2014 Evolving Your UX Process 1up

Evolving

Your UX Process

Tom Brinck simplytom@me.com

Total Experience Design 2014 Nov. 17, 2014 3:30-4:30

About me

Diamond Bullet

President/co-founder

Web design & development 100s of clients

U. of Michigan /

Academy of Art Adjunct Instructor, UI/UX

A9/AmazonCreative director Advertising & search UI

Samsung

Sr. Dir. UX Innovations Consumer electronics product incubation

“No process” is a bad process

What makes a good process?

◍ Fits users and company ◍ On-time, on-budget ◍ Helps you plan with the resources you have ◍ Fits the long-term plan:

product evolution, career development ◍ Not too much overhead ◍ Minimize risks, minimize restarts and redos ◍ Validated: success metrics ◍ Gets great results, consistently

Requirements Structural Design Visual Design Production

▨ D D D D D

R S V P

Define - Discover - Design - Develop - Deploy

Typical waterfall

Typical iterative

DESIGN PROTOTYPETEST

Build Measure Learn

Rinse…Repeat…

The agile / lean philosophies

◍ Agile ▒ Non-waterfall, minimize process & tools ▒ Working software ▒ Reactive, dynamic response to change ▒ Collaboration

◍ Lean ▒ Learning loops, measuring market fit ▒ Minimal viable product

Tons of methods

Try & Learn

Experiment: Try out process changes.

If they work, adopt them. If they don’t, bail out.

Process themes

◍ Adaptive design ◍ Streamlined ◍ Optimized ◍ Innovative

◍ Collaborative ◍ Parallel design ◍ Concrete ◍ Evolving:

The UX capabilities model

Adaptive design

◍ Starting a project with a thoughtful plan: ▒ Helps make estimates ▒ Foreshadows the design activities ▒ Begins the process of diagnosing what needs to be solved ▒ Establishes the methods you have available for solving

the problems

◍ At every checkpoint evaluate unfinished design, and open issues. From your toolkit of methods, choose the best tool in the moment.

Project plans are rigid &

often unrelated to our activities

Adaptive design

◍ The plan serves as a reference point, not as a straightjacket.

◍ Real projects are dynamic. Surprises happen (small & large): we discover user needs, development complexities, and feasibility limitations. We need to act constructively and efficiently on new information.

bricolage (in art or literature) construction or creation from a diverse range of available things

Streamlined

◍ Deliverables are about action (not about archives) ▒ User-centered ▒ Each deliverable has a clear takeaway,

not an abstract future possible use. ▒ Summarize, prioritize

◍ Tools and time-savers: templates, checklists, heuristics ▒ Take planning down close to zero ▒ Communicate correctly ▒ Cognitive artifacts: think & remember on paper ▒ Avoid errors

No wasted energy !

Optimized (for best results)

Goal Explore the design space. Find the best design solution.

Inverted pyramid process.

Iterations + Variations

Project in a day Start a project in a workshop, walking through every step in miniature.

◍ Root concept ◍ Target audience ◍ User interviews ◍ Personas ◍ Scenarios ◍ Task inventory ◍ Thumbnails ◍ Screen flows/IA ◍ Wireframes ◍ Storyboards ◍ Design options ◍ Layouts ◍ Functional prototype of key

interactions ◍ User test

Spiral model

Hill climbing Our designs sample points in the design space, and we refine to improve to similar designs.

Design is an applied science. Designs are embodied theories of human behavior. We test to refine those theories.

Innovative ⚗◍ Innovation = Solving problems ◍ Informed

▒ Do the research: user research, trends, competitors ▒ Embrace knowledge. Do not fear bias.

◍ Thinking ▒ Make time for high-level analysis

◍ Aspirational ▒ Set a high bar, do better than expected.

◍ The adjacent possible ▒ Rapidly iterate in small steps to get to large steps ▒ Know when and how much to diverge

Innovative ⚗◍ Brainstorming tips: Questioning the received wisdom

• Brainstorm independently • Don't vote, at least not classically • Divergence: yes, for people without ideas.

Convergence: for those with a lot. • Relevant: ideas fit the problem spec.

• Ideas are for improving, not shooting down, but… • If an idea has no merit, put it at the bottom of the pile. • Drop pet ideas. After working through an idea, you have

something specific and reasonably feasible or you have nothing.  (Want to keep it? Write it down. Revisit it on your own.)

Great resources ◍ Gamestorming ◍ Innovation Games

Collaborative

◍ Design is multi-perspective.   ▒ Solve all the constraints.  Involve all

roles and disciplines.    ▒ It’s not easy: weak skills, alternate goals,

alternate philosophies. ▒ Collaborate early.

◍ Pairwise problem-solving. Group-wide context sharing.

Parallel design

◍ Challenges ▒ User scheduling ▒ … and waiting for analysis ▒ … and waiting for inspiration

◍ Use ‘em when you got ‘em & keep movin’ ◍ Evaluate using the latest, and minimize turnaround time

Bottlenecks & idle cycles ☹

▨▨ ▨ ▨ ▨ ▨ ▨ ▨

▽ ▽ ▽

Design iterations

User availability

Parallel design

IA / Flow Visual design Content Interaction Backend

Automate your prototyping Low to high fidelity

User research - Industry research - Concept development

➤➤➤

Le Corbusier

“I prefer drawing to talking. Drawing is faster, and leaves less room for lies.”

Maurice Merleau-Ponty Sense and Non-Sense

“Conception cannot precede execution.”

◍ Solve the concept first ◍ Focus on user needs ◍ Big picture priorities are the

experience ◍ Details will overcommit to a

false direction

◍ Your prototype is your thought. Without it, you don’t think.

◍ Avoid abstract, ungrounded discussions.

◍ Reduce risk to completion.

Concrete

Bottom upTop down ◈vs

Do both: test grounded prototypes against high level goals, question failures of the prototype.

Build. Understand. Think. Solve. Improve. Build some more.

Build. If you're talking and not building, Stop Talking.

Kill cynicism: When someone says something can’t be done…Build it. If they say it’s been done before, build it as a baseline, and discover in the process that there was a lot to learn.

Cultivate the mental discipline of avoiding tunnel vision, and steadily produce concrete alternatives.

Evolving

UX Capabilities Model

Plan your process evolution through a roadmap of increasing capabilities.

6. Transformative Don’t just deliver a product. Change the world meaningfully.

5. Insightful Design with depth, insight, and the right voice.

4. Proactive Design strategically and creatively.

3. Streamlined Design with an effective process.

2. Skillful Design well, responsibly, with skill.

1. Reactive Design for the required features.

0. Accidental Design happens because things were made.

Evolving

UX Capabilities Model

0. Accidental

1. Reactive ▒ Document carefully ▒ Track status and requests ▒ Prepare proper design docs/specs ▒ Meet deadlines ▒ On budget with appropriate manpower ▒ Collaboration/customer service to other teams ▒ Collect feedback from stakeholders

Let’s design if we can squeeze it in.

Evolving

UX Capabilities Model

2. Skillful ▒ Heuristic eval ▒ Design reviews ▒ Establish procedures ▒ Design-quality checklists ▒ Accessibility. ▒ Browser compatibility ▒ Platform optimization: PC, phone, tablet ▒ Localization ▒ Performance optimized ▒ SEO ▒ Responsive design  ▒ Quality control: style guides, process checklists

I’ve learned how to do it, and I want to do it right.

Evolving

UX Capabilities Model

3. Streamlined process ▒ User testing ▒ Stakeholder input ▒ Iterations & Variations ▒ Fail early - prototype early ▒ Parallel work / no bottlenecks ▒ User driven needs/formative research ▒ Secondary research ▒ Monitor reviews/social networks/buzz ▒ Quantified goals and measurement ▒ Continuous A/B testing ▒ Multiple sources of user and stakeholder feedback ▒ Resolve large questions early, minimize late disruptions and risks ▒ Thoughtful and testable rationale ▒ Rapid prototyping ▒ Stakeholder integration

I’ve delivered on-time, on-budget, repeatably, and well.

Evolving

UX Capabilities Model

4. Proactive ▒ Set the business agenda ▒ Strategy formulation ▒ Roadmap ▒ Risk tracking and risk strategy ▒ Scope management ▒ Leverage technologies & feasibility ▒ Leverage emerging platforms ▒ Leverage emerging business models ▒ Competitive analysis ▒ Connect to externalities: e.g.service design

I’ve done the research.I’ve got a plan.

Evolving

UX Capabilities Model

5. Insightful ▒ Fit ▒ Top layout, flow, language, typography, IA, content, usability ▒ Task perfection: Call to action/completion, addictiveness ▒ Immersive pow: relevant 2d, 3d, motion, video, audio, etc. ▒ OOBE ▒ Voice/perspective (of the product) ▒ Emotion/humor/playfulness ▒ Differentiated brand & style

6. Transformative ▒ New products, product categories, major new markets ▒ Design with an agenda. Be inspired/driven by that agenda.

The designer’s voice. ▒ Empower people. Improve the human experience.

Make the world a better place.

I’ve thought about this a lot. I’m ready to propose a new point of view.

Let’s do the impossible. I have the passion, the vision, the

ability, and batteries fully charged.

The Action Plan

◍ Get started by developing a roadmap of deltas to greater capability levels

◍ What changes can we make to our current processes? ▒ Design space exploration ▒ Continuous testing ▒ Concrete solutions from the outset ▒ Parallel design activities ▒ Adaptive optimization / bricolage

Your UX Process

Tom Brinck simplytom@me.com

linkedin.com/pub/tom-brinck

Total Experience Design 2014 Nov. 17, 2014 3:30-4:30

Evolving