Creatief programmeren 2.0 in JavaScript: kleur, geluid en animatie
A course by Bruno ImbriziCreatief programmeur
A course by Bruno Imbrizi, Creatief programmeur
Ontdek geavanceerde programmeertechnieken en creëer unieke visuals waarin je kleur, beweging en geluid combineert
Programmeren is als het oplossen van puzzels; het is een constante cyclus van leren, fouten en herhalingen die kunnen worden gebruikt om iets moois te creëren. Bruno Imbrizi is een bekroond grafisch ontwerper die de afgelopen 10 jaar van zijn carrière heeft gewijd aan het beheersen van de kunst van het creatief programmeren.
Hij gebruikt Javascript om animaties, prints, interactieve kunstwerken en meer te creëren en heeft samengewerkt met merken als Google, Spotify en Nike. Hij heeft ook prijzen gewonnen, waaronder de Adobe Cutting Edge Award en FITC Best Digital Installation.
Wat krijg je in deze cursus?
"Ik leer je verschillende technieken om boeiende beelden te produceren met Javascript."
Je leert hoe je een meeslepende beelden verbeterd met geluid
Je ontwikkelt programmeercomposities boordevol kleur
Je animeert je beelden en neemt cursorinteractie op
Dit is Bruno's tweede Domestika-cursus. In zijn eerste cursus, Creatieve codering: maak visuele stukken met Javascript leert hij je de essentie van programmeren en tekenen met code.
Wat leer je tijdens deze online cursus?
28 lessen & 20 aanvullende bronnen
De online installatie
5 minuten, 4 seconden
Verdeling
4 minuten, 51 seconden
Kleuren toevoegen
8 minuten, 50 seconden
Knipmasker
6 minuten, 29 seconden
Afbeeldingsgegevens
8 minuten, 53 seconden
Wat is inbegrepen in deze cursus?
Je begint met een samenvatting van de essentiële tools van Javascript. Je stelt vervolgens een omgeving in om de code uit te voeren en je schetsen te maken.
Ontdek hoe je basisvormen volledig in code kunt tekenen, kleur kunt toevoegen en je ontwerpen kunt uitrekken of scheeftrekken.
Je creëert krommingen voor verschillende bewerkingen, van ontwerpelementen tot grafieken. Je voegt meerdere punten langs een segment toe, animeert ze en leert hoe je afbeeldingen kunt laten reageren op de cursor.
Je creëert een audiovisualisatie door geluidsbestanden af te spelen, hun gegevens te lezen en frequenties te gebruiken om een animatie te maken.
Je experimenteert met deeltjes en leert hoe je hun gedrag dicteert door verschillende krachten en verstoringen toe te passen en hun grootte en kleur aan te passen.
What is this course's project?
Je ontwikkelt een reeks programmeercomposities met kleur en geluid die in een webbrowser kunnen worden uitgevoerd.
Projecten van studenten van de cursus
Who is this online course for?
Deze cursus is voor diegenen die geïnteresseerd zijn in het verder ontwikkelen van hun programmeerkennis om unieke geanimeerde composities te maken.
Requirements and materials
Voor deze cursus heb je voorkennis nodig van programmeren.
Qua materialen heb je toegang nodig tot een apparaat met Javascript.
Beoordelingen
- 4 maanden geleden
Polecam, fajna zabawa
- 8 maanden geleden
Excelente! Buena fuente de inspiración para creativos incursionando en programación
- 9 maanden geleden
I will recommend this to my friend who likes to know more on javascript designing
- 10 maanden geleden
Recomendado para principiantes que quiera incorporar su lado artístico a la codificación.
- chillwill47PLUS1 jaar geleden
Just getting started into creative coding and this course is definitely a great point to begin at.
Hij heeft meer dan 10 jaar ervaring en heeft gewerkt bij bureaus, ontwerpstudio’s, productiemaatschappijen en bekende merken, waaronder Dell, Adidas en Universal Music. Hij was te zien in online publicaties zoals WIRED en Londonist, en hij heeft verschillende prijzen gewonnen, waaronder de Adobe Cutting Edge Award en FITC Best Digital Installation.
Inhoud
- U1
Introductie
- Over mij
- Invloeden
- U2
De opzet
- JavaScript-recap
- De online installatie
- De offline installatie
- Canvas-schets
- U3
Scheeftrekken
- Een rechthoek tekenen
- Een scheve rechthoek tekenen
- Verdeling
- Kleuren toevoegen
- Knipmasker
- Een willekeurig zaadje instellen
- U4
Curven
- Een kwadratische curve tekenen
- Cursorinteractie
- Meerdere punten
- Een raster maken
- Segmenten
- Animatie
- U5
de audio
- Drukken op Afspelen
- analysator
- Frequenties
- Bogen
- Een poster maken
- U6
Deeltjes
- Een enkel deeltje tekenen
- Krachten toepassen
- De deeltjes distribueren
- Schaal en kleuren wijzigen
- Afbeeldingsgegevens
- EP
Eindproject
- Creatief programmeren 2.0 in JavaScript: kleur, geluid en animatie
Wat kan je verwachten van een cursus van Domestika
Leer in je eigen tempo
Geniet van thuis leren, zonder lesroosters en in je eigen tempo. Jij beslist wanneer je verder gaat met het volgende onderdeel.
Leer met de beste professionals
Leer de meest bruikbare methoden en technieken van de beste professionals in de creatieve industrie.
Ontmoet deskundige docenten
Iedere docent brengt kennis met passie over, biedt duidelijke uitleg en een professioneel perspectief bij elke les.
Certificates
PLUSIf you're a Plus member, get a persoonlijk certificaat signed by your teacher for every course. Share it on your portfolio, social media, or wherever you like.
Zorg dat je op de voorste rij zit
Dankzij de hoge kwaliteit van de video's mis je geen enkel detail. Dankzij de onbeperkte toegang kun je de lessen zo vaak bekijken als nodig is om je vaardigheden te perfectioneren.
Deel kennis en ideeën
Stel vragen, krijg feedback en bied oplossingen aan. Deel je leerervaringen met andere studenten in de community die net als jij een passie hebben voor creativiteit.
Maak contact met een wereldwijde creatieve community
Deze community heeft miljoenen gebruikers van over de hele wereld, nieuwsgierig en enthousiast om hun creativiteit te verkennen en te uiten.
Geef cursussen op een professionele manier
Domestika selecteert zorgvuldig haar docenten en produceert iedere cursus in eigen huis om een uitstekende online leerervaring te garanderen.
Veelgestelde vragen
This course is designed for intermediate learners. Basic familiarity with JavaScript and coding concepts is recommended before enrolling to get the most out of the lessons.
You'll need access to a modern web browser, and tools like StackBlitz, CodeSandbox, Node.js, npm, and a code editor such as Sublime Text. No specialized hardware is required.
You'll learn foundational creative coding concepts, how to use JavaScript and Canvas APIs for interactive visuals, generative art techniques, project setup, exporting artwork, and integrating audio for visualization.
The course primarily focuses on 2D creative coding using JavaScript and Canvas APIs, but introduces 3D visualization concepts and frameworks like Processing and OpenFrameworks.
Yes, the course includes detailed instructions for setting up and using StackBlitz and CodeSandbox for browser-based development, making it easy to start coding without local installations.
You'll learn how to export your browser-based generative artwork as high-resolution PNG images, which can then be printed or shared online.
Yes, the course covers creating interactive visuals and animated sketches using JavaScript, the Canvas API, and Canvas Sketch, including frame-based logic and user input.