Exercise 1: Four Examples

Bring in 4 pieces / videos / links

1. A work you like and think is good.
2. A work you don’t like and think is bad.
3. A work you like, but think might not be good.
4. A work you don’t like, but think might actually be good.

Be prepared to explain your choices to the class.

These don’t have to be artworks related to code / technology / the internet / software in some way and possibly are examples of something you would like (or not like) to get out of the class.

Project 1 : Two Faced

Part A

Design an abstract or simplified face composed of 10-20 basic shapes (rectangles, ellipses, lines, triangles, polygons, stars). Look at the links and images below as a reference. Create two emotions for this face, one neutral, and one exaggerated. For instance, a very sad frown, and a neutral expression. Have a plan in mind for how the face might transition from neutral to exaggerated. You may only move, rotate, and scale the facial features, it should not "pop" from one expression to the next. Think about all the different faces we’ve looked at and how you can construct a face both human or non-human.

Before you begin coding, sketch this face out either on paper, or in photoshop/illustrator/your software of choice and bring them to class. Also arrive with your neutral face translated into p5 code. Make sure your sketch size is set at 500px x 500px

Here’s some links and artists for inspiration:

• Apophenia
• Pareidolia
• Love Bytes
• Nokia / Friends / Heathrow
• Bruno Munari
• Early Disney Sketches
• Kasemir Malevich
• Picasson & other cubist sculptures
• Isamu Noguchi
• Joge-e & two way pictures
• David Hockney
• Emojis & Mac Finder Face

Part B

Add variables to your project from Part A so that the face can move between the neutral and exaggerated expressions by changing the value of the variables. The variables can change the color, position, scale, rotation, etc. of your face. Don't forget to write comments in your code so that you know the range of the variable i.e int x = 100; // left eye x - coordinate with a value between 100 and 200. Be careful when trying out rotation and scale, they can be tricky.

Bring this code to class to work on during in class studio time. One more reference for you! Mattias Dorfelt's Weird Faces



Part C

Modify your code from part B so that the face changes fluidly from the neutral expression to the strong expression as you move the mouse across the screen. The map function will be your friend for this. You will need to include a setup() and draw() to your project so that variables in the draw() can be updated on the fly. Think about how you can develop in-between expressions and make the face as dynamic and emotive as possible. I have put together an example TK.

Project 2: Nonlinear Narrative

Part A

For project 2, you will create an interactive non-linear (i.e. choose your own adventure) story in the form of a photo-novel or comic book (A photo-novel is essentially a comic that uses photos instead of drawings). Your story should have a minimum of 10 and a maximum of 15 scenes and have at least three different conclusions. Try to keep it simple and spend more time thinking about the interactions, images, and text. Here's little short story if you're having trouble getting started writing...Do supertoys last all summer long

Make your project 600 x 600 px in size.

For part A, complete a flow chart storyboard with images and text diagramming the flow of your story. You may draw your chart by hand or create it in Photoshop or Illustrator. If you draw it by hand please make a digital copy.


Part B

Begin converting your story into p5 scenes. Make a new sketch for each scene / room in your story.

Part C

Once you have created a sketch for each of your scenes / rooms, combine them all into one single p5.js project using conditional statements. Use at least 3 sounds in your final piece. Here are some free sound resources

• Archive.org
• Freesound
• Free SFX
• Sound Bible
• Sound On Loop

Project 3: 

Anim-instrument

For project 4 we will be creating a musical instrument that can be played by pressing different keys. When you press a key your program should play a sound and trigger an animation. For the first part of this assignment, create between 5 - 26 different sketches that have their own distinct sound / animation combo. Make sure each animation is encapsulated inside of a function. Think about the relationship between sound and motion? What motions make sense with what sounds?


Part B

Now that you have all of your animations created, combine them all into one larger sketch so that you can play your instrument.

Examples:

Patatap

Project 4: Pattern Weaver

Part A

For Project 3 we will be making a series of geometric patterns that move in relation to a song or piece of audio. For part A, you need to pick a piece of audio that you would like to work with. Bring your audio track to class on


Part B

With your audio track in mind, sketch 5 different distinct patterns that will be associated with different parts of the song. Think about how the patterns will change if they are laid over top of each other, rotated, scaled, or altered in color. You will most definitely need to use for or while loops for this project. Create one sketch for each pattern


Part C

Now that you have all five sketches complete, your task is to combine them into one continuous sketch that plays along with the music. Think about how you can trigger your different patterns. Possible triggers might be volume (amplitude) or time cues. Your code will be significantly easier to manage if you roll your patterns into functions.

Final Project

Our assignments so far have been fairly restrictive. For your final project, I want to open up the field for you to create an artwork of your choice. The requirement is that it uses code, emotion, narrative, and sound in some way in the project. You don’t need to use p5.js if there is another library or language that you prefer. I’m open to you working in something like Max Msp, Touch Designer, or other node based editors. If there is a special topic that we have not covered in class (shaders / 3d / sound programming / image manipulation etc. ) that you would like to explore that would be ok as well.

Please prepare a proposal to share with the class. Your proposal must include a description of your piece, how you plan to show it, and at least three references or inspiration projects. The proposal doesn’t need to be more than 2-3 short paragraphs. I will do whatever I can to help aid in the completion of your project.