Communicating Design: Web Design Documentation Dan Brown Principal, EightShapes, LLC presented to the Energy Information Administration September 20, 2006

Dan Brown

Principal, EightShapes, LLC

presented to the Energy Information Administration

September 20, 2006

Web Design Methods in a Nutshell What do users want/need? What approach will we take? How will we fulfill that need? Does the solution effectively fill the need?

What do users want/need?

What approach will we take?

How will we fulfill that need?

Does the solution effectively fill the need?

A document captures an idea.

War is Bad

The Role of Documentation Consistency of Vision Documents help facilitate communication Accountability Documents represent project history Traceability Documents show progress

Consistency of Vision

Documents help facilitate communication

Accountability

Documents represent project history

Traceability

Documents show progress

Different Kinds of Documents Persona Usability Test Plan Usability Report Screen Design Flow Chart Site Map Wireframe Content Inventory Concept Model Competitive Analysis

Different Kinds of Documents Persona Competitive Analysis Site Maps Usability Test Plan Concept Model Flow Charts Usability Reports Content Inventory Wireframes Screen Designs User Needs Strategy Desgin

Some Examples

Persona

Usability Results

Concept Model

Content Inventory

Site Map

Wireframe

A Closer Look at Flow Charts

Anchors Steps Paths Decision Points Step Distinctions Step Details Step Groupings Error Paths Step Variations Triggers Scenarios

Deliverable Elements Elements that DEFINE Elements that ELABORATE Elements that ENHANCE

Elements that DEFINE

Elements that ELABORATE

Elements that ENHANCE

Tips for Creating Deliverables Identify the purpose of the document. Think about the target audience, and how they’ll use the document. List of all the information you want to capture. Prioritize the information based on the purpose and the audience. Create a “visual language” to represent your ideas consistently.

Identify the purpose of the document.

Think about the target audience, and how they’ll use the document.

List of all the information you want to capture.

Prioritize the information based on the purpose and the audience.

Create a “visual language” to represent your ideas consistently.

Tips for Using Deliverables Communicate the purpose of the discussion Relinquish control Note opportunities for improvement Estimate value of keeping document up-to-date

Communicate the purpose of the discussion

Relinquish control

Note opportunities for improvement

Estimate value of keeping document up-to-date

Thanks! www.communicatingdesign.com Dan Brown [email_address] www.eightshapes.com

www.communicatingdesign.com

Dan Brown

[email_address]

www.eightshapes.com