Week 3 Class Examples and Homework

Posted: September 17th, 2010 | Author: | Filed under: Assignments, Examples | 12 Comments »


Here are the class files that we created in class. Please check them out, play around with them and make sure you have a basic understanding of the concepts. We went over a lot of stuff in the first class, so feel free to send me an email if you are not quite understanding something or need some advice on where to learn more.

Someone brought up in class the fact that there are better books that concentrate on Processing in detail, and that these may be better for some students at this point. I can recommend the official Processing book by Casey Reas and Ben Fry as well as Daniel Shiffman’s book. If you really feel like you are not comfortable with the processing environment or just want to get into some advanced topics you should definitely look into these books.



For homework I’d like to continue along the mini-assignment format and have you apply the new concepts that we learned in class.

Please create a sketch that has a minimum of 100 items, all of which are stored in an array. Create a boolean that can be turned off and on using the keyboard and have all or some of the items in the array change based on the value of the boolean. Also use the mouse as input, so that when the mouse is pressed the items appear or act one way, and when the mouse is released they act another way.

Bonus: Use timing (either framerate or millis()) to change the appearance of the items over time.

The emphasis should be on creating well written code and understanding the concepts. The visuals can be as simple or complex as you would like. If you feel comfortable with everything we’ve gone over there is a lot of room for creativity within this assignment, so go crazy. If you really are still struggling with the concepts just create something simple and make sure it works.

As always if you have any questions email me and I’ll be happy to help.

Class Time

As I said on Thursday I have no problem with starting class at 3:15 so get some food, take your time coming to class and be ready to work when you get there.

12 Comments on “Week 3 Class Examples and Homework”

  1. 1 Alvaro Soto said at 4:54 am on September 21st, 2010:


    drag mouse or click and drag

  2. 2 Yiruo Zhao said at 3:16 pm on September 21st, 2010:


    move mouse->click->move mouse->click

  3. 3 Ben Riley said at 4:13 am on September 23rd, 2010:


    Press the spacebar to change the direction of the squares.

    Press the mouse button to generate a new bunch of squares (if they all fall off screen, or you’re just bored with the collection you have).

    This is rather hideously coded with all sorts of odds and ends retrofitted from past processing sketches. D:

  4. 4 Oylum said at 4:34 am on September 23rd, 2010:


    press or drag the mouse to see the changes. also use left, up, right arrows when the mouse is pressed.

  5. 5 Minho Kim said at 7:11 am on September 23rd, 2010:


  6. 6 Michelle Kirby said at 11:25 am on September 23rd, 2010:


  7. 7 bree said at 12:51 pm on September 23rd, 2010:

    So, I’m typing merrily away and then go to run my processing sketch, but find that the screen is small. I try to resize in every way I can think of, but no dice. What do you make of it?

    int height = 700;
    int width = 700;

    boolean keyDown = false;
    boolean mouseDown = false;
    int totalcircs = 100;
    int [] arrayOfRads = new int [totalcircs];

    float[] circX = new float[totalcircs];
    float[] circY = new float[totalcircs];
    int[] rad = new int[totalcircs];
    int i;

    void setup(int i){
    circX[i] = random(width);
    circY[i] = random(height);
    rad [i] = round(random(5,35));


    void draw(){
    for (int i =0; i < totalcircs; i++){




    void shiftCirc(){
    if (mouseDown = true){
    circX[i] ++;
    else {
    mouseDown = false;
    void mousePressed(){

    if (circX[i] % 3 == 0){

    mouseDown = true;



    void mouseReleased(){

    mouseDown = false;


    void keyPressed(){


  8. 8 Yiruo said at 2:17 pm on September 23rd, 2010:


    move your mouse-click-move-click

  9. 9 Thomas, Tu said at 2:33 pm on September 23rd, 2010:

    press keyboard to start the laser light(green);
    move mouse to increase the range and density of the light;
    press up to change the light color into red.
    As a result, u can press key+ up+ move mouse to change the light.
    just like playing the role of stage lighting technician.

  10. 10 Francisco Zamorano said at 2:55 pm on September 23rd, 2010:


    Need to check some things I couldn’t achieve..

  11. 11 Lisa Lee said at 6:49 pm on September 23rd, 2010:


    Move your mouse, and also press “UP” button to make some changes.

  12. 12 Seokin Jang said at 7:10 pm on September 23rd, 2010:

    http://a.parsons.edu/~jangs384/Seokin Jang

Leave a Reply