Cc -2 19-10
Kapitoli
-
0:00
We gaan eens te beginnen met wat een animatie juist is. Animatie is eigenlijk allemaal frames na elkaar. Ik weet niet waar jullie dat in audiovisual misschien al niet zo over gehoord hebben. Een aantal frames na elkaar met kleine verschille…
-
1:23Kapitolu 2: kunnen gaan maken. 212s · Speaker 7
kunnen gaan maken. En dat gaan we doen aan de hand van een draw loop. Dat is eigenlijk gewoon een magische functie, kunnen we dat noemen. Als je die function draw toevoegt, dat is eigenlijk een functie die je zelf gaat schrijven, maar die d…
-
4:55Kapitolu 3: Oké. Dus we zien de eerste. 249s · Speaker 5
Oké. Dus we zien de eerste... frame, frame count is 1, hij wordt getekend, in de volgende frame wordt hij getekend, 1 pixel verder, en ga gewoon die frame count variabele, die je daar telkens eentje omhoog ziet gaan per frame, gaat hij gebr…
-
9:04Kapitolu 4: no stroke. 64s · Speaker 6
no stroke. Daarna komt het de eerste keer in die drawloop, ik zal hem fillen en ik teken een rectangle over de breedte en hoogte van mijn canvas. Ik doe een fill wide, ik teken die cirkel op die plaats en de volgende loop start. Ik wis alle…
-
10:09
FPS, en dan kun je zien hoeveel frames per seconde dat er gaat. Nu, op sommige computers kan dat hoger zijn, of naargelang je refresh rate van je schijn. En ook, hoe meer dat er gaande is op je schijn, als je heel complexe tekeningen aan he…
-
11:11Kapitolu 6: Enzovoort. 91s · Speaker 5
Enzovoort. Goed, dus, zoals ik heb juist verteld, de eerste setup -functie wordt automatisch opgeroepen aan het begin van dit programma. Na die setup -functie gaan we opnieuw en opnieuw die browser gaan uitvoeren. De frame -count variabele,…
-
12:46Kapitolu 7: Delta Time, dat gaan we nu nog niet zoveel gebruiken, maar zeker als je naar interactieve 3D applicaties of games gaat. 86s · Speaker 2
Delta Time, dat gaan we nu nog niet zoveel gebruiken, maar zeker als je naar interactieve 3D applicaties of games gaat. Dat wordt iets dat heel vaak gebruikt wordt. En Delta Time geeft mij de tijd terug tussen de huidige frame en de vorige …
-
14:12Kapitolu 8: Zo. En dan zie je hier frames per seconde, 60. 255s · Speaker 5
Zo. En dan zie je hier frames per seconde, 60. Afgrond. Ik ga gaan afronden. En de ene keer gaat dat 61 zijn, de andere keer gaat dat 59 zijn, maar meestal gaat dat die 60 proberen bereiken. En wat is er nu ook handig? We kunnen eigenlijk o…
-
18:28Kapitolu 9: 4, enzovoort gezet. 133s · Speaker 8
4, enzovoort gezet. Ik denk dat is een mogelijkheid, maar de andere oplossing is iets beter. Waarom? Omdat dit getalletje wel blijft stijgen. Terwijl als je het zelf gaat resetten en je hebt meer controle over, dat dat elke keer terug naar …
-
20:41
Zo. En ik kan hier eigenlijk de muispositie even gaan loggen. Of ik ga ineens een cirkel tekenen als ik klik. Cirkel. Op welke positie? Op mouseX en mouseY. En met een bepaalde size. Ik zal nu even 50 zetten. Dus nu heb ik geen draw loop, d…
-
21:47Kapitolu 11: Mouse moved. 114s · Speaker 8
Mouse moved. Die gaat, iedere keer als ik mijn muis nog maar een pixel beweeg, gaat hij die functie oproepen. Waardoor dan eigenlijk hetzelfde principe gebeurt, maar laat wel me op, dit wordt niet geanimeerd. Dus als ik nu die kleur ga gaan…
-
23:41Kapitolu 12: gaan gebruiken. 125s · Speaker 6
gaan gebruiken. Er zit trouwens ook een dubbelklik in als je iets wilt maken met dubbelklik. We kunnen ook opreageren. Maar we hebben nog een mousewheel functie, dus ik ga dat even terugzetten. Dus normaal heb ik nu terug een programmaatje …
-
25:47Kapitolu 13: plus plus. 188s · Speaker 3
plus plus. Als dat getalletje dat ik binnenkrijg in die functie kleiner is dan al, dan doe ik size, min, min. En dan heb ik eigenlijk iets interactief gemaakt. Als ik naar beneden scroll, dat dat kleiner wordt. En als ik naar boven scroll, …
-
28:56Kapitolu 14: En dan naast mouse interactions kunnen we ook op keyboard gaan reageren. 163s · Speaker 5
En dan naast mouse interactions kunnen we ook op keyboard gaan reageren. Dus als we bijvoorbeeld een soort van VJ installatie willen maken en we op verschillende toetsen verschillende animaties gaan afspelen, dan kunnen we dat gaan doen doo…
-
31:40Kapitolu 15: function, key pressed. 157s · Speaker 6
function, key pressed. Als ik mijn toets indruk, dan wil ik iets gaan doen. Dus ik kan hier een keer zeggen, output test. En we gaan een keer gaan testen. Je ziet hier, als ik mijn toets indruk, komt er daar telkens test te staan. Maar ik b…
-
34:17Kapitolu 16: In dat geval ga ik i++ doen. 64s · Speaker 5
In dat geval ga ik i++ doen. En naar beneden bewegen. En dan ga ik hetzelfde doen voor... De left and right. Arrow, left, right. Maar natuurlijk niet de y -positie, maar de x -positie. En kan ik eigenlijk die gaan bewegen. Oké? Het leuke da…
-
35:21Kapitolu 17: terugzetten. 185s · Speaker 8
terugzetten. Let target y. Ik ga daar een cirkeltje tekenen, iedere keer opnieuw. Dan gaat die op een vaste locatie staan. Dus circle. Target x, target y. Een bepaalde size. Oké. Ik wil die ook even een ander kleurtje geven. Dus mijn eigen …
-
38:27Kapitolu 18: kleiner wordt, wordt mijn scherm volledig groot. 117s · Speaker 7
kleiner wordt, wordt mijn scherm volledig groot. Want vanaf nu komt hij altijd in deze if statement terecht. Want dit is true geworden. En wordt altijd dat rood scherm betekend. En zo heb ik eigenlijk een soort van collision detectie gemaak…
-
40:25Kapitolu 19: kun je Frogger maken. 106s · Speaker 6
kun je Frogger maken. Ken iedereen Frogger nog van vroeger? Ik heb nog nooit van gehoord, dat is in de lesgeschiedenis. Frogger game. Ja, ik speelde nog zo games vroeger. moest je met een kikkertje aan de overkant draken, en dan passeren de…
-
42:12Kapitolu 20: bij muziek, als je dat wilt. 21s · Speaker 7
bij muziek, als je dat wilt. Maar dat is wel iets complexer, dat ga ik een keer tijdens de les stap voor stap gaan uitleggen. Oké, ik denk dat dat dus al was voor vandaag, dus vanaf uur kunnen we eigenlijk zeer geanumerende interactieve din…