2 – GIF-it-YEAH: eine Art Daumenkino mit Plexiglas und Neopixeln

2

GIF-it-YEAH: eine Art Daumenkino mit Plexiglas und Neopixeln

Das lernst du hier

Fast wie ein Daumenkino, aber aus Plexiglas und mit Neopixeln: Schaffst du es, aus nur vier Einzelbildern ein kurzes “Video” zu produzieren? In diesem einfachen Projekt lernst du, wie ein GIF-Bild zu einem effektvollen “Plexiglaskino” wird. Ob mit simplen Programmierungen oder einem Sketch, das sogar auf Musik reagieren kann!

2a

Was ist ein GIF-Bild?

Wie geht das?

Ein GIF-Bild ist eine Art von Bildformat, das verwendet wird, um kurze Animationen oder Sequenzen von Bildern darzustellen. Es steht für “Graphics Interchange Format“. Im Gegensatz zu statischen Bildern können GIF-Bilder sich bewegen oder wiederholen, ähnlich wie kleine Videos. Sie werden oft in sozialen Medien oder Textnachrichten verwendet, um lustige oder informative Animationen zu teilen.

Hier ein Beispiel:

2b

GIF aus dem Internet laden und in Einzelbilder umwandeln

GIF-Bilder sind im Internet leicht zu finden. Am besten gelingt dein Projekt, wenn du eine Strichgrafik suchst, da du das Bild ja in ein Plexiglas gravieren wirst. Lade dein Lieblings-GIF herunter. Natürlich kannst du GIFs auch selber herstellen.

Google Keyword für GIFs: GIF Strichgrafik Yeah
Google Keyword für Bildfolgen: movement study

Wandle dann dein GIF-Bild online in die einzelnen JPG-Bilder um. Das geht ganz einfach, wenn du nach diesem Keyword suchst: GIF online in JPG

Dieses GIF besteht aus 15 Einzelbildern. Welche vier Bilder sind am besten, um dennoch eine flüssige Animation zu erhalten?

2c

Vier Bilder auswählen und in Plexiglas gravieren

Für die Plexiglaslampe verwenden wir vier Einzelbilder des GIFs. Entscheide dich für eine Bildfolge, von der du glaubst, dass sie als Animation immer noch gut wirkt. Du bist dir nicht sicher, ob das gelingt? Wähle deine vier Bilder aus und konvertiere sie online wieder zu einem GIF (Google Keyword: convert jpg to gif).

Ich habe mich für die Bilder 11, 12, 13 und 15 entschieden und sie einzeln ausgedruckt. Danach habe ich sie mit einem Dremel Engraver ins Plexiglas graviert!

Hinweis: die folgenden Bilder sind mit 8mm-Plexiglas entstanden. Um mit dem gängigen 3mm- Plexiglas zu arbeiten, können aus 5mm-Holz Distanzhalter gebaut werden. Dies wird in Punkt 2d gezeigt.

GIF-Bild auswählen und ausdrucken
Ausdruck auf die richtige Grösse zuschneiden
2d

Distanzhalter aus 5mm Holz herstellen

Im Video oben arbeiten wir mit 8mm Plexiglas, weil das dem Abstand der Pixel entspricht. Möchtest du lieber mit dem gängigen 3mm-Plexiglas arbeiten? Dieses ist schliesslich günstiger und in jeder TTG-Werkstatt vorhanden! Dann kannst du aus 5mm Pappelsperrholz simple Distanzhalter bauen oder diese gleich mit einem Lasercutter ausschneiden. Lade jetzt hier die Vorlage herunter.

Wenn du das Holz von Hand, z.B. mit einer Dekupiersäge, schneiden willst, lohnt es sich, die Formen zu vereinfachen. Im Bild siehst du eine Version mit einzelnen Stäben als Distanzhalter:

2e

Matrix anschliessen

Anschlussschema Neopixel Matrix
2f

Matrix programmieren und Bilder animieren

Das Programmieren der Matrix ist einfach und du hast das in Challenge 1 bereits getan, denn mit einem Lauflicht werden deine Bilder schon lebendig! Der Unterschied zu Challenge 1 ist, dass jeweils eine Reihe von 4 Pixel gleichzeitig leuchten soll (siehe Video unten!).

Kannst du die Animation auch vorwärts und rückwärts laufen lassen?

Challenge:

Challenge: XML-Code in Editor einfügen
<xml xmlns="https://developers.google.com/blockly/xml"><variables><variable id="TcCO{,6!rKL%!WIVD{CK">Pixel</variable></variables><block type="basic_comment" id="XjX.XnAUE($w%aeQ%=F3" x="-505" y="-85"><field name="COMMENT">Dieser Block muss nicht in den Hauptloop eingesetzt werden. &amp;#10;Hier kannst du die Anzahl Pixel einstellen, die deine Matrix oder dein Stripe hat.</field></block><block type="set_neo_pixel" id="I`^biUhO1LmL1hH1oz-/" x="12" y="-78"><value name="NUM_LEDS"><block type="math_number" id=";w$YmxxVz2X7P-I}c08d"><field name="NUM">16</field></block></value><value name="BRIGHTNESS"><block type="math_number" id="QUQ`.VUj%Y]+XS@JxovV"><field name="NUM">100</field></block></value><value name="OUTTURN"><block type="led_pin" id="OK)/#n=LD%PG%`Aj6cp?"><field name="LED">LED1</field></block></value></block><block type="basic_main_loop" id="KlJsKVB#*Pt72$iMt?Kg" deletable="false" x="10" y="10"><value name="BLINK"><block type="basic_blinkcode" id="Fg`kPuq`MbnaEqeK*|rR"><field name="SHORT">1</field><field name="LONG">1</field></block></value></block><block type="basic_comment" id=":kgG`H2-%JCRVWHEgqy=" x="-388" y="154"><field name="COMMENT">Ab den Pixeln 1, 5, 9 und 13 sollen jeweils 4 Pixel leuchten</field></block><block type="flow_for" id="EH9t)fOl|f^]$;4n=fEO" x="11" y="153"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field><value name="FROM"><block type="math_number" id="6xeZ2@W]F:4EAA;c.US!"><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id=":vWZab%3W!EA3=}.aRU6"><field name="NUM">16</field></block></value></block><block type="set_pixel_color" id="/:k]f~MIBX(Tz~ek(Jj_" x="12" y="278"><field name="MODE">MODE1</field><value name="S"><block type="math_number" id="jGE{4{@_uo-.A6V)5.|n"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="KfOet:4ZOIMWE*7cJu?;"><field name="NUM">100</field></block></value></block><block type="flow_delay" id=";9sv~KXJ%vFJ[-o:plB5" x="15" y="356"></block><block type="math_number" id="AbBn].2bh%bSOO,9,Qki" x="12" y="442"><field name="NUM">4</field></block><block type="math_number" id="yEi$yzF/lNg%VwxsY2F}" x="84" y="442"><field name="NUM">4</field></block><block type="math_number" id="0gceFb|S!=DA)Egolg{s" x="154" y="442"><field name="NUM">20</field></block><block type="math_number" id="LIqT:}dLZ.ft{~27`=;}" x="232" y="443"><field name="NUM">100</field></block><block type="variables_get" id="gX4:(Y~opzb]ZmfDW)x:" x="318" y="442"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field></block></xml>

Mögliche Lösung:

Lösung: XML-Code in Editor einfügen
<xml xmlns="https://developers.google.com/blockly/xml"><variables><variable id="TcCO{,6!rKL%!WIVD{CK">Pixel</variable></variables><block type="basic_comment" id="XjX.XnAUE($w%aeQ%=F3" x="-505" y="-85"><field name="COMMENT">Dieser Block muss nicht in den Hauptloop eingesetzt werden. &amp;#10;Hier kannst du die Anzahl Pixel einstellen, die deine Matrix oder dein Stripe hat.</field></block><block type="set_neo_pixel" id="I`^biUhO1LmL1hH1oz-/" x="12" y="-78"><value name="NUM_LEDS"><block type="math_number" id=";w$YmxxVz2X7P-I}c08d"><field name="NUM">16</field></block></value><value name="BRIGHTNESS"><block type="math_number" id="QUQ`.VUj%Y]+XS@JxovV"><field name="NUM">100</field></block></value><value name="OUTTURN"><block type="led_pin" id="-?ay-9m~:+/`cY-JHo^_"><field name="LED">LED1</field></block></value></block><block type="basic_main_loop" id="KlJsKVB#*Pt72$iMt?Kg" deletable="false" x="10" y="10"><value name="BLINK"><block type="basic_blinkcode" id="Fg`kPuq`MbnaEqeK*|rR"><field name="SHORT">1</field><field name="LONG">1</field></block></value><statement name="CODE"><block type="flow_for" id="EH9t)fOl|f^]$;4n=fEO"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field><value name="FROM"><block type="math_number" id="6xeZ2@W]F:4EAA;c.US!"><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id=":vWZab%3W!EA3=}.aRU6"><field name="NUM">16</field></block></value><value name="BY"><block type="math_number" id="AbBn].2bh%bSOO,9,Qki"><field name="NUM">4</field></block></value><statement name="DO"><block type="set_pixel_color" id="/:k]f~MIBX(Tz~ek(Jj_"><field name="MODE">MODE1</field><value name="FROM"><block type="variables_get" id="gX4:(Y~opzb]ZmfDW)x:"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field></block></value><value name="TO"><block type="math_number" id="yEi$yzF/lNg%VwxsY2F}"><field name="NUM">4</field></block></value><value name="H"><block type="math_number" id="0gceFb|S!=DA)Egolg{s"><field name="NUM">20</field></block></value><value name="S"><block type="math_number" id="jGE{4{@_uo-.A6V)5.|n"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="KfOet:4ZOIMWE*7cJu?;"><field name="NUM">100</field></block></value><next><block type="flow_delay" id=";9sv~KXJ%vFJ[-o:plB5"><value name="DELAY"><block type="math_number" id="LIqT:}dLZ.ft{~27`=;}"><field name="NUM">100</field></block></value></block></next></block></statement></block></statement></block><block type="basic_comment" id=":kgG`H2-%JCRVWHEgqy=" x="-384" y="45"><field name="COMMENT">Ab den Pixeln 1, 5, 9 und 13 sollen jeweils 4 Pixel leuchten</field></block></xml>

Mögliche Variante:

Lösung: XML-Code in Editor einfügen
<xml xmlns="https://developers.google.com/blockly/xml"><variables><variable id="C5g.,`tcMQY4dVBGs94K">TempoLauflicht</variable><variable id="k7pm)DO#Gm8hN}5+hP%x">TempoFarbwechsel</variable><variable id="oW1bACDylAhE`Y9$!W|=">Startfarbe</variable><variable id="oHPsXH7|f!`XxLutN!ZG">Farbspektrum</variable><variable id="/r$J;hje.(Llna?IG5aF">Farbe</variable><variable id="id+fnMxx^g.cZmulxh*$">Zeit</variable></variables><block type="basic_comment" id="F%av4uJ(%X`e9L~(;z8S" x="15" y="-172"><field name="COMMENT">Matrix Lauflicht mit Überblendung</field></block><block type="set_neo_pixel" id="y5u!Ud:}l+R0U(|AJkB$" x="13" y="-96"><value name="NUM_LEDS"><block type="math_number" id="ezELuySp-}D48pJw]w7Z"><field name="NUM">16</field></block></value><value name="BRIGHTNESS"><block type="math_number" id="hpr`+`~;Qbt_es#9:Rk%"><field name="NUM">100</field></block></value><value name="OUTTURN"><block type="led_pin" id="S4FXI*1t2;Q(hlr~MOBQ"><field name="LED">LED1</field></block></value></block><block type="basic_main_loop" id="{4g%=.fgAOUFcI-{_t-V" deletable="false" x="11" y="0"><value name="BLINK"><block type="basic_blinkcode" id="1tguzu^k@QE=2E45^N0B"><field name="SHORT">1</field><field name="LONG">1</field></block></value><statement name="CODE"><block type="variables_set" id="?]*qIL,gnn.ttrJk~Hu:"><field name="VAR" id="C5g.,`tcMQY4dVBGs94K">TempoLauflicht</field><value name="VALUE"><block type="math_number" id="vY2/gT,VXP-q9QIWrU2q"><field name="NUM">1</field></block></value><next><block type="variables_set" id="0eJ!},eGP`Yn-X],B)=q"><field name="VAR" id="k7pm)DO#Gm8hN}5+hP%x">TempoFarbwechsel</field><value name="VALUE"><block type="math_number" id="2Q.r[6[v#$k~DorM9,H,"><field name="NUM">0.8</field></block></value><next><block type="variables_set" id="e1KOnp3Rxkd@L@Nsin$k"><field name="VAR" id="oW1bACDylAhE`Y9$!W|=">Startfarbe</field><value name="VALUE"><block type="math_number" id="l@4|=zTr794:Cm`yeadq"><field name="NUM">180</field></block></value><next><block type="variables_set" id="$MzBedj+3gg$JMEf#nq{"><field name="VAR" id="oHPsXH7|f!`XxLutN!ZG">Farbspektrum</field><value name="VALUE"><block type="math_number" id="xb4l$1l^R26TmbYd=`wr"><field name="NUM">80</field></block></value><next><block type="variables_set" id="Z%)Ih]}!m!:$~xA?OGyI"><field name="VAR" id="/r$J;hje.(Llna?IG5aF">Farbe</field><value name="VALUE"><block type="code_pin" id="V^EZ=Airxy`0V9FF$tbl"><field name="CODE_PIN">(sin(Zeit*TempoFarbwechsel)+1)*Farbspektrum*0.5+Startfarbe</field></block></value><next><block type="variables_set" id="ERb%UVrDe(|q,lgJ~e}O"><field name="VAR" id="id+fnMxx^g.cZmulxh*$">Zeit</field><value name="VALUE"><block type="code_pin" id="lF,?0HCP:yn@W*o_6QsW"><field name="CODE_PIN">Zeit+0.01*TempoLauflicht</field></block></value><next><block type="set_pixel_color" id="DG#8*aq=QYCMN)R@IZGd"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id="d)/|z|3K`8c~W$VJD/yN"><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id="aWI%~EewjO?c,K($Fk%c"><field name="NUM">4</field></block></value><value name="H"><block type="variables_get" id="fZr5-U}-]$(C`alf^{3?"><field name="VAR" id="/r$J;hje.(Llna?IG5aF">Farbe</field></block></value><value name="S"><block type="math_number" id="`^[=m]dbylTRP~^5hJh!"><field name="NUM">80</field></block></value><value name="B"><block type="math_constrain" id="ke)9EYV2dWG(mz#og,9$"><value name="VALUE"><block type="code_pin" id="wkK#J4rpAQxP08RI,$/|"><field name="CODE_PIN">sin(Zeit)*100</field></block></value><value name="MIN"><block type="math_number" id="xqEU:jHk;IV1RGUP?f(_"><field name="NUM">0</field></block></value><value name="MAX"><block type="math_number" id="L6=VWIYVD@4OzpHL3aZ}"><field name="NUM">100</field></block></value></block></value><next><block type="set_pixel_color" id="Jw@LyX:hjQZJHHiP7WE*"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id="[z4Xe;~a_Tjm|-E`Mc$B"><field name="NUM">5</field></block></value><value name="TO"><block type="math_number" id="/sSM:6V:dKP7)?tzt/2-"><field name="NUM">4</field></block></value><value name="H"><block type="variables_get" id="r*-p0).!z^fNl$QYyMbq"><field name="VAR" id="/r$J;hje.(Llna?IG5aF">Farbe</field></block></value><value name="S"><block type="math_number" id="8@OEHJ$OQ1(;cvv:Gcul"><field name="NUM">80</field></block></value><value name="B"><block type="math_constrain" id="3Jdr[RI@.qidlf1WVP9+"><value name="VALUE"><block type="code_pin" id="O`7`P;h=*HS:VI%G!gVF"><field name="CODE_PIN">cos(Zeit)*100</field></block></value><value name="MIN"><block type="math_number" id="$|vOmCF:.yUi:2b!4hAO"><field name="NUM">0</field></block></value><value name="MAX"><block type="math_number" id="3HBfcub|)$3f_y#9YI}3"><field name="NUM">100</field></block></value></block></value><next><block type="set_pixel_color" id="[w%siz~m{I,|-0nvufdd"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id=",|$^zegvWHs@Yvj-]Q:v"><field name="NUM">9</field></block></value><value name="TO"><block type="math_number" id="U~e*ELmxgWq+:6$.EPA7"><field name="NUM">4</field></block></value><value name="H"><block type="variables_get" id="Ep9Zz(Dg6^2$VixA2[_]"><field name="VAR" id="/r$J;hje.(Llna?IG5aF">Farbe</field></block></value><value name="S"><block type="math_number" id="/4J0CFl%6:*R.w3}fe#!"><field name="NUM">80</field></block></value><value name="B"><block type="math_constrain" id="K{qT;zb5VbB]Gk};]T30"><value name="VALUE"><block type="code_pin" id="BqGbTKgbH-7k+VJ!qy9V"><field name="CODE_PIN">sin(Zeit+3.14)*100</field></block></value><value name="MIN"><block type="math_number" id="~{Hr}(Vwd!0E,#JC%WAo"><field name="NUM">0</field></block></value><value name="MAX"><block type="math_number" id=",pV:t6a*;5l?Pe*GXfT="><field name="NUM">100</field></block></value></block></value><next><block type="set_pixel_color" id="bAsKeLC?We5*)~m{s@UI"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id="S-j#Clr#p.y;~[,mZ|ih"><field name="NUM">13</field></block></value><value name="TO"><block type="math_number" id="Z^N:F%iGNhAOi0p8HD!x"><field name="NUM">4</field></block></value><value name="H"><block type="variables_get" id="nQ9!Fq{~Uy,:U2lMvOs$"><field name="VAR" id="/r$J;hje.(Llna?IG5aF">Farbe</field></block></value><value name="S"><block type="math_number" id="b,xxe+-GY,$9#Qauqr5:"><field name="NUM">80</field></block></value><value name="B"><block type="math_constrain" id="6lyb2x94STA0v6AvnOPI"><value name="VALUE"><block type="code_pin" id="ImQ]PcWj7R;Nvpc5r#=^"><field name="CODE_PIN">cos(Zeit+3.14)*100</field></block></value><value name="MIN"><block type="math_number" id=")cr8(b]0X$cfe%bp`1s."><field name="NUM">0</field></block></value><value name="MAX"><block type="math_number" id="|k]N=iki@C@U8waxu?=U"><field name="NUM">100</field></block></value></block></value><next><block type="flow_delay" id="Lxw@MLsW1e8JF3?|5]Td"><value name="DELAY"><block type="math_number" id="R)0[JcyZKM,[=Xg~mz1+"><field name="NUM">1</field></block></value></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></statement></block><block type="basic_comment" id="9ZRzEW7f)+|+43oBQu_?" x="-235" y="34"><field name="COMMENT">Tempo: 0.1 bis 10&amp;#10;Tempo Farbwechsel: 0.1 bis 10&amp;#10;Startfarbe: 0° bis 360°&amp;#10;Farbspektrum:  0° bis 360°</field></block><block type="basic_comment" id="0gv%zxYd~f%0Et#M,/^]" x="812" y="433"><field name="COMMENT">Sinus verstehen: pglu.ch &gt; CODING &gt; LASERGRAPH &gt; Aufgabe und Lösung 5</field></block></xml>

Programmiere als Erweiterung eine Musiksteuerung der Matrix. Damit kann sich die Animation im Takt zu deiner Lieblingsmusik bewegen! Hier erfährst du, wie das Mikrofon angeschlossen wird.

Challenge:

Challenge erweitert: XML-Code in Editor einfügen
<xml xmlns="https://developers.google.com/blockly/xml"><variables><variable id="TcCO{,6!rKL%!WIVD{CK">Pixel</variable></variables><block type="basic_comment" id="XjX.XnAUE($w%aeQ%=F3" x="-505" y="-85"><field name="COMMENT">Dieser Block muss nicht in den Hauptloop eingesetzt werden. &amp;#10;Hier kannst du die Anzahl Pixel einstellen, die deine Matrix oder dein Stripe hat.</field></block><block type="set_neo_pixel" id="I`^biUhO1LmL1hH1oz-/" x="12" y="-78"><value name="NUM_LEDS"><block type="math_number" id=";w$YmxxVz2X7P-I}c08d"><field name="NUM">16</field></block></value><value name="BRIGHTNESS"><block type="math_number" id="QUQ`.VUj%Y]+XS@JxovV"><field name="NUM">100</field></block></value><value name="OUTTURN"><block type="led_pin" id="_t%~IGVmH@@*X*fAh%9g"><field name="LED">LED1</field></block></value></block><block type="basic_main_loop" id="KlJsKVB#*Pt72$iMt?Kg" deletable="false" x="10" y="10"><value name="BLINK"><block type="basic_blinkcode" id="Fg`kPuq`MbnaEqeK*|rR"><field name="SHORT">1</field><field name="LONG">1</field></block></value><statement name="CODE"><block type="flow_for" id="EH9t)fOl|f^]$;4n=fEO"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field><value name="FROM"><block type="math_number" id="6xeZ2@W]F:4EAA;c.US!"><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id=":vWZab%3W!EA3=}.aRU6"><field name="NUM">16</field></block></value><value name="BY"><block type="math_number" id="AbBn].2bh%bSOO,9,Qki"><field name="NUM">4</field></block></value><statement name="DO"><block type="set_pixel_color" id="/:k]f~MIBX(Tz~ek(Jj_"><field name="MODE">MODE1</field><value name="FROM"><block type="variables_get" id="gX4:(Y~opzb]ZmfDW)x:"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field></block></value><value name="TO"><block type="math_number" id="yEi$yzF/lNg%VwxsY2F}"><field name="NUM">4</field></block></value><value name="H"><block type="math_number" id="0gceFb|S!=DA)Egolg{s"><field name="NUM">20</field></block></value><value name="S"><block type="math_number" id="jGE{4{@_uo-.A6V)5.|n"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="KfOet:4ZOIMWE*7cJu?;"><field name="NUM">100</field></block></value><next><block type="flow_delay" id=";9sv~KXJ%vFJ[-o:plB5"><value name="DELAY"><block type="math_number" id="LIqT:}dLZ.ft{~27`=;}"><field name="NUM">100</field></block></value></block></next></block></statement></block></statement></block><block type="basic_comment" id=":kgG`H2-%JCRVWHEgqy=" x="-380" y="46"><field name="COMMENT">Ab den Pixeln 1, 5, 9 und 13 sollen jeweils 4 Pixel leuchten</field></block><block type="set_pixel_color" id="h0Xqhe#ovJ@}?+kRDrX7" x="12" y="234"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id="AwoNP!q)TgmptU4@W;v."><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id="B}BM{)7QjxY^M*[z37)0"><field name="NUM">4</field></block></value><value name="H"><block type="math_number" id="fC=D*H=j6E,I=8(NMgxq"><field name="NUM">20</field></block></value><value name="S"><block type="math_number" id="/ks6@jCiXZp{MA/pCLM?"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="+EM^9MaWM@/I!:v!z+pv"><field name="NUM">100</field></block></value></block><block type="basic_comment" id="w6M`B[Mz3(yo3n8SPg/;" x="-436" y="326"><field name="COMMENT">Wenn die Lautstärke 60% überschreitet, wird die Animation ausgelöst</field></block><block type="logic_if" id="NgITu9**Geb|isL_|;ds" x="11" y="324"><mutation xmlns="http://www.w3.org/1999/xhtml" else="1"></mutation></block><block type="basic_comment" id="2/3~`|U0Ab|.L3M[Z.G3" x="-220" y="387"><field name="COMMENT">Wenn nicht, soll Bild 1 leuchten</field></block><block type="logic_compare" id="pgKf26v6*I)Hii^,B?6X" x="7" y="459"><field name="OP">GT</field></block><block type="sensor_read_percentage" id="A$(S24EULTgB!s5Dc?p?" x="9" y="530"><value name="SENSOR"><block type="sensor_pin" id="3VxK@LE`qz6P=zLkos,k"><field name="SENSOR">SENSOR3</field></block></value></block><block type="math_number" id="jh~JI_6q:Ge7*i^3LD4h" x="320" y="535"><field name="NUM">60</field></block></xml>

Mögliche Lösung:

Lösung erweitert: XML-Code in Editor einfügen
<xml xmlns="https://developers.google.com/blockly/xml"><variables><variable id="TcCO{,6!rKL%!WIVD{CK">Pixel</variable></variables><block type="basic_comment" id="XjX.XnAUE($w%aeQ%=F3" x="-505" y="-85"><field name="COMMENT">Dieser Block muss nicht in den Hauptloop eingesetzt werden. &amp;#10;Hier kannst du die Anzahl Pixel einstellen, die deine Matrix oder dein Stripe hat.</field></block><block type="set_neo_pixel" id="I`^biUhO1LmL1hH1oz-/" x="12" y="-78"><value name="NUM_LEDS"><block type="math_number" id=";w$YmxxVz2X7P-I}c08d"><field name="NUM">16</field></block></value><value name="BRIGHTNESS"><block type="math_number" id="QUQ`.VUj%Y]+XS@JxovV"><field name="NUM">100</field></block></value><value name="OUTTURN"><block type="led_pin" id="hbwdfj#[.5GT;5TE]^_r"><field name="LED">LED1</field></block></value></block><block type="basic_main_loop" id="KlJsKVB#*Pt72$iMt?Kg" deletable="false" x="10" y="10"><value name="BLINK"><block type="basic_blinkcode" id="Fg`kPuq`MbnaEqeK*|rR"><field name="SHORT">1</field><field name="LONG">1</field></block></value><statement name="CODE"><block type="logic_if" id="NgITu9**Geb|isL_|;ds"><mutation xmlns="http://www.w3.org/1999/xhtml" else="1"></mutation><value name="IF0"><block type="logic_compare" id="pgKf26v6*I)Hii^,B?6X"><field name="OP">GT</field><value name="A"><block type="sensor_read_percentage" id="A$(S24EULTgB!s5Dc?p?"><value name="SENSOR"><block type="sensor_pin" id="3VxK@LE`qz6P=zLkos,k"><field name="SENSOR">SENSOR3</field></block></value></block></value><value name="B"><block type="math_number" id="jh~JI_6q:Ge7*i^3LD4h"><field name="NUM">60</field></block></value></block></value><statement name="DO0"><block type="flow_for" id="EH9t)fOl|f^]$;4n=fEO"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field><value name="FROM"><block type="math_number" id="6xeZ2@W]F:4EAA;c.US!"><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id=":vWZab%3W!EA3=}.aRU6"><field name="NUM">16</field></block></value><value name="BY"><block type="math_number" id="AbBn].2bh%bSOO,9,Qki"><field name="NUM">4</field></block></value><statement name="DO"><block type="set_pixel_color" id="/:k]f~MIBX(Tz~ek(Jj_"><field name="MODE">MODE1</field><value name="FROM"><block type="variables_get" id="gX4:(Y~opzb]ZmfDW)x:"><field name="VAR" id="TcCO{,6!rKL%!WIVD{CK">Pixel</field></block></value><value name="TO"><block type="math_number" id="yEi$yzF/lNg%VwxsY2F}"><field name="NUM">4</field></block></value><value name="H"><block type="math_number" id="0gceFb|S!=DA)Egolg{s"><field name="NUM">20</field></block></value><value name="S"><block type="math_number" id="jGE{4{@_uo-.A6V)5.|n"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="KfOet:4ZOIMWE*7cJu?;"><field name="NUM">100</field></block></value><next><block type="flow_delay" id=";9sv~KXJ%vFJ[-o:plB5"><value name="DELAY"><block type="math_number" id="LIqT:}dLZ.ft{~27`=;}"><field name="NUM">100</field></block></value></block></next></block></statement></block></statement><statement name="ELSE"><block type="set_pixel_color" id="h0Xqhe#ovJ@}?+kRDrX7"><field name="MODE">MODE1</field><value name="FROM"><block type="math_number" id="AwoNP!q)TgmptU4@W;v."><field name="NUM">1</field></block></value><value name="TO"><block type="math_number" id="B}BM{)7QjxY^M*[z37)0"><field name="NUM">4</field></block></value><value name="H"><block type="math_number" id="fC=D*H=j6E,I=8(NMgxq"><field name="NUM">20</field></block></value><value name="S"><block type="math_number" id="/ks6@jCiXZp{MA/pCLM?"><field name="NUM">100</field></block></value><value name="B"><block type="math_number" id="+EM^9MaWM@/I!:v!z+pv"><field name="NUM">100</field></block></value></block></statement></block></statement></block><block type="basic_comment" id="w6M`B[Mz3(yo3n8SPg/;" x="-434" y="45"><field name="COMMENT">Wenn die Lautstärke 60% überschreitet, wird die Animation ausgelöst</field></block><block type="basic_comment" id=":kgG`H2-%JCRVWHEgqy=" x="-376" y="111"><field name="COMMENT">Ab den Pixeln 1, 5, 9 und 13 sollen jeweils 4 Pixel leuchten</field></block></xml>

Anforderung:
✓ Einfach bis Mittel
✓ Bauen ohne Werkstatt

Thema:
> Daumenkino
> Gestaltung einer Animation
> Bildformate verstehen und umwandeln
> Lauflicht programmieren

Werkzeug:
> Dremel Engraver
> Lötstation
> SuS sägen: Dekupiersäge oder Bandsäge
> LP sägt: Kreissäge
> Optional: Lasercutter

Material:
> Bausatz: pglu.ch/shop > Bausatz > GIF-IT-YEAH
> 4 Acrylglas: 3 x 104 x 120 (hier konfigurieren und fertig zugeschnitten kaufen)
> 1 Pappelsperrholz 5 x 215 x 240
> 4 Kabelbinder 2.5 x 200

Anleitung Neopixel:
> Neopixel bauen: pglu.ch > BAU > NEOPIXEL
> Neopixel programmieren: pglu.ch > CODING > NEOPIXEL
> Matrix Designer: pglu.ch > CODING > MATRIX

3D-Modell:
> Hier anschauen

Videos:
> Vimeo: pglu.ch

Basics:
> Lernumgebung aufbauen: pglu.ch > ANLEITUNG
> XML in Editor importieren: pglu.ch > ANLEITUNG > EDITOR

Editor:
> Online: mach.pglu.ch
> Teacher’s Box: mach.pglu.box

Erweiterungen:
> Matrix Designer: pglu.ch > CODING > MATRIX Designer
> Weiteres: pglu.ch > HILFREICHE DOKUMENTE