Ben Unterman

Assignments

Assignment 1: Some simple stuffs

To Pooya and Chris: Sorry for the messy annotations. They're starting to make more sense.

• A1-01
• A1-02
• A1-03
• A1-04
• A1-05
• A1-06
• A1-07
• A1-08
• A1-09
• A1-10
• A1-11
• A1-12
• A1-13
• A1-14
• A1-15
• A1-16 Note: The square moves when you drag it around

Assignment 2

• A2-01 - Using beginShape() and endShape(), create a composition with five or more vertices.

• A2-02 - Using beginShape() and endShape(), create a composition with ten or more vertices.

• A2-03 - Create an image different from A2-02, but using the same vertex data.

• A2-04 - Write a function with one parameter and demonstrate it visually.

• A2-05 - Write a function for drawing triangles and visually demonstrate its flexibility.

• A2-06 - Write a function with three or more parameters and visually demonstrate its flexibility.

• A2-07 - Create a dynamic animation using the cos() function as a generator for motion.

• A2-08 - Create a dynamic animation using the cos() and sin() function as a generator for motion.

• A2-09 - Move two visual elements across the screen using the random() function as a generator of movement. Give each element a unique nonlinear motion.

• A2-10 - Create an event that begins when the mouse is pressed and ends when the mouse is released.

• A2-11 - Create a responsive image that behaves differently when the mouse is moving and the mouse is dragging.

• A2-12 - Create a button that changes the color of the background when it is clicked.

• A2-13 - Program your moving elements from A2-09 but use classes to represent the two visual elements.

A2-01 thru A2-13 Due: Tuesday October 6

• A2-14 - Create a subclass of one of the asteroids classes that adds a new capability. Some examples of what you could do: create a subclass of Rocket (or ArmedRocket) that shoots flame when the thrusters are fired and/or plays a sound when thrusters are fired, create a subclass of Asteroid that know when it's been hit (instead of doing this test in loop()), create a subclass of Asteroid that splits into two smaller Asteroids when it's hit.

A2-14 Due: Thursday October 8

Assignment 3

• A3-01:

Create a subclass of PImage that implements a

mosaic( int blockSize )

method.

The blockSize parameter specifies how big the mosaic block is (e.g. blockSize = 4 would mean the mosaic block size is 4 pixels by 4 pixels). The mosaic method should replace each block of pixels in the image (e.g. if blockSize = 4, each block of 4 by 4 pixels) with the average color value of the pixels in that block. Look at the Pixelate->Mosaic filter in photoshop for an example of what this image operation does. Demonstrate your new class by drawing an image with several different block sizes.

• A3-02:

Write a small app that demonstrates kinetic text. Your app should allow the user to type something and move the text around in some way while they type. For example, the user might type text on a line, but slowly the words or letters start drifting apart, or perhaps the line starts bending, or the words and letters flutter to the bottom of the screen, etc. Of course you shouldn't exactly copy any of the typographic in Processing or that you find on the web (though using such examples for inspiration, as a place to start modifying code, etc. is fine).

Assignment 4

Here is Assignment 4.

This is a graphics assignment that will ask you to use a "widget set" of sliders, menus, and buttons to control the display. Widget Sets are a collection of classes that provide many of the standard Graphical User Interface tools in a convenient package. The Widget Set gives you a simple programming system, and lets you put together the GUI without having to worry about the details of how to manage the contents of menus and sliders.

The standard programming style is to create the widgets you need, lay them out on the screen, and tell each widget what of YOUR functions to call when the user interacts with the widget. Your application must therefore respond to these events.

The assignment is to take your Project 2 and add controls that enable the user to make a setting and use that setting while drawing.

For the Drawing editors,

1. Add at least two sliders that control the properties of the marks that the user is drawing.
2. If your editor draws in a random location, you must allow the user to now set the location of the mark that the user is now making.
3. Add a button to clear the screen
4. Add a pull-down menu that enables some sensible choice, such as shape to draw, or whether to draw filled/unfilled.

You could use either the ControlP5 widgets or the Spring GUI widgets

Projects

Project 1: Prime Time

Prime Time is an unusual clock which displays the passage of time using only prime numbers (and 0 and 1). Each numerical representation of time is broken down into its prime factors and displayed on the screen. My intention was to make an unusual clock which was nonetheless easy to read, while playing with notions of the value(s) of time and the different ways we can break down and understand increments of time (in addition to being based on a really bad pun).

Project 2: Mandala Drawing Tool

For the drawing tool assignment, I am creating a drawing tool which allows the user to create mandalas (a mandala is a circular, rotationally symmetrical meditation tool) based on lines that they draw within the interface. A line drawn by the user (while dragging the mouse) will be copied and rotated around a pre-determined centre point to create the pattern for the mandala.

Mandala Drawing Tool

Final Project

The assignment: "Do whatever you want." All right. I can do that.

For this assignment, I created a toy for very young users. Specifically, I made a computer-based building toy for my son Louis's 5th birthday, conveniently timed to be two days before the project is due in class.

The project was tested by Louis on his birthday, and met with his approval, with the exception of him wanting to be able to pick up the blocks once they had been placed (a feature I attempted, but wasn't able to implement).

The interface is meant to be easy to operate for a young user, and none of the controls require a significant amount of precision on the part of the user.

I used the BoxWrap3D library extensively (it replaced an overly complex arraylist of classes and subclasses in my initial version with a few lines of code). A lot of elements were also derived from the applet "sketching boxes - avalanche" by antiplastik [1].

The four icons in the control interface are royalty free icons from : http://icons.mysitemyway.com/

The background images are all original paintings by Louis.

Other than the frustrations of having to restart the project several times after having headed off in the wrong direction, everything seems to be working all right.

Here is [a link to the final project online]. Executable versions for Windows, Mac & Linux are available [here].