Opening the Kimono - Big (D)esign Conference, Dallas, TX, May 29, 2010

Opening the Kimono: A look behind the design process Russ Unger | @russu Director of Experience Planning Draftfcb Big Design Conference

no one shows their work.

no one shows their work IA Summit 2009 http://pimpformationarchitect.com/?p=67

no one shows their work have you ever seen a wireframe from: JJG? Peter Morville? Jared Spool?

no one shows their work JJG? Global Navigation Default state store September 24, 2009 Version 1.0 logo search 2 Jesse James Garrett 1 cart 1. Today on HBR today on current account blogs books authors HBS downloads This new page highlights timely content from the blogs, magazine, hbr magazine 3 and books sections. explore hbr 4 2. Store area expand your knowledge build your expertise discover new approaches This area provides a focal point for all e-commerce related links. 3. Authors This new page allows users to ﬁnd aggregated links to content from Partially expanded state popular authors across blogs, magazine, and books sections. 4. Explore drawer store logo search This expandable area encourages and facilitates exploration of cart content by subject. today on current account blogs books authors HBS downloads 5. Expand your knowledge hbr magazine This area features editorially selected sub-categories from the current Strategy Decision making explore hbr Business processes “Topics” category in search results. Leadership Interpersonal skills Management by objectives Organizational change Project management Quality management 6. Build your expertise Information & technology Managing uncertainty Forecasting This area features editorially selected sub-categories from the current Global business Time management Knowledge management “Management Skills” category in search results. 5 7 7. Discover new approaches expand your knowledge build your expertise discover new approaches 6 This area features editorially selected sub-categories from the current “Tools & Methodologies” category in search results. 8. “More” links Fully expanded state These links drive users interested in exploring further to dedicated store landing pages. logo search cart today on current account blogs books authors HBS downloads hbr magazine explore hbr more topics » more skills » more methods » 8 Strategy Decision making Business processes Leadership Interpersonal skills Management by objectives Organizational change Project management Quality management Information & technology Managing uncertainty Forecasting Global business Time management Knowledge management expand your knowledge build your expertise discover new approaches Web Redesign | Harvard Business Review

no one shows their work Peter Morville?

no one shows their work Jared Spool?

no one shows their work “My work is PROPRIETARY”

no one shows their work it’s time to ask your boss to let you show your work.

wireframing was the obvious choice.

wireframing was the obvious choice Visio HTML Axure Omnigraffle Pencil & Paper what is the best tool? Keynote Flash Catalyst iRise Fireworks Powerpoint Balsamiq

wireframing was the obvious choice “Now that I’m a consumer of wireframes, I want to see prototypes!” Christina Wodtke | @cwodtke “You can’t say that works for everyone just because it works for you now!” Me | @russu

wireframing was the obvious choice “Can, too!” “Cannot!” “Can, too!” “Cannot!” “Can, too!” “Cannot!” “Can, too!” “Cannot!” “Can, too!” “Cannot!”

wireframing was the obvious choice WTF?!

wireframing was the obvious choice I <3 but...

wireframing was the obvious choice it’s time to end the debate of wireframes vs. prototypes

wireframing was the obvious choice if you’re still arguing about wireframes and prototypes, you are missing the point.

wireframing was the obvious choice they’re just communication tools.

nut up or shut up.

nut up or shut up i called a few friends.

nut up or shut up i called a few friends. Todd Zaki Warfel Will Evans Fred Beecher @zakiwarfel @semanticwill @fred_beecher Messageﬁrst Semantic Foundry eVantage

nut up or shut up i called a few friends. Todd Zaki Warfel Will Evans Fred Beecher @zakiwarfel @semanticwill @fred_beecher Messageﬁrst Semantic Foundry eVantage 2 prototypers! (gasp!)

nut up or shut up 4 designers. 1 problem.

nut up or shut up 2 rules.

nut up or shut up each designer uses a different tool.

nut up or shut up Balsamiq Mockups Fireworks Omnigraffle Axure

nut up or shut up no talking.

nut up or shut up oh... document everything.

s i d e b a r

sidebar we could have designed anything.

sidebar a college website without girls under trees.

sidebar a website selling affordance faucets.

sidebar the project had to be for a non-proﬁt and had to be real.

Tori Tuncan & Lend4Health

tori tuncan & lend4health Tori Tuncan @lend4health www.lend4health.com “If we can lend a friend, or even a stranger, $5 at a coffee shop, why can't we do the same for health?”

tori tuncan & lend4health

tori tuncan & lend4health whew.

tori tuncan & lend4health connecting people is a manual process.

tori tuncan & lend4health Never doubt that a small group of thoughtful, committed, citizens can change the world. Indeed, it is the only thing that ever has. ~Margaret Mead

requirements & research

research & requirements Gabby Hon @gabbyhon http://linkedin.com/in/gabbyhon @uxbookclubchicago http://uxbookclubchicago.org Available: July 1st!

research & requirements

research & requirements objective: design the path for funding a loan.

research & requirements how it’s done today: • user reviews proﬁles/needs in the blog format • user determines amount they can loan • user contacts lend4health • lend4health connects user and loan recipient • lend4health supplies loan agreement • user funds loan via paypal • lender repays funds via paypal per agreement • lender supplies updates to child’s progress to lend4health and lender • lend4health updates progress on website • continues until loan is paid back

research & requirements whew.

research & requirements a very manual process

this is how i do it.

this is how i do it requirements Requirements Courtesy of: Gabby Hon @gabbyhon staywiththegroup.com

this is how i do it personas

this is how i do it information architecture

this is how i do it user journey Meet Angela The Loan Funder Angela Reviews Angela arrives at Angela Searches for a Details of Loan Lend4Health.com Loan to Fund Request (0.0.0.0) (1.0.0.0) (1.1.0.0) http://www.ﬂickr.com/photos/ 11762156@N06/2912606267/ Part-time working mother of 8 year old son Avery who is able to stay with a babysitter several hours a day. Angela has been through the gamut of testing and wants to help others.

this is how i do it sketching Lend4Health.com Search Loans to Fund Loan Details Home Page (1.0.0.0) (1.1.0.0) (0.0.0.0)

this is how i do it sketching Lend4Health.com Search Loans to Fund Loan Details Home Page (1.0.0.0) (1.1.0.0) (0.0.0.0) quantity over quality.

this is how i do it sketching Lend4Health.com Search Loans to Fund Loan Details Home Page (1.0.0.0) (1.1.0.0) (0.0.0.0) quantity over quality. 15 sketches for 3 screens.

this is how i do it sketching

this is how i do it sketching i even sketched this presentation.

this is how i do it wireframing 50% off code: friendofruss (“friend of russ”)

this is how i do it wireframing Lend4Health.com Search Loans to Fund Loan Details Home Page (1.0.0.0) (1.1.0.0) (0.0.0.0)

this is how i do it visual design Brad Simpson @simplybrad http://i-rradiate.com

this is how i do it visual design Lend4Health.com Search Loans to Fund Loan Details Home Page (1.0.0.0) (1.1.0.0) (0.0.0.0)

this is how i do it kinda cool.

this is how i do it the entire process

this is how i do it

the overlap

the overlap russ unger information architecture

the overlap fred beecher information architecture

the overlap will evans information architecture

the overlap russ unger sketching

the overlap todd zaki warfel sketching

the overlap fred beecher sketching

the overlap will evans sketching

the overlap russ unger visual design

the overlap todd zaki warfel visual design

the overlap fred beecher visual design

the overlap will evans visual design

the overlap the videos Russ Unger Todd Zaki Warfel Balsamiq Mockups Fireworks / HTML http://is.gd/curls http://is.gd/curpN Will Evans Fred Beecher Omnigraffle Axure http://is.gd/curow http://is.gd/curw2

http://www.modelomental.com.br	130
http://www.slideshare.net	64
http://www.felgner.ch	18
http://felgner.ch	6
http://bigdesignevents.com	3
http://www.techgig.com	2
http://www.lmodules.com	1

Opening the Kimono - Big (D)esign Conference, Dallas, TX, May 29, 2010

by Russ Unger on May 29, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

7 Embeds 224

Statistics

Opening the Kimono - Big (D)esign Conference, Dallas, TX, May 29, 2010 — Presentation Transcript