Data noise - website & coding
Aktualizacja: 10 kwi 2019
Link to final website: here
Finally after few unsuccessful attempts, Oliver suggested us different and, in my opinion, easier idea where we would allocate sounds to separate circles which would be overlaying on top of each other. At first, we wanted to make only 4 sounds because we thought it might be easier, when in reality we would only have problems with empty spaces (no sound) or with no clear middle sound (illustrated below).
We ended up coding our website having below sketch in mind.
It took us few hours to do everything and of course it was not without any troubles. The main issues we had with the circle in the middle because the idea was that the sounds stop playing when you go outside the border. It worked for both Marylebone and Vauxhall location, but for City of London and Greenwich it was playing constantly on the whole right side of the website. As we found out later, it was a problem with the way Google Chrome understands code - we had to edit the 'body' and 'html' elements in CSS giving them exact width and height attributes (1920px x 1080px). Of course it made our website unresponsive, but it was the only way we knew and it could fix our problem quickly. Next issue we encountered was that Google Chrome didn't play the sounds until the user clicked somewhere on the website, and this is why we had to create a welcoming page forcing users to click first before they could use the interface.
We had short conversation about the color palette for our website but we went with a bright yellow and blue color so it would be associated with toxic environment and something dangerous.