Creatief programmeren 2.0 in JavaScript: kleur, geluid en animatie

Creatief programmeren 2.0 in JavaScript: kleur, geluid en animatie

“Gefeliciteerd! U bent aan het einde van deze Domestika-cursus gekomen. Bedankt voor je deelname en ik hoop dat je ervan genoten hebt. We werkten samen aan een paar composities, maar het belangrijkste waren de technieken die je leerde. Je kunt die nu meenemen, ergens anders opnieuw toepassen en iets anders creëren! Hoewel we veel hebben behandeld, is er altijd meer om over te praten, dus ik heb een kleine lijst met tips opgesteld voor dit laatste onderdeel. Bibliotheken Ik heb er tijdens de cursus een paar gebruikt, maar er zijn er nog duizenden. Sommige mensen vinden het leuk om alles zelf te doen, maar soms is dat hetzelfde als proberen het wiel opnieuw uit te vinden. Als je iets specifieks nodig hebt, raad ik je aan eerst door NPM te bladeren. Iemand anders heeft misschien al aan dat probleem gewerkt! Als u bijvoorbeeld gegevens uit een CSV-bestand moet laden, zijn daar bibliotheken voor. Als u bewerkingen met vectoren moet uitvoeren, tussen verschillende kleurruimten moet converteren of lettertypebestanden moet laden, zijn daar bibliotheken voor. Bouwen aan een website Een schets kan op zichzelf leven. U kunt uw compositie exporteren en afdrukken of ergens ophangen. Maar als u uw schetsen online wilt delen, kunt u dat ook doen met een "--build"-opdracht. Het genereert statische JavaScript- en HTML-bestanden die overal als normale webpagina's kunnen worden gehost. Als u uw schets wilt integreren in een bestaande website, onthoud dan dat we altijd de native Canvas API gebruiken, zodat u relevante delen van uw code naar een ander project kunt kopiëren en deze zonder canvas-sketch kunt uitvoeren. p5.js Veel mensen beginnen met creatief coderen met Processing of p5.js, en dat is logisch, het zijn geweldige tools. Ik ben gewend om met de native API te werken, maar als je al vertrouwd bent met p5.js, kun je het naast canvas-sketch gebruiken. Er is een eenvoudig voorbeeld opgenomen in de video hierboven die u laat zien hoe u dat moet doen. Documentatie Dit is een voor de hand liggende. Zorg ervoor dat u de documentatie controleert. Dat is niet alleen voor canvas-sketch of Canvas, maar voor elke API waarmee u werkt. Iemand heeft de tijd genomen om hun code te ordenen en te documenteren, zodat we er ons voordeel mee kunnen doen. Het is er om ons te helpen. Vervolgens wil ik een samenvatting maken van wat we tot nu toe hebben gezien. In deze cursus heb ik aan vijf kleine projecten gewerkt. De eerste begon met een eenvoudige rechthoek, maar uiteindelijk ging het om enige kennis over trigonometrie, willekeur, kleurenpaletten, overvloeimodi en uitknipmaskers.

Het tweede project bestond uit het maken van enkele visuals met behulp van curvesegmenten die als een raster werden verdeeld, waarbij kleuren op een andere manier werden gebruikt dan in de eerste eenheid. Daarna gebruikte ik audiofrequentiegegevens om wat beelden aan te sturen en probeerde ik een aantal klassieke posterontwerpen na te maken met behulp van code. De laatste schets gaat helemaal over deeltjes! Je hebt geleerd hoe je krachten op ze kunt toepassen met behulp van basisbegrippen uit de natuurkunde zoals snelheid en versnelling. Nu zou ik graag willen dat u uw schetsen op het forum deelt door hierboven op de knop "Maak uw project" te klikken. Het zou fijn zijn als je ook de keuzes die je onderweg hebt gemaakt kunt toelichten en ons kunt vertellen als je twijfels hebt. Zo leren we allemaal van elkaar. Ik zal er zijn om vragen te beantwoorden en advies te geven. Ik ben benieuwd wat je gaat maken met wat je in de cursus hebt geleerd. Zie je daar! ”

Gedeeltelijke transcriptie van de video

“Laatste project Hallo allemaal, ik hoop dat je genoten hebt van de reis. We hebben samen aan enkele composities gewerkt maar het belangrijkste waren de technieken die we leerden zoals nu kun je die overdragen, pas ze ergens anders toe en creëer iets anders. We hebben veel besproken, maar er is altijd meer om over te praten. Ik heb een lijst met tips opgesteld voor deze laatste video. Bibliotheken, we hebben er tijdens de cursus een paar gebruikt maar er zijn er nog duizenden. Sommige mensen doen alles zelf maar soms is het alsof je het wiel opnieuw probeert uit te vinden. Als je iets specif...”

Deze transcriptie wordt automatisch gegenereerd en er kunnen typefouten in staan.

Samenvatting van de cursus: Creatief programmeren 2.0 in JavaScript: kleur, geluid en animatie

• Niveau: Beginner
• 99% positieve beoordelingen (175)
• 19592 studenten
• 6 didactische onderdelen
• 28 lessen (2u 47m)

• Categorie

  3D en animatie, Web- en app-ontwerp

• Domeinen

  JavaScript, Motion Graphics, Multimedia, Programmeren