This document discusses different types of web design documentation and their purposes. It outlines documentation such as personas, usability test plans, concept models, content inventories, site maps, and wireframes. Flow charts are discussed in more detail as a type of documentation that can define, elaborate on, and enhance a design. Tips are provided for both creating and using design documentation effectively.

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

8. 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?

9. A document captures an idea.

10. War is Bad

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

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

13. 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

14. Some Examples

15. Persona

16. Usability Results

17. Concept Model

18. Content Inventory

19. Site Map

20. Wireframe

21. A Closer Look at Flow Charts

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

28. Deliverable Elements Elements that DEFINE Elements that ELABORATE Elements that ENHANCE

29. 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.

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

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