HCDE 598 Winter 2017
The purpose of this exercise is to give you a chance to explore with p5.js and use new things in creative ways.
In this assignment you will create 2 p5.js visually interesting programs. They should do something new, creative, and interesting. As usual I am expecting you to sketch and plan your projects before starting on your code.
The goal is for your programs to not be too complex, but rather explore with different aspects of p5.js. You might explore more with sound, or keyboard and mouse input, or maybe you might explore with text and images or even video. The goal is for you to try something new and interesting—to learn how to do something new with p5.js.
Note: You may work individually or in a pair on this assignment. If you work as a pair you need to let me know who you are working with no later than Tuesday 02/07 by 9pm via Slack direct message. Those working in pairs must physically be together for all project coding.
Note: Grading on this assignment will not be as specific as past assignments. As long as you try something new and interesting, use correct style including indentation and commenting then you will receive full credit.
These examples are meant to inspire you, you should not be recreating any of these directly. If you want to build off one of these projects that is okay as long as you dive deep and modify it to create something new.
Note: Only images are shown below, you will need to run the program on your own computer for the full visual experience.
This program simulates the Seattle rain. This program generates droplets of a random size and one of two different (but very similar) random colors. The slow frame rate makes the action develop in kind of a hypnotic way, like Seattle rain.
This program simulates a beating heart using shapes, and adjusting the color.
In this program a stick figure is animated to walk forward over an abyss. Notice that the body can be moved by using our standard move-to-the-right techniques, but the legs must work differently.
- Your code should have a top comment block with your name, last edited date, and a brief description of the entire program
- Each line in setup and draw should have a comment
- Each function that you created should have a top comment briefly explaining what that function does (note that setup and draw do not need top comments)
- Add your creative exploration projects to your Github portfolio and submit a link to this project on canvas along with an image of your sketches
- If you are comfortable with HTML and CSS also add your sketches to your portfolio
- Assignment Explanation Video
- Daniel Shiffman's p5.js Videos