The final

Well here is my final. After much frustration, I wasn't able to code the sound to play when the balls bounced through them so I just coded it so that when the mouse runs over a specific rectangle, audio gets heard, so that you get some kind of an idea of the sound effect that I was intending my interaction to have.


The link to it is:


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

Stopgap

As a stop gap measure, and to make sure that my sound files work correctly, I coded it so that if the mouse cursor ran over one of these rectangles, it would play the desired sound. This however just seems to bog down the application massively and after around 10 seconds of runtime, it comes up with the error message saying that I need to increase the memory because it just can't handle what I'm trying to run.


More frustrations..

Inserting sound.. And more problems!

Now that the basic idea of my code had been done, I just needed to make it so that when the balls bounced through the different rectangles, different sound effects that I had would be played. But I couldn't do it! I kept on getting an error message stating that 'static references could not be mixed with non static'... hmm.

Beginning coding... And running into problems

Now that I had my idea sorted, I began to start coding for my project. Tutorial 8 on bouncing balls and arraylists was a huge help in this. However in my concept, I had envisaged the emitted balls to have been able to bounce of the rectangles in the lower half of the page and create a sort of randomly induced interaction. The actual coding of this however was just far too complicated and I decided to alter my idea so that the balls will just pass through the lines and a resulting sound will be heard.

The balls just bounce through the rectangles now instead of bouncing off them

Audio creation

I used garageband to create that smooth synth sound that I wanted to imitate. Here is one of my trial attempts.

Audio ideas

Once more I decided to take to youtube to find some ideas as to what kind of sound I thought I should use for my interaction. I wanted to stay away from those sound generating websites where you can get sound for free, because they don't usually sound that good. I ended up finding this video on youtube of a smooth synth pad that I felt would be nice and suitable to try and imitate as my sound effects

Aesthetics

While searching for ideas on how I would make the aesthetic interface of my interaction design, I came across this video on youtube of american neon motel signage, and that really inspired me to give my design that kind of a feel. 


Here, take a look

The chosen concept

After deliberating over my concepts and taking in advice from the tutors, I decided to settle on concept 3, the emitter idea. In particular, I felt that this would be the best way to go as concept 1 was a bit too simple in it's interaction, while concept 2, while being in theory a fairly cool interactive concept that could end up nicely indeed, I thought that the programming skill required to do what I had in mind would be way higher than what I'm currently able of achieving. So with these reasons, I decided to settle with concept 3.


That being said, I think that concept 3 offered a solid idea that offered the best form of interaction over the other two ideas. the variable bounce of the balls coupled with an emission system meant that you could spend quite a while playing around with it and seeing what kind of effects that could be made.

Inspiration for my storyboard concepts

Here are some of the images that I looked at that served as inspiration for my 'transform' application.

A simple vector based arrow that could be appropriate as the 'hidden' image for concept 1

A spiders web. An amazing and ornate structure that flexes and warps a lot, but still manages to keep it's shape.

The emission of water from a hose.

Project 2: My concepts and storyboarding

Well we're now onto project 2 and here are my storyboards and ideas for what I want to base my 'transform' project around.

My first concept was to base my interaction around a supposed 'hidden' image. The user would begin with a blank screen. Unknown to them is that, invisible, are strips of bars that combine to form a particular shape or pattern. Attached to each of these strips will be a specific audio file. So when the user begins to interact with the blank canvas by clicking, these strips will show themselves and with them, audio will be played as well. The idea is that if the user drags across the screen fast enough, an interesting shape or graphic will appear as well as an interesting combination of audio.


However, I thought that this idea maybe a little basic in it's interaction with the user. For once the image is discovered, there is little more point to the animation other than to make random noises.


As a result, my second concept takes a more complicated approach. This concept is about focusing on the idea of a web of lines all connected by small circles. These small circles all have a particular soundfile coded to each of them. Clicking on these circles will subsequently play that piece of audio. But to make things more interesting, the circles are able to be moved around in their web, and since they are all conjoined through lines, the movement and wobbling of these lines as a result from the movement of the circles will cause warping or bending in pitch of the audio.


In thinking about what my third concept would be, I decided to focus on a simpler idea that would be sound to make but still provide solid interaction with the user. I came up with this idea of an 'emitter'. This emitter would emit random balls that would fall onto these randomly placed lines or rectangles across the bottom half of the screen. As the balls from the emitter hit these lines, specific audio will then be played.