✿ code toolkit ✿ python ✿

spring 2022 agenda



Week 3 — Homework assignment

Due: Wednesday, February 16th by 8pm




1. Review this week's lecture notes.




2. Abstract Interaction

Using Processing's interactive mode, fill the window with a dynamic, interactive, kinetic composition that is responsive to the user's mouse. Try to create something that is expressive, so that the user's movements and gestures are represented in the visual output.

Start with the two code blocks that form the basis of a new interactive sketch. You can use this as a starting point:


# Variable declarations here

def setup():
    # Put size() here and other one-time code

def draw():

    # Assign values to your variables here, using
    # mouseX and mouseY, as well as possibly
    # pmouseX and pmouseY, and even map()


    # Draw code here

Use any of the "2D Primitives" and the "Vertex" commands, as well as color, image(), and anything else with which you'd like to experiment.

Use mouseX, mouseY and map() so that your draw commands change as you move the mouse. Adjust the x and y positions, but also widths and heights, colors, etc. Can you experiment also with pmouseX and pmouseY? So maybe for example the faster the user moves the mouse, the bolder your composition becomes.



Try to do at least three of these tasks:

These are just suggestions — use them as a starting point for experimentation.

Experiment with putting background() inside setup() and then moving it to inside draw() or not. What happens?



Add the following chunk of code at the end of your sketch:


def keyPressed():
    saveFrame("week3-###.png")

and run your sketch again. Now pressing any key will create a .png image of whatever is in your window at that moment. Next week we will learn how to create more advanced user keyboard commands.




3. Parallax effect

Using the parallax effect map() example from this week's notes as a reference, experiment with the parallax effect. The example has three layers, maybe add more? Or use this as a basis but completely change the imagery and the look and feel of the code. The example also changes the sky color as you move the mouse. Can you create other different dynamic elements that respond to the mouse? Maybe make a sun or moon rise or fall. Or something completely different. Maybe experiment to try and find some new tricks to make the effect of distance and motion seem more or less realistic ...





4. User testing

Export your interactive sketch from part 1 and give it to a friend or family member. (To do this, in Processing, go to File > "Export Application" , select your friend's OS, and click "Export". Processing will then show you your sketch folder (if not, click Sketch > Show Sketch Folder in the menu). On Mac, you want to share the .app file, on windows, the .exe) You can email this file, but your email provider may block the attachment. Try "compressing" or "zipping" it (right-click > "Compress" on Mac) and emailing that. Or, try sharing it on a USB drive, or via Google Drive.

Ask your friend to install the program on their computer. Then ask your friend to double-click and run the program. See if they can figure out that a pressing a key saves their work. If not, tell them and let them make a creation that they can save.

Write up some brief comments about this experience and include these notes in a comment at the top of your code for Part 1 for this week. (150-250 words is fine.) What is it like to write code that runs on someone else's computer? This was one small program, run on one person's computer, but these kinds of experiences happen millions of times per day: software being installed and run on computers. What insights might this one small experience give you into this kind of transaction? Who writes software and why? Under what assumptions? Why do people run software written by others and at what cost? What kind of a resource is a computer? You've probably used someone else's computer before by borrowing it, but what does it mean to use someone else's computer in this way, as a platform to run your code on?





** if you have not done the following items, please make sure to get them completed by Week 4, these affect your overall grade! **

1. Submit a GitHub Gist as per the instructions on the Help page (even if you are not having coding issues, I just want to ensure that you familiarize yourself with this process before we get too far into the semester)

2. Submit any missing assignments and notify me that you have dropped them in the Google Drive

3. Do the Lev Manovich reading and write a response as per instructions from Week 2 HW in the shared Google Doc, we will discuss our responses in Week 4