Data visualisation in user experience design

by Nathanael Boehm on 22 November, 2009

Whilst a technique that requires significant graphic design and sometimes mathematical talent to implement, data visualisation can significantly increase data accessibility and comprehensibility.

Experience design is about creating an environment where people who interact with an interface – be it of a product, service or community – will feel they’ve had a positive experience where they feel like an interface speaks their language and is there to help them in finding out information or completing tasks.

When this comes to exposing users to data this can be quite difficult to achieve because many people don’t cope well with lots of numbers. Where possible data should be converted and translated to information – conclusions that we make about data on behalf of the user to save them the hard work. Unfortunately such translation can bias the information or hide trends and alternative translations.

This is where data visualisation comes in. Data visualisation is a way of presenting data that makes it easier for people to extract information.

Sample data table of web browser usage statsTake this example of web browsers people use to access my blog with:

Now we have some options when it comes to displaying this data. The first option is that we could display this table of data as is; let people read through all the browsers, all the stats, hold those in their head and then figure out what to make of it. At least I’ve arranged the table by numbers of users in descending order.

This takes time and is only suited to a certain type of person. If your user research says that your primary persona is someone who works well with raw data then by all means give them the raw data.

The second option is that we can translate this data for them. We can look at those numbers and say that Firefox is the leading browser and that Opera only accounts for 1.5% of traffic to my blog – and with such a negligible number we can forget about Opera users. We can present that as information and hide the raw data … thus users will never know that 1.5% translates to roughly 30 users per month who may or may not be able to use this site because we’ve now decided they’re not worth worrying about. 3o people! Could be potential customers in there.

Now, when it comes to data visualisation and infographics there is certainly scope to still bias the results and influence how people interpret the data. Deciding what format to use is a combination of branding, user experience, business objectives and ethics.

If the purpose of this data visualisation is to make sure people don’t forget about the one percent’ers of our userbase then they emphasis will be on augmenting the representation of the minority groups without affecting the integrity of the data. A simple pie chart graph will not achieve this as 1% on a pie chart will be a slice only 3.6 degrees wide. A logarithmic graph would probably be better, perhaps using icons of people to enforce the fact there are real people behind those statistics; just as an example of where symbols come into play.

Some examples

How Safe is the HPV vaccine?Now I’m not a graphic designer so I’m not even going to attempt and draw you an example of a professional infographic but have at look at this graphic How safe is the HPV vaccine? at Information is Beautiful. It’s simple but puts things in context and helps visualise big numbers which at the time was necessary to fight media hype about the alleged risk of death associated with the vaccine.

Apart from generally being fun or interesting to look at, data visualisation plays an important part in user experience design in terms of providing access to information, increasing confidence in that information, giving people the tools they need to make decisions and reducing cognitive excise. It helps leverage metaphors and schemas, existing knowledge and symbols to make data more consumable and actionable. With a plain data table like my original example there is no scope for drawing upon other resources like this.

Data visualisations are also great for geospatial data. A-Z lists of countries, while orderly, don’t really mean anything. But when numbers are plotted on a map then it can be easier to scan and absorb that information as well as identify your own trends. This map from GOOD shows the number of passports issued by state in the US. Another map example is the abortion laws by country also by GOOD, where the colour brightness used shows the “severity” of the laws, making it easier to interpret the map (rather than some arbitrary colour scheme) and the map helps identify the clusters of countries with strict abortion laws. While it might be simpler to say “South America, Africa, Middle East, South and South-East Asia” that would in fact be incorrect in this case so infographics can help simplify whilst still exposing the real underlying data and maintaining that data integrity. You can quickly scan and within seconds get the general sense but could also spend quite some time with the graph. We use a similar technique with written information using the inverted pyramid – start off with general conclusions so people get a quick sense for the content and then if they have time and interest they can “drill down” into the detail. Same goes for infographics; if people just want to look at the size comparison of circles or colours on a map that’s fine, but also provide for those who want to get into the numbers, relationships and trend analysis.

For anyone who’s played the boardgame Risk I’m sure you can relate to how difficult it would be to play the game without the map.

So hopefully that’s given you some idea of where data visualisation fits in with user experience design as a tool and technique that should be considered when dealing with data – however care needs to be taken because to apply this technique badly could be confusing or worse, unethical.

Finally, have at look at Inspired Magazine’s 20 Essential Infographics & Data Visualization Blogs.

Post to Twitter Post to Delicious Post to Facebook

// purecaffeine.com is a user interaction and UX design, social media and Government 2.0 blog run by professional Canberra, Australia web user interaction designer Nathanael Boehm, licensed under a Creative Commons Attribution-Noncommercial-Share Alike 2.5 Australia License.

Related posts:

{ 1 comment… read it below or add one }

Blog Header Guy 2 December, 2009 at 12:05 am

I appreciate the effort that went into this informative article. And anyone that begins a blog post using the word “Whilst” is automatically a friend. :)

I look forward to seeing more.

Roy

Reply

Leave a Comment

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Previous post:

Next post: