-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
366 lines (342 loc) · 11 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
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
<!DOCTYPE html>
<html lang="fi">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tuotekehityssimulaatio 2018</title>
<link rel="stylesheet" type="text/css" href="tukesim.css" />
<link rel="author" type="text/plain" href="humans.txt" />
</head>
<body>
<div class="container">
<h1>
Tuotekehityssimulaatio 2018
<img
alt="Pikseligrafiikka tietokoneesta, jonka näytöllä sykkii sydän"
src="gifuja/divigif5.gif"
class="inline-gif"
/>
</h1>
<p>
Tupsahdit Metropolian digitaalisen viestinnän
tuotekehityssimulaatiokurssin kotisivulle! Täällä pääset selailemaan
kurssin projekteja ja niiden tuotoksia.
</p>
<dl>
<dt>Mikä tukesim?</dt>
<dd>En mä tiiä, kato toi video alla.</dd>
<dt>Kuka tämän helkkarin siistin saitin on nikkaroinut?</dt>
<dd>
Tämän sivuston tekijät löydät
<a href="humans.txt">humans.txt</a>-tiedostosta.
</dd>
<dt>Miksi?</dt>
<dd>Siksi.</dd>
</dl>
<div class="installed" style="display: none;">
SlowSpace Player asennettu.
<button class="button" id="deleteTrigger">Poista</button>
</div>
<div class="player js-player">
<div class="player__videowrapper">
<video loop preload>
<source src="videos/divi_tv.mp4" type="video/mp4" />
</video>
<div class="player__screensaver js-player__screensaver">
<marquee direction="down" behavior="alternate" height="100%">
<marquee behavior="alternate">
<svg
class="player__logo js-player__logo"
xmlns="http://www.w3.org/2000/svg"
width="399"
height="204"
viewBox="0 0 400 204"
shape-rendering="geometricPrecision"
text-rendering="geometricPrecision"
image-rendering="optimizeQuality"
fill-rule="evenodd"
>
<path
fill="currentColor"
d="M145 24h33v154h-33zM216 24h33v154h-33zM27 24h37l39 155H66L27 24z"
/>
<path
fill="currentColor"
d="M131 24h-20c-1 1-1 4 0 5 2 6 1 13 0 19L81 179h15l35-155zM220 123h-73l-9 14h58c9 0 21-7 24-14zM327 89c-51-10-34-52-5-52h47l6-13h-61c-18 0-57 18-52 53 2 23 18 32 47 40 50 12 34 48 12 48h-54l6 14h51c27 0 51-19 51-46-1-28-16-38-48-44z"
/>
<path
fill="none"
stroke="currentColor"
stroke-width="7"
d="M8 7h386v190H8z"
/>
</svg>
</marquee>
</marquee>
</div>
</div>
<div class="player__controls">
<button class="button" id="sequenceTrigger" style="display: none;">
Vilmi käynttii nii
</button>
<button
class="button js-player__play"
data-pause-text="Vilmi poikki"
style="display: none;"
>
Vilmi käynttii nii</button
><-- toi on play-nappi :)
<button class="button js-player__start-again">Uuvestaa</button>
<button
class="button js-player__volume"
data-louder-text="Kovemmalle"
>
Hiljemmalle
</button>
</div>
</div>
<div class="separator">
<p>Sitten niihin projekteihin:</p>
<img
src="gifuja/digigif5.gif"
alt="Laatikko jossa liikkuva kysymysmerkki"
/>
</div>
<article>
<h2>Team Grano</h2>
<p>
Oletko sisältöpalveluiden suurin tarjoaja Suomessa, mutta yrityksesi
some on kangistunut vanhoihin kaavoihin? Eikö tuottamasi sisältö
tavoita ihmisiä tai erotu valtavasta somemassasta? Haluaisitko myös
päivittää brändisi luomaa mielikuvaa? Ei hätää – me viemme somesi
seuraavalle tasolle! Team Granolta saat yrityksellesi räätälöidyn,
kattavan somestrategian, joka päivittää somesi ajan tasalle. Tilaa nyt
ja saat kaupan päälle vielä henkilökohtaista konsultointia ja
kohderyhmätutkimuksen.
</p>
<p><button class="button">Lisää ostoskoriin</button></p>
</article>
<div class="separator"></div>
<article>
<h2>Team Lilinkotisäätiö</h2>
<p>
Onko tekemisestä vaikea saada ote? Jännittääkö ulkomaailma? Ei hätää!
Nyt pääset kuumotuksistasi eroon nykyaikaisin menetelmin ja helposti
jopa omalla mobiililaitteellasi! Unohda entisajan ankeat ja jähmeät
motivointisaarnaukset, kuinka pitäisi liikkua enemmän ja kyselyt siitä
miten sinulla menee. Nyt tämä kaikki on tehty hauskaksi ja ennen
kaikkea helpoksi juuri sinulle!
</p>
<p><button class="button">Yks semmonen -></button></p>
</article>
<div class="separator">
<img
src="gifuja/diviclip1.jpg"
alt="Clipart-hahmo jonka käsi pystyssä ja pään päällä hehkulamppu"
/>
</div>
<article>
<h2>Team Bailataan</h2>
<p>
Ahdistaako? Stressaako? Tuntuuko sinusta siltä, että deadlinet
kaatuvat päällesi? Kaipaisitko lomaa tenteistä ja projekteista? Meillä
on siihen ratkaisu! On aika bailata!
</p>
<p>
Bailataan-palvelu tarjoaa tapahtumia opiskelijoille, joiden jalka
vipattaa ja kaljahammasta kolottaa. Älä haikaile vaan tilaa nyt
soittamalla numeroon 0700 123 69 666. Huipputarjous! Kaksi approa
yhden hinnalla! Arvo 99,99€. Tilaa nyt ja kutsu kaverisikin
tapahtumaan! Bailataan yhdessä!
</p>
<p><button class="button">Ai keitolle?</button></p>
</article>
<article>
<h2>Team Verkkokauppa</h2>
<p>
Haluatko epäonnistua projektissasi ja ahdistua syksyksi? Valitse
projektiksi verkkokauppa, jonka asiakas on juuri saamassa lapsen, eikä
hänellä ole aikaa, kiinnostusta tai halua ideoida projektia kanssasi.
Ota yhteyttä, ja epäonnistutaan yhdessä.
</p>
<p><button class="button">Pyydä ilmainen näyte!</button></p>
</article>
<div class="separator">
<img src="gifuja/divigif2.gif" alt="Tietokoneet sähköilee" />
</div>
<article>
<h2>Team Tarkkalaatta</h2>
<p>
Eikä siinä vielä kaikki, hankkimalla nettisivut vuoden 2018 aikana
saat kaupan päälle ilmaisen logosuunnittelun! Kaiken tämän lisäksi
saat kaupan päälle laadukkaat tekstisisällöt upouusille
nettisivuillesi! Tilaa heti soittamalla numeroon 0101100101.
</p>
<p>
Projektina oli toteuttaa nettisivut kylpyhuone- ja saunaremontteja
tarjoavalle yritykselle Wordpressilla. Lisäksi yritykselle
suunniteltiin logo. Projekti sisälsi käyttöliittymäsuunnittelua,
kilpailijoiden benchmarkkausta, Wordpressin kanssa tappelua ja muun
muassa käyttäjätestausta logon osalta. Sivut on julkaistu, mutta
näiden kehitys jatkuu vielä kurssin jälkeen sisältöjen ja kuvien
osalta.
</p>
<p><button class="button">Lähetään laattaan</button></p>
</article>
<article>
<h2>Team MotivApp – kaaos hallintaan!</h2>
<p>
Onko sinulla vaikeuksia keskittyä? Onko kotisi kaaoksessa? Tule nyt
mukaan kokeilemaan uudenlaista sovellusta siivouksen ongelmiin! Kuin
siivouskalenteri, mutta juuri sinun tarpeisiisi kehitetty. Kerää
pisteitä ja huomaa kotisi siivoutuvan kuin itsestään! Ei enää
jumitusta tai siivouksen lykkäämistä! Kokeile nyt, niin saat kaupan
päälle virtuaalisen puutarhan, jota voit kasvattaa pelin edetessä.
Tätä tarjousta et halua ohittaa!
</p>
<p lang="en">
<button class="button">Shut up and take my money!</button>
</p>
</article>
</div>
<div class="christmas">
<marquee behavior="alternate"
><h2>HYVÄÄ joulua kaikille <span>ja uutta vuotta</span>!</h2></marquee
>
<p>T: pienet digitonut <small>tossa alhaalla</small></p>
<img
src="gifuja/Divigif1.gif"
alt="Silmiä ja valossa joulukuusi ja lahjoja"
/>
</div>
<div class="separator">
<p>
<img src="gifuja/laskuri.gif" alt="0123456789" /> kävijää (aloitettu
13.12.2018)
</p>
</div>
<div class="diwinter">
<div class="snow snow--near"></div>
<div class="snow snow--near snow--alt"></div>
<div class="snow snow--mid"></div>
<div class="snow snow--mid snow--alt"></div>
<div class="snow snow--far"></div>
<div class="snow snow--far snow--alt"></div>
</div>
<div class="dialog" id="requestDialog">
<div class="dialogContainer">
<img
class="errorSymbol pixelatedImage"
src="./images/warning.png"
alt="Warning"
/>
<span
>Tämä video vaatii toimiakseen SlowSpace Playerin. Haluatko asentaa
sen nyt?</span
>
</div>
<button class="button windowsButton alignRight" id="cancelTrigger">
Peruuta
</button>
<button class="button windowsButton alignRight" id="downloadTrigger">
OK
</button>
</div>
<div class="overlay"></div>
<div class="dialog" id="downloadDialog">
<img
src="./images/download.gif"
alt="Downloading file"
class="downloadGif pixelatedImage"
/>
<div class="progressBar">
<div class="barCluster" id="bC1">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<div class="barCluster" id="bC2">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<div class="barCluster" id="bC3">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<div class="barCluster" id="bC4">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<div class="barCluster" id="bC5">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
</div>
<span id="loadingText">Ladataan...</span>
<button
class="button windowsButton alignRight noMargin"
id="errorTrigger"
style="display: none;"
>
Jatka
</button>
</div>
<div class="errorDialogContainer">
<div class="dialog" id="errorDialog">
<div class="dialogContainer">
<img
class="errorSymbol pixelatedImage"
src="./images/error.png"
alt="Error"
/>
<span>Jotain meni vikaan.</span>
</div>
<button class="button windowsButton alignCenter" id="continueTrigger">
OK
</button>
</div>
</div>
<div class="bsod">
<img class="pixelatedImage" src="./images/bsod.png" alt="BSOD" />
</div>
<div class="reboot">
<div class="rebootInner">
<p>Käynnistetään uudelleen...</p>
<div class="rebootProgress">
<div class="rebootProgressInner"></div>
</div>
</div>
</div>
<div class="dialog" id="resetDialog">
<div class="dialogContainer">
<img
class="errorSymbol pixelatedImage"
src="./images/warning.png"
alt="Warning"
/>
<span
>Tietokoneesi on käynnistynyt uudelleen järjestelmävirheen
vuoksi.</span
>
</div>
<button class="button windowsButton alignCenter" id="resetTrigger">
OK
</button>
</div>
</body>
<script src="./js/index.js" async></script>
</html>