Changing Web Navigation Metaphors - the mobile paradigm

Old School - Orientation, Information Scent and Maps.


4/22/20137 min read

Or, the web at the speed of I don't give a shit

I can't remember where I saw this stat but it says that 70% of online activity is about discovering you're in the wrong place. Surely that must have come from Peter Morville's classic on wayfinding, or his book on IA for the web? Whatever, it feels about right. So the thinking goes if you are effectively lost 70% of the time then you need a good map. You to know where you are. You need, like a good scout, to orient yourself to the landscape with the help of a map and make an objective decision about where to go next.

Consequently we spent a lof of time giving you tons of maps. We showed you where you were in the navigation tree no matter how deep you got. We gave you breadcrumbs as well, and color-coding and top nav and footer nav and related fan and facets. We gave you the lot.

Now assuming we can couple that with some serious user story or task prioritisation and a web manager with a gift for guiding content edits past stakeholders, this can work.

It can also lead to an unholy mess, with the designers sitting looking at user tests of their carefully planned sites with their heads in their hands; "The signs are there!" they said, "If only people would stop and look at them!"

The assumption is that web users are rational beings - as rational as the IA's who came up with the sites - who keep their best intellectual rigour and energy for the task of finding their way around your website.

The Bad News

You know what I am about to say right?

There are few (or no) rational web site users. If they start rational then 15 seconds after waiting for your page to load and not getting what they want they deform into stress monsters and start to hate you. Or the site, which pretty much amounts to the same thing.

Where did it go so horribly wrong?

It’s the Metaphor, stupid.

A little metaphor can be a dangerous thing. You can work from them for years without questioning them and they can take you strange places, the kind of place where you keep believing something even if it doesn't work. And even it that approach of throwing maps at the screen worked a little on the desktop it's totally doomed to failure on mobile.

So what's the problem? Is it the scent of information? Is it the map? Is it having too many cues and not enough territory?

Several places; lets start with the Scent of Information. Great research. But it's too slow a metaphor. It evokes sniffing and to sniff well you have to be moving slowly. The problem is your average web user isn't delicately sensing the terrior in their Merlot online, they are running, no SPRINTING. All the time.

I call this the speed of 'I don't give a shit'.

Find. Compare. Rate. Tweet. Move on. That's how you use the web, so why do you expect anyone else to use your site in another mode? You can't.

Which brings us to another problem. Maps. Have you tried to read a map when you are running? Not effective. You have to STOP to use a map and do you know what? Most web user just won't stop. They will pause briefly at Google and render all your careful work irrelevant. Brutal isn't it? Who'd be a designer?

New School- Velocity Design

So, we have to speed up. We have to design thinking fast. We spend so long at wireframes and sketching out pages in detail that we fail to account for momentum. An we doubly fail to design for the joy of momentum, and the delirium of momentum - what French cultural critic Paul Virillio calls 'dromoscopy'.

Here's another metaphor to swap out your old one with. Yes, this is dangerous, you could get just as trapped in this one. It's a risky business this.

Jump in your car and sit behind the wheel. If, like me, you think the thing is way too fast and a blow to the planet, I humbly ask you to keep that feeling for another day. What's the first thing you do? What's the thing you couldn't do ten years ago when driving?

That's it, punch that destination into your SatNav or Phone and hit 'Start.' Now put on your favourite music and proceed at the posted speed limit, to the first corner.

Are you looking at a map? This close to home you're probably just listening for that voice. 'At the next intersection take the second left'. You're not even looking, the navigational aid is just a nudge, a aid to memory as you've been here before, many times.

Lets take you a hundred miles away, onto roads to don't know, searching for an address of that guy who sold you that great thing on ebay you couldn't live without last week but now are struggling to recall what it even was. Now you are paying more attention to the SatNav, you're probably scanning the 3D representation of the road network which has that green line on it. Still, everything is OK.

Then, suddenly, boom. You're lost. The satnav seems to have taken you the wrong way. All the cues are out of line. She's telling you to so a U-turn but you are pretty sure that she is wrong. She's never wrong, but you think she must be because your systems are overwhelmed and when that happens you believe you are right and will select the smallest detail to prove to yourself that this is the case. Yes, I am talking to you, men. Confirmation bias.

So you get tied up in knots and in the end you have to pull over. Admit defeat. And then you look at the map on your phone but that's just not big enough so you, wait for it, get the map out. If you have one that is. If you're that old. And then, by referencing backwards and forwards between map and the picture on the SatNav you admit that she knew better all along, your 3D maps all line back up and off you go again.

That is contemporary navigation. You will go a lot further before you reach for the map and 99% of the time you simply don't need it. You need the barest of signage, you just need the little voice of certainty and the green line.

So as designers what do we have to do? Get rid of the map (until it's really needed). Be the voice. Be the green line. Know their likely direction of travel before they do and get them there as quickly as possible.

WebNav is SatNav

I can hear the objection: Of course it would be great if we all had a little voice in our head telling us where to go next, but we don't really know where they are going do we? There is no green line. There is no voice.

Well I disagree. You are the voice and your language is design cues. You know what the green lines will be, for the most part, if you start looking for them. If you can find the discipline (and the client with the discipline) you can strip back to essences and your site will be much better for it. What you have to do is provide the minimum assurance that the direction of travel is correct - and that the journey is worthwhile. Guidance and Motivation, not information and navigation. Even the term 'Information Architecture' gives me the creeps these days - and I used to LOVE it. You have to drop the whole idea of the map as orientation tool. You need two things: signage that provides forward momentum and a way to step back (a guided undo). You might optionally provide some kind of overview, a zoom out.

And that's it.

Surely this is ok for a small site I can hear you thinking, but what about a big site, with real navigational issues? Well yes, if you're the BBC you have to get into that game, and then the overview is a need rather than a option, but that's about it.

Well lets look at some examples from one of Europe's most interesting agencies, Fabrique in the Netherlands. Here are four cultural sites they have done in the last four years, each one a jewel.

The Reijsksmuseum. Mobile first, super efficient and still manages to contain 400,000 images. Also note the way shop and ticketing is intergarted - not a step out of place.

  • Van Gogh Museum - particularly on mobile. Direct yet characterful.

  • Design Museum London - total control. Take a tour through 'Design and designers section, lovely.

  • National Military Museum of the Netherlands - a site so good you can get around it in dutch.

We get this. We carefully profile our users to develop personsae that we can design to. I don't have any argument with that, good job. But we need to take it two steps further.

Step one: Develop Site Personas

The first is to be really brave and write yourself a persona of your site as it is now. Take a step back and try to see your site with antropomorhic eyes (your users do this). Does that theme you downloaded look like a cheap suit? Does that clip art make you look like you are wearing an old tie, or your dads. How about the writing, do you sound like a salesperson? Like a cold caller with your 'optimised solutions' and 'unique personalisation'.

Go the whole way, give them an age, where they live, occupation, car they drive, their family profile, hobbies and dark secrets.

## Get it?

Ok, so that last one is a bit cheesy, but you get the idea. The site persona which includes look, language, behaviour, has to match up with the user and their expectations and experience.

So here is the challenge for you:

  • The first thing - write out the dialogue with a key persona for your site as it is now.

  • Pick out a competitor, write it all out and see how they do it

  • Write out a couple of ideal scenarios and use them to see how far away you are - what do you need to do to bridge the gap bewteen what you have and where yuo want to be?

You can use these plays, sorry NEMs in the same way that Agile developers use 'Story cards', as a reference to test and develop against. Of course you need to wrap it all up with ROI and really know what your business is, but this humanising of the user experience is what it's all about. Get them into the circle of trust, and once they are there treat them like your sites friend.

## Advanced technique

We know that showing clips of your user tests to Managers is a guaranteed way of rasing money for a UX project right? That's because we are turning them into the audience for this dialogue between the user persona (that tricky combination of want, thriftiness, lack of time and innate suspicion)and site personas (look, voice, behaviour).

So the next thing is to dramatise your Narrative Experience Maps. Unearth a thesp or two at work and do them in a presentation or as a video to make a point. Yes, you will need to be comfortable with your position at work before you do that, but it will get your point across better than a paper. Aren't we sick of papers?! Wasn't this meant to be productive fun?