Source
1size 960 600
2background #000000
3timeline 30 300
4
5// Un grenier plongé dans le noir. Le même décor (un symbole) est posé deux fois : une fois presque éteint,
6// une fois dans un calque MASQUE dont la matière est le disque de la lampe — piloté par le pointeur, avec un
7// temps de retard. Cinq choses se cachent ; la lampe qui passe dessus les trouve.
8var lx = 480
9var ly = 300
10var hx = [722, 302, 548, 868, 196]
11var hy = [292, 318, 514, 470, 188]
12var trouve = [0, 0, 0, 0, 0]
13var quand = [-99, -99, -99, -99, -99]
14var nb = 0
15var fini = 0
16var tfin = -99
17
18// L'anneau qui salue une trouvaille : un symbole paramétré, posé cinq fois par `repeat`, animé par `each`.
19symbol "Eclat"(n) {
20 layer "c" { circle 0 0 46 nofill stroke #fff3c4 4 circle 0 0 60 nofill stroke #fff3c466 2 }
21}
22
23symbol "Grenier" {
24 layer "mur" {
25 rect 0 0 960 600 fill linear(90, 0:#7a5538, 1:#4e3423)
26 repeat i from 0 to 11 { rect $(i * 82) 0 3 430 fill #5c3d28 opacity 0.6 }
27 path "M0 0 L400 0 L0 280 Z" fill linear(30, 0:#3e2819, 1:#2a1a10)
28 path "M960 0 L560 0 L960 280 Z" fill linear(150, 0:#3e2819, 1:#2a1a10)
29 path "M0 268 L400 -12" nofill stroke #2a1a10 16
30 path "M960 268 L560 -12" nofill stroke #2a1a10 16
31 rect 0 0 960 22 fill #2a1a10
32 }
33 layer "fenetre" {
34 circle 480 130 66 fill #2a1a10
35 circle 480 130 56 fill radial(0.5, 0.5, 0.5, 0:#2b3d72, 1:#0d1534)
36 circle 500 112 16 fill #f3e9c6
37 circle 507 108 13 fill #22325f
38 repeat i from 0 to 6 { circle $(440 + mod(i * 37, 80)) $(100 + mod(i * 23, 60)) 1.4 fill #ffffff opacity 0.7 }
39 rect 476 74 8 112 fill #2a1a10
40 rect 424 126 112 8 fill #2a1a10
41 }
42 layer "sol" {
43 rect 0 430 960 170 fill linear(90, 0:#6a4429, 1:#3f2919)
44 repeat i from 0 to 5 { rect 0 $(452 + i * 26) 960 2 fill #2e1d12 opacity 0.7 }
45 repeat i from 0 to 9 { rect $(40 + i * 97 + mod(i, 2) * 40) $(432 + mod(i, 6) * 26) 2 26 fill #2e1d12 opacity 0.7 }
46 }
47 layer "meubles" {
48 rect 110 360 170 120 4 fill linear(90, 0:#c49364, 1:#9a6b40) stroke #6e4a2a 2
49 rect 110 360 170 18 fill #b5845a
50 rect 186 360 18 120 fill #e3c48f opacity 0.7
51 rect 240 330 96 80 4 fill linear(90, 0:#b3845a, 1:#8c5f39) stroke #6e4a2a 2
52 rect 640 340 210 120 8 fill linear(90, 0:#5a3420, 1:#3b2214) stroke #2a170d 3
53 path "M640 360 C640 300 850 300 850 360 Z" fill linear(90, 0:#6e4129, 1:#4d2c1a) stroke #2a170d 3
54 rect 728 372 34 30 4 fill #c9a24a stroke #7a5a1e 2
55 rect 640 400 210 10 fill #c9a24a opacity 0.8
56 rect 742 150 140 100 4 fill #2a1a10
57 rect 752 160 120 80 fill linear(90, 0:#e8b86a, 1:#8a4e2c)
58 circle 836 182 14 fill #fff2c8 opacity 0.9
59 path "M752 240 L800 196 L836 224 L872 200 L872 240 Z" fill #3e5a3a
60 path "M60 20 L60 70 M60 70 L40 110 M60 70 L80 110" nofill stroke #2a1a10 3
61 }
62 layer "caches" {
63 // le chat, assis sur la malle
64 ellipse 722 312 30 26 fill #474150
65 circle 722 274 20 fill #474150
66 path "M706 262 L704 240 L718 256 Z" fill #474150
67 path "M738 262 L740 240 L726 256 Z" fill #474150
68 path "M750 322 C790 320 792 290 776 280" nofill stroke #474150 8 cap round
69 ellipse 715 274 4 5 fill #f5d76e
70 ellipse 729 274 4 5 fill #f5d76e
71 // le nounours, sur le carton
72 circle 302 312 26 fill #b5763f
73 circle 302 282 18 fill #b5763f
74 circle 288 268 7 fill #b5763f
75 circle 316 268 7 fill #b5763f
76 circle 302 318 14 fill #e0b07a
77 circle 296 279 2.5 fill #2a170d
78 circle 308 279 2.5 fill #2a170d
79 circle 302 286 3 fill #2a170d
80 // la clé, par terre
81 circle 534 514 10 nofill stroke #f0c64a 4
82 rect 543 511 30 5 fill #f0c64a
83 rect 564 515 4 8 fill #f0c64a
84 rect 572 515 4 6 fill #f0c64a
85 // la souris, contre la plinthe
86 ellipse 868 472 18 11 fill #9a95a3
87 circle 852 465 7 fill #b8b3c2
88 circle 849 470 1.8 fill #1a1a22
89 path "M886 474 C905 478 910 466 920 470" nofill stroke #9a95a3 2.5 cap round
90 // l'araignée, pendue à sa poutre
91 path "M196 70 L196 180" nofill stroke #d8d8e8 1.2
92 circle 196 188 9 fill #2b2b33
93 path "M188 184 L174 176 M188 190 L172 192 M188 194 L176 204 M204 184 L218 176 M204 190 L220 192 M204 194 L216 204" nofill stroke #2b2b33 2.5 cap round
94 }
95}
96
97scene {
98 layer "Eteint" {
99 instance "Grenier" as "Ombre" at 0,0 tint #04050a 0.95 nohit
100 }
101 mask layer "Faisceau" {
102 group "Lampe" at 480,300 nohit { layer "c" { circle 0 0 150 fill #ffffff } }
103 layer "Eclaire" {
104 instance "Grenier" as "Vu" at 0,0 nohit
105 }
106 }
107 layer "Lueur" {
108 group "Halo" at 480,300 nohit {
109 layer "c" { circle 0 0 152 fill radial(0.5, 0.5, 0.5, 0:#ffd27a1c, 0.45:#00000000, 0.62:#00000010, 1:#000000e0) }
110 }
111 group "Yeux" at 722,274 nohit {
112 layer "c" { circle -7 0 9 fill radial(0.5, 0.5, 0.5, 0:#f5d76e88, 1:#f5d76e00) circle 7 0 9 fill radial(0.5, 0.5, 0.5, 0:#f5d76e88, 1:#f5d76e00) ellipse -7 0 3 4 fill #f5d76e ellipse 7 0 3 4 fill #f5d76e }
113 }
114 }
115 layer "Eclats" {
116 repeat i from 0 to 4 { instance "Eclat"($(i)) as "Eclat$(i)" at 0,0 pivot 0,0 nohit }
117 }
118 layer "Liste" {
119 rect 0 556 960 44 fill #000000 opacity 0.75
120 text "chat" as "L0" at 150,556 font "Geist, system-ui, sans-serif" size 18 bold align center line 1.2 color #f5e6c4 box 120 44 valign middle
121 text "nounours" as "L1" at 270,556 font "Geist, system-ui, sans-serif" size 18 bold align center line 1.2 color #f5e6c4 box 120 44 valign middle
122 text "clé" as "L2" at 390,556 font "Geist, system-ui, sans-serif" size 18 bold align center line 1.2 color #f5e6c4 box 120 44 valign middle
123 text "souris" as "L3" at 510,556 font "Geist, system-ui, sans-serif" size 18 bold align center line 1.2 color #f5e6c4 box 120 44 valign middle
124 text "araignée" as "L4" at 630,556 font "Geist, system-ui, sans-serif" size 18 bold align center line 1.2 color #f5e6c4 box 120 44 valign middle
125 text "{} / 5" as "Compte" at 790,556 font "Geist Mono, ui-monospace, monospace" size 22 bold align right line 1.2 color #f5d76e box 120 44 valign middle bind "nb"
126 text "promène la lampe" at 20,556 font "Geist, system-ui, sans-serif" size 14 italic align left line 1.2 color #8a7a62 box 130 44 valign middle
127 }
128 layer "Bravo" {
129 group "Bravo" at 480,300 pivot 0,0 nohit {
130 layer "c" {
131 rect -230 -56 460 112 20 fill #000000c0 stroke #f5d76e 2
132 text "Tout est trouvé !" at -230,-56 font "Geist, system-ui, sans-serif" size 40 bold align center line 1.2 color #fff3c4 box 460 112 valign middle
133 }
134 }
135 }
136}
137
138// La lampe suit le pointeur avec un temps de retard ; au repos (pas encore de pointeur), elle reste au centre.
139every frame {
140 lx = lerp(lx, mouse.x == 0 && mouse.y == 0 ? 480 + 120 * sin(clock * 0.7) : mouse.x, 0.16)
141 ly = lerp(ly, mouse.x == 0 && mouse.y == 0 ? 300 + 60 * sin(clock * 1.1) : mouse.y, 0.16)
142 repeat i from 0 to 4 {
143 if trouve[i] == 0 {
144 if hypot(lx - hx[i], ly - hy[i]) < 70 {
145 trouve[i] = 1
146 quand[i] = clock
147 nb = nb + 1
148 send "trouve", i
149 }
150 }
151 }
152 if nb >= 5 {
153 if fini == 0 {
154 fini = 1
155 tfin = clock
156 send "fini"
157 }
158 }
159}
160
161object "Lampe" {
162 x = lx
163 y = ly
164}
165object "Halo" {
166 x = lx
167 y = ly
168}
169object "Yeux" {
170 scaleY = mod(clock, 3.7) < 0.14 ? 0.1 : 1
171 opacity = 1 - trouve[0]
172}
173each "Eclat" as i {
174 x = hx[i]
175 y = hy[i]
176 opacity = pulse(quand[i], 1.2)
177 scaleX = 1.6 - pulse(quand[i], 1.2) * 0.6
178 scaleY = 1.6 - pulse(quand[i], 1.2) * 0.6
179}
180object "L0" { opacity = 0.3 + 0.7 * trouve[0] }
181object "L1" { opacity = 0.3 + 0.7 * trouve[1] }
182object "L2" { opacity = 0.3 + 0.7 * trouve[2] }
183object "L3" { opacity = 0.3 + 0.7 * trouve[3] }
184object "L4" { opacity = 0.3 + 0.7 * trouve[4] }
185object "Bravo" {
186 opacity = fini * clamp((clock - tfin - 0.6) * 2, 0, 1)
187 scaleX = 0.9 + 0.1 * clamp((clock - tfin - 0.6) * 2, 0, 1)
188 scaleY = 0.9 + 0.1 * clamp((clock - tfin - 0.6) * 2, 0, 1)
189}
Galerie
FR
FrançaisEnglish

Le grenier dans le noir

Scène animée · 960×600 · 30 img/s
FlatInk
JeuInteractifMasque
Gérer (admin)
Informations
Type
Scène animée
Dimensions
960 × 600
Cadence
30 img/s
Durée
10.0 s · 300 images
Téléchargements
Page web autonome Ouvrir dans l'éditeur
FlatInk