Almost 4 years ago, Jesse James Garrett came out with The Elements of User Experience. It was the first book I read where I said, “Yes! This guy understands the big picture. He understands the context of being a user experience practitioner.” Jesse’s model is still relevant as ever for anyone involved in web development. I’ve been a proponent of it ever since I first started using it, although I’ve found that it isn’t absolutely necessary to go in a set order from abstract to concrete. Below is my 1-page summary of Jesse’s book that I often send to others as an introduction to the model.

STRATEGY > SCOPE > STRUCTURE > SKELETON > SURFACE
The Web Development Process Using the Five Planes

These 5 planes go from abstract to concrete. The critical point often comes during the development of structure. Here the team must be able to bridge abstract ideas and paper requirements to tangible prototypes.

STRATEGY:
PART I: What are your site objectives?

What do you want to accomplish with this site?
What do you want your users get out of it?

PART II: What are your user needs?

What do your users want from this site?
Develop personas to better understand needs.

SCOPE:
PART I: What are we building?

Know what is being built so you can launch in a given timeframe.
Prioritize requirements for now and decide what gets developed later.
Develop success metrics.

PART II: Brainstorm feature sets from requirements.

Develop user scenarios for the primary and secondary personas.
Define what is being implemented in a specifications documents.

STRUCTURE: (MACRO)
Take the pieces above (the feature sets: content and functions) to form a cohesive whole.
PART I: What’s the best way to organize the content and functions?

Create the information architecture for the site.
Ensure consistency in nomenclature, definitions, and language to describe what’s going on.

PART II: How does the user interact with the system? (interaction design)

Create a system that works for the personas with appropriate user behavior cues and system responses.
Develop conceptual mental models for error handling, and aim to increase efficiency of tasks.

SKELETON: (MICRO)
Take the large structural issues of information architecture and interaction design and apply it to every step, every page, every screen.
PART I: Assess the best solutions that combine interface design, navigation design, and information design.
PART II: Address these three: DO THINGS — GO PLACES — COMMUNICATE IDEAS at all times.

SURFACE:
PART I: Create visual representation that can be evaluated using aesthetics and the following:

Eye Tracking – following the movement of eyes on a page
Contrast and Uniformity
Internal and External Consistency
Color Palettes and Typeface
Style Guide and Templates
Graphics and Animations that fit the brand identity

Tags: , , , ,

process, user science

, , , , ,

March 23, 2006

1 Comment