-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·259 lines (235 loc) · 10.6 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
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Licurici la râu</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:url" content="http://somesdelivery.ro/proiecte/licurici-la-rau/" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Licurici" />
<meta property="og:description" content="Licurici digitali in cadrul evenimentului Clujotronic" />
<meta property="og:image" content="img/licurici_la_rau.png" />
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<section id="title">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="background svg" data-path="img/branch1.svg">
</div>
</div>
</div>
</div>
</section>
<section id="intro">
<div class="container">
<div class="row">
<div class="col-sm-4">
<p>
"Licurici" e un concept care a pornit de la un proiect in cadrul evenimentului Someș Delivery 2016,
ca o instalație care invită la contemplare in liniște si aduce natura mai aproape de clujeni.
</p>
<p>
Acum îi prezentăm într-un context nou, la Clujotronic, ca o instalație care explorează dinamica oraș-natură,
cu care poti interacționa prin variații de distanță, sunet si lumină.
</p>
</div>
<div class="col-sm-4">
<p>
Ca să influențezi comportamentul lor, folosește si <strong>#clujotronic</strong>, <strong>#clujotronic2017</strong> sau
<strong>#licurici</strong> pe Instagram si Twitter.
</p>
</div>
<div class="col-sm-4">
<p>
<a class="twitter-timeline" href="https://twitter.com/search?q=%23licurici%20OR%20%23clujotronic%20OR%20%23clujotronic2017" data-widget-id="905797014360924161">#licurici OR #clujotronic OR #clujotronic2017 Tweets</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</p>
</div>
</div>
</div>
</section>
<section id="fireflies">
<div class="background svg branch right" data-path="img/branch2.svg" id="branch2"></div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>Despre licurici</h2>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<img src="https://upload.wikimedia.org/wikipedia/commons/5/52/Photuris_lucicrescens.jpg" alt="Licurici" id="img-firefly">
<p id="img-caption"> Sursa:Wikipedia
</p>
<p>
Licuricii sunt de fapt niște gândaci.
</p>
<p>
Ei se regăsesc pe toate continentele, cu excepția Antarcticii. Mediile propice pentru ei sunt pădurile, câmpurile, mlaștinile de lângă lacuri, râuri și alte zone umede.
</p>
<p>
Se hrănesc cu melci și larve, având rol de control al dăunătorilor.
</p>
</div>
<div class="col-sm-4">
<p>
Lumina emisă de ei este foarte eficientă, tranformând mai mult de 80% din energie în lumină. În comparație cu ei, un bec incandescent emite doar 10% din energie ca lumină, restul fiind căldură.
</p>
<p>
Cum produc lumina: folosesc o reacție chimică numită bioluminescență, în timpul căreia, enzima numită luciferază, reacționează cu acidul trifosforic prezența oxigenului, și eliberează energie sub formă de lumină.
În funcție de specie, ei luminează diferit: unii mențin o lumină continuă, alții licăresc.
</p>
<p>
Lumina emisă de ei are mai multe funcții. Ouăle și larvele luminescente anunță potențialii prădători că nu sunt comestibile.
</p>
</div>
<div class="col-sm-4">
<p>Adulții folosesc lumina ca semnalizare în timpul perioadei de împerechere. Femelele din specia Photuris mimează semnalizarea altor specii pentru a atrage și mânca licuricii care își caută pereche.
</p>
<p>
Poluarea luminoasă, asfaltarea și asanarea zonelor umede întrerup ciclul de reproducere al licuricilor, ducând la dispariția lor din zonele afectate de aceste schimbări.
</p>
<p>
Unii licurici din zonele tropicale își sincronizează lumina și realizează un spectacol nocturn fascinant.
</p>
<iframe src="https://www.youtube.com/embed/a-Vy7NZTGos" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
</section>
<section id="installation">
<div class="background svg branch left" data-path="img/branch3.svg" id="branch3"></div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>Despre instalație</h2>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<p>
Partea vizuală e formată din leduri controlate prin intermediul unor plăcuțe
Arduino și senzori de proximitate, sunet si lumină. Un Raspberry Pi ne permite sa trimitem
comenzi de la distanta placutelor Arduino, si astfel licuricii isi sincronizeaza comportamentul
cu activitatea de pe Twitter si Instagram.
Sunetele sunt field recordings din Cluj și împrejurimi.
</p>
</div>
<div class="col-sm-4">
<p> Cu cât va fi mai liniște, cu atât vor lumina mai
intens și se vor aprinde mai mulți. La fel si in cazul apropierii oamenilor de instalatie.
</p>
</div>
<div class="col-sm-4">
<p>
Am făcut codul “open source” pentru cei care vor să îl folosească și să facă o instalație similară.
Îl găsești pe github:
<a href="https://github.com/licurici" target="_blank">
<p>
<img src= "img/github-sociocon.png" class="icon">
</p>
</a>
</p>
</div>
</div>
</div>
</section>
<section id="us">
<div class="background svg branch right" data-path="img/branch2.svg" id="branch2"></div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h2>Echipa</h2>
<div class="row">
<div class="col-md-2">
<div class="thumbnail authors">
<img class="img-circle" src="img/Bogdan.jpg" alt="Photo of Bogdan Szabo" />
<div class="caption authors">
<h3>Bogdan Szabo</h3>
</div>
</div>
</div>
<div class="col-md-2">
<div class="thumbnail authors">
<img class="img-circle" src="img/Ale.png" alt="Photo of Alexandra Casapu" />
<div class="caption authors">
<h3>Alexandra Casapu</h3>
</div>
</div>
</div>
<div class="col-md-2">
<div class="thumbnail authors">
<img class="img-circle" src="img/Oana.png" alt="Photo of Oana Casapu"/>
<div class="caption authors">
<h3>Oana Casapu</h3>
</div>
</div>
</div>
<div class="col-md-2">
<div class="thumbnail authors">
<img class="img-circle" src="img/Alex.png" alt="Photo of Alexandru Rotaru"/>
<div class="caption authors">
<h3>Alex Rotaru</h3>
</div>
</div>
</div>
<div class="col-md-2">
<div class="thumbnail authors">
<img class="img-circle" src="img/Ionut.png" alt="Photo of Oana Casapu"/>
<div class="caption authors">
<h3>Ionut Rosu</h3>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "row">
<div class="col-lg-12">
<h2>Multumiri</h2>
<div class="row">
<div class="col-md-2">
<div class="thumbnail authors">
<img src="img/logo-Altom-transparent.png" alt="Altom Logo"/>
<div class="caption authors">
<h3></h3>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="bottom">
<div class="background svg branch left" data-path="img/branch4.svg" id="branch4"></div>
<div class="container">
<div class="row">
<div class="col-lg-12">
</div>
</div>
</div>
<div class="background svg" data-path="img/water.svg" id="water"></div>
</section>
<script src="js/vendor/jquery-1.11.2.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/main.js"></script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-79536135-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>