Week 2 Homework:

Animation

Create one of the following and post a link to the sketch and documentation of your creative process on your website:

Clock Design: a "visual clock" that displays a novel or unconventional representation of the time. Your clock should appear different at all times of the day, and it should repeat its appearance every 24 hours (or other relevant cycle, if desired). Challenge yourself to convey the time without numerals. Rather than making a clock that's analogous to a real-world clock, it should be a more abstract way of telling time. You are encouraged to question basic assumptions about how time is mediated and represented. Ponder concepts like biological time (chronobiology), ultradian and infradian rhythms, solar and lunar cycles, celestial time and sidereal time, decimal time, metric time, geological time, historical time, psychological time, and subjective time. Inform your design by reading about the history of timekeeping systems and devices and their transformative effects on society.
Emotive: Using your mouse and a simple shape (rect, ellipse, arc, triangle, line, polygon), create an interaction that causes the shape to demonstrate an emotion. It could be fear, attraction, desire, exhaustion. Your choice. Obviously mouseX and mouseY are helpful. Examples like this easing function might be inspirational, as would notes from the 12 principles of animation. Give consideration to how you can impart emotion through motion.

Readings:

Read p5.js Tutorial on interaction, in particular pay attention to the section on Events. The aspects in the article that describe mouseOver() and mouseOut() are our of scope for our discussion at the moment, so don’t worry if you don’t entirely get what it’s describing.
Read The Art of Interactive Design Chapter 1 (Online access provided by NYU Libraries) and What Screens by Frank Chimera. Write a response to this on your blog:
- Based on how Crawford defines interaction, would you consider a book to be interactive? What about a plant you need to care for? How about a puppy? What about your sketches?
- According to Chimera, how are animation and interaction related? How does this relate to your own work in p5?
Watch videos on loops [1] [2] and functions [1] [2].
(Optionally) Watch video on translation [1] [2] [3].
(Optionally) Read Getting Started With p5.js Chapters 4-6. Online access provided by NYU libraries.