/creative-coding-domestika-2022

Resources and notes for students of the course Creative Coding 2.0 in JS: Animation, Sound, & Color at Domestika.

Primary LanguageJavaScriptMIT LicenseMIT

creative-coding-domestika-2022

Resources and notes for students of the course Creative Coding 2.0 in JS: Animation, Sound, & Color at Domestika.

General Resources

New to JavaScript

The course is focused on creating visuals using JavaScript. In case you are new to the language, it's better to start with some of the fundamentals first:

CanvasRenderingContext2D

The CanvasRenderingContext2D interface, part of the Canvas API, provides the 2D rendering context for the drawing surface of a <canvas> element. It is used for drawing shapes, text, images, and other objects.

canvas-sketch

canvas-sketch is a loose collection of tools, modules and resources for creating generative art in JavaScript and the browser using the <canvas> tag. It is designed to help create artworks and images with code, randomness, algorithms, and emergent systems.

Online templates

UNIT 2 - Setup

image

L01 - JavaScript Recap

L02 - Online Setup

L03 - Offline Setup

L04 - Canvas-Sketch

UNIT 3 - SKEW

image

L01 - Rectangle

L02 - Skewed Rectangle

L03 - Distribution

L04 - Colors

L05 - Clipping Mask

L06 - Random Seed

UNIT 4 - CURVES

image

L01 - Quadratic

L02 - Cursor Interaction

L03 - Multi-point

L04 - Grid

L05 - Segments

L06 - Animation

UNIT 5 - AUDIO

image

L01 - Press Play

L02 - Analyser

L03 - Frequencies

L04 - Arcs

L05 - Müller-Brockmann

UNIT 6 - PARTICLES

image

L01 - Particle

L02 - Forces

L03 - Paul McNeil

L04 - Scale & Colors

L05 - Image Data