jennylihan / example-brush

p5-template

Use this template for a brand new p5.js project.

Assignment 1: Make a brush

1. Find an object, texture, or motion that you want to recreate using p5.js Here is some inspiration.
2. Generate some sort of "mark" every time your mouse location changes (aka make a “brush” you can "draw" with using the mouse).
3. Include one element that changes as you move the mouse that is not just the location of the mark. This could be scale, color, angle, or more.
4. (Optional) Include one element that is different each time you load the sketch (you may want to use randomness!)

Some helpful questions to think through

Q: What ideas do I want to convey with my brush?

You may want to choose an emotion: surprise, playfulness, confusion, etc.

Q: How can I create layers in p5?

Layers can help create a sense of complexity! To do so, comment out the background() function in your draw() function. This will prevent the screen from being covered by the background color each frame.

Q: How can I create a gradient of colors?

You might to check out https://p5js.org/reference/#/p5/lerpColor. Also useful: https://p5js.org/reference/#/p5/map

Q: Is my brush a tool for the user to create art, or is the brush a work of art in itself?

🤯

Q: Are there any resources I can turn to?

Check out Dan Schiffman's youtube tutorials http://learningprocessing.com/videos/3-2# !

This is adapted from Camille Utterback's class "Drawing with Code".