journey over destination: creating an effective framework with ux tools

creating an effective framework with UX tools

Stephanie TroethParisWeb 2010

Journey over Destination

Friday, October 15, 2010

Who? User eXperience Strategist/DesignerPrevious hats: * Co-founder of an innovative publishing startup* Director of Interactive Technology & Solutions @ a Montreal web agency

Played active part(s) within the Web Standards Project since 2002 until 2 months ago.


This is a conversation about “how”...


which depends on “what”...

and “when we do what”.

deliverables

process

tools


define

design

develop

deploy

plan

extend

research

concept

build

measure

launch

Classic Waterfall

Adapted from Chapter 4: Project Objectives & Approach, A Project Guide to UX Design, Russ Unger & Carolyn Chandler.

a plan!reports

requirements

Specs / briefs

code

key performance indicators


design

adapt

deploy

plan

define

measure

Agile approach

sketches/wireframesmockups

code

roadmap

user stories


“It's really the act of designing that matters, so we should focus on designing rather than design.”

Mark Baskinger“From Industrial Design to User Experience: The Heritage and Evolving Role of Experience-Driven Design”, UX Magazine, June 2010http://uxmag.com/design/from-industrial-design-to-user-experience


http://uxmag.com/design/from-industrial-design-to-user-experience


Designing vs design?


Process = act of designing?Deliverables = design?


stuff you get

at the endof each design activity

It’s easy to see design represented as deliverables of a design process.


Todd Warfel’s Design Process Diagram

http://www.boxesandarrows.com/files/banda/card_sorting_a_definitive_guide/designProcessDiagram.jpg

plan designdefine develop deploy




What’s good about deliverables?


tangible tools for communication?

easy to estimate the cost?


What’s wrong with deliverables?


“Wireframes are representations of a design made before final specifications exist, which is problematic because in comparison to sketches they are higher fidelity

representations of design. Unfortunately, although wireframes are meant to inform design processes and design decisions, they often can be viewed as more concrete than sketches, and therefore considered more final.”

Will Evans, “Shades of Grey: Thoughts on Sketching”, UX Magazine.http://www.uxmag.com/design/shades-of-grey-thoughts-on-sketching


http://www.uxmag.com/design/shades-of-grey-thoughts-on-sketching

http://www.uxmag.com/design/shades-of-grey-thoughts-on-sketching

“Wireframes, flow diagrams, personas, card sorts, content strategy documents, etc. All of these things are important to design, and designers need some combination of them to synthesize their user research and communicate what they’re doing with the other members of the team.

But too often these deliverables are the last line of contact for designers. Too often these deliverables are what designers prepare and then hand off to implementors. Then they shuffle off to create more deliverables and the cycle is repeated.

In the end deliverables are merely artifacts of the design process. They are not the final design, they are not the artifact of experience. The end user never interacts with them…they interact with the product or service that is actually delivered.”

Joshua Porter, “Deliverables vs Delivery”, 52 Weeks of UXhttp://52weeksofux.com/post/346650807/deliverables-vs-delivery


http://52weeksofux.com/tagged/week_36


“We get so lost in our deliverables and sharing information that we forget that we’re really trying to collect and share knowledge. Just like the software we build, the persona document is hopefully an interface to a much deeper connection and store of insight or ‘institutional memory.’ In most cases, I fear that we’re just leaving the document, not the knowledge.”

Chris Baum in response to Jared Spool’s post, “Personas are NOT a Document”, UIE.comhttp://www.uie.com/brainsparks/2008/01/24/personas-are-not-a-document/#comment-104179


http://www.uie.com/brainsparks/2008/01/24/personas-are-not-a-document/#


“Do people you work with expect detailed wireframes and functional specifications even if they may or may not be necessary, or the best tool?”

Mini-survey/interview:


Response #1

“They do expect [it], unfortunately.”


Response #2

“For the most part, yes, that has been my experience, when it hasn’t been just Photoshop mockups.”


Response #3

“They do. Totally. And it's freaking moronic. Clients tend to get all focused on the list of deliverables they'll get for their money. The thinking, of course, is what they're paying for—the deliverables are just for communication purposes.”


“In my experience freelancing, small clients don't expect any UX deliverables, they just wait for the designs. At larger companies, they seem to fixate on process and lose sight of outcome. Agencies get fixated on deliverables. Seems like a lot of ‘thought leaders’ in the UX space fall prey to that too. Seems like so often people obsess over the terms we use, the steps we follow, etc. thinking of problem solving as a one size fits all type of thing.”

Response #4


If we’re not careful:


Having a recipe book doesn’t make you a good cook.


What can we do?


Cook up the procedure based on the ingredients we have.


Establish context:Frame the problem

1


define

design

develop

deploy

plan

extend

research

concept

build

measure

launch

design

adapt

deploy

plan

define

measure

Classicwaterfall

Agileapproach


What’s the goal/objective?

What’s the actual problem we are solving?

Who are we solving it for?

What impact do we want to have?


How “out there” is it?

evolutionary revolutionary

analytics

competitive analysis

user research

SWOT analysis

prototyping


ephemeral permanent

market research

user research

more iterative process

set process

Longevity?


What type of solution?content-focused

interactiveapplication

copywriting

user research

content strategy

information architecture interaction design

visual design


Social context?

individual social/community

community management

social design

mental models

support


Common user research methods

open-endedclose-ended

“listening labs”

“contextual enquiry”

interviewsusability testing

“five-second test”

“feedback army”

surveys

focus groups

card sorting

discoveryrefinement

heuristic evaluation

personas


Common design tools

hi-fidelitylow-fidelity

realisticprototypes

sketchesgraphic

mockups

paper prototype

detailedwireframes

functionalprototype

hi-levelwireframes

dynamic

static

storyboard functionalspecifications

content inventory

flow diagrams


Example: user modelling (motivations)

Making sense of research, extrapolating user models.


Set the stage: Design together

2


define

design

develop

deploy

plan

extend

research

concept

build

measure

launch

design

adapt

deploy

plan

define

measure

Classicwaterfall

Agileapproach


Creating sketches help you think. Sketching together helps you think together.


Example technique: Leah Buley’s six-up.

Sketch six different versions of interface within a limited time.


Sketchboarding example

James Downes, “Using Sketchboards to Design Great User Interfaces”http://www.boxuk.com/blog/using-sketchboards-to-design-great-user-interfaces


http://www.boxuk.com/blog/using-sketchboards-to-design-great-user-interfaces


Engage everyone in the process, so that everyone’s in on the journey.


“Sketching is hardly a new technique in UX design. I would imagine that the vast majority of UX / UI designers start by putting their thoughts on paper, but how often do clients get to see these

sketches? We firmly believe that this collaborative technique can communicate the ideation process much better than wireframes, can save you time and make your clients happier. What’s not to like?”

James Downes, “Using Sketchboards to Design Great User Interfaces”http://www.boxuk.com/blog/using-sketchboards-to-design-great-user-interfaces




Document.3


define

design

develop

deploy

plan

extend

research

concept

build

measure

launch

design

adapt

deploy

plan

define

measure

Classicwaterfall

Agileapproach


Document all the time, but not everything!


Keep trace of changes and decisions made.


Think of it as leaving pebbles to remember whence you have come.


4. Hang in there...

...till the endand beyond.

ready t

o deploy

!


define

design

develop

deploy

plan

extend

research

concept

build

measure

launch

design

adapt

deploy

plan

define

measure

Classicwaterfall

Agileapproach


Ensure vision is carried all the way through.


Time is saved in maximising communication and not generating artifacts.


Act of designing is the act of crystalising ideas.


Choose your weapons tools wisely.


“We tend to try and automate everything in our lives so that we can achieve

more, faster. However, the power of design is its ability to make the inanimate more human. This is not something that happens when design becomes a checklist, a process or a formula. Inevitably, as the designer yields to the design system, we find ourselves faced with products that don’t emotionally resonate with us as human beings.”

Joshua Brewer, “Design Systems Need to be Challenged”, 52 Weeks of UXhttp://52weeksofux.com/post/1215278826/design-systems-need-to-be-challenged




Embrace the design journey.


Thanks!Questions?

Stephanie [email protected] @sniffles


mailto:[email protected]

mailto:[email protected]

Borrowed wisdom

Unger, Russ and Carolyn Chandler. “A Project Guide to UX Design”, New Riders/Peachpit.Berkeley 2009.

http://www.slideshare.net/ugleah/ux-team-of-one-sxsw-2009-1161299http://alanhogan.com/being-a-ux-team-of-onehttp://www.slideshare.net/jgothelf/lean-ia-getting-out-of-the-deliverables-businesshttp://www.slideshare.net/pboersma/ux-deliverables-in-practice-1466984http://www.slideshare.net/purplepurr/ux-design-deliverables-experts-choice-3448105http://www.boxesandarrows.com/files/banda/card_sorting_a_definitive_guide/designProcessDiagram.jpghttp://52weeksofux.com/post/346650807/deliverables-vs-deliveryhttp://52weeksofux.com/post/1215278826/design-systems-need-to-be-challengedhttp://www.uie.com/brainsparks/2008/01/24/personas-are-not-a-document/#comment-104179http://www.365webapplications.com/2010/03/14/sxsw-interactive-ux-designdeliverables/http://uxexchange.com/questions/2027/what-ux-deliverables-are-successful-in-an-agile-environmenthttp://semanticstudios.com/publications/semantics/000228.phphttp://uxmag.com/design/from-industrial-design-to-user-experiencehttp://www.uxmag.com/design/shades-of-grey-thoughts-on-sketchinghttp://www.uxmag.com/design/shades-of-grey-wireframes-as-thinking-devicehttp://www.boxuk.com/blog/using-sketchboards-to-design-great-user-interfaceshttp://www.uxbooth.com/blog/under-the-cover-an-interview-with-the-authors-of-undercover-ux/http://www.uie.com/articles/design_deliverables/http://www.adaptivepath.com/blog/category/deliverables/http://bokardo.com/archives/activity-centered-design/http://uxmag.com/design/from-industrial-design-to-user-experience

With thanks to:Chris Baum, Ralph Brandi, Robert Hoekman Jr, Denise Jacobs, AJ Kandy, Olivier Thereaux, Aarron Walter


http://www.slideshare.net/ugleah/ux-team-of-one-sxsw-2009-1161299

http://www.slideshare.net/ugleah/ux-team-of-one-sxsw-2009-1161299

http://alanhogan.com/being-a-ux-team-of-one

http://alanhogan.com/being-a-ux-team-of-one

http://www.slideshare.net/jgothelf/lean-ia-getting-out-of-the-deliverables-business

http://www.slideshare.net/jgothelf/lean-ia-getting-out-of-the-deliverables-business

http://www.slideshare.net/pboersma/ux-deliverables-in-practice-1466984

http://www.slideshare.net/pboersma/ux-deliverables-in-practice-1466984

http://www.slideshare.net/purplepurr/ux-design-deliverables-experts-choice-3448105

http://www.slideshare.net/purplepurr/ux-design-deliverables-experts-choice-3448105



http://52weeksofux.com/post/346650807/deliverables-vs-delivery

http://52weeksofux.com/post/346650807/deliverables-vs-delivery







http://www.uxmag.com/design/shades-of-grey-wireframes-as-thinking-device

http://www.uxmag.com/design/shades-of-grey-wireframes-as-thinking-device



http://www.adaptivepath.com/blog/category/deliverables/

http://www.adaptivepath.com/blog/category/deliverables/



journey over destination: creating an effective framework with ux tools

Design

ux design

nal design

design activityfriday

design processes

vs design

end user

end deliverables

user research