In the UX field: no one shows their work! So Todd and Russ are here to show us everything they do when they build a design project. Has anyone seen a wireframe from Jesse James Garrett, Peter Morville, or Jared Spool?
If you are arguing about the differences between wireframes and prototypes or the best tools (OmniGraffle, Visio, Fireworks, Balsamiq Mockups, Axure), you are missing the point. The best tool / model is the one you are most comfortable with and the one you can produce the best output with. The idea is to communicate your concept to someone else, period.
Requirements. Research. Audience. [Content Strategy?]. Concepts (sketch). Wireframe/Prototype. Visual Design.
[ session description ]
- Todd Zaki Warfel @zakiwarfel
- Russ Unger @russu
- 13 March 2010
- Prototyping (Zaki Warfel)
- Project Guide to UX Design (Unger)
- Will Evans
- Russ Unger
- Todd Zaki Warfel
- Playlist from ixd10
1 problem. 4 guys. No talking. 4 tools.
Tori Tuncan and lend4health.com. Very small nonprofit. Tori started making microloans to people who have children with health issues. She needed a platform/method to handle a larger volume of lenders/borrowers.
Persona to Wireframe
Requirements analysis. Personas. IA (sitemap–”He who owns the sitemap owns the project.”). How are things connected? Typed (not font). User paths through sitemap as sketches. Sketching before using any tool is cruicial. Sketch sketch sketch.
Turn user path sketches into wireframes for locations on sitemap (used balsamiq mockups tool). Hand off to designer (who you have involved in the conversation throughout the process).
Research to Prototype
Existing research. Guerilla remote observation. Put research into a framework package to tag data points and then output onto post-its. Start with major themes and sort data points around themes. Personas based on data. Explore concepts with sketches (6-up adaptive path, 8-up). Pitch concepts and get critiques: re-sketch/repeat. HTML/CSS Prototyping [ round 1/2 in greyscale, round 3/4 full by visual designer ].