Objectives

• Load images into and save images from a program.
• Access and use color information in an image.
• Store and use mouse positions in arrays.
• Grow arrays over time.
• Manage dynamic animation.

Description

In this assignment, you will create a program which lets users play with an image using mouse clicks. Your program will display the image of your choice. When users click on the image, a shape will appear on it which is the same color as the pixel the user clicked on. That shape will shrink over time. New mouse clicks will lead to additional shapes appearing (i.e., there may be multiple shapes visible at the same time, in different sizes). When the user types "s", the program will save the current frame.

Extra credit

Requirements

1. Load an image and display it in the window.
2. Use global variables which hold 1 or more arrays to store the points where the mouse has been clicked and the current size of each shape. The arrays will grow using append() when a new point is clicked.
3. Use for loops to access the data in the arrays in a meaningful manner.
4. Create shapes anywhere where a point has been clicked, which are in the same color as the pixel which was clicked on.
5. Each shape must start at the same size, then gradually shrink down in size. In other words, more newly created shapes will be larger than previously created shapes. You may or may not choose to have the shapes eventually disappear.
6. Save the current image when the user types "s".

Instructions

You may proceed in any way that you wish to accomplish the requirements of this assignment. One way to do this assignment is as follows (get each step working and debugged before moving on to the next):

1. Load the image into your program and display it on the screen.
2. Make a mouse click cause your chosen shape to appear.
3. Make the image save when the user types "s".
4. Make it so that the shape shrinks over time. For now, just have this work for a single mouse click.
5. Alter your code to use arrays to store the data you need to know for multiple mouse clicks, and to generate multiple shapes.
6. Double-check you have fulfilled all the requirements. Clean up your code so that it is logical, clean, and elegant. Fix any formatting problems and make sure it is adequately documented.

For this assignment, please submit a zipped sketch folder which includes both your processing file and the image(s) you are using.

Grading scheme

A+ - All required elements included, plus an interesting and creative approach to fulfilling the assignment requirements.

A - All required elements included and functioning correctly. Mouse clicks cause a clear and correctly patterned shape to appear. Code is clean, clear and well-documented.

B - Competent response to the assignment showing overall mastery of course material, with some small errors that do not greatly affect the quality of the assignment. For example, the code may be somewhat baroque (too complex for what it does), the code only works for a limited but non-trivial number of mouse clicks, or the code may be formatted incorrectly.

C - Some bigger errors, or a larger collection of smaller errors, but with potential to develop into a competent response. For example, the code may not run, but with a few small syntactical fixes would properly fulfill the assignment; the code may work but not be comprehensibly written; or the code completely misses on one of the requirements, but still shows some understanding of the unit's material.

D - Serious errors show clear effort, but serious gaps in understanding, such as code that does not run and is not close to being correct, or fulfills only part of a requirement.

F - Little demonstrated effort, or clear effort with no understanding, such as code fragments submitted which are only the start of a response to the assignment.

(Up to 5 points extra credit if the shapes pulse and the pulsing code is written in a clean and elegant manner.)