Week 3: Motion

Monday, October 13th Overview

• Review Mini Assignment 3 / questions from the previous week

• Hysteresis attempt 2 ! 

  • Thermostat example

  • https://en.wikipedia.org/wiki/Canny_edge_detector#Edge_tracking_by_hysteresis

• Reading Reflection check-in

• Project 1 Examples added - Questions?

  • OOP in p5.js - exercise caution when vibe coding with classes

  • P5.js AI coding support

• Motion Basics Overview- Slides

• Motion Code Examples

• Other useful examples and links

  • The Nature of Code Chapters 1-6!

  • Stop Drawing Dead Fish by Bret Victor

  • Generative Design Oscillation Examples

    1. Example 1

    2. Example 2

    3. Example 3

    4. Example 4

To Do before Wednesday's Class:

• Reading and Reflection

  • Narrative Motion Blocks: Combining Direct Manipulation and Natural Language Interactions for Animation Creation

  • Create a slide on the Reflection Slide Deck and add your response

  • Experiment with sample code in motion examples and take a look at extra materials.

Wednesday, October 15th Overview

• Reading Discussion- Discussion leaders Taneesha and Siddarth

• UI Resources

  • Class Examples

  • P5 DOM reference  (scroll to DOM section)

  • P5.5 - "an addon for the p5.js library. It is a combination of a UI with panning and zooming, and more nice things."

  • p5.TouchGUI - another GUI library for p5.js

• OOP in P5.js quick overview

• Questions about project 1

• Vector-based motion and simple physics simulation in p5.js

  • P5.js vector class reference

  • Class Examples

    • basic vectors

    • bounce 

    • forces

    • particles

To Do before Monday's Class:

• Finish Project 1 and come to class prepared to have another person try out your drawing tool!