CITY SOUND MAP MA GRAPHIC BRANDING AND IDENTITY 2011 LONDON COLLEGE OF COMMUNICATION SILVIA GIULIANINI
4|5
CONTENTS 06 / Introduction 07 / Field of Study 09 /
Mapping and Wayfinding
32 /
Visualisation of sound
48 /
Code and Processing
57 / Methodology 70 / Visual Experiments 104 / Outcome 105 / iPad application 108 / Posters 109 / Pocket Maps 110 / Animated projections 111 / Website
Introduction The visual summary contains the contextual basis of my project, the experimental research and the visual experiments undertaken throughout the project. The field of study will be the subject of the first section, providing visual examples of my research: I looked mainly into existing examples of visualisation of sound in several fields, into mapping and information graphics. The following section will focus on the methodology that I followed, consisting in ‘soundwalks’ around London, during which I was recording sounds and taking pictures of the sound sources. Afterwards, the visual experiments that lead me to the final outcome, will be explored and the summary will conclude with the visual representation of my outcome, consisting in an application for iPad, and in the design of posters and maps.
01
Field of Study Mapping and Wayfinding Visualisation of Sound Code and Processing Information Graphics
MAPPI NG AN D WAYFI N DI NG SYSTE MS Part of my research was focused on exploring several examples of maps and wayfinding systems, looking into different ways to represent space, through usual and unusual representations.
Tactile Map David Sweeney, 2008
The Talking Tactile Map by David Sweeney improves both the clarity and quality of the information. Simplicity is key to a tactile map’s success, but tactile maps have always suffered from a trade-off between legibility and information quality.
10 | 11
Smart Camera David Sweeney, 2008
A computer’s ability to recognise objects, patterns and gestures, has drastically improved over the past few years. Even with the limited processing power available to us on a mobile phone, such software can identify real world objects with such fidelity that it can be used as a profitable navigational tool today. This prototype, the Smart Camera, is sensitive to two dimensional data matrices called QR (Quick Response) codes. These black and white icons contain digital information that is instantly decoded the moment that the camera recognises them.
12 | 13
Pathfinder David Sweeney, 2008
Wayfinding solutions for elderly impaired people have yet to take full advantage of emerging technologies. This project looks at designing systems that enable better navigation of public spaces and buildings using near-future technology. Evidently our present wayfinding infrastructure relies heavily upon displaying information visually through signs, notices, arrows, maps, etc. There is no reason why this has to be the case. We have other senses and each could act as an input for information.
Psychogeographic guide of Paris Guy Debord, 1955
Psychogeography, according to its founder Guy Debord, was ‘the study of the precise laws and specific effects of the geographical environment, consciously organized or not, on the emotions and behavior of individuals’. The results of this new approach to space were primarily a series of psychogeographic reports and maps, developed predominantly within Paris. The maps were seeking a corresponding new visual way to represent their findings.
14 | 15
Cognitive Maps Of Boston Kevin Lynch, 1960
Lynch wanted to know how people sense their city and how they use that sense to go about their lives within it. He was more interested in the sense of people who live in the space, than the science behind the stuctures within it. For Lynch, key to the process of teasing out the individual and collective perceptions of a city, was the concept of imageability: “imageable� is a term that Lynch invented to indicate how well a place can be taken in, mentally mapped, and experienced.
The sonic environment of cities Michael Southsworth, 1960
Michael Southsworth’s map of Boston sonic environment.
16 | 17
Emotional Mapping Christian Nolde, 2005
Artist Christian Nold worked with local residents, to build emotional maps of different areas of cities, exploring people’s relationship with their local environment.
Greenwich emotional map Christian Nolde, 2005
The participants explored the city, whilst equipped with the special Bio Mapping tool invented by the artist. The device measured the participants’ emotional arousal in relation to their geographical location in the city. On their return from the walk all the participants viewed their maps and guided by the artist, analysed their own arousal data.
19 18| |19 19
Stockport Emotion Map Christian Nolde, 2007
Over 200 people were involved in this project to map emotions, desires and opinions of the Stockport population. The map represents the inhabitants personal experience of the town.
Silent London Simon Elvins
Using information that the government has collected on noise levels within London, a map has been plotted of the capital’s most silent spaces. The map intends to reveal a hidden landscape of quiet spaces.
20 | 21
Radio Map Simon Elvins
Map plotting the location of FM commercial and pirate radio stations within London. Power lines are drawn in pencil on the back of the map which conduct the electricity from the radio to the front of poster. Placing a metal pushpin onto each station then allows visitors to listen to the sound broadcast live from that location.
Sound Maps Communities
The following communities (Aporee and Barcelona Sound) consist of archival databases of sound recordings from the cities, but they don’t provide any kind of navigational information. They are continually evolving projects, with the goal of a constant addition of new recordings being placed into a browsable tagging system.
22 | 23
Sound Maps Communities
The homepages here displayed belong to the following on-line communities: Soundseeker, Montreal sound map and Soundcities.
Lust Map Lust
The map directly relates to the Lust design methodology and phylosophy. (Owen, 2008. Mapping graphic navigational systems, Mies: RotoVision)
24 | 25
The Safari 7 Urban Omnibus, 2008
The project uses a range of media – podcasts, maps, signs, schedules and social networking tools – to create a platform where commuters, school children, subway operators can connect to New York City’s ecosystems, as they travel through it. New York’s transit system acts as an eco-urban classroom, and passengers become their own park rangers, or safari guides.
Population Density Map Stamen Design
The Census Bureau published a map of population density of 3,134 countries using a choropleth map; darker counties have higher population densities. A GeoJSON layer containing state boundaries is drawn over the counties using a thick white border.
26 | 27
Flickr Shapes Aaron Straup Cope
Aaron generated ‘Flickr Shapetiles’ from geotagged Flickr photos, which have up to six associated Where On Earth IDs. These identifiers correspond to the hierarchy of places where a photo was taken: the neighbourhood, the town, the county, and so on up to continents.
San Francisco Digital City browsers Stamen Design
Two parcel viewers, perspective and aerial, show a basic, interactive view of downtown San Francisco. These viewers are based on renderings of a digital city model of San Francisco, provided by Mark Schwettmann, that combine realistic shading and identifying parcel information encoded as a color.
28 | 29
Pretty Maps Stamen Design
Prettymaps is an interactive map composed of multiple data sources, designed to push the limits of modern browsers and the aesthetic boundaries of traditional cartography.
Amsterdam Real Time Esther Polak, 2003
Amsterdam RealTime attempted to visualise ‘mental maps’ of the city that everyone has in his mind, through examining the mobile behaviour of the city users. During two months, partecipants were equipped with a tracer-unit, a portable device, equipped with a GPS. Using satellite data tracer to calculate the geographical position, the resulting coordinates were then sent in real time to a central point.
30 | 31
Wireless Network Visualizations Stamen Design
As a participant walks through the city, wireless networks are sensed by the PDA. Each time a new network is encountered, a new vertical bar is drawn. As each new network is encountered, its marker moves along the color spectrum. The first network is always red and on the left hand side, the last one is always purple and on the right side, and networks along the way get new colors as they come within range. The height of each bar represents the combined strength of the wireless networks currently in range.
SOU N D VISUALISATION Visualising sounds is not a new matter: this chapter will explore the attempts made in different fields to translate visually music and sound.
33 | 33
Mouse Tracking Generative Art, Anatoly Zenkov
Whaam! Roy Lietchestein, 1963
One of the earliest known examples of pop art, “Whaam!” is based on an image from ‘All American Men of War’ published by DC comics in 1962, by the artist Russ Heath. The cartoon style is heightened by the use of the onomatopoeia “Whaam!”
34 | 35
Parole in Libertà Filippo Marinetti, 1912
The Futurists’ poetic and literary impressions of the explosions of grenades and shots of the weapons, are shown graphically with the use of the so called “words-in-freedom,” accomplished with different typefaces, some hand-designed, of various size. The text features a large use of onomatopoeias in order to express the variety of sounds and noises of battle.
Phonak Sculptumes Samuel Textor, 2010
With an international campaign, people in need of hearing aids are demonstrated what wearing Phonak products can bring: the restoration of their full hearing potential. This was emphasized by real costumes that symbolize the colorful range of life sounds, each costume symbolizing a special sound.
36 | 37
Realtime Sound Visualisation Quayola, 2010
Live music visualisations for Ether Festival.
Music Visual Stephanie Barth, 1999
The work of Stefanie Barth, Karl Kliem and Benjamin Fehr (King, 2001, Restart: New systems in Graphic Design, p.49) can be thought of an application of Kandinsky’s ideas to modern, digital age. Their work shows simple geometric shapes that appear at intervals determined by the structure of the music. Nowadays, this kind of sound visualization is such a wide spread idea that it does not belong to the serious artists anymore. A lot of music player softwares include some kind of “visualization” plug-ins, which draws very complex digital images that react to the sound of the music.
38 | 39
Souton, the Yellow Voice Paul Farringdon, 1999
Sound and image experiments (King, 2001, Restart: New systems in Graphic Design, p.21). The designer tried to create a set of visuals that respond directly to what was being heard, visuals were directly generated by sound. In the images below, the experiment was firstly to record partecipants from different regions, with different accents. Afterwards the computer generated a typeface from each recording.
Sound object / Laser cut plastic Leander Herzog, 2010
Leander Herzog’s data sculptures perpetuate this disregard of the emotional dimension of music, looking at the sound input simply as a frozen space of random-access data. Herzog replicates this data stream by perforating plastic ribbons at intervals matching amplitude measurements, producing ornate collections of short and long loops. The result is a curious data artifact, numerically correct but completely disconnected from its own origin as sound.
40 | 41
Seelenlose Automaten Patric Schmidt & Benedikt GroĂ&#x;, 2008
Seelenlose Automaten is a generative music visualization with an unusual approach. MIDI control messages are sent simultaneously to the sound and image generators. These messages are a vocabulary of rules giving structure to the composition, so all changes can be precisely predicted, and as a result the entire composition is perfectly synchronized. Polygons, lines and circles twist and turn in a gray void, responding to the smallest change in sound. Musical information is turned directly into a visual output.
III Video Tina Frank, 2005
Tina Frank created the video “iii� below by taking digital audio files of the music by Peter Rehberg and opening them as raw pixel data in Photoshop. An oval image mask was superimposed, giving a more specific form to the resulting video.
Spectrogramalphabet Tom van de Velde, 2009
Illustrations relating to the concept that image can be treated as sound, and vice versa. A sound recording is visualised by means of a spectrogram. The resulting output is manipulated and consequently synthesized back into sound, allowing the viewer to “listen� to the illustration.
42 | 43
Zimoun Sound installation, 2010
Zimoun, a young artist from Switzerland, uses sound in order to create magic. In his installations sound is used as an architectural element, it defines space and it makes the spectator be a part of a totally unique experience.
Landscape I: Vanishing Point John Kannenberg, 2004
‘Landscape I: Vanishing Point’ is a score for four or more performers. It premiered on March 21, 2004 at Deadtech gallery in Chicago during the Decomposure at Deadtech series.
44 | 45
Scores: ‘Signals’ and ‘Tetralog’ Leon Schidlowsky, 1972
The graphic music scores of the well known Chilean-Israeli composer and painter have been shown in various exhibitions linked to concerts.
Solitude Hans Christoph Steiner, 2004
Graphic score for 50-100 voice polifony.
(Sauer, 2009. Notation 21, New York: Mark Batty Publisher, p.236-237)
46 | 47
Museik n. 9 and n. 10 Henrik Colding Jorgensen, 1979
Graphic score for any instrumentation. (Sauer, 2009. Notation 21, New York: Mark Batty Publisher, p.54-55)
CODE AND PROCESSING I did some research also into generative processes as my initial idea was to realise a generative application, able to generate different patterns, according to the imput given by the users.
City of Letters, John Maeda, 2005
Generative Softwares John Maeda
Examples of reactive softwares, realised by the artist John Maeda. (Maeda, 2004. Creative Code, Thames & Hudson)
50 | 51
Shangai Traces Ben Houge, 2010
This piece uses the medium of generative video to evoke the manner in which people move through a city; people constantly interact in unpredictable ways, and every life leaves a trace, however fleeting.
INFORMATION DESIGN Before approaching the design of the final sound maps it was helpful to look into some good examples of information graphics.
52 | 53
Graphic timetable for the Java Railroad, 1937 (Tufte, 1983. The visual display of quantitative information, Graphics Press)
Dance notation Giambatista Dufort, 1728
Systems of dance notation that translate human movements into signs transcribed onto flatland, permanently preserving the visual instant. Design strategies for displaying dance movements encompass many techniques: small multiples, close text-figure integration, parallel sequences, details and panorama, layering and separation and avoidance of redundancy.1
The Art of Dancing Kellom Tomlinson, 1735
Dance notation System.1
54 | 55
Dance score ‘Cachucha’ Friedrich Albert Zorn, 1905
Extract form the score Cachucha, (1905, Grammar of the art of Dancing: Theoretical and Practical. Heintzemann press) It shows the simultaneous action of four dancers.
Dictionary of kinetography Albrecht Knust, 1979
1
Tufte (1990). Envisioning information, Graphics Press
Napoleon’s March to Moscow Charles Minard, 1869
In the panel below the designer Edward Tufte refers to the famous 1869 Charles Minard analysis of Napoleon’s disastrous March to Moscow as “the best statistical graphic ever drawn.” In a single visual, Minard elegantly plots a half-dozen variables, each of which could warrant its own separate chart.
London cholera map Dr John Snow, 1854
The page shown below (Tufte,1983. The visual display of quantitative information, Graphics Press), shows good examples of information graphics. Dr. John Snow plotted the location of deaths from cholera in central London, while Charles Minard
Tableaux Graphiques et Cartes Figuratives Charles Minard, 1864
gave quantity and direction to the data measures located on the world map in his portrayal of 1864 exports of French wine.
02
Methodology Soundwalks Typologies
106 | 57
Methodology I started my qualitative research by doing soundwalks around London in different areas, bringing with me a voice recorder and a camera.
At the beginning of my project I was looking for discovering the variety and also the typical soundmarks of London soundscape, focusing my research on busy roads, urban green spaces, pedestrian areas and voices. The purpose was to explore sounds and to make critical judgement about their contribution to the balance or imbalance of the sonic environment. While walking, I was taking notes of the areas explored, on a map. What I first noticed were the quick changes in the soundscape by just simply turning a corner, the loudness of certain areas and the dominance of machinery sounds on other “organic sounds�. The typical London soundscape feature I noticed most was the mixture and overlapping of sounds, which made it really difficult to distinguish each of them clearly. I started to analyze the data gathered and to classify sounds recorded into typologies, like voices, nature, transport, emotional sounds, religious sounds, warning sounds. What I was focusing on, in particular was their loudness, pitch, duration and the emotional response that were producing on me.
59 58| 59 | 59
SOUNDWALK / Analysis of sounds recorded Holborn Station / UNDERGROUND TRAIN / 70 DB / LOUD Oxford Circus / PEOPLE FOOTSTEPS NOISE / 60 DB / MODERATE Regent’s Street / BUS BREAKS / 70 DB / LOUD Regent’s Street / AMBULANCE SIRENS / 125 DB / PAIN Charing Cross / PREACHER VOICE / 65 db / MODERATE
Typologies
During my soundwalks around London, I was taking pictures at the locations where I was recording sounds. This helped me to classify the city sounds into several typologies: Nature, Machinery, Transportation, Religious, Warning, Silence, Human and Leisure, and I coded each one with a colour.
SOUNDWALKS
TYPOLOGIES
NATURE HUMAN
MACHINERY ANALYSIS OF DATA COLLECTED
WARNING
TRANSPORT
RELIGIOUS
LEISURE
SILENCE
Human Sounds
Looking at the pictures taken during my soundwalks, it was helpful for classifying the sounds recorded into typologies. I decided to code each typology with a colour.
62 | 63
Mechanical
Leisure
64 | 65
Nature
66 | 67
Warning
68 | 69
LONDON SOUNDS Typologies
Nature
Religious Sounds
Machinery
Rivers
People Praying
Buses
Lakes
Bells
Trams
Rain
Religious choir
Trains
Fountains
Vespers
Underground train
Wind
Mass
Cars
Storms
Priest voice
Motorbikes
Thunders
Muezzin calling to prayer
Bycicles
Breezes
Religious music
Trucks
Thunders
Gospels
Airplanes
Birds
Religious festivals
Helicopters Jets
Squirrels Cats Dogs
Entertainment
Police cars Police sirens
Cicadas
Television
Ambulances
Crickets
Sport Events
Road Works
Mosquitos
Theatres
Jackhammer
Bees
Museums
Air conditioners
Opera
Weapons
Concerts
Industrial equipment
Amusement fair
Farm machinery
Human Cheering Eating Drinking Snooring Footsteps Sneezing Scratching Applauding Talking (languages) Shouting Screaming Coughing Laughing Singing Crying Whispering Grunting
Markets
Warning Alarm clocks Clocks Whistles Bells Horns Phone ring Alarm systems Sirens Foghorn
Silence
02
Visual experiments Visual experiments 1-10
70 | 71
The following chapter describes the visual experiments that were performed during the project and that lead me to the final outcome.
After the analysis of the data gathered, I started to undertake my first visual experiments on sound mapping, focusing on the small areas of London that I have visited. I was trying to organize the materials collected and to represent visually my soundwalks. I experimented different solutions to make sound visual, at first using a system based on pictograms, then adopting a more abstract visual language based on color and shapes. This chapter describes all the visual experiments that I have undertaken and that were necessary to achieve the final result.
In my first experiment I tried to map the sounds recorded according to their volume and
Visual Experiment 1 Loudness map
their geographical position.
LEISURE Holborn
FAINT
MODERATE
LOUD
Tottenham Court Road VERY NOISY
Oxford Circus PAIN
INTOLERABLE
Covent Garden
Leicester Square
Piccadilly Circus
Charing Cross
72 | 73
Visual Experiment 2 Loudness and typologies maps
In these experiments I created a code, where sound was represented by a circular shape (in the first example) or by a speech bubble (in the second example). Colour was used to differentiate the typologies of sounds, while size corresponded to the level of loudness.
LEISURE Holborn
Leisure FAINT
LEISURE
LEISURE
MODERATE
Holborn Holborn
FAINT
faint moderate
FAINT LOUD
MODERATE
MODERATE
Tottenham Court Road LOUD
loud
LOUD VERY NOISY
Tottenham Court Road
Tottenham Court Road
VERY NOISY
noisy
Oxford Circus
VERY NOISY
PAIN
Oxford Circus
Oxford Circus
PAIN
PAIN
very noisy
INTOLERABLE INTOLERABLE
painful
Covent Garden
Covent Garden
INTOLERABLE
Covent Garden
Human
EMOTIONAL EMOTIONAL Leicester Square
FAINT
Leicester Square
FAINT
MODERATE
EMOTIONAL
MODERATE
Leicester Square
faint moderate
FAINT LOUD
LOUD MODERATE
Piccadilly Circus
loud
Piccadilly Circus VERY NOISY
noisy
LOUD VERY NOISY
Piccadilly Circus PAIN
VERY NOISY
Charing Cross
PAIN
very noisy
Charing Cross INTOLERABLE
Charing Cross
PAIN
painful
INTOLERABLE
INTOLERABLE
Loudness Holborn
faint Tottenham Court Road
moderate loud
Oxford Circus
very noisy painful
Covent Garden
Typologies machinery human
Leicester Square
leisure Piccadilly Circus
Charing Cross
Visual Experiment 3
After the first experiments, my following approach was to try to visualise differently the sound objects, by translating them into pictograms.
74 | 75
Visual Experiment 4 Collage map
In the example shown below, I was trying to make my soundwalk visual, by using pictograms and speech baloons, containing the corresponding onomatopoeia. As at first I was thinking to address my project to a young target audience, I adopted a more illustrative style.
HOLBORN
HOLBORN
SPLASH
CLING
SCREECH
CLING CLING
MIND THE
HOLBORN
DOORS HOLBORN HOLBORN HOLBORN HOLBORN
AARHH!
BLA BLA
HOLBORN
HOLBORN
FIZZZ
OXFORD CIRCUS BOND STREET HOLBORN
GLUG
COVENT GARDEN
COO COO
LEICESTER SQUARE
WROOM COO COO
PICCADILLY CIRCUS CHARING CROSS
77 76| 77 | 77
In these examples I kept experimenting with pictograms and speech baloons.
Visual Experiment 5 Pictogram maps
HOLBORN
THUMP
THUMP
SCREECH
TOTTENHAM COURT ROAD
THUMP
THUMP
OXFORD CIRCUS
BLA BLA
CLING
COO COO
CLING CLING
AARHH!
COO COO
GLUG
COVENT GARDEN
FIZZZ WROOM
LEICESTER SQUARE
CLAP PICCADILLY CIRCUS
CLAP
MIND THE
DOORS
CHARING CROSS
FAINT
0-30 db
MODERATE 30-60 db
LOUD Leicester Square
60-90 db
VERY LOUD 90-110 db
PAIN 110-130 db
Visual Experiment 6
My first idea of outcome was to create a brand, whose purpose was to educate young people to listen. Thus I adopted a visual language based on colours and pictograms: I grouped the sounds collected into typologies and I coded each one with a colour. Each typology contained specific sounds, translated into pictograms, representing the sound source. The following step was to classify sounds by volume. The visual translation of the volume was represented by six graphic speech baloons with different shapes, each one corresponding to a different level of loudness (faint, moderate, loud, very loud, painful, intolerable).
78 | 79
LEISURE
NATURE
TRANSPORT
VOICES
WARNING
Code created to represent city noises and sounds.
Visual Experiment 6
LOUDNESS
0-30 decibels FAINT
60-90 decibels LOUD
30-60 decibels MODERATE
90-110 decibels VERY NOISY
110-140 decibels PAINFUL
140-160 decibels INTOLERABLE
SOUND TYPOLOGIES
TRANSPORT
LEISURE
EMOTIONS
VOICES
NATURE
SPIRITUAL
WARNING
SILENCE
PICTOGRAM REPRESENTING THE SOUND OBJECT
BUBBLE SPEECH INDICATING THE VOLUME OF SOUND
80 | 81
Visual Experiment 6
Visual Experiment 6 Sound Map (Transport)
I combined together pictograms and speech ballons, trying to create visual maps for each category of sound.
82 | 83
Visual Experiment 6 Sound Map (Nature)
CLAP
CHIN
YAHOO
AHAHA SIGH
WAH
Visual Experiment 6 Sound Map (Voices)
84 | 85
Visual Experiment 6 Sound Map (Leisure)
BLABLA
GLUG
SSSS
CLING
Visual Experiment 6 Sound Diary
My first idea of output included the design of a book, which explained the process that I undertook and which contained the pictures taken, the sound typologies and the sounds recorded in a cd. The book was meant to contain also an empty map of London, together with stickers representing the pictograms, so that the user could personalise the map according to his sonic experience of the city. The final part of the book would have been a sort of an empty diary where the user could have written the information about the sounds heard.
Visual Experiment 6 Sound Diary
98 | 89
Visual Experiment 6 Sound Diary
Visual Experiment 6 Web Site
Finally my first idea of output included also the design of a web site, that could give information about the sounds of the city and at the same time could orientate people to navigate space, from a geographic point of view.
HOME
SOUND CATEGORIES
BLOG
MY SOUNDWALK
SIGN IN
CONTACT
SOUND CATEGORIES TRANSPORTATION
EMOTIONAL
WARNING
SPIRITUAL
NATURE
LEISURE
cheep
VOICES
SCARY
SILENCE
SOUND JOURNEY PLANNER
cheep 30 Decibels / Faint
From To
Hyde Park City of London, Bayswater W26LS Hyde Park is the perfect place for lovers of Italian food. At Bertorelli restaurant you can find everything from great antipasti to the finest italian food and specialties.
Read more
HOME
SOUND CATEGORIES
BLOG
MY SOUNDWALK
SIGN IN
CONTACT
SOUND CATEGORIES TRANSPORTATION
EMOTIONAL
WARNING
SPIRITUAL
NATURE
LEISURE
VOICES
SCARY
SILENCE
SOUND JOURNEY PLANNER
glug glug
glug
From
Oxford Circus
To
Cafè Bertorelli
30 Decibels / Faint
Oxford Circus Station Walk down from Regent’s Street toward Oxford Street, until you reach the Underground station. Walk down and turn left in Brewer Street, until you reach Regent’s St.
Regent’s Street Walk down from Regent’s Street toward Oxford Street, until you reach the Underground station.
SUBMIT YOUR SOUNDS
HELP US TO SAVE ENDANGERED SOUNDS
Walk down and turn left in Brewer Street, until you reach Regent’s St. Walk down and turn left in Brewer Street, until you reach Regent’s St
Liverpool Street Walk down from Regent’s Street toward Oxford Street, until you reach the Underground station.
90 | 91
Visual Experiment 6 Web Site
Web-site sketches.
Visual Experiment 7 Web Site
The following example shows a more abstract visual approach. That was my first attempt to design an on-line community map that contained the ‘sound memories’ submitted by users, classified by location, hour of the day, date, sound and emotions. Each user could design his own sound map of a certain area of the city and then submit it, thus contributing to the creation of the entire map of his city.
92 | 93
SOUND LIBRARY
Search
MY SOUND DIARY
SOUNDMAPS DATABASE
ABOUT
DESIGN YOUR SOUNDMAP
SIGN IN
CHOOSE A CITY
London
FEAR
AREA / POST CODE
BOREDOM
Camden Town
IRRITATION
HOUR
12 am
SADNESS
DATE NOSTALGIA
13.09.2011 SOUNDS
ANXIETY
Bells
COMFORT
Wind
EXCITEMENT
Traffic
LAUGHTER
RHYTHM
VOLUME
HAPPINESS
SOUNDS
Add to my Soundiary
Submit
PEACE
INTENSITY
EMOTIONS
SETTINGS
Share
Visual Experiment 8 Visual identity
The following pages contain another visual solution, based as well on an abstract visual language. First of all I named the brand “City Sound Map”, and I redefined the target audience, by addressing it mainly to designers and people interested in sound. The idea was to create an Open Source Community on-line, containing sound maps of the world cities, related to the geographical space. The maps should have been created by the contributions of volunteers all around the world, that, by submitting their maps, could partecipate to the creation of the entire sound map of their city: the web-site was meant to be a database, that mashed together the ‘sound maps’ submitted by users, classified by location, hour of the day, sound and emotion. As the emotional response to sounds is personal and subjective, users could have designed their own visualisation of sound, through a software contained in the website. In this way every map would have represented the perception and the emotions of that individual, related to a precise location.
94 | 95
Visual Experiment 8 Sound maps
Examples of how city sound maps could look like.
First layout of “City Sound Map� web site. The visual language is minimal, based on
Visual Experiment 8 Web site and software
shapes and colours. The menu is hidden in the grey bar, placed at the bottom of the screen. Users can browse throught the maps created by other users, and they can also create their own account, containing their personal sound memories, thus becaming a sort of private sound diary.
MY SOUND DIARY
CITY SOUND MAP
96 | 97
WARNING
Visual Experiment 8 Processing software
The web-site contained an application to allow users to design their sound map. The principle on which the software is based, is the one of reactive graphics. The purpose was to engage the human sensory system at the instinctual level, and the user should have ‘learnt by doing’ how the application worked: the graphic would have reacted differently according to the cursor movement and windows would have popped up from the bottom bar.
1 click
6 clicks
2 clicks
3 clicks
7 clicks
4 clicks
8 clicks
5 clicks
9 click
98 | 99
First attempt to create a notation system: this code represents the tool through which
Visual Experiment 8 Software Code
users could design their sound maps. Users were free to use any shape belonging to a particular category (Air sounds, ground sounds and underground sounds). Colour defined the typologies.
AIR SOUNDS
GROUND SOUNDS
UNDERGROUND SOUNDS
SOUND TYPOLOGIES
TRANSPORTATION
NATURE
ENTERTAINMENT
RELIGIOUS
HUMAN
WARNING
MACHINERY
Visual Experiment 8 iPad application
The iPad application would have had two functions, like the web-site: the one to search for maps and the one to design maps.
SEARCH BY: LOCATION DATE TIME SOUND
MY SOUNDIAR Y
100 | 101
Visual Experiment 8 Sound maps book
Promotional item for the brand: a book containing sound maps designed by users.
After the feedback about the previous experiment, where the code was getting too
Visual Experiment 9 Web site
complex, I simplified the legend, and classified sounds in 3 typologies, human, natural and mechanical (represented by colours), pitch (represented by tone) and volume (represented by size).
LOCATION
LOCATION LOCATION CITY SOUND MAP
CITY CITY SOUND MAP
LONDON | CAMDEN
L OND N LONDON
CAMDEN
LOCATION
LONDON
CITY SOUND MAP
CITY SOUND MAP
LONDON | CAMDEN
6AM-12AM | 12PM-6PM | 6PM-12AM | 12AM-6AM |
LONDON | CAMDEN | 12PM-6PM |
6AM-12AM | 12PM-6PM | 6PM-12AM | 12AM-6AM |
Camden Road NW1 0AY
“Bird-singing make me feel happy” -2 hours-
LOCATION
DESIGN YOUR MAP
CITY SOUND MAP
CITY SOUND MAP
LONDON | CAMDEN | 12PM-6PM |
6AM-12AM | 12PM-6PM | 6PM-12AM | 12AM-6AM |
Camden Road NW1 0AY
“Bird-singing make me feel happy” -2 hours-
INTOLERABLE VERY LOUD LOUD MODERATE
LOW
FAINT
HIGH
VOLUME
PITCHA
The sound of bird-singing brings back the good memories of my childhood.
DD YOUR THOUGHTS
SUBMIT
SAVE
102 | 103
I was experimenting, trying to find the best way to visualise city sounds, designing a
Visual Experiment 10 Web site
more clear and easy-to-read legend. In this case sounds were classified by typology (colours) and volume (size).
LONDON
CITY SOUND MAP
CITY SOUND MAP
LOCATION
CITY S SOUND SOU ND M AP A
LOCATION
CITY SOUND MAP LONDON LOND ON | C CAMDEN AMDEN A EN | 12 12PM-6PM P 6PM |
LONDON DON | CAMD CAMDEN | 12PM 12PM-6PM M-6PM PM |
Camden Road NW1 0AY
Camden Road NW1 10 0A 0AY
“Great music from next door pub” - 6 hours ago -
“Bird-singing make me feel ee el happy” p pp -2 hours ago-
CITY SOUND MAP
CITY SOUND MAP
Camden Road NW1 0AY
LOND ON | CAMD EN | 12 PM -6PM | “Very loud ambulance sirens give me stress.” - 2 hours ago “Noisy and annoying traffic”. - 2 days ago “Kids making noise and screaming” - 12/09/2011 “Very annoying loud music coming from the pub” . - 06 / 08 / 2011 -
THE SOUND OF BIR D-SINGING BRIN GS BACK THE GOOD MEMORIES OF MY CHILDHOOD.
“Excessively loud noise generated by road works”. - 12/09/2011 -
VOLUME
ADD YOUR THOUGHTS
SUBM IT
SAVE
03
Outcome iPad Application Promotional Posters Pocket Maps Animated Projections Web-site
104 | 105
iPad application
The aim of the brand ‘City Sound Map’ is to collect and map data about how people perceive sound and noise in cities. The application has a double function: the first one is to allow users to browse through sound maps of cities, the second one is to allow users to design their own map of a specific area, thus contributing to the creation of the sound map of their city.
London
City Sound Map
London Camden
Hour
Sound
Search
Emotions
London Camden | NW8 7JT
Hour
Sound
Emotions
On the top bar there are three parameters that allow the user to filter the sound map.
iPad application
Users can in fact browse by hour of the day, by sound they would like to research about and by emotion.
London
Hour
Sound
Emotions
18 Lodge Road, London NW8 7JT | Camden
London
Hour
Sound
Emotions
31 University Street | WC1E 6JL | Camden
Camden WC1E 6JL “Annoying live music until late every night” - 4 hours ago “Excessively loud sirens coming from the street” - 2 days ago “Noisy kids screaming under my window” - 12/09/2011 “Noisy group of people in front of the pub at site” - 24/08/2011 “Great band playing live music” - 05/07/2011 -
“Loud annoying music coming from the pub next door” - 2 hours ago -
London
Hour
18 Lodge Road, London NW8 7JT | Camden
Sound
Emotions
London
Hour
Sound
10 PM–6 AM | 6 AM–2 PM | 2 PM–10 PM
Emotions
106 | 107
Users can design their sound maps, add a description of their sonic experience and the emotion related to it.
London
Hour
Sound
Emotions
London
Hour
Sound
Emotions
Hour
Sound
Emotions
Rivers
Rivers
OCEANS RIVERS RAIN FOUNTAINS WIND BIRDS
London
Hour
Sound
Emotions
Design your map London
NW8 7JT | Camden | Exciting
NW8 7JT | Camden
Loud
Emotions Scary Stressing Pleasant Exciting Annoying
Add a description Constant noise caused by road works and traffic.
Promotional Posters
The posters are promotional tool for the brand. Without being too explicit, they communicate what the brand is about: they show the neighbourhood sound patterns of two cities, London and Venice, without showing the geographical reference. At the bottom of the posters there are information about the location, date and hour of the day represented, plus the web-site reference, where users can find more information.
City Sound Map
LONDON | CAMDEN TOWN | 02.10.2011 | 2 PM
www.citysoundmap.com
City Sound Map www.citysoundmap.com
VENICE | SAN MARCO | 13.09.2011 | 4 PM
108 | 109
Pocket maps are informative tools through which the brand can give information to the audience about the urban sonic environment of specific areas and neighbourhoods of the city. They could be placed in airports or in tube stations.
www.citysoundmap.com
AN ALTERNATIVE MAP OF LONDON, VISUALISING THE SOUND OF THE CITY
For further information about the project check the website www.citysoundscape.com Learn more about the sonic environment of your city and experiment a different way to navigate space. Follow the sound!
City Sound Map
Pocket Maps
Legend
Sounds
City Sound Map
Volume
Periodically Repeated
Faint Moderate
Impulsive Travelling
Loud
Continuous
Very Loud
Typologies Natural Leisure Human Machinery
Painful
Warning Silence
City Sound Map
LONDON | CAMDEN TOWN | 6 AM - 2 PM
London / Camden Town
Animated projections
Promotional projection screens, placed in underground stations, showing animated sound maps, endowed with microphones that make sounds. The projections show sound patterns of different areas of cities at different hours of the day, or they show city sound patterns related to certain emotions (for example relaxing or stressing).
04
Web-site
110 | 111
The web-site works in the same way as the iPad application: users can search for sound maps of cities and can design and submit their sound maps.
City Sound Map
“There is no such thing as empty space or an empty time. There is always something to see and to hear. In fact, try as we may to make silence, we cannot.” — John Cage —