In the spirit of taking simple methods and processes and applying them in different ways, I have set about creating a quick real-time digital clock in Processing. I did this in a very similar way to how I implemented the screenshot file naming scheme of a processing project from a while ago, with the inbuilt date/time functions and simple string concatenation.

This just goes to show that these fundamental techniques of programming can be applied to many different scenarios – something which I will keep in mind when coming up with plans for the interactive assignment, as I will no doubt be able to incorporate much of what I have covered already.

Image manipulations is something I can see being very useful in the camera-based brief we are working towards. There is much that can be done by simply changing the video or picture feed from a camera to alter the way the audience sees the surrounding space, or indeed themselves.

It is this that I’ve been looking at and learning the ropes of in the Processing environment.

We started by simply loading in images to be displayed on the canvas, but then quickly progressed beyond that and started altering the images and then displaying this altered form. This was achieved through loading the picture and then creating an array of the colour value of each pixel in the image. This information can then be used in many different creative ways. A simple manipulation that I achieved was to, using for loops, loop through the array and take the colour value at certain intervals. These values could then be used as the fill value for rectangles which were drawn to the screen at corresponding intervals. This can be used to make the image look blockier, and is essentially a simple filter applied to the image. The colours of the pixels can also be offset or randomised slightly so as to put different tints on the image.

I then animated the image by each frame randomising the colours of the rectangles a small amount and offsetting the location they were drawn on the x-axis slightly each frame. This created a sort of blurred ‘shimmering’ quality to the image, whilst still appearing ‘blocky’.

In all, there are a wide variety of things that could be done with an image when it can be broken down into its individual pixels like this, and this knowledge could potentially open up an array of possibilities for the interactive video project.

I’ve been experimenting in Processing, this time with the intention of creating patterns out of rotating simple shapes. In the workshop we were given the example of a house image, but could then play around and make our own images to rotate and otherwise create patterns from. I wrote a function which would draw a stick-figure out of a few lines and a circle. I then used this function, calling it several times using a for loop, to make rows of stick-figures which were then incrementally rotated around the middle of the screen each frame. This created an interesting pattern.

I also added slight random deviation to each row’s position and opacity to make the pattern slightly less regular.

For the colouring of the image, I defined an array of a few RGB colours as effectively a pallet of colours which I would then randomly choose from for each generated row of stick-figures. I think this concept could prove very useful  in any more complex designs developed in Processing, or really any programming language, as it keeps a general tone for the whole piece by using a confined set of colours, and also makes it easy to swap out these colours and have that reflect throughout the whole piece of work with minimal coding effort.

I then decided to produce another piece with the same general idea, except this time I used rotating randomly-coloured circles which were also moving away from and towards the point of rotation, while changing size and opacity relative to the distance. I also implemented a system to take screenshots using a mouse-click, which would be named for the exact date and time they were saved using Processing’s in-built date/time functions (day(), hour() etc.) and simple string concatenation.

I decided to add another level of interaction to this piece, whereby the speed of the circles’ travel from and to the point of rotation is controlled via how far along the x-axis of the canvas the user’s mouse pointer is. I did this by mapping the controlling variable of how far the circles move each frame between two values to the mouseX variable between 0 and the width of the canvas. I really like the effect this has on the piece, as it provides a large variation in the patterns which can  be captured, simply by moving the mouse to different positions at different times and then taking a screenshot.

Several of the methods used in these works I’m sure will be fundamental for many Processing projects to come – things such as mouse interaction, string handling, and building up images from simple shapes. In theory, it would be quite simple to perform actions with camera-interaction similar to those done with the mouse, once the appropriate motion tracking libraries and such are in place. Once I am familiar with that side of programming in Processing, it is easy to see how small works such as these are very relevant in building up ideas and snippets of useful code for the interactive display project.

It’s done – our final ‘Independent Dorset’ poster designed for the design iterations mini-brief has been displayed in the Weymouth House foyer for our audience to see.

We ended up compromising slightly on our placement of the poster. As previously discussed, our main target was the queue for Costa.  We had determined that this was the main area where people actually stay for more than a brief period of time as they pass through the room., so it was our goal to position our poster on a pillar situated by the till so that it would be in the eye-line of all of Costa’s customers. However, this turns out to have been a popular line of thought, as the location was already in use by a different group for displaying their own work – something which disappointed us, as well as some other groups with the same idea.

We ultimately positioned two copies of our poster – one on a pillar by the stairs and one on the main entrance door, so it could be seen as people left the building. We had found that the majority of people in the space simply travel through the foyer, so we thought it best to use these locations of those available to us in order to most directly target these people.

The poster by the stairs.

The poster on the pillar by the stairs, I would say, was the best positioned of the two. The pillar it was situated on is located in such a way that anyone walking from the stairwell  into the main area of the foyer has to walk around it, and as such many will look directly at it to avoid walking into it if nothing else. The poster was placed at roughly eye-level for most people, so it was clear to see that many of the people travelling in this direction  would at least glance at the poster, with some visibly turning their heads and reading its message.

The poster on the door.

The other poster was situated on the glass sliding door of the main entrance, targeting those leaving the building. While this wasn’t the worst spot to have chosen – it was eye-level, and it stood out against the glass surrounding it, it did have its issues. The sliding nature of the door would often cause the poster to be difficult to read when the door was moving, something which clearly would happen whenever someone approached the poster. We also concluded that both posters facing the same direction relative to the flow of people was perhaps a mistake. Both were located so that people moving towards the exit from already having been in the building would see them, whereas I now feel that the poster would have probably received more exposure if one was turned the other way so that people entering the building could see one. This could have been achieved through either placing a copy on the other side of the pillar, or on the door facing the outside.

Overall I am pleased with the way this assignment has turned out. The feedback we received on the designs was largely positive, and the process of analysis that we engaged in in preparation for the task will undoubtedly be of use in the creation of our interactive projects for the main iterative design unit assessment.

As part of the lead-in to our interactive display project for Design Iterations, alongside the poster brief we have been experimenting in the Processing environment. Processing is a programming environment and language (very similar to Java) which is aimed at visual programming / arts based projects. We are going to be using this tool in the creation of our displays, utilising some of the camera-interaction features available to its users.

As an introduction to Processing, we’ve been making simple programs to learn the basics of drawing things to the canvas, such as basic points, lines and shapes. We’ve also had a bit of a refresher on the very basics of programming such as if statements, for loops and other fundamentals.  As an example, here’s a small sketch I produced which simply generates a grid of squares which vary in colour and opacity every frame.

I aim in the coming days and weeks to explore Processing and its capabilities in a more in-depth fashion, and hope to create more complex sketches with it. I look forward to experimenting with new features such as the camera-interaction side of things as well as getting stuck into some more lengthy coding in the environment. I think this will be a very useful tool for the work I want to create.

In preparation for displaying our posters in the Media School foyer, we were tasked with checking out the space and analysing the room, along with the people and activities within it. What we found, perhaps unsurprisingly, was that most of the people in the foyer at any moment were more than likely just passing through, either entering the building or leaving. Of the people who were actively occupying the space, the majority were often congregated around the food area, either queuing to buy or otherwise choosing food and drinks. The seating areas generally had people occupying them, but these people were normally groups of students more engaged with talking to each other or doing their own thing than looking around at the actual space they were in. Because of this, we thought it probably wouldn’t be beneficial to aim the poster at the people in these areas.

Our current plan, then is to take advantage of the patterns we have observed in the habits of our intended audience. We aim to place the posters in areas of high traffic – specifically near the queue area for Costa, and facing people both entering and leaving the building, either on the doors or columns of the foyer. These locations should, theoretically, produce maximum exposure of the work.

We also received feedback from our peers on our current poster designs, and though the preference between the two posters was largely split, the general consensus seems to be that the blue-coloured poster has a stronger image. Helpfully, a few constructive improvements which could be made were also pointed out. There were issues with the legibility of the top slogan from far distances, for one, which we aim to remedy by increasing the font size of this text. We will also increase the contrast between some of the shades of blue on the poster, to maintain the definition of the features in the imagery when the poster is printed and displayed.

All points considered, I feel confident going into the display phase of this brief that a high-quality piece of work has been produced which I look forward to seeing the audience reaction to.

After coming up with our initial poster ideas previously, we met up again and decided to redo our design. The puzzle / separated island theme we were going with was, on reflection, perhaps a bit complicated so we decided to simplify the poster so as to make it more easily understandable. To this effect we designed around the ideas of a simple colour pallet, and big, bold easily-readable slogans. We had a think about the demographic we would be aiming the poster at in the foyer – mostly students, and thought this was probably a good approach so that the design would be kept modern and appealing. To further appeal to this demographic, we decided upon using a ‘hashtag’ for the slogan, as this firmly aims the poster at a younger generation while also providing the possibility for greater sharing of the campaign represented by the poster via social media.

For the imagery of the posters we thought it important to represent actual Dorset landmarks and features. Initially we came up with a largely green poster that portrayed Durdle Door – a prominent natural landmark on the Dorset coast. The idea of this design was, similarly to our plans with the old ‘puzzle map’ concept, to highlight the natural beauty of Dorset and the comparatively urbanised ‘grey’ nature of the rest of the UK. We tried a range of phrases for the poster before settling on ‘The UK is grey. Say yes and stay green’. We feel this line sends both the message about nature and preserving it in Dorset and also the fact that people need to actively vote (‘say yes’). For our main social media hook / slogan we went with #FREEDORSET. This is quite a striking, to-the-point expression that we hope will draw curiosity and attention towards the poster.

We then thought we’d do another poster, as if there would be a range of posters in the same range promoting the cause. We tied the posters together with the ‘free Dorset’ hashtag displayed prominently at the bottom. For the second design we decided to continue the tactic of promoting the concept of Dorset independence through presenting negative ideas of the UK – perhaps a controversial approach, but one we thought would work effectively. We also tied in both a nautical theme for Dorset’s coastal position, and another Dorset landmark – this time the Portland Bill lighthouse. We coloured this poster in shades of blue, with imagery of a sinking ship (representing the UK) and the lighthouse in the background giving an idea of hope for Dorset. The phrase we decided on to accompany the main hashtag is ‘The UK is a sinking ship. Vote to stay afloat’. This again provides a call to action for the audience to actually go and vote, as well as providing a favourable comparison of Dorset to the UK.

We hope to get feedback on these new designs today, so that we can make any beneficial changes before putting the posters up next week.

The first practical unit of the year is Design Iterations – a unit that is ultimately leading up to the creation of an interactive display for the foyer of the Media School building. This piece of work will use camera-based interactions to engage the user and will convey information related to a digital media issue. In preparation for this task, as well as to give us practice with the iterative approach we’re going to be taking, we have been tasked with, in small groups, designing an A3-sized poster to go in the foyer. This poster is to promote the idea of an independent Dorset.

My group (Daniel Burden & Liam Gorton) and I had a brief ideas session, and came up with some initial concepts for this task. We discussed portraying Dorset as an island separated from the UK, and stylising the map by rendering Dorset in green and the rest of the UK in grey to highlight the natural beauty of Dorset – one of its strongest features. After feedback with another group we have furthered this idea with the incorporation of a jigsaw-puzzle theme. The map would be abstracted as a series of puzzle pieces, with the piece for Dorset being separated and the wrong piece to connect to the main puzzle. Possible slogans were discussed, such as ‘Sometimes the pieces just don’t fit’. I think it is important not to abstract too much so that the message of the poster remains evident and easily understandable. We aim to refine our ideas and come up with a more final poster design over the coming days.