Inspiration

I was inspired by this video i saw on Vimeo that makes tones that produce a circle which represents the sound. I wanted to create an interactive application like this that you can abstractly create different tunes, and lets you see the effect visually. I decided i want a similar sound to that, a tonal scale of notes. 

http://vimeo.com/5324878

So I had a few boxes. Now i needed to add interaction. I looked at the processing website and other sites that gave me examples of interaction. I learned about the mouse functions such as mouse clicked and mouseDragged and researched everything relevant to them.

I looked at some examples of mouse clicked functions and extracted these qualities you could produce:

Definition - mouseClicked function - called when the mouse is pressed and released and changes the value of an object

Click and the object is instantly at your mouse - uses mouseX and mouseY to position
Gradual attraction - click and the object/s gradually go toward the mouse
Repel - click and the object/s run away from the mouse
On the mouse(mouseMoved) - moving the mouse across the screen automatically changes the value of the object, as it stays on the pointer
Change in form/colour - click and the form either completely changes to a random state or the colour changes
Creates sound/movement
Changes value depending on the position of the mouse click - uses pmouseX and Y
Changes value depending on the position of the mouse - ie change in colour in different areas

MouseDragged

Change in size or form - clicking and dragging the mouse changes a value depending on the direction and position of the mouse and drag

Change in tone/pitch - dragging causes the sound to change in melody or frequency

Drag - drags an object across the screen

Trail - dragging an object leaves a trail of some sort

Push - Dragging pushes objects around an invisible forcefield around the mouse

Rotate - dragging in a circular motion rotates an object making it seem 3D

Collision

 So i had gotten the shape and the basic idea of what I wanted it to do. I had boxes floating across the screen which didn't really do much. I started to think about how my boxes would act when they collided with the edges or each other. So I figured out how to make my boxes highlight when they intersected each other, but it wasn't enough.

With my animation I explored the concepts of collision and what happens when two solid objects collide with each other. I was inspired by this creation because you can pull the ragdolls and throw them against a solid object where they would crash and bounce off depending on how they hit it.

Transformation

This is my original storyboard for the interim presentation which shows my two ideas and how they work. I decided to go with the box idea because the bubble one was too overused and a little boring.

Reflection

What have you learnt so far, what helped and motivated you learn? Is there anything that you want to improve in your next project? Set yourself a goal and make a plan how you could achieve this goal.

Any key concepts and questions that arise – any connections you can make to your own experiences in design and with code.

• Programming is a way to express visual ideas that normally cannot be expressed on paper, or will take many hours of labour. It can be a way to create art over time through animation.
• Generative animation is animation that changes over time as well as every time you run it. Programming is the only way to achieve this form of animation.
• Programming with variables can take massive changes and solve them in only a few lines.

Investigate the topic transformation. What does transformation mean? 

Transformation to me is about the interaction with your mouse or keyboard which makes the image move, sound, or change visually into something different. 

http://www.openprocessing.org/visuals/?visualID=8941


I found this one interesting because it  reacted to mouse movement with change in area and scale, as well as scrolling to change density and size.


http://www.openprocessing.org/visuals/?visualID=6753


This one is a bit different as it can be made to look 3D as you can click and drag to rotate it in any direction.

http://www.openprocessing.org/visuals/?visualID=22598

This one interests me as it introduces the concept of collision and what happens to an object when it hit another. The code actually has step by step comments on what each line does so I am currently trying to decipher what parts are applicable to me and what I can use to help my animation.