I’ve been writing for a while that I wanted to overhaul the visual design of the project. The black dots turning red, while a good way to clearly see if the functionality I was implementing was working during the development process, are not anywhere near exciting enough to be the final visual representation of the project. More than this, I wanted to add an additional layer or two onto the graphical side of things, so that the connection between the audio and visual elements of the piece could be emphasized in a greater number of ways, and in ways which are more evident. I talked to Paul, the Processing workshop leader, about what I had so far, and while he seemed to approve of the overall project he agreed that visually it needed an upgrade. He suggested that each note, rather than a single point, should be represented by a geometric shape. This shape would then have more properties which could be changed according to the motion of the light, and this could then afford more connections with the properties of the accompanying sounds.

After previously having experimented with different visual styles, such as having the points be connected together with lines (in an attempt to have the ‘drawing’ produced by the light’s motion more resemble an actual line drawing), I decided to follow this advice, and experiment with geometric shapes instead. I tested using different shapes such as triangles and various quadrilaterals for the points, however this produced an effect that I did not like. I wanted the overall appearance of the graphic elements of the project to be quite organic and free-flowing, so that it would not be too far removed from the physical movements made by the user with the light source. To this end, I decided upon using circles as my geometric shape of choice. To change the aesthetic from what I had previously made, the circles needed to be of differing sizes though. This would give me a property of the points which I could pair with the amplitude of the sound, which up until this point had depended on the x-coordinate of the point.

The newly altered lightDraw function, complete with size changing.

The newly altered lightDraw function, complete with size changing.

A link having been made between the properties of graphics and sound, I needed a way to tie both of these in with the physical motions made by the user. The best fit seemed to me to be the speed of these motions.  To start implementing this into the project, I began changing the lightDraw function, as an extra variable would need to be stored in the note objects. Unsure  at first how to find out how fast the light source was moving, I experimented with the previous version of the project and changing the speed at which I moved the light. I found that due to the nature of the fixed frame-rate of the sketch, the faster the light moved, the further apart each successive ‘note’ object would be on the display. Using this information, I realised I could keep track of the distances between points and use this data to generate a size for the point. I declared new variable called ‘last’, which would store the location of the light until the next frame so it could be compared with the new location. To generate a size for the point, I then took the absolute (always positive) of the current x value taken away from the last x value, and added it to the same thing for the y coordinate. I accounted for the case where a point is the first drawn to the screen by making the default ‘last’ x value -10, and then giving the size a base value of 20 if this value was found in the last position (as -10 can not occur naturally for the x position during the course of operation of the sketch). This value is then passed into the new note instance which is created, along with the x and y values which were already being passed.

The changes to the 'note' class.

The changes to the ‘note’ class.

A number of changes were made inside the ‘note’ class to account for the new visual style. For starters, the constructor now accepts a third argument, named z, which receives the size value calculated above. The value of this argument is stored in a new ‘size’ variable. To make the visuals of the notes more cohesive, their colour is also changed according to the size. As before, a base colour of black is set, however now the z parameter is added to all three RGB values of the colour, essentially shifting the colour closer to white as the speed of the light source and hence the size of the note increases. The amplitude of the sound, via a newly declared ‘amp’ variable, is also given the value of z, although constrained between 0 and 100 so as not to cause the volume to get too loud.

The drawCircle method is much the same as before, although now instead of drawing a point an ellipse is drawn at the (x,y) coordinates with the width and height set to the value of the size field, creating a circle. Upon playback of the note via the play method, the audio note is played using the amplitude variable now rather than the x coordinate. The note also, instead of simply turning red, is now essentially ‘tinted’ slightly red by either increasing it’s red value or, if this is already too close to 255, by reducing the blue and green values of the colour. This change was made to preserve the differences in the colouring of different notes after playback. I am unsure of whether to keep this ‘turning red’ behaviour of the playback functionality, but at the moment it serves its purpose for testing. I intend to try and get some user feedback in the near future, so I will ask for some input as to possible colour schemes.

The updated visuals of the piece can be seen here:

As evidenced by this video, some other small changes have been made to the appearance of the project. I have removed the camera output from the display, as this was always simply to make testing the code easier. I have also made the sketch full-screen, as this is the way it will be showcased in its final form on the screens in Weymouth House. I can see some issues with the way the project is now, such as the notes created when the light source is moving quickly being increasingly harder to see as the colour of the circles reaches white and blends in with the background of the canvas. These circles are also the largest due to the way the properties of the notes are linked, and so have the potential to hide other, smaller notes that come before them if they are drawn over them. I will continue to refine the project in its current form, and I intend to get a few other people to test my work soon so that feedback can be incorporated and any additional possible issues can be spotted and resolved before the work is displayed in the Weymouth House foyer space.