CC 3.12 : Computers and Art
Fall 2007
HW Unit E part 2

INFORMATION

INSTRUCTIONS
  1. For this assignment, you will create 2 Processing sketches, which will be saved as folders on your desktop, and you will be writing answers to the questions in a text file.
  2. Type your name in the files and your email address as comments. Learn how to write comments in Processing..
  3. Save your work!!!
    BEFORE YOU LEAVE THE LAB, make sure that you save your work (all of the sketch folders that you create) by storing them on a USB flash drive or by mailing them to yourself.
  4. When you are completely finished with all the steps, zip all your files together and email the zip file to me as an attachment. To do this, put everything that you want to turn in, into a folder:
      1. Mac OS X: Right-click on the folder and choose "Create Archive"
      2. Win PC: WinZip program and adding the homework files to the zip archive when it is created.
      3. Send me the .zip file as an attachment. Do not send me the files individually!
      4. Some links as to how to create .zip files:
    1. My email address is: chipp@sci.brooklyn.cuny.edu
    The assignment is due (both parts) on Wednesday Nov 14, 2007 no later than 11:59pm.

    BE SURE TO ASK IN THE LAB IF YOU NEED HELP WITH ANY STEPS!!!!


    PART II.

    These problems fit with this TUTORIAL on variables that we did in lab on Monday, Nov. 5th.

    1. Add a Variable (1.0 point)

    Step 1. Add a variable of the type integer to this sketch. (Hint: there is already an integer variable given in this program).

    Step 2. In setup(), set the variable to a value between 0 and 255.

    Step 3. Using a println() function, print the value of this variable onto the console with your very own text message.

    Save As.. this sketch, naming it yourname-Variable, (i.e. my sketch would be called Chipp-Variable).

    Turn this sketch (yourname-Variable) in with your HW E

    2. Change the Variable (1.0 point)

    Make a copy of the program you were working on in the previous step:

    Step 1. Change the value of the variable in the draw() function. (You can set it to a new value, increment it's value, or decrement it's value like we did in the tutorial).

    Step 2. Add a println() function to the draw() function to print the changed value of your variable.

    Save As.. this sketch, naming it yourname-Change, (i.e. my sketch would be called Chipp-Change).

    Turn this sketch (yourname-Change) in with your HW E

    3. Use the Variable in a Function (1.0 point)

    Make a copy of the program you were working on in the previous step:

    Step 1. Draw an ellipse() onto the screen in the draw() function. Use the variable in at least one of the parameters of the ellipse or in the fill color of the ellipse.

    Save As.. the sketch you were previously working on, naming it yourname-Ellipse, (i.e. my sketch would be called Chipp-Ellipse).

    Turn this sketch (yourname-Ellipse) in with your HW E

    4. Change the Value of the Variable based on an Event (1.0 point)

    Make a copy of the program you were working on in the previous step:

    Step 1. Add a conditional to your draw() function so that when the mouse clicks on the left side of the screen, the value of the variable is set to a low number.

    Step 2. Add a conditional to your draw()function so that when the mouse clicks on the right side of the screen, the value of the variable is set to a high number.

    Question 10. What happens to the color of the ellipse when the value of the variable changes? Why?

    Save As.. the sketch you were previously working on, naming it yourname-Event, (i.e. my sketch would be called Chipp-Event).

    Turn this sketch (yourname-Event) in with your HW E

    5. In Full Variable Color (1.0 point)

    Make a copy of the program you were working on in the previous step:

    Step 1. Add 3 integer variables to your program (just like you did in the previous Problem 1) to represent the three colors used in our RGB digital color model. One variable will represent the red level, another will represent the green level, and the third will represent the blue level. Name your variable appropriate names (hint: you can't name your variable just red, because Processing already uses the word red for another purpose, come up with a more descriptive name).

    Step 2. Use these 3 variables in the three parameters of a fill() functions for your ellipse shape. Example:

    fill(redvar, greenvar, bluevar);

    Step 3. Pick two (2) distinct colors from Processing's color selector. You will have 3 values (each one between 0 and 255) for each color, a red value, a green value, and a blue value.

    Step 4. Change the conditional in your draw()function so that if the mouse clicks on the left side of the sketch, the three color variables are set to the values of the first color you picked in Step 3.

    Step 5. Change the conditional in your draw() function so that if the mouse clicks on the right side of the sketch, a the three color variables are set to the values of the first color you picked in Step 3.

    Step 6. Your ellipse shape should now change color when you click the mouse on either side of the screen.

    Save As.. the sketch you were previously working on, naming it yourname-Full, (i.e. my sketch would be called Chipp-Full).

    Turn this sketch (yourname-Full) in with your HW E

    BONUS: Color Fade

    (1.0 points) Change your previous program to change the color of the ellipse (and other shapes) with the change in time. (Think about how we faded the background and you in the Monday Tutorial).

    Save As.. the sketch you were previously working on, naming it yourname-Fade, (i.e. my sketch would be called Chipp-Fade).

    Turn this sketch (yourname-Fade) in with your HW E