Front to back

Two flowsters, Ofer Deshe and Simon Johnson, dug out these two fine blog posts and sent them to me.
The five worst website designs in the world

Ten futuristic user interfaces

What I take from this:

• The web on a computer is old, flat and slow.  But still incredibly useful.
• When you ask cutting edge design teams to create interfaces, you get discernably better results.
• The value that good design brings to a business couldn't be clearer.

Facebook's homepage moves more of the navigation to the right - a signal that the convention of left navigation bars is shifting.

Facebook's welcome page - lots of functionality has moved to the right.

When I first saw a left hand navbar in 1995, I was amazed at the idea of dividing the page up into zones, and dedicating one of them to this cryptic concept called "navigation". I never stopped to wonder whether putting it on the left was a good idea. Fundamentally, I don't think it is.

Left to right

In the west, we read from left to right. Eye tracking studies generally indicate the the top left area of the page is the place where everyone looks. But when we arrive on a page, we first want to assess if it brings us closer to our goal. Getting closer to our goals makes us happy. So content, not navigation should go in the prime, left-side spot.

At worst, a navbar says "Are you sure you wanted to be on this page? Why not try a different one?" And because it is there on every page, the question is quite incessant. It's like having the store guide in a department store follow you around on wheels. Or the table of contents appear on every page of a newspaper.

Long left navbars: Do we really need to be able to navigate from anywhere to everywhere else?

Breaking with convention

Mercifully, around 3-4 years ago, left navs started disappearing. Maybe it was eye tracking studies that did it.

Blogs were among the first to shift- the standard templates didn't feature left navs. The changes were a difficult decision for interaction designers. So deep rooted was the left-nav habit, that angst-ridden designers posted on lists asking, "Is it ok to put my nav on the right?"

Some debate ensued. Wasn't convention the most important thing for ease of use? Convention said navbars went on the left. Right was for cross-links, bits and pieces. But a study showed that actually, it didn't make a significant difference. People could complete key tasks with no training with pretty much the same levels of efficiency and effectiveness, with both right and with left navbars.

What we think while we navigate

I like putting the navigation on the right. Here's why. I think people conceptualise their navigation through a website taxonomy like this...

This comes from watching people during a lot of usability tests. If you think about web navigation like that, then right equals forward and left equals backward (just like in a book). People like going forward, making progress towards their goals. So if interaction designers can ensure there is always an interesting place to go forward to, left navigation becomes much less important. You can collapse it into top menus or push it into a rather lovely bottom navbar.
(The other key form of navigation, probably most effective of all, is inline links. But that's another post).

Facebook is moving the emphasis to the right with its redesign. It hasn't given up on the left navbar yet, but I think it will over time, and so will most other websites. Because overall, I think content on the left and onward links on the right suits the way we think.

I'm iteratively prototyping my new room layout at full scale with newspaper.

This is the second time I've tried this and it really works well. You stick sheets of newspaper together to represent the kitchen cabinets or the new sofa or whatever. Then you lay the sheets out in the room itself and see what it's like. Of course, it helps a lot if the room is empty.

Paper prototyping a kitchen to scale with newspaper

It's a very similar process to designing good user experiences. Create a prototype. Simulate use. Discover what works. Iteratively improve.

The motivation is also the same. If I'm going to spend thousands or a new kitchen or a new sofa, I want to be sure I don't end up with an expensive mistake. I want something efficient, comfortable and lovely to live with. Any organisation launching a website should be thinking something similar. "Measure twice, cut once," as the saying goes.

Paper prototyping a a lounge/dining space with newspaper

And what I have learned on both occasions?

• Leave more empty space between the objects
• Make sure there's good flow from one space to the next

Which sounds a lot like interaction design too.

Cape Town's new collaborative T-shirt design website is a really interesting piece of social design.

A couple of weeks ago, Eric Edelstein, the CEO of Springleap asked me to pop by and chat about the user experience strategy for his site.

The idea for the site is simple: Designers submit designs for t-shirts, the community votes on the designs, and the winning t-shirts get printed and made available for to buy on the site. The designers of those shirts get a cash prize and people can come and buy the shirts.

Eric Edelstein and one of Springleap's shirts.

It's similar to Threadless but the community rules and processes are a bit different. And therein lies the challenge. Designing a community that works, and that makes money, is not easy but always interesting.

The number one rule for social design is: deliver personal value to each individual user. That way you'll attract members regardless of how big or small the network is already. When you've attracted members, value will start to emerge from their interactions, and the whole becomes greater than the sum of the parts.

Now: where's the personal value? Designers see value in submitting designs: they might win money, and they will certainly get exposure. And shoppers see value in buying: the shirts are limited editions by talented designers. The tricky part is the getting people to vote. There's no obvious incentive for them to do it.

But people are already voting, and with some planned improvements to the site, they should soon be voting even more. Here are some reasons:

• The designers encourage people to come and vote for them. This means the promotional activity for the site is distributed to the members themselves. That's very scalable.
• People who came to the site as designers or shoppers can be "seduced" into voting. Once they have completed their primary goals, designers want to check out the competition and shoppers want to find new things to buy.
• Voters will earn kudos for voting, and particularly for predicting the winning designs. So if you vote well, you can become a respected design pundit on the site, and get free stuff too.
• Voting will be very very easy. That's a straight usability challenge. Put voting opportunities in attaractive locations, and make the voting process extremely quick.

Getting a Springleap t-shirt is a great customer experience. There's a mini brochure of that month's winning shirts, and a postcard and badge of your chosen design.

It's working so far

There are all sorts of business and community design challenges for Springleap to tackle. But the bottom line is: they're getting designs in, selling t-shirts and doing something amazing. The web gives them world-wide reach, and there's no need to stop at just t-shirts, either.

There's a great vibe in the office, and we had a lot of fun brainstorming ideas. But the best thing about my visit: they paid me in T-shirts!