Tag Archives: usability

Persuasive Design Patterns

The Design with Intent toolkit is a guide to help you design systems to influence a user’s behaviour. The author, Dan Lockton, has subtitled the toolkit 101 Patterns for Influencing Behaviour Through Design.

Categorised into the following eight ‘lenses’ (ways to look at design and behaviour) the toolkit proves to be a fantastic resource for helping you persuade through design.

  • Architectural (e.g. Segmentation and Spacing: Can you divide your system up into parts, so people only use one bit at a time?)
  • Errorproofing (previously) (e.g. Choice Editing: Can you edit the choices presented to users so only the ones ou want them to have are available?)
  • Interaction (e.g. Partial Completion: Can you show that the first stage of a process has been completed already, to give users confidence to do the next?)
  • Ludic (e.g. Unpredictable Rreinforcement: What happens if you give rewards or feedback on an unpredictable schedule, so users keep playing or interacting?)
  • Perceptual (e.g. Fake Affordances: Is there anything to be gained from making something look like it works one way, while actually doing something else (or nothing at all)?)
  • Cognitive (e.g. Social Proof: Can you show people what other users like them are doing in this situation, and which choices are most popular?)
  • Machiavellian (e.g. Anchoring: Can you affect users’ expectations or assumptions by controlling the reference points they have?)
  • Security (e.g. Peerveillance: What happens if users know (or believe) that what they’re doing is visible to their peers also using the system?)

From the introduction to v0.9 of the toolkit:

You have a product, service or environment—a system—where users’ behaviour is important to it working properly (safely, efficiently), so ideally you’d like people to use it in a certain way.

Or maybe you have a system where it would be desirable to alter the way that people use it, to improve things for users, the people around them, or society as a whole.

How can you modify the design, or redesign the system, to achieve this: to influence, or change users’ behaviour?

Web Design Research Results

Some of the more enlightening/worthwhile results from a number of studies on design and usability conducted by Smashing Magazine, found via their otherwise-ordinary 10 Useful Usability Findings and Guidelines article:

General design decisions taken by the top 50 blogs (part two):

  • 92% use a fixed width layout with 56% varying the width between 951 and 1000px.
  • For body text, 90% use Verdana, Lucida Grande, Arial or Georgia with 78% using a font size between 12 and 14px.
  • Headlines are typically Arial or Georgia (52%), with a font size between 17 and 25px.
  • The front page presents excerpts of 10-20 posts in 62% of cases.
  • 50% offer links to related and/or popular posts.
  • 90% of footers contain copyright information, 40% contain links to About pages and 30% to contact information.
  • 76% provide ad-free articles.
  • 54% provide social icons under the post.
  • 66% display RSS buttons above the main layout area, while a similar percentage use the ‘standard’ RSS icon (as opposed to a text link) and employ only one RSS feed.
  • Only 5 blogs use tag clouds (10%) and 11 (22%) use pagination.
  • Nobody cares about standards (only 2 conform).

A study of the typography used on the top 50 blogs touched on some of the above and then went into more detail:

  • Sans-serif fonts are more popular for both headlines and body copy (although not by a large margin).
  • Headlines: Georgia, Arial or Helvetica between 18 and 29 pixels.
  • Body copy: Georgia, Arial, Verdana or Lucida Grande between 12 and 14 pixels.
  • Header font size ÷ Body copy font size = 1.96.
  • Line height (pixels) ÷ body copy font size (pixels) = 1.48.
  • Line length (pixels) ÷ line height (pixels) = 27.8.
  • Space between paragraphs (pixels) ÷ line height (pixels) = 0.754.
  • Optimal number of characters per line: between 55–75 (although 75–85 is more popular).
  • Body text is left-aligned, image replacement is rarely used and links are either underlined or highlighted with bold or color.

100 unspecified sites were used for this analysis of web form structure and design (part two):

  • 93% use single-page sign-up forms.
  • 41% of sites attract visitors by explaining the benefits of registration.
  • Vertically arranged fields are preferred to horizontally arranged fields (86%).
  • 82% of sites don’t ask for e-mail confirmation, although 72% required password confirmation.
  • Only 45% of sites used the thank-you message to motivate users to proceed with exploring the services of the site.

The New Rules of The Fold

In 1996, while discussing the importance of the inverted pyramid style of writing, usability expert Jakob Nielsen wrote that “users don’t scroll”. From there the idea of The Fold as an integral part of web design came into being.

But, as Nielsen himself has said, the Internet has evolved and “as users got more experience with scrolling pages, many of them started scrolling”. That’s not to say that the fold is no longer of any importance, just that the rules have changed.

Looking at eye tracking data—the current gold standard for design and usability testing—design agency cxpartners has come up with some new rules (with examples) for dealing with the fold in web design:

  1. Less is more – don’t be tempted to cram everything above the fold. Good use of whitespace and imagery encourages exploration.
  2. Stark, horizontal lines discourage scrolling – this doesn’t mean stop using horizontal full width elements. Have a small amount of content just visible, poking up above the fold to encourage scrolling.
  3. Avoid the use of in-page scroll bars – the browser scrollbar is an indicator of the amount of content on the page. iFrames and other elements with scroll bars in the page can break this convention and may lead to content not being seen.

Jeff Attwood of Coding Horror looks at how this advice can actually be applied.

It’s not only a basic rule of writing, it’s also a basic rule of the web: put the most important content at as close to the top of the page as you can. This isn’t new advice, but it’s so important that it never hurts to revisit it periodically in your own designs.

In treating user myopia, it’s not enough to place important stuff directly in the user’s eyepoint. You also need to ensure that you’ve placed the absolute most important stuff at the top of the page — and haven’t created any accidental barriers to scrolling, so they can find the rest of it. The fold is far less important than it used to be, but it isn’t quite as mythical as Bigfoot and the Loch Ness Monster quite yet.

Text as UI (On Twitter)

Putting me in mind of Dustin Curtis’ multivariate ‘split’ testing to increase click-through rates to his Twitter profile (previously), Jakob Nielsen discusses his iterative design process for a Twitter message advertising his latest usability conference.

The message went from,

Announcing LAS VEGAS and BERLIN as the venues for our biggest usability conference of the year http://bit.ly/UsabilityWeek


LAS VEGAS (October) and BERLIN (November): venues for our biggest usability conference ever http://bit.ly/UsabilityWeek

I am by no means a high-output Twitter user and I dislike ‘How to Twitter’ articles with a passion. Nielsen’s latest I quite like because he notes that, in the case of Twitter and other micro-blogging services, text is a form of UI in itself.

It’s a common mistake to think that only full-fledged graphical user interfaces count as interaction design and deserve usability attention. As our earlier research has shown, URLs and email both contribute strongly to the Internet user experience and thus require close attention to usability to enhance the profitability of a company’s Internet efforts.

The shorter it is, the more important it is to design text for usability.

Apple’s Strategy: The Good and Bad

The four major issues with Apple’s current product line and strategy that are “stifling the industry, consumer choice and pricing”, according to Jason Calacanis:

  1. Destroying MP3 player innovation through anti-competitive practices.
  2. Monopolistic practices in telecommunications.
  3. Draconian App Store policies.
  4. Wanting to own almost every extension of the iPhone platform.

It’s tough to disagree with these points (or Jason’s reasoning) but a typical response could be:

The restrictions Apple places on its products are necessary to ensure the quality of the user experience, that Apple deserves to be paid for the innovations it has brought to the marketplace and the consumer freedom it has enabled to use things like the mobile internet, to make online music easy and fun to use etc.

Both of the above articles are anti-Apple (or at least anti-Apple strategy) and I agree with them both—but my stance is definitely that of pro-Apple (a recent development since owning an iPhone, swiftly followed by a Hackintosh).

The ROI I get with Apple products is positive despite these issues and as such I’m willing to pay a premium. This isn’t a financial ROI, but a time/enjoyment ROI. For an idea of what I mean, this short tirade against open source usability from an article looking at how to compete with open source software (via @zambonini) may help:

At a salaried job making $80k plus benefits your time is worth around $55/hour. […] And thus it is with the majority of open source software:

Open source software is free if your time is worth nothing.

[…] I’ve used mainstream image editors like Photoshop, Paint.NET and Gimp; some of my best friends are mainstream image editors. And when I saw Gimp I almost went blind. Children were weeping; fruit was bruising. The UI could kill small animals.

Are there exceptions in the open source world? Absolutely.

When an open source project gets enough talented people working on it, it can become a downright masterpiece.

In UI and UX terms the majority of open source applications are behind or on par with PC-based software. These are then both behind Mac-only applications. There are exceptions, of course, but they’re exactly that—exceptions.

Granted; there are unnecessary and debilitating restrictions on Apple products, and when these restrictions make product use cumbersome I’ll switch in a heartbeat. But it seems that these restrictions are part of a larger strategy: to build the best user experience.

This, from a TechCrunch article looking at Apple’s strategy:

“Our goal is not to build the most computers. It’s to build the best.”

That was Apple COO Tim Cook two days ago during Apple’s quarterly earnings call. Sure, it may sound like spin from an executive who doesn’t have a better answer as to why Apple isn’t competing in the low-end of the market, and thus, gaining market share. But it’s not.

You need look no further than numbers released today by NPD to understand Apple’s strategy. Its revenue share of the “premium” price market — that is, computers over $1,000 — is a staggering 91%.