due: Tuesday, September 21, 8pm
An 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 expresive, 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:
line() with a trig function
like sin() to create patterns that resemble
overlapping dials or analog clock hands
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?
Try adding 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.
map() example from class 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 ...
User testing. Export your interactive sketch from part 2 (or part 3 if you want) 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. If you are sharing part 2 (the abstract interaction) 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 one of your homework files 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?