I started looking at interactive applications and sound shapes for the third project.
The following two applications have no sound but I spent a very long time playing with them. The first http://www.openprocfdsjgfdessing.org/visuals/?visualID=11948gis a game and the reason I spent a long time playing with it was because the coder had set his personal best at a little over 100,000 and I wanted to beat him. I also found it challenging as there was a constant conversation between me as the user and how the game reacted.
The second application was a sponge that moved in relation to the mouse which I spent along time trying to break. http://www.openprocessing.org/visuals/?visualID=15431
Wednesday, September 14, 2011
Wednesday, September 7, 2011
Final
Artists Statement:
I coded an interactive mouse toy in which the user gets to interact with a flashing X made of 4 different colours. I wanted the user to be able to move around the mouse and see a 'ghost' trail in which I really liked the look of when I was doing research earlier on and found other applications which use them. The reason I liked this was because it allowed the user to see where they had been and to create images that faded over time. Another one of my precedents had the object follow the mouse. I liked this too as it meant the user had control over what was happening, but the 'ghost' trail meant that a lag was created meaning the user had a sort of power over the application.
I wanted an unexpected reaction to occur when the user clicked the mouse. In my research I found things that were unexpected made the application more appealing. To achieve this I decided to use mouse pressed. When the user did this the ellipses making up the flashing X grew in size until they were as big as the screen. To add to this I also had the background colour change. I decided to use neutral black and white as the background colours. This was because of my colour choice for the X. In my previous project colour was an issue for my final. I chose a standard green and there was nothing special about it. For this project I looked up art I found particularly appealing with a piece of aboriginal art standing out. The reason I liked it was the variety of colours it used that all worked together. They weren't bright like my last project but were very earthy and natural which I chose on purpose as when the ellipses were in large and moved around they created a fire like look.
I am happy with the turn out of my interactive mouse toy http://www.openprocessing.org/visuals/?visualID=36355
Slowing it Down
I realized that the rate at which the ellipses grow is very fast and doesn't give the user a lot of time to play with them. I decided to slow this down so that the user can see the growth occur and then has time to move the mouse while this is occurring. This created more of a connection between the user and the application. Colour
To create more of an interaction between the user and the application by creating something unexpected I decided to code that everytime the mouse is clicked the background changes between black and white. I used colour after this proved to be a success but the colour blending between the two of them when it changes creates a very ugly middle colour that is not pleasant to look at.
The conversation: Expansion
I needed to have more of an interaction to occur between the application and the user. To accomplish this I decided that when the mouse was pressed the balls would grow in size. The effect created a vibrating giant ball which looked very appealing. I also coded it so that when the mouse was released the size of the balls went back to normal. The mouse could also move and draw using the giant balls. I liked that this communicated a conversation between the user and the application.
I also inverted the colours to see if white on black would look better than black on white.
Flashing X of dots
This development allowed me to explore what happens when a random number is chosen to create a distance between mouseX and the ellipse. The quad turned into a flashing X because of the loop the code was going through and although this wasn't my intended purpose I really liked this result and have decided to use it and continue building on it.
Concentrated ellipses
The next step for me was to make the ellipses larger. I also wondered what they would look like closer to the mouse. I liked this look and I think I will code the ellipses to jump back and forth from the mouse to random co-ordinates.
Lots of dots
I needed to have more dots in my new design instead of just the one from my earlier code. I made 4 and I also used a rect to create a trail after them which I liked the look of.
(The image is of the trail but to take the screenshot the image gets rid of the mouse)
New Direction
After I got feedback on how my project was doing I decided that the final idea would not be interactive enough. This presented a problem as I had no idea as to how to fix this. I decided that I needed to come up with a new concept which had code which was not outside my skill level but looked very pleasing and would require problem solving. I found this website after more research and I liked the simplicity of the idea as it looks very nice and is entertaining also.
It uses the idea that the 'bugs' follow the food. The food is where the mouse last clicked and the 'bugs' look like they flash as they go. Earlier in the project I coded a series of dots that follow the mouse around. I went back to this code and decided to build upon it.
My new idea is to create balls which follow mouse and after a random amount of time would change colour. Random amounts of time also make the balls grow but when the mouse is pressed the balls shrink back to normal.
Success!
I managed to get the triangles to draw when the user clicks and drags so that the point where the user clicks is the point of the triangle and the point where the user releases the mouse is the base. It took a long time for me to be able to get this to work so i'm very happy. I now need to take away the multiple triangles that are drawn so that it is only one triangle per click. I also need to add the colours.
Monday, September 5, 2011
User activates sizes
The next step I went through was to make the triangle appear based on where the user clicked to when the user released the mouse. I managed to achieve the second part of this goal, when the user clicked a triangle appeared but it was always from 0,0 to where the mouse clicked from. Sunday, September 4, 2011
Colour Swatch
I picked out the colours I liked from my aboriginal art precedent. I changed the gradient of them at one end to see if the colours would look better darker. I think they look better at the lighter end as they appear brighter and give a more positive feel.
Colour Experimenting
This is a piece of aboriginal art which I love the colour in. I like that the colours are very earthy and natural and work well together. I want to use colours like this in my mouse toy but I will have to experiment as to wether the colours above can be used because even though I think they look really lovely now, it is because there is a variety. In my mouse toy the next colour will only be released when a triangle is 'ripped' into the page. So blue might be too overpowering as a background colour when a beige is ripped. Then again, the more the user rips the more interesting the patterns created by the colours will become.
Transparent Triangles
I built on my previous code and made the triangles transparent with no stroke. This meant that they had a really cool layering effect.
http://www.openprocessing.org/visuals/?visualID=35599
Moving Triangles
I started coding triangles that appeared when clicked. The top point of the triangle is at mouse X but I have yet to figure out how to make the triangle draw as the mouse moves. I will have to look at other code on Open Processing to see what other have done in similar projects in order to get an idea of the code involved as I have no idea where to go from here.
http://www.openprocessing.org/visuals/?visualID=35597
I would also like to work on the colour and maybe play with transparency. Colour is an important part to achieving the overall result and is a major factor in the interaction.
Dots
In this code I was trying to draw a line from where the mouse was clicked to where the mouse was released. I needed to do this because for my mouse toy I want click and start drawing a triangle from where the mouse is clicked and it would stop drawing it when the mouse is released.
Practising
I started to code what I would need for my mouse toy. The first one I did was learn how to use mouse clicked and what it could do. For this I made a rect change colour between black and white.
It was simple and easy but it meant I knew how to do this. It also helped me learn more about else and if statements. Something I think I will need in this project.
Subscribe to:
Comments (Atom)