Assignment 1: Helloworld

setting up github, p5.js, and your homepage

Week 1: One, Two, Three

Follow this class tutorial to setup your Github account, your github.io homepage, and your first p5.js sketch. Once you have p5.js working, add a word and a couple of shapes to your sketch. Make sure between all the elements and the background you have at least three different colors. You won’t be graded on aesthetics for this first assignment, but do feel free to have fun with type, palettes, and layout if you wish.

You should finish with:

  • your Github @handle you’ve emailed to Agnes
  • a yourname.github.io url showing 1 word, 2 shapes, 3 colors

Week 2: Add Time

For practice, let’s turn your “One, Two, Three” composition into an ugly clock. This is about working with time and JavaScript, so again, don’t worry about looking pretty.

Follow the p5.js reference on hours, minutes, and seconds to get the current time number, then use that number, via a mapping, to rotate, scale, translate, or change color on your elements. Here’s my (ugly) example.

Remember: if it’s not ugly you’re doing it wrong.