Numiko, an award winning Leeds based digital creative agency

Neil and I went down to @Media in London for Thursday and Friday. And it was good, despite the slightly weird hotel we stayed in, complete with paintings of slightly scary naked women in the hall.  At the conference, meanwhile, there was a good line-up of people to present or speak on panels, and between us we saw quite a few really interesting presentations.  And my feeling that all presentations sould contain at least one lolcat were reaffirmed.  Read all about it below the fold.

Jeff Veen – Designing Our Way Through Data

First thing on Thursday was Jeff Veen, recently of Google, doing a talk called ‘Designing Our Way Through Data’.  Jeff gave a fascinating talk about the history of data visualisation (much more interesting than it sounds!) and how to present data in a useful, meaningful way that was immediately useful to users.

Early on he talked about a set of data about rainfall in a few different US cities.  This data started out as a few rows of numbers, and, as Jeff pointed out, was next to useless, with no descriptions or way of working through the data.  First, he added labels to the axes, which meant that everyone looking on could interpret what he was showing them, and went on to illustrate how some simple styles (font sizes, emboldening text) could make things even clearer.  Next, he overlaid each cell of the table with a colour, from white to blue, representing the number in the cell visually.  All the way through the presentation he talked about finding the story in data, and that was exactly what this did – instantly, you could see and understand the patterns of rainfall in a particular city, or even across the US, in a way that you couldn’t without the colours (at least, not without some time and effort).  He even went one step further and replaced the number completely with different size raindrops, and admitted that for some people this would be a step too far; it’s one thing presenting data in a visual, immediate way, but another to do it in such a way that your visualisation actually obscures the data you’re trying to present.

Jeff went on to show a few examples from the history of data visualisation.  John Snow’s (not the newsreader) mapping of water pumps and cholera victims was described by Jeff as not only one of the first times political policy was affected by a scientific finding, but also one of the first data mash-ups…

He showed Charles Joseph Minard’s carte figurative that depicts Napoleon’s army on its way to Moscow and back.  This diagram is fascinating – it simultaneously tells a story concerning time, location, geography, troop numbers and temperature – and, more importantly, it does actually tell a story.  You can follow the narrative in the graph from beginning to end, all the while easily understanding how each factor interacts with the others.  On his blog, Jeff says, “I really like how this idea of making something visually apparent while reducing intellectual work – a sort of cognitive ergonomics. Minard was suggesting that stories and meaning can be found in any collection of data. It’s up to us to uncover those stories and tell them clearly and accurately.”

 I think the phrase cognitive ergonomics sums up what Jeff’s talk was all about: clearly and accurately representing data in a way that people can see and immediately understand.  He called it a ‘don’t make me think’ approach.  While I’m not sure I totally agree with the sentiment of this, it’s clear that there are a lot of situations that need, or could be improved by, this user-centered approach and clarity of expression…

Indy Young -Mental Models

Next up was Indi Young talking about Mental Models.  Mental Models is a technique for planning/designing projects that helps to define, understand and accommodate your users’ wants and needs.  It’s kind of hard to explain without a diagram – so here’s one Indi mentioned during her talk.  It’s a slightly random example that’s about what cats want, rather than users/consumers, but as a visual aid it’ll do fine.  This is the kind of thing you end up with when you’ve made a mental model, whether it’s on a screen or made of post-its and spread all over a wall.

Each item above the horizontal line is a thought, emotion, behaviour or philosophy gleaned from interviews and other customer/user research.  These are grouped into mental spaces, separated by the vertical lines, each of which represents an aim like ‘make sure humans pay me proper attention’ or ‘nap in warm, comfy spot’.  Under the horizontal line are the things that support those behaviours and aims, eg ‘cat-activated heating pad in every piece of furniture’.

Mental models give you a way to separate out and organise all the various desires and emotional responses from user research and map those against existing support structures, then quickly and easily identify areas that need improvement.  For example, an area with lots of items above the line but none below the line is likely to be an area that causes a lot of frustration to your users – they have a lot of feelings and aims but no mechanisms to act on them.  This lets you align more closely what you do, or what you want to do, with what your customers/users need.

Indi made a few interesting points, that should apply equally to any work like this: the focus should be on customers, not internal categories or sections; you should use language that your customers use, not internal, technical or management jargon…

As another tool in the research box this seems like it could be really helpful to us– it was a good talk to follow on from Jeff Veen – an interesting new way of examining research data and matching it against what you need to be doing, to get from vague, emotional research to ‘actionable data’ (bleh).

Andy Clark – Underpants Over My Trousers

Andy Clarke did a really interesting talk called ‘Underpants Over My Trousers’ in which he asked, and suggested, what kind of inspiration we could draw from superheroes, and comics in particular. He started by looking at the differences between comic books and web design – in particular the interpolation that takes place between frames in a comic.  The reader doesn’t see everything that happens; they can’t – so they have to fill in the gaps themselves.  Sometimes, the most important thing in a comic is what happens between the frames – something that’s never actually seen…  This ‘making the reader think’ attitude is the complete opposite of the approach pushed by Jeff Veen that morning – the ‘don’t make me think’ attitude.  He wanted to get people to bring this sense of narrative and adventure back to web design.

In comics, structure, size and position of frames are chosen according to how much time the artist wants the reader to spend looking at them.  Frames that have a lot of detail, or that need to make a big impact, are generally larger than frames that convey a sense of speed or passing detail.  In web design, areas are usually shaped by the content that they’re going to hold, no more – a small amount of content means a small area, and the same for large amounts.  In comics, when the artist needs to emphasise the contents of a certain frame, they allow it to burst out of the confines of the frame, or even remove the surrounding frame altogether…  Near the end of the Watchmen series, one of the largest frames was blank – it had no content, but the size and position in the story meant that, for the reader, that one blank frame signified a huge, important event in the narrative of the comic.  Anyone who knows anything about web design knows the value of white space, but this was an interesting way of looking at things that turned a lot of conventions on their heads, and was definitely something to think about.

He moved through the grid layouts of comics like Watchmen and Concrete, explaining how the layout, images and text, especially speech bubbles, served to draw the reader through the (sometimes potentially confusing) narrative, leading their eye from frame to frame or place to place in the right order.  He also showed a few examples of how this could be applied to web design in a practical way, using headings, text colour and images to guide the user through large pages with lots of content, to provide conscious and unconscious clues to readers/users.

Towards the end, Andy even started to make a plea on behalf of splash pages, which he argued had been over-used and abused, and could, in fact, play a useful role in our designs.  The crowd didn’t seem so sure, but Andy put up a good fight and had some interesting examples to show, like a splash he’d designed for a newspaper that presented the big stories of the day using the comic-style principles he’d talked about.

All in all, another very entertaining and interesting talk from Andy, someone who’s always worth a listen.  Nice to hear someone with an opposite opinion to the seemingly-prevailing ‘don’t make me think’ argument as well – obviously there are times and places for both schools of thought, but it seems that there’s a bit of a dearth of sites that credit the user with a bit of patience and intelligence…

I’ll be writing up the other people we saw when I’ve got time…