@ambermatthews #hkcodeconf

your code is a waste of time

@ambermatthews #hkcodeconf

your code is a waste of timeIFyou

don’t ask whyyou

are writing it in the first place

@ambermatthews #hkcodeconf

ENTER lean UX

@ambermatthews #hkcodeconf

My goals:

• Give you some clear definitions

• Dispel some myths

• Outline some tools + processes

Your take-aways:

• Actionable templates

• Understanding of the necessary mindset

By @gapingvoid

AGENDA

@ambermatthews #hkcodeconf

FOUNDATIONS OF LEAN UX

AGILESOFTWARE

DEVELOPMENT

DESIGN THINKING

LEAN STARTUP

@ambermatthews #hkcodeconf

FOUNDATIONS OF LEAN UX

AGILESOFTWARE

DEVELOPMENT

DESIGN THINKING

LEAN STARTUP

“Design thinking has come to be defined as combining empathy for the context of a problem, creativity in the generation of insights and solutions, and rationality in analyzing and fitting various solutions to the problem context” - Tim Brown, IDEO

@ambermatthews #hkcodeconf

FOUNDATIONS OF LEAN UX

AGILESOFTWARE

DEVELOPMENT

DESIGN THINKING

LEAN STARTUP

• individuals and interactions over processes and tools• working software over comprehensive documentation• responding to change over following a fixed plan

@ambermatthews #hkcodeconf

FOUNDATIONS OF LEAN UX

AGILESOFTWARE

DEVELOPMENT

DESIGN THINKING

LEAN STARTUP

• methodology for developing businesses and products• scientific approaches to developing products faster• uses a continuous BUILD - MEASURE - LEARN cycle

@ambermatthews #hkcodeconf

ENTER LEAN UX

DESIGN THINKING

LEAN STARTUP

AGILE

LEANUX

Lean UX takes the best parts of all

these foundations, and integrates core

UX methodology

@ambermatthews #hkcodeconf

HOLD ON. WHAT IS UX?

@ambermatthews #hkcodeconf

UX in context

“User experience encompasses all aspects of the end-user's interaction with the company, its services, and its products.” - Jakob Neilsen + Don Norman

By Jessica Vallance

@ambermatthews #hkcodeconf

UX ≠ UI

By @odannyboy By @Erik_UX

@ambermatthews #hkcodeconf

UX ROLES

Evolution of roles (and job titles) over the past 2 decades

By @Erik_UX

@ambermatthews #hkcodeconf

UX IN PRACTICE

UX includes developers and their skillsfor the journey from tasks to experiences

this is the line (chasm) that mostcompanies struggle to cross

via Stephen P. Anderson

@ambermatthews #hkcodeconf

GOT IT. SO back to LEAN ux.

@ambermatthews #hkcodeconf

WHAT THe “GOTFATHER” Says

“Inspired by Lean Startup and Agile development theories, it’s the practice of bringing the true nature of a product to light faster, in a more collaborative, cross-functional way with less emphasis on deliverables and greater focus on a shared understanding of the actual experience being designed”

- Jeff Gothelf, Neo

@ambermatthews #hkcodeconf

LEAN UX is RELEVANt TO CODERS

“the site shall incorporate

shopping cart functionality”

“we assume that a shopping cart is the

best way to structure the e-commerce flow

on our site”

Requirements are transformed into questions that teams can ask (and should answer) about their business

Lean UX team Typical dev situation

Build solutions based on specification requirements document handed

down from business owners

@ambermatthews #hkcodeconf

LEAN UX is a mindset

WE KNOW.... WE BELIEVE...

LET’S BUILD IT LET’S TEST IT

Requirements

are actually

Assumptions

@ambermatthews #hkcodeconf

LEAN UX IN BUSINESS

The measure of progress changes

OUTPUT OUTCOMES

“we will create a single sign-on

feature”

“we want to increase the

number of new sign-ups”

@ambermatthews #hkcodeconf

10 PRINCIPLES OF LEAN UX

1. Design + Product Management + Development = 1 core team2. Externalise! 3. Goal-driven & outcome-focused 4. Repeatable & routine cycles5. Use THINK -> MAKE -> CHECK cycle 6. Focus on solving the right problem 7. Generate (ideate) many options 8. Decide quickly what to pursue & hold decisions lightly9. Create hypotheses & validate them10. Research with users is the best source of information & inspiration

WHO

HOW

WHAT

TEST

@ambermatthews #hkcodeconf

ELEMENTS OF a LEAN UX process

•assumptions• (sub)hypotheses•outcomes• (proto)personas• journey maps•prototypes

BUILD(MAKE)

MEASURE(CHECK)

LEARN(THINK)

@ambermatthews #hkcodeconf

ASSUMPTIONs

Early product definition assumptions include:

• who is our customer?• what pain points do they have related to our product/service?• how will our product/service solve their pain points?• what features are important?• what is our differentiation from others?• what is our business model?

LEARN(THINK)

@ambermatthews #hkcodeconf

PROBLEM STATEMENT template

LEARN(THINK)

[Our service/product] was designed to achieve [these goals].

We have observed that the product/service isn’t meeting [these goals] which is causing [this adverse effect] to our business.

How might we improve [service/product] so that our customers are more successful based on [these criteria].

@ambermatthews #hkcodeconf

We believe [this statement is true].

We will know we’re [right / wrong] when we see the following feedback from the market:[qualitative feedback] and / or [quantitative feedback] and / or [key performance indicator change].

hypothesis template

LEARN(THINK)

@ambermatthews #hkcodeconf

We believe that [doing this / building this feature / creating this experience]for [these people / personas]will achieve [this outcome].

We will know this is true when we see[this market feedback, quantitative measure, or qualitative insight].

SUB-hypothesis template

LEARN(THINK)

@ambermatthews #hkcodeconf

Sketch + Name

PROTO-PERSONA template

Demographic + Behavioural information

Pain points and needs

Goals + potential solutions

LEARN(THINK)

@ambermatthews #hkcodeconf

Step 1. Character developmentidentify ALL the possible personas to target

PROTO-PERSONA Development

Step 2. Meet your castintroduce each of your personified userstheir motivations, goals, level of expertise, un-met needs and context

Step 3. Refine your charactersrank them if possible and group together based on specific traits so you can prioritise to between 1 - 3

LEARN(THINK)

@ambermatthews #hkcodeconf

Journey MapS

Look at each persona you have and try to answer the following questions:

• What was their objective in visiting the (our) website/app?• How did they get t/here?• Where did they land?• Where will they go next?• What is the (our) opportunity?

LEARN(THINK)

@ambermatthews #hkcodeconf

PROTOTYPING

Prototypes come in various guises and fidelities, depending on what you are trying to test:

• landing pages• sign up buttons• emails• Google adwords

BUILD(MAKE)

@ambermatthews #hkcodeconf

MEASUREMENT

QualitativeQuantitative

observing and listening to

people

all about data with no human

interaction

=> WHAT is happening => WHY something is happening

MEASURE(CHECK)

@ambermatthews #hkcodeconf

RESEARCH TOOLS

Multitude of online tools for more ways to validate and test at low cost.

A few you can try today:

• Qualaroo.com (surveys)• Unbounce.com (A/B tests)• Optimalworkshop.com (tree/nav tests, card sorts, click tests)• Usabilityhub.com (5 second tests, click tests, nav flow tests)

MEASURE(CHECK)

@ambermatthews #hkcodeconf

CONCLUSIONS

@ambermatthews #hkcodeconf

• Declare all your assumptions up front

• Use hypotheses and persona templatesto move away from fixed specifications

• Work across cross-functional teams

• Measure Quant + Qual together

• Build stuff that people actually want

By Dave Landis

TAKE-AWAYS

@ambermatthews #hkcodeconf

FURTHER READING

@ambermatthews #hkcodeconf

your code is a waste of timeIFyouuse

LEAN UX

NOT

<

@ambermatthews #hkcodeconf

thank you