Information architecture… is broken
A statement of intentBy Kai Turner
March 27, 2008 prepared by Kai Turner, [email protected] 1
My background
• 12 years of experience working on internet services -information architecture has been core to what I do.
March 27, 2008 prepared by Kai Turner, [email protected] 2
Current practices
• Established by Studio Archetype c. 1998– Not much has changed in 2008
March 27, 2008 prepared by Kai Turner, [email protected] 3
This is not a pipe This is not a design
… but it is!
March 27, 2008 prepared by Kai Turner, [email protected] 4
Schematics don’t work
• Clients don’t understand them
• We, the designers, don’t fully understand them
• Design artefacts are not ‘living’ documentation– “The digital ink is never dry!” - Hans von Sichart, Studio Archetype (formerly)
March 27, 2008 prepared by Kai Turner, [email protected] 5
Schematics don’t work
• Web 2.0 interaction models cannot be representedthrough static page-based diagrams– “Wireframes as sample of application states aren't dead. … but the old
[Studio Archetype] way of wireframing every screen of a site is kaput.”Gino Zahnd, Flickr (formerly)
How do you wireframe iPhone’smultitouch coverflow?
March 27, 2008 prepared by Kai Turner, [email protected] 6
Information architecture is broken
• So – how can we fix it?
• Leading examples from– Apple
– Product development
– Agile methodologies
March 27, 2008 prepared by Kai Turner, [email protected] 7
Apple
• 10 3 1• Multiple interaction design routes
• Apple designers come up with 10 entirely different mock ups of any newfeature. Not, Lopp said, "seven in order to make three look good", whichseems to be a fairly standard practice elsewhere. They'll take ten, and givethemselves room to design without restriction. Later they whittle thatnumber to three, spend more months on those three and then finally endup with one strong decision.
Michael Lopp, Senior Engineering Manager, Apple Computers
(source: Business Week)
March 27, 2008 prepared by Kai Turner, [email protected] 8
Product model
• Design
• Build
• Iterate
– “[It is] about skipping all the stuff that represents real (charts, graphs,boxes, arrows, schematics, wireframes, etc.) and actually building the realthing.”
37signals - Getting Real
March 27, 2008 prepared by Kai Turner, [email protected] 9
Pattern libraries
• We need an agile methodology for design– “I think having more of a pattern based approach is the way to go”
Matt Jones, Dopplr
March 27, 2008 prepared by Kai Turner, [email protected] 10
A proposed processI. Requirements capture
II. Detailed features definition
III. 3 x 3 sketch wireframes of the entireservice
IV. Distillation of 3-to-1 “quick & dirty”set of wireframes
V. Visual design mockups & functionalprototyping
VI. User testing
VII. Implementation team handover- Prototype
- CSS styleguide
- Light documentation
- Detailed use cases
March 27, 2008 prepared by Kai Turner, [email protected] 11
Team structure
• Concept teamThe concept team is skilled in rapid visualisation of concepts as screens andwireframes, and should reflect a diversity of perspectives & practices (eg.Hand-drawn pages, Visio, etc.)
– Lead Information Architect- maintains vision throughout the project
– 2 IAs / Interaction designers
– Business Analyst- maintains functional documentation throughout
March 27, 2008 prepared by Kai Turner, [email protected] 12
Team structure
• Design teamThe design team is skilled in rapid prototyping and iteration, culminating inthe final, realisation of the product.
– Lead Information Architect- maintains vision throughout the project
– Business Analyst- maintains functional documentation throughout
– Visual designer(s)
– Web developer(s)
– User testing / Usability specialist(s)
Information architecture… let’s fix it!