solution design - the hidden side of ux (for developers)

64
Solution Design THE HIDDEN SIDE OF UX Joe Baz @joebaz #bostonphp Above the Fold

Post on 21-Oct-2014

733 views

Category:

Technology


0 download

DESCRIPTION

UX is not just about UI. It's about understanding customer needs and creating a technological solution that addresses their needs. Developers have a huge, and often understated role, in the creation of a great user experience for customers. Joe will walk us through principles and techniques that can help you test your ideas and bring them to market successfully

TRANSCRIPT

Page 1: Solution Design - The Hidden Side of UX (for Developers)

Solution Design

THE HIDDEN SIDE OF UX

Joe  Baz    @joebaz  #bostonphp  

Above  the  Fold  

Page 2: Solution Design - The Hidden Side of UX (for Developers)

Why?

Page 3: Solution Design - The Hidden Side of UX (for Developers)

34M customers

1.4M paying customers

Page 4: Solution Design - The Hidden Side of UX (for Developers)
Page 5: Solution Design - The Hidden Side of UX (for Developers)
Page 6: Solution Design - The Hidden Side of UX (for Developers)

1. IDENTIFY THE PROBLEM

Page 7: Solution Design - The Hidden Side of UX (for Developers)

Acquire Supporting Data Points

Online Forums

Trouble Tickets

Web Analytics

Split Testing

Surveys

Page 8: Solution Design - The Hidden Side of UX (for Developers)

Problem Statement

According to __________

______________ [verb] ___________.

(data)

(problem) (customer)

Page 9: Solution Design - The Hidden Side of UX (for Developers)

Problem Example 1

According to our online survey, 40% of consumers have lost important notes in the past

accidentally.

Page 10: Solution Design - The Hidden Side of UX (for Developers)

Problem Example 2

According to mobile app analytics, 85% of business users are using

the Blackberry app once.

Page 11: Solution Design - The Hidden Side of UX (for Developers)

2. BUILD THE PERSONAS

Page 12: Solution Design - The Hidden Side of UX (for Developers)

Copyright:  h<p://www.homestarrunner.com/trogdor.html  

Page 13: Solution Design - The Hidden Side of UX (for Developers)

­  Hits  the  gym  3x  a  week  ­  Doesn’t  trust  online  sites  ­  Has  almost  zero  Ime  for  

new  things  ­  Worships  his  Android  

tablet  

Workout  Will  

Page 14: Solution Design - The Hidden Side of UX (for Developers)

­  Works  for  a  financial  firm  ­  Power  user  ­  Loves  trying  new  things  

but  easily  frustrated  ­  Overworked  –  10hr  days  ­  The  fastest  texter  in  the  

Blackberry  galaxy  

Analyst  Amy  

Page 15: Solution Design - The Hidden Side of UX (for Developers)

3. CREATE SCENARIOS

Page 16: Solution Design - The Hidden Side of UX (for Developers)

Copyright:  h<p://www.deviantart.com/download/32507261/Trogdor_by_DonBranZ.jpg  

Page 17: Solution Design - The Hidden Side of UX (for Developers)

Scenario Example 1

Workout Will goes to the gym

He records each set in his notebook

He !nishes his workout and

gets ready for work

He hops on the T

He gets to work, and then

realizes that…

He accidentally left his

notebook on the T

Page 18: Solution Design - The Hidden Side of UX (for Developers)

Scenario Example 2

Analyst Amy is waiting in a long

line at Starbucks

She’s decides to browse the app catalog on her Blackberry

She see’s her note taking app, downloads and

installs it

She logs in and wants to !nd her meeting

notes

She struggles for 1 minute to !nd the search

bar

The cashier tries to get her

aention to place an order

Page 19: Solution Design - The Hidden Side of UX (for Developers)

DISCOVER by…

1.  Identifying the Problem

2.  Building Personas

3.  Creating Scenarios

Page 20: Solution Design - The Hidden Side of UX (for Developers)
Page 21: Solution Design - The Hidden Side of UX (for Developers)

1. STATE THE HYPOTHESIS

Page 22: Solution Design - The Hidden Side of UX (for Developers)

We believe that ___________

will ___________ ______________.

(who)

(what)

Hypothesis Template

(because)

Page 23: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 1

We believe that consumers will

record notes on their tablets

because if they lose their tablet,

the notes are still accessible online.

Page 24: Solution Design - The Hidden Side of UX (for Developers)

Problem Example 1

According to our online survey, 40% of consumers have lost important notes in the past

accidentally.

Page 25: Solution Design - The Hidden Side of UX (for Developers)

­  Hits  the  gym  3x  a  week  ­  Doesn’t  trust  online  sites  ­  Has  almost  zero  Ime  for  

new  things  ­  Worships  his  Android  

tablet  

Workout  Will  

Page 26: Solution Design - The Hidden Side of UX (for Developers)

Scenario Example 1

Workout Will goes to the gym

He records each set in his notebook

He !nishes his workout and

gets ready for work

He hops on the T

He gets to work, and then

realizes that…

He accidentally left his

notebook on the T

Page 27: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 2

We believe business users will use

the Blackberry app more than once

because they will be able to find

their notes easily.

Page 28: Solution Design - The Hidden Side of UX (for Developers)

Problem Example 2

According to mobile app analytics, 85% of business users are using

the Blackberry app once.

Page 29: Solution Design - The Hidden Side of UX (for Developers)

­  Works  for  a  financial  firm  ­  Power  user  ­  Loves  trying  new  things  

but  easily  frustrated  ­  Overworked  –  10hr  days  ­  The  fastest  texter  in  the  

Blackberry  galaxy  

Analyst  Amy  

Page 30: Solution Design - The Hidden Side of UX (for Developers)

Scenario Example 2

Analyst Amy is waiting in a long

line at Starbucks

She’s decides to browse the app catalog on her Blackberry

She see’s her note taking app, downloads and

installs it

She logs in and wants to !nd her meeting

notes

She struggles for 1 minute to !nd the search

bar

The cashier tries to get her

aention to place an order

Page 31: Solution Design - The Hidden Side of UX (for Developers)

2. GENERATE IDEAS

(Collaboratively)

Page 32: Solution Design - The Hidden Side of UX (for Developers)

Photo  Credit:  h<p://www.ghostvillage.com/resources/2007/gc_02072007.shtml  

Page 33: Solution Design - The Hidden Side of UX (for Developers)

­  The Anti-Problem

­  Empathy Map

­  Post Up

Idea Games

Page 34: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 1

We believe that consumers will

record notes on their tablets

because if they lose their tablet,

the notes are still accessible online.

Page 35: Solution Design - The Hidden Side of UX (for Developers)

3. PROTOTYPE

Page 36: Solution Design - The Hidden Side of UX (for Developers)
Page 37: Solution Design - The Hidden Side of UX (for Developers)

Photo  Credit:  h<p://modifiedcarsandautoparts.blogspot.com/2011/12/famous-­‐sharpie-­‐lamborghini-­‐gallardo.html  

Page 38: Solution Design - The Hidden Side of UX (for Developers)

Balsamiq

Balsamiq  

Page 39: Solution Design - The Hidden Side of UX (for Developers)

Axure

Page 40: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 2

We believe business users will use

the Blackberry app more than once

because they will be able find their

notes easily.

Page 41: Solution Design - The Hidden Side of UX (for Developers)
Page 42: Solution Design - The Hidden Side of UX (for Developers)
Page 43: Solution Design - The Hidden Side of UX (for Developers)
Page 44: Solution Design - The Hidden Side of UX (for Developers)

4. TALK TO THE CUSTOMER

Page 45: Solution Design - The Hidden Side of UX (for Developers)
Page 46: Solution Design - The Hidden Side of UX (for Developers)

Photo  Credit:  h<p://www.luma-­‐insItute.com/images/18.png  

Page 47: Solution Design - The Hidden Side of UX (for Developers)

Capture explicit & implicit feedback

Page 48: Solution Design - The Hidden Side of UX (for Developers)

CREATE by…

1.  Stating the Hypothesis

2.  Generating Ideas Collaboratively

3.  Prototyping

4.  Talking to Customers

Page 49: Solution Design - The Hidden Side of UX (for Developers)
Page 50: Solution Design - The Hidden Side of UX (for Developers)

Hand off!

Photo  Credit:  h<p://www.stack.com/2013/02/25/relay-­‐sprint-­‐training/  

Page 51: Solution Design - The Hidden Side of UX (for Developers)

1. CREATE A BETA PROGRAM

Page 52: Solution Design - The Hidden Side of UX (for Developers)
Page 53: Solution Design - The Hidden Side of UX (for Developers)
Page 54: Solution Design - The Hidden Side of UX (for Developers)

8-10 Weeks

Page 55: Solution Design - The Hidden Side of UX (for Developers)

2. MEASURE THE RESULTS

Page 56: Solution Design - The Hidden Side of UX (for Developers)

Tips on what can you measure:

FOR SALES

FOR USAGE

FOR MESSAGING

FOR DISCOVERABILITY

FOR EFFICIENCY

➜  CONVERSION RATE

➜  SINGLE USE RATIO

➜  BOUNCE RATE

➜  HEAT MAPS

➜  TASK TIMES

Page 57: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 1

We believe that consumers will

record notes on their tablets

because if they lose their tablet,

the notes are still accessible online.

Page 58: Solution Design - The Hidden Side of UX (for Developers)

Metrics for Hypothesis 1

Beta Customer

Logins

Devices Connected

Tablet Use Time

Notes Created

Page 59: Solution Design - The Hidden Side of UX (for Developers)

Hypothesis Example 2

We believe business users will use

the Blackberry app more than once

because they will be able to find

their notes easily.

Page 60: Solution Design - The Hidden Side of UX (for Developers)

Metrics for Hypothesis 2

Beta Customer

Logins

Search Inquiries

...Visiting More than

Once

Page 61: Solution Design - The Hidden Side of UX (for Developers)

Did you prove it?

Revisit your Hypothesis

Page 62: Solution Design - The Hidden Side of UX (for Developers)

VALIDATE by…

1.  Creating a Beta Program

2.  Measuring the Results

Page 63: Solution Design - The Hidden Side of UX (for Developers)
Page 64: Solution Design - The Hidden Side of UX (for Developers)

    Joe Baz (@joebaz) www.abovethefolddesign.com

Thank you!