Infographics Rant

I am sick of infographics.

There I said it.

So what is an infographic? Wikipedia gives this definition;

Information graphics or infographics are graphic visual representations of information, data or knowledge. These graphics present complex information quickly and clearly, such as in signs, maps, journalism, technical writing, and education. With an information graphic, computer scientists, mathematicians, and statisticians develop and communicate concepts using a single symbol to process information.

There are infographics that are useful, the stylised subway maps are much easier to use than a true and accurate map would be. They are also fantastic for visualising huge amounts of data, it would take volumes to convey the information that Hans Rosling gets across in his data visualisations. Here’s his explanation of improving health in history, but all his videos are fascinating.

Recently there has been a fashion for infographics, and there is now a plethora of infographics on every conceivable subject;

Social media seems to be a particularly fertile ground for infographics, with 29 million results for the search query “infographics social media” which is about 10 million more than for “infographics” alone. Here’s a selection from pinterest.

The use of infographics is spreading and some are now thinly disguised advertising material including the most pointless graphic I’ve found (so far) is the “what your luggage says about you” one. Which offers the startling conclusion that a woman with a stroller is a multi-tasking mum, someone with carry-on is on business, and someone with a backpack is not.

There are too many pointless infographics out there, ones that;

  • use very long images that require you to scroll to the bottom of the page,
  • that present data in rather suspect ways such as 3D bar graphs
  • make rather dodgy connections between data sets
  • present information that could as easily been presented in a single paragraph or a short list
  • one last complaint – what’s with the use of retro styling?

Just before I got completely fed up with infographics I found a fabulous selection of infographics that specifically mock infographics. Very meta, very 2012.

 

image infographics

Design Fail

About 4 website generations ago, ie; circa 2006, there was a fashion in design of internet sites to disguise the website’s navigation in an image, with the navigation text only revealed on mouse over. A style named “Mystery Meat Navigation” by Vincent Flanders who has preserved some extreme examples on his aptly named “Web Pages That Suck” site.

It was bad, impossible to use from the user’s perspective, like having blank signs on the motorway. Thankfully the fashion died.

Well almost. It still turns up on particularly arty sites (bands and photographers apparently), and a ghost of that fashion came back to haunt me recently – a very small site, that provides mostly text-based information. Their home page was designed at great expense as an image, to be fair there were a few visual clues within the image, but it was only by mousing over that you could really “find” all the navigation. Once you clicked you were into a text-universe with no navigation – other than your browser’s back button.

I could have cried.

I tried to persuade the web-manager not to launch the site as is; to re-design the home page and sort out the navigation. I offered to help her figure it out.

She gave me two reasons for going ahead with the launch;

  1. They’d already spent a lot of money getting it designed and they didn’t have money to start over.
  2. Their manager liked it.

Both of those are incredibly bad reasons to proceed with a website launch when your precious new design is not user-friendly.

One of the key principles for designing usable websites is to tell people what they’re getting before they click. As Steve Krug points out in his utterly brilliant book “Don’t make me think”, we keep designing websites as if people read all the information, but people assess our website as if there were driving past a billboard at 100km/hr.

(I’m paraphrasing, I lent my copy of “Don’t make me think” to someone who obviously needs it – it’s never come back.)

Image Blank sign showing the old route of Hwy 55 into Downtown Mpls /Andrew Munsch/ CC BY-NC 2.0

Dutch Design; Cycling Style

Two of the things I like about living in Amsterdam; cycling everywhere, and Dutch pragmatism. Both are combined in latest bike design from VANMOOF.

VANMOOF design for urban cyclists, so their bikes are sturdy, but light and stylish. It’s dark here at 4pm in winter so the lights are built in and there’s a dynamo integrated into the bike. Bike theft is the most common crime here, so there’s a built in lock – one that comes out of the frame. I’ve noticed their distinctive design around town but didn’t know what they were until recently.

The design is so good it’s won awards.

The interesting thing about this company is they’re trying to design new products with genuine co-creation, take a look at their facebook page – they are always asking for feedback at every step of the process. They’re heading for 7,000 likes, and the community is submitting photos and stories of their VANMOOF bikes from all around the world.

Not only have I “liked” their facebook page, I want one of their bikes!

(Disclaimer – no of course they didn’t pay me to write this).

Postcript is…

A brief postscript to my “Design is…” post from a couple of weeks ago.

I used the design ideas from Presentation Zen to give a speech, a speech that needed to use visual aids at Toastmasters.

Toastmasters is a club that focuses on public speaking, and some members of my club are a little allergic to using powerpoint for this project. I was toying with the idea of using fabric samples to illustrate the colour wheel, but when someone in the club said that powerpoint was always awful I decided to rise to the challenge.

Screen Shot 2013-06-16 at 5.26.15 PMI choose “Fear” as my subject, and gave an 8 slide presentation (the speech is 6 minutes) using images to illustrate the various fears we have and our reactions to them. I got positive feedback on the night.

Even better at the following meeting two people came up and said they’d “copied” the concept of my presentation – that is they’d gone for image heavy presentations rather than text and bullet points. I recommended the book and website of Presentation Zen – I really can’t take any credit for the concept but I’m so happy that that others are picking up on it.

Image Claustrophobia I /Laura Lewis/ CC BY 2.0

Design is…

One of the frustrations of being involved in a design process is that every can have an opinion on design, and express it. Having recently heard design dismissed as “aesthetics” (by a non-designer, obviously) I’ve been looking harder at some discussions of design principles.

Common principles include; balance, rhythm, proportion, dominance, unity, negative space, and colour. These are discussed on Digital Web in some detail.

Picture 3I’ve noticed is that there is a lack of understanding of these principles, and almost no understanding of the interplay between the principles. If, for example you change the colour of an element on your site from bright red to pale grey that element will recede. It will no longer be dominant, and your site may look unbalanced as a result.

And in my research I found a lovely discussion on Presentation Zen – a site well worth visiting for design inspiration – about Japanese principles of design. Emphasis is on providing a quietness in design allowing what is essential to be more apparent.

Seijaku (静寂)Tranquility or an energized calm (quite), stillness, solitude. This is related to the feeling you may have when in a Japanese garden. The opposite feeling to one expressed by seijaku would be noise and disturbance. How might we bring a feeling of “active calm” and stillness to ephemeral designs outside the Zen arts?

It’s a quality overlooked in many website designs; we’re often so focussed on impact, or trying to accomodate competing needs on the one page, that this simplicity is lost. I think it’s worth reviewing your designs for what can be REMOVED as well as what more can be added.

Design for Development


IDEO, the award-winning design consultancy with success across multiple industries has created a design process kit free for download.

They’ve called it a Human Centered Design Toolkit and it’s aimed at NGO’s and social enterprise, and it’s developed with the Bill and Melinda Gates Foundation.

They’re arguably the world’s experts in this having worked on design projects in energy, health, education and more recently developed the wonderfully simple kickstart pump which has helped farmers irrigate their land and earn around $37M per year.

The toolkit consists of five guides; introduction, hear, field, create, deliver. Because there can be language barriers making the field research phase the kit includes some visual aspirational cards to ease the discussion. The cards feature images of everything from farming to cities, from money to cowpats; some are shown at left.

The design kit is brilliantly simple, each guide is well set out, with tips on running brainstorm sessions, collecting the ideas and developing them into practical solutions. It helps field workers find solutions that will fit the local situation and economy in developing countries.

But the lessons and process can be applied more widely, and the guides themselves offer inspiration.

Usability in Action; Streets

We respond very well to visual clues on how something should be used, in fact we probably respond more to visual clues than to any other sort of clue

visual_signal

I was reminded of that this week when crossing the road – the one shown in the picture. It’s a little difficult to tell, but it’s a crossing and then a traffic island. On the other side of the traffic island – beyond the bicycles – are tram tracks. You can see it on the google satellite map.

Until recently that traffic island used to be a forest of bicycles and you really had to weave your way through them. It annoyed me, I really wanted to just kick the bicycles out of the way and under a passing tram (for the record I did not do this).

When I went through the city on Thursday I noticed that someone has painted a large white rectangle across the island with an ‘X’ in the centre of it. Marking it a no parking zone, and that’s all it took for cyclists to park their bikes in a way that leaves space for pedestrians.

There’s no sign saying that people may not park there, there’s no indication that the painting on the ground was even done officially, it could have been done by a similarly frustrated pedestrian in the wee hours for all I know.

But I’m fascinated that one visual clue is enough to trigger the mass of cyclists to change their behaviour.

4 Keys to a Great Briefing

Selecting the right company to work with on a creative project can be tricky. If you work in marketing or communications it’s a skill worth developing; you’ll need it for website development, photography assignments, visual identity development and ad campaigns. Any marketing manager will find themselves developing a briefing several times a year, whether it’s part of a selection process or a new assignment with an existing supplier. I think there are four key areas of information that need to be covered in a briefing; context, aspiration, process and logistics.

Help the potential supplier understand who you are. What are your brand values? Describe your brand personality – if that sounds weird describe who your brand would be if it were a person. Who are your customers – how do you want them to describe you?

Provide visual information, existing brochures and websites, brand and/or photography guidelines – even if you’re moving away from that look, it will help the designers understand your company and the legacy.

What is the big idea?

What is the one message you want customers/visitors to get above all else from this project?

Try to inspire the creatives; you could include songs, images, quotes, words that support your aspiration but; resist the temptation to “spell it out”, too much factual detail at this point won’t get the best out of your creatives. You want them to be inspired and creative – not just implement to the limits of your creativity.

Here’s a great presentation on what should be in briefing from the creative’s perspective.

How do you want to work together? This is possibly the most important part of the briefing, but it rarely gets attention – this is partly because it’s very difficult to assess on paper. I treat the whole process as a test for the company; all contact from the moment the brief is sent to the decision date. Easy ways to get disqualified in this period include; not being able to say my company’s name correctly (yes, it happened even after being told how to say it), being rude to anyone you meet from my company during the process (the Richard Branson approach), or wasting my time (yes, it’s happened).

People recognise it when it’s right though, if your team walk out of a briefing with a potential supplier saying things like “they really get us” you’re probably in the right direction.

I look for four things; do they listen, do they build on our ideas, do they do anything extra and do they get my jokes.

The last one might seem frivolous, but if you’ll be working together intensively for a longer period of time it’s important that the relationship is there. Getting each other’s jokes is one sign that you’re on the same wavelength, and that you might enjoy each other’s company.

Possibly the least interesting for the creative – but very important for the account manager to know! Set out who from your side should be the contact person, I recommend a single point of contact if possible. Explain what you expect to be delivered. State what options they have for presenting those deliverables (eg: we sometimes need to be able to email design examples – so I’ll need a standard format file less than 1MB). State the deadline. Are you paying any fee to support their development work – and is the written off against the costs of the successful company? If the briefing is part of an assessment process then explain the criteria for assessment and how (and when!) the decision will be made.

These details are not interesting for a creative person so I usually set them out on a separate page to reduce distraction.

Keep the document short. If you can’t convey what your company is about and what your brand means in under 200 words then perhaps you need to give that more thought before you start an ad campaign.

There will very likely be a group of people round the table when it comes to the decision, two things worth keeping in the front of everyone’s mind are the customer and the aspiration. It can help to name the customer, in our case we called her Iris,  and then the discussion became “would this appeal to Iris?”

What do you think? Do you recognise these as the four most important keys? What else would you suggest?

Design 101; the User’s Perspective

In designing websites, buildings, business cards, kitchens, hospitals and pretty much everything else the user/visitor should be central in the decision making. In our current project to relaunch our corporate site we’ve named the visitor, and decision deadlocks are often broken by asking “What would Iris think?”

Paul Bennett from IDEO takes it further step, and discusses designers really going through the visitor experience.

He covers four broad themes in his talk.

1 A Binding Glimpse of the Bleeding Obvious

Sometimes the right idea is so staring you in the face that you miss it. In the case he gives showing hospital staff footage of the ceiling (as seen by a patient) gave the staff a better understanding of the patient’s experience than any amount of data or any fancy graphical representation would have done.

In our case seeing an analysis of the search terms actually used on our site told us that people visiting were looking for content that’s just not there, and (due to legal and organisational reasons) won’t ever be there. (We’ll solve this with an enterprise search engine, which can search across all company websites. We’re working on it, Shell’s already done it.)

2 Finding Yourself in The Margins

Notice the small things at the edge of the experience, these details make a difference. Look at how people subconsciously design their own experience.

This sort of thinking meant that his team noticed that nurses will often comfort a patient by holding their hand as they go through a diagnosis step – so a two-handed diagnosis-palm-pilot was not going to be a solution. They designed a less sexy device that can be used in one hand.

For us a random email set of a small but cool change. There is a glossary on our site, that covers technical financial terms, it’s good, but it’s probably not enough to help the consumer. A rewrite was already planned. And then I got an email, from someone who missed a term, suggested we add it. So our “Word of the Day” will include the possibility of suggesting a term,  suggesting a definition, and adding your email address so we can tell you when it’s added. It’s a tiny thing, and we’re not expecting a huge response, but it’s something on the margins that invites visitors to engage.

3 Having a Beginner’s Mind

Getting to new design solutions requires that you consciously start as if you know nothing; you need to unlearn.

His example is a project with IKEA, for children’s storage. It’s a cool solution from a kid’s perspective but probably not a solution from a parent’s perspective – and it’s not in the IKEA catalogue as far as I can tell.

Having a new person in our team has helped provide that fresh outside perspective.

4 Pick Battles Big Enough to Matter and Small Enough to Win

His example of this was a lightweight portable water pump, not very designer-y, but incredibly practical for the African communities it was designed for, and went on to get on to win design awards.

image design