Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

defining the problem

01The brief for this project was that there was none. Instead, we had to develop a brief ourselves by defining a design ‘problem’ that could be solved by ourselves by proposing or making a response.

I thought this was a bit daunting at first, but after thinking about it for a while I had a few ideas already buzzing around my head.

We were told first to choose an area to look into e.g news, politics etc. I chose to look into news/current affairs as my field of study and after looking around for a while there were a few things that I noticed.

The first was there were a lot of social stereotypes being made, mostly derogatory within and around the news and their stories. After thinking about this for a while I wasn’t too sure about how this would be solvable through design.

The other was that there were a lot of statistics being featured, especially considering that around the time I was looking there were the student demonstrations and the conflicts in Libya. Most of these though played quite an important role in the news story, yet were displayed in a boring fashion and the majority were overlooked.

This was a problem that obviously needs solving so I started looking for other examples of badly displayed statistics on news websites to get a bigger look at the problem so I could start looking at ways of approaching the problem and possible design solutions.

They aren’t used to be visually appealing and are never displayed in a way to be the main focus of a news report. They are just used to back up a news story and reinforce the statements they are trying to make instead of rarely being a standalone article.

The problem is very significant as this sort of visual representation/aid could make people realise the scale of the latest news and possibly raise awearness and maybe gather support if needed. I think that by creating this sort of visualisation would make some people more interested in news statistics/the news in general.

This was quite a wide thing as well as the target audience that is affected by this is anyone interested in current affairs or anyone who possibly doesn’t currently take much interest in the news, so pretty much anyone.

Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

RESEARCH

02

I started looking into lots of news data to see in general how it is displayed and where it is located etc.

Most look very boring with just text only, and lightly brushing over the figures.

Some have slight diagrams/maps to illustrate ares but that is the extent of the visuals.

Maps feature sometimes on news websites, but they are just used to illustrate where events have been. This diagram they have presented the statistics alongside in a nice way, but there are only a few and are quite boring to look at.

This is an extremely boring table that I found featuring data from the news. It almost looks like a spreadsheet and is formatted in that way.

This is an example of another table featuring statistics – this one is displayed a bit better by making use of different font weights and colours – but it is still just a table. No particular visuals. There is definitely a big gap for something like this to be featured.

Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

data visualisation

03The solution that I proposed to solve this was fairly obvious, Data Visualisation. To make the statistics more engaging to get people interested in them. I wanted to create a Data Visualization, containing up to date statistics (probably from Egyptian protests).

This is an important thing as it means that people can see the impact and size of the news statistics in a visual way, whereas it is normally displayed in a fairly boring way on news websites etc or in graphs at the most. So I am proposing another way of displaying the data to people who may not normally look at it/be interested. It is also another way of making the news look more dramatic and being able to see the impact it has caused.

I started by reading through some books relating to data visualisation and also by looking into already existing news/non news visualisations wether static or dynamic and how they were created.

I obviously need to decide a visual style that fits with the data but is also easy to decipher and looks good.

This is what I currently need to experiment with as this may decide wether I can actually create the visualisation software or wether I will have to just create a pre rendered video or image for example.

Digital Nostalgia PrintsWEB trend map v4 HTML Webpages as Graphs

The data being visualised is different types of new>old technology. It is being visualised through different graphs/charts that are well displayed and designed. When placed alongside each other you can also see their relative sizes. Different types of storage capabilities/size are the main things focused on with some additional data such as transfer speed etc added in also.

It is non customisable but I think that the face that it is in a series of prints makes them stand out more when seen as a group as the same style is carried across.

It is being visualised to show how technology has come on and how things have changed regarding data storage and format physical sizes/shapes. When compared it is quite interesting for example when they compare an iPod with a Floppy Disk. Floppy disk could store around 1.5 average mp3 track whereas an iPod, being almost the same size can hold 10,000 tracks.

This is visualising Website Popularity/Hits as a virtual map – looking almost like most common underground/metro maps. They have connected them together in groups arranged by colour and size on popularity.

They have made an interface on the website where is uses an almost like google maps style pan and zoom navigation. They have also made the key interactive so that it automatically navigates to certain parts. So even though the maps isn’t interactive – you almost have to interact with it because it is so big/there is so much data.

I like how much they have included but I think it is slightly overwhelming to look at as a whole, but when broken down it is very effective.

It is being visualised to show the popularity of certain websites (ie Google/Facebook) and you can see how much more popular they are than other sites and how they relate to each other.

This is visualising HTML Data from a page submitted on the site. All of the HTML TAGS that make up the page are used as data.

They are visualised in a tree sort of hierarchical system where you can clearly see how each tag is related to another or nested within each other. Each tag is taken from the pages HTML and then categorized by colour so that you can tell what sort of tag it is. They are then linked in the same order that the page is made up. I think it would be interesting to actually have them visu-alise the opening and closing of the <HTML> tags and the <HEAD> & <BODY> tags.

All of the data is similar, but there are all sorts of tags so each diagram looks different as no one page has the exact same makeup of tags – across one site though you may see trends within the layout of each diagram as they may use the same layout elements in the same order/place.

Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

choosing data

04

I had to decide what data I was going to use for my visu-alisation, my concept was that it could apply to all news statistics, but I need to choose something meaningful and relevant for my proposal or test visualisation.

I started by looking at some data websites and news websites. I found the Guardian’s Data Blog website a helpful tool during the development of my project along with the data.gov.uk website for finding all sorts of pub-lic and government data and statistics to use within my visualisation. They have also implemented a fairly simple API so I could work with the data in a more flexible way and maybe make it more interactive.

GLOBAL DATA SEARCHhttp://www.guardian.co.uk/data/global-development-data/search

WORLD GOVERNMENT DATA SEARCHhttp://www.guardian.co.uk/world-government-data

COINS (GOVERNMENT SPENDINGS)http://coins.guardian.co.uk/coins-explorer/search

A great example of data that I could use to visualise is the data I found about British casualties in Afghanistan since 2002 – Present.

I thought that I would like to use some very current data that would answer my design problem of making peo-ple more aware in different ways of current issues. But after searching I managed to collect some data but it was very hard to find anything concrete and quite a lot of data had massive gaps in the timeline and my visualisa-tion idea would not really work too well if I was missing chunks of data – it would not flow too well. I think as this issue is so current no real statistics apart from death tolls etc have been released. I will keep looking but I am also open to looking into other data I just have to find something which can also be helped by having aware-ness raised.

After not being able to find much data on the Egyptian Demonstrations, and not very solid info as of yet about the student demonstrations in London I decided to look into comparing the amount of Civilian Casualties to

Soldier Casualties in Afghanistan. I may only use this as test data – or at least something to use when proposing the concept in general. I also thought the relationship between these two sets of data was quite interesting – and a bit shocking as well.

I think this area of showing data in a different way and also being able to compare is where there is a big gap within the news – these statistics are normally just brushed across. Almost 200+ civilians die per month in Afghanistan when compared to 5-8 on average soldiers die. However, this is never reported in the news and the main focus is on soldiers dying, when civilians are as or if not more important.

One of my peers in a feedback session did raise a good point that these are fairly sensitive statistics and that I shouldn’t trivialise these statistics at all and very care-ful in the way that I display these as not to offend/upset anybody.

“Question + Visual Data + Context = Story”(Julie Steele)

Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

designing visualisation

05

I then had to start thinking about visual styles for my visualisation and how it would function and the features it would provide. I wanted to take inspiration from ones that I had seen and take some of the best bits from each and combine them together to create a perfect hybrid data visualisator that could visualise almost any statistics in a number of different, interesting ways.

Some of the design features that I suggest are using stacked histograms to display the data and also using sign like symbols to classify what type of data at is or what field you are currently visualising.

Also, I quite like simple styled visuals, like the map be-low. I will define a final visual style once I have decided what the data that I am visualising is. For the time being I will just propose my idea and present some rough visuals.

Sign imagarySimple map visuals

Chris Brown | DIGITAL MEDIA DESIGNER self directed brief - data visualisation

OUTCOME/EVALUATION

06

My outcome was my proposed data visualisation concept of a data visualisation that would work for all different types of news statistics and would work almost live with the latest statistics.

For the moment I just went with the placement statistics of the death toll of soldiers in Afghanistan and would use the statistics of Age, Gender, Cause of Death, Place of Death and Date/Time of Death.

I started playing with Processing to create a basic mock up version of the visualisation. I created 2 versions, one that scrolls through the months between 2002-2011 and displays the casualty toll in the centre of the screen. I think this is quite powerful and a bit haunting too. It is a start though and I can see that this is definitely something I could see through to being a complete polished product. I also made another version that streams live data from the net so I can update the program live. It is good to know that this is possible too.

I didn’t want to land on any real specific visual style as it needed to fit all sorts of data, or a specific set and I knew neither, so I was just focusing more on the functionality side at this stage.

If I had more time to do this project I would definitely finish the visualisation and spend more time developing a look and feel as this plays a huge role in representing the data. I think my proposal is a success and I don’t think there is anything out there currently that does

what I am suggesting in the way I want it to. I will finish it off in my spare time for sure, I am extremely moti-vated to get it finished, it is just extremely time consum-ing and as in the projects deadlines I spent around 3/4 of the time looking for what data I was going to use as I initially wanted it to be a one off comparison between a certain set of data but the data was very hard to come by, so next time I would collect the data myself, use dif-ferent or live data.