August 31st, 2009
Posted by Cam Beck

Dog Sniff

Contrary to our dearest wishes, people generally don’t come to our websites just to “click around” and see what’s there. They’re on a mission to find or do something – either specifically or vaguely defined. Information scent is that which sets expectations for their ability to find or do it.

It is a brand’s promise to them that they can find or do what the object or labels represent.

The good news is that, for savvy and diligent brands, this is a great opportunity to set high expectations and exceed them – thus, building a strong brand reputation.

The bad news is that, without proper planning, it’s unlikely to happen on its own. Brands, Web designers, and experience planners need to know the principles that will enable them to build strong brands by generating a strong information scent and delivering on the expectations they set.

What is information scent?

instruction(Nerd alert: Instruction of theory follows)

To help interaction designers understand how to make information more findable, back in 1993, some researchers at the Palo Alto Research Center developed a theory called “information foraging,” which suggests that there are important similarities between how animals gather food and how humans collect information online.

The concept of “information scent” came out of this theory, which provided some useful principles to follow when building online experiences.

Abstraction: The stink bomb of information scent

Everything is alike at the appropriate level of abstraction.

For instance, dogs and cats are distinct animals. However, dogs and cats are both “pets.” Dogs, cats, and horses are “domesticated animals.” Dogs, cats, horses, and mice are “animals.” Dogs, cats, horses, mice, and pitchforks are “things you might find on a ranch.”

The more abstract the category, the more difficult it is to predict exactly what the label means. Hence, in (sadly) typical website parlance, “resources” and “tools” may be too abstract to be useful. By themselves, they provide no information scent. “Resources,” as a label, may just as easily be about water, coal, and oil as it is about links, support documents, or helpful people.

As the Chip and Dan Heath, authors of Made to Stick tell us, “Abstraction is the kiss of death in any situation where you need to stand out.” And in a space that is abundant with information (like the Web), you need to stand out.

Don’t be obsessed with click-counts

Once upon a time, savvy Web designers believed that websites should adhere to something they called the “Three-Click Rule,” which, as the name suggests, stated that every piece of content on a site should be no more than three clicks away.

The problem, however, isn’t the number of clicks. It’s the degree of certainty users have that they can find the information they need – that they can accurately predict what will happen when they click something.

It’s very rarely a good idea to add unnecessary clicks.* But often adding an intermediate step in a given process can actually make things more findable.

Otherwise everyone would just take their site map and turn it into their home page.

* Surprisingly enough, this white paper from Human Factors International suggests adding extra clicks can sometimes better support the goal of the site and fulfill the desires of the users.

Turn your web pages into billboards

Dontmakemethink“The goal should be for each page to be self-evident, so that just by looking at it the average user will know what it is and how to use it.” – Steve Krug, Don’t Make Me Think

Following Krug’s advice sometimes means turning three painfully laborious clicks into four quick and mindless ones. Within reasonable constraints, if the information scent is strong enough that users are supremely confident they will find the information they need by clicking on something, as long as the site delivers regularly, they won’t even remember how many clicks it took them to get there.

They get frustrated only when they struggle – either deciding what or where to click, or finding out that what they clicked didn’t give them what they expected.

You could provide instructions, but while in foraging mode, people don’t want to stick around and read instructions, so your interface must convey what you would otherwise use words to communicate.

People want to get to the meat of what brought them to your site in the first place. So they won’t read at first. They’ll scan. They’ll scan by looking for cues that indicate to them where they must go (or what they must read to find out).

Krug wrote of a framework that takes advantage of the typical scanning behavior of users: If people simply scan pages like they scan billboards (until they find what they came for), when necessary and possible, treat the pages like billboards.

Besides creating clear, consistent labels, here are Krug’s guidelines for doing just that:

1. Create a clear visual hierarchy on each page
As "ugly" as his site design is, Jakob Nielsen's articles are ridiculously easy to scan and read because he makes use of good visual hierarchy.

Caption: As “ugly” as his site design is, Jakob Nielsen’s articles at useit.com are ridiculously easy to scan and read because he makes use of good visual hierarchy.

2. Take advantage of conventions

conventions

Caption: Many of the video interface elements we see and recognize everywhere on the Web today are conventions because YouTube became popular. Many of them were recognizable because they were recycled from video players that were manufactured for decades prior to YouTube’s manifestation.

3. Break pages up into clearly defined areas

usatoday

Caption: USA Today’s website has a lot going on — even on content pages like this one — but the various areas are clearly defined for what they are. Navigation is navigation, headlines are headlines, body text is body text and so forth. Separation between areas aids in navigation and consumption.

4. Make it obvious what’s clickable

buttons

Caption: Buttons can come in all shapes and sizes. You can perform a few tests with others to determine if a button appears clickable. But if you do nothing else, look a few inches in front of any given design element (such as a button). If you can still tell that the object is clickable, then it probably will appear clickable to others.

5. Minimize noise

Separation

Caption: In spite of providing access to thousands of programs, Hulu.com does an outstanding job of keeping things simple on their homepage.

Live it, love it, give it a pleasant aroma

The main goal of following these principles is to ensure people who come to a site looking for information can find it.

Abstract labels or design features can get in the way of this goal. They are said to have a weak information scent.

Clear labels with good visual hierarchy, familiar or recognizable design elements that aren’t too cluttered typically provide a strong information scent.

It isn’t always possible, given the constraints of any particular circumstance, to achieve 100% clarity in appearance or labels.

However, knowing the principles of information scent and their potential benefit, with proper planning and testing, can give you a greater degree of certainty that your online presence will successfully support your brand promise.

Remember to plan for this important aspect of communication.

Related
Top 10 UX Myths
(Hat tip to David Armano)

May 28th, 2009
Posted by Brian Kress

The mobile phone, or third screen as they call it, continues to break boundaries in the content people are ingesting. Of course, the advent of the iPhone layed the ground for a turning point in the industry to treat your mobile device as more than a pure utility machine and into a sort of lifestyle device.

This turning point has opened the doors to a much more “mobile involved” customer, increasing incidence of nearly every phone behavior – with the notable exception of talking – but a particularly large increase in the use of mobile video. At 28%, iPhone users are 3.5 times more likely to use mobile video and TV than non-iPhone users according to GfK study.

45348055_6bfe6bb119_o

There are three factors coming from the market that drive this adoption:

Better phones
The iPhone created an entire new category of phone – one that jargon is beginning to call smartphone plus. The screens are bigger and better, allowing for a vast improvement in video quality, and they are designed with an ease of use in mind that transforms the way we think about our phones.

Better networks
Most major carriers have implemented 3G across their network, which has sent download and upload speeds skyrocketing at near broadband speeds. The normal-speed internet surfing from your mobile has unlocked a lot of the potential for the phones to truly become the “third screen,” making video content simply a click away.

Better content
Here the iPhone had a triple role: 1. Allowing users to view and download the content they could download to their computers, be it podcasts, episodes or full movies, on their phones. Often in the Kress household, this means scrambling to download movies before you’re stuck on a plane for a number of hours. 2. Pulling in YouTube content from the start in an app that allows the iPhone user to watch any video on the site. All of those halarious clips that we talk about with friends became immediately available from our mobile phones. 3. The iPhone helped make another cultural shift when they opened the iPhone app store to third-party developers. This created a marketplace for people to customize their phone experience, with video being one of the obvious first choices. Joost was one of the first in the game, bringing its streaming content directly the iPhone in an app.

The mobile video craze isn’t limited to viewing content either. As phone cameras continue to improve and the software behind them meets customer demand, we are seeing more and more videos taken with mobile phones and uploaded on the spot to the video sharing site of your choice. We expect that consumer generated content, not typical video content, will begin much of the growth of mobile video.

The service Qik allows users to stream video content from directly from their phones to its site, sharing every step and experience immediately with family and friends. In the screenshot below, a Googler is streaming video from the Google I/O developer conference.
picture-1

We expect to see much more from mobile video in the coming years, especially as the marketplace continues to adopt the large, touchscreen “smartphone plus” phones. Keep on a lookout for opportunities for you brands to get involved on the ground level of this growing space.

March 12th, 2009
Posted by Cam Beck

The best way to make sure a Web design and development project goes smoothly is to ensure everyone is working toward the same goals. The only way to ensure they’re working toward the same goals is to, early in the project, express the goals in clear, concrete terms and get agreement on them. An effective way to accomplish this is through the creation of use cases.

What is a use case?
Historically, software developers created use cases to define how individuals were expected to interact with a system. They expressed an interaction between users and the software, but from the perspective of the users rather than the system, the programmers, or the programming language itself.

A single use case represented a single task or goal – usually from the perspective of a single user role (called “actors” in geek-speak). However, a single use case could contain several scenarios, which represent variations that could occur in how the system behaves, depending on a specific action or condition of the actor.

An example
For instance, let’s take a look at a simple use case for a word processing application. Say we want to define the printing process. The use case can be expressed in the form of a diagram or in plain text, but either way, it identifies key operations and attributes of the system:

  • Who or what is using the operation? (In use cases, the actor isn’t always a person)
  • What is the actor’s goal?
  • What must the actor do to initiate the process we’re defining?
  • What does the system provide in return…
  • …when everything is done and set up properly?
    …when everything is not done and set up properly?

Consider the implications of the failure to go through this exercise. It would be very easy to overlook the need for the system to identify the conditions necessary for the successful completion of this task, and, if those conditions aren’t met, to provide adequate feedback that lets the user know:

  • That an error has occurred,
  • What the error was, and
  • What steps the user must take to correct it

Ideally, the system would help in this recovery process (e.g., providing a button or wizard to install a printer), but in some cases, it must suffice to tell the user what is wrong in clear language, such as “Your printer is out of paper.”

Don’t laugh. It beats the pants off of some strange error messages we still get from time to time that tell us nothing at all.

Fake error message for demonstration only.

Use cases for the Web
Over time, web development teams started to consider a similar approach to website design. They understood that clients were demanding their websites accomplish more. Partially because there were more opportunities for more severe task failure, usability engineers, experience planners, and developers saw the value of introducing use cases for their projects.

With use cases, system designers can define what an actor expects when he comes to a website, what the he must do in order to get the result he expects, and what the system must do, in turn, to deliver that expected result.

And they also must provide for the means to recover from an error. An example of this is in an online shopping cart, where the user has not filled in all the fields or has entered obviously false credit information.

What does the system show in return? Use cases help teams to identify the optimal workflow, provide safeguards that make that workflow the most likely outcome, and anticipate – in spite of those safeguards – what the likely errors are and how to recover from them.

dingo

The goals of use cases
Building a book of use cases during the planning stages of creating a website provides several important benefits:

  • Helps prioritize. It helps to identify features that provide the highest business value. This is of particular importance, as it helps companies decide what features are most critical to the successful implementation of the overarching business strategy.
  • Reduces risk. Each feature takes a certain amount of time to develop. With use cases, it’s easier to estimate how much time (and money) it will take to build a feature. Joined with the budget for the project and the estimate of the value of that feature, it makes it easier to decide which high-risk features are expendable, and which are worth the effort.
  • Improves usability. Because tasks are explicitly defined and assigned a business value early in the process, it is easier to anticipate possible obstacles as well as plan an iterative usability test plan. Each iterative chunk should be designed, as much as practical to reduce effort duplication, to test the highest value use cases first, to give the team more time to make improvements.

Web projects will always have a finite budget and a deadline. Use cases help teams establish a common understanding of what user goals are of the highest value to the business and what level of effort is necessary to deliver on the goals. Then it is up to the team to make sure, through their development processes, that the design and interface successfully communicate to the user what they can expect to do and how they can do it.

Ultimately this process helps build better websites that meet the needs of the users and the organization and, through the act of meeting (if not exceeding) audience expectations, endear the brand to the individuals who come to the site.

For more information about use cases:
Use Cases information from usability.gov
Use Case Design for Websites

About Click Here

We make brands successful in entirely new arenas. Our blend of creativity, technical savvy and, yes, moxie can help you meet your ROI and other goals.

Visit ClickHere.com

Authors