Assignment Set 6

Images and Pixels

6.0 Exercise — Images and Arrays

Review the code on the class resources page. Create a sketch that does the following:

  • Every time the user clicks the canvas, five randomly selected die images are shown simultaneously. If you do this correctly, but only this, you'll get an 80.
  • Display text to the screen when a given condition is met, related to dice rolled (e.g. one of the dies is a 1, all dice add to 15). Your condition must not happen every time. If you do this correctly as well, you'll get an 100.

  • HINT: If you plan checking to see if the dice add up to a value, consider creating a variable that adds each roll to itself each time through the loop.
  • HINT: Beware that you'll probably need to add one to your randomly selected value.

Download the dice images here.

6.1 Exercise — Pixels

Complete the following:

  • Find an image that is interesting to you. Resize it to a small resolution. Make the longest side less than 200px.
  • Use for loops to go through the image and use the color of each pixel to draw a triangle of that color. Manipulate the original color in some way.
6.2 Project — Image Processing

You have three options:

  1. Find an image you'd like to manipulate (like exercise 6.0, keep your image small — biggest side less than 200px). Create three different sketches using that same source image. Make each sketch produce a static image that distorts or manipulates the original in an interesting way. Remember to do the following:
    • Use a small image (biggest side less than 200px).
    • Use the get() function we went over in class and nested for loops.
    • Use // noprotect to stop infinite loop protection.
    • Use the nested for loops within setup not draw.
  2. Use the get() function we went over in class with mouseX and mouseY or your own variables (like we went over in class) to creatively reveal an image over time. Use a small image (biggest side less than 300px).
  3. Do something creative with nested for loops and multiple images. Tilesets?

Take a look at the following for inspiration:

To hand in your work get the URL from the editor and link to it from your index.html page. To receive credit, it must be uploaded by class on the date specified. Label it clearly. Here is help if you need it.

Projects will be graded on both creativity and implementation.