-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
177 lines (163 loc) · 10.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
<!DOCTYPE html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>Ecal x Samsung</title>
<meta name="author" content="Your Name">
<meta name="description" content="Example description">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="styles/nav.css">
<link rel="stylesheet" href="styles/style.css">
<link rel="shortcut icon" type="image/x-icon" href="images/other/favicon.ico" />
</head>
<body>
<div id="mainContent">
<nav>
<a id="logo" href="#">Beyond The Screen</a>
<div id="link">
<a href="#">About</a>
<a href="Projects.html">Projects</a>
</div>
</nav>
<section class="videoFS" id="introVideo">
<video muted autoplay loop>
<source src="https://player.vimeo.com/external/500771199.hd.mp4?s=2536c7549c16f2bfaf89bda017b3c240f8e23f1d&profile_id=175" type="video/mp4">
</video>
<div id="logoVideo">
<img src="images/Logo/ECAL-X-SAMSUNG_White.png">
<h1>A TV Design Research</h1>
</div>
</section>
<!-- Introduction -->
<section class="intro box hidden">
<h2>A collaboration<br>since 2017</h2>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique.</p>
</section>
<section class="parts hidden" id="part0">
<div>
<img class="hidden" src="images/other/Ecal.jpg">
<img class="hidden" src="images/other/Ecal_02.jpg">
</div>
<div>
<h1>ECAL in a nutshell</h1>
<p>Enjoying international renown and featuring regularly among the world’s top ten universities of art and design, ECAL is directed by Alexis Georgacopoulos. The school currently offers six Bachelor programmes (Fine Arts, Cinema, Graphic Design, Industrial Design, Media & Interaction Design, Photography), five Master programmes (Fine Arts, Film, Photography, Product Design, Type Design) and two Master of Advanced Studies (MAS) in Design for Luxury & Craftsmanship and in Design Research for Digital Innovation (with EPFL+ECAL Lab). ECAL also offers a one-year Foundation Course to prepare students for entrance to the different Bachelor’s programmes.</p>
<img class="hidden" src="images/other/Ecal_03.jpg">
</div>
</section>
<!-- PARTIE 01 -->
<section class="videoFS">
<video muted autoplay loop>
<source src="https://player.vimeo.com/external/500771923.hd.mp4?s=785fd22a53b2931fcfef1dfb3e67e84f4a6f3c3d&profile_id=175" type="video/mp4">
</video>
<div class="VideoTitle">
<h1>What about<br>rethink the TV ?</h1>
</div>
</section>
<section class="parts" id="part1">
<div>
<h1>Shapes, furnitures,<br>interfaces and more.</h1>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique. Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis.</p>
<img class="hidden" src="images/01/Img_01_01.png">
</div>
<div>
<img class="hidden" src="images/01/Img_02_01.png">
<img class="hidden" src="images/01/Img_03_01.png">
</div>
</section>
<section class="citation hidden">
<div>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique.</p>
<br>
<p class="Name">Erwan Bouroullec<br></p>
</div>
</section>
<!-- PARTIE 02 -->
<section class="videoFS">
<video muted autoplay loop>
<source src="https://player.vimeo.com/external/500775067.hd.mp4?s=665a174038cd0127153beb011f894da38799bf0b&profile_id=175" type="video/mp4">
</video>
<div class="VideoTitle">
<h1>A new window to explore.</h1>
</div>
</section>
<section class="parts" id="part2">
<div>
<h1>A new window<br>to explore.</h1>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique. Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis.</p>
<video muted autoplay loop class="hidden">
<source src="images/02/Vid_01_01.mp4" type="video/mp4">
</video>
<video muted autoplay loop class="hidden">
<source src="images/02/Vid_01_02.mp4" type="video/mp4">
</video>
</div>
<div>
<img class="hidden" src="images/02/Img_03_01.png">
</div>
</section>
<section class="citation hidden">
<div>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique.</p>
<br>
<p class="Name">Vincent Jacquier<br>Head of Bachelor Visual Communication</p>
</div>
</section>
<!-- PARTIE 03 -->
<section class="videoFS">
<video muted autoplay loop>
<source src="https://player.vimeo.com/external/500774021.hd.mp4?s=a84695c0062f254474abf4361a759567a1cde7b0&profile_id=175" type="video/mp4">
</video>
<div class="VideoTitle">
<h1>Look for new horizons.</h1>
</div>
</section>
<section class="parts" id="part3">
<div>
<img class="hidden" src="images/03/Img_01_01.png">
<h1>More than just a TV.</h1>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique. Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis.</p>
<img class="hidden" src="images/03/Img_02_01.png">
</div>
<div>
<img class="hidden" src="images/03/Img_03_01.png">
<img class="hidden" src="images/03/Img_04_02.png">
</div>
</section>
<section class="citation">
<div>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique.</p>
<br>
<p class="Name">Camille Blin<br>Head of Master Product Design</p>
</div>
</section>
<section class="intro box thanksEnd hidden">
<h2>Special thank's</h2>
<p>Donec fermentum quis ipsum at dapibus. Duis pellentesque eleifend est, non condimentum velit ornare sed. Ut ut interdum elit, nec feugiat magna. Nam quis gravida mi, et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Quisque eleifend justo ac lorem euismod, non molestie elit cursus. Donec sodales quis arcu eget tristique.<br><br>Et sodales turpis. Maecenas dictum suscipit leo vel hendrerit. Duis pellentesque eleifend est, non condimentum velit ornare sed.</p>
</section>
<footer class="footer">
<ul>
<li><h2><a href="https://www.ecal.ch">ECAL</a></h2></li>
<li><h2>2021 Copyright</h2></li>
</ul>
<ul>
<li><h2><a href="index.html">About</a></h2></li>
</ul>
<ul>
<li><h2><a href="Projects.html">Projects</a></h2></li>
<li>Blend Into Home</li>
<li>My data Ecosystem</li>
<li>New Horizons</li>
</ul>
<!--
<ul>
<li><h2>Supervised by</h2></li>
<li>Camille Blin</li>
<li>Vincent Jaquier</li>
</ul>
-->
</footer>
</div>
<script type="text/javascript" src="srcipts/script.js"></script>
</body>
</html>