p5-fundamentals

Basics of working with p5.js at IDM

Intro Some basic concepts related to programming
  • Programming Computers
  • The Browser and JavaScript
  • Setting up a Development Environment
  • Git and GitHub
Ready to p5 The basics of programming using p5.js and JavaScript
  • Setting up p5.js
  • Intro to p5.js
  • Drawing: Shapes and Colors
  • Variables
  • Conditionals
  • Loops as Patterns
  • Loops as Counters
  • Functions
  • Randomness
  • Arrays
  • Strings
  • JavaScript Objects
  • Advanced Arrays
  • Classes
Creative Coding The browser as a canvas
  • Translations, Rotations and Transformations
  • Interactions
  • Maths: mod and map
  • Animations
  • Cycles
  • Sine & Cosine
  • Loading Data (JSON/CSV)
  • State Variables
  • The DOM
  • More Random
  • More Trigonometry and Vectors
  • Images
  • Videos
  • Computer Vision
  • 3D
  • Sound Files
  • Sound Processing
  • Sound Synthesis
Mini Projects Putting it all together
  • 2D Patterns
  • Procedural Drawing Machine
  • Glitchy Typewriter
  • Simple Game
  • Sprites
  • Generative Terrain
  • Lights