Startup UCLA8.6.2013

WTF UX?

Startup UCLA8.6.2013

Startup UCLA8.6.2013

SKOT CARRUTHFounding Partner,philosophie

Startup UCLA8.6.2013

WHAT IS UX?“User experience” encompasses all aspects of the end-user’s interaction with the company, its services, and its products.

Nielsen Norman Group

Startup UCLA8.6.2013 © 2009 iA

Startup UCLA8.6.2013

Startup UCLA8.6.2013

WHO IS YOUR USER?• Personal History• Culture• Education• Motivations• Mood

Personal factors

Startup UCLA8.6.2013

WHERE, WHY, HOW?• Location• Distractions• Devices• Other people

Contextual factors

Startup UCLA8.6.2013

USER RESEARCH• Use market research• Look at competitors• Conduct a survey• Interview people

What do they need? How will they use it?

Startup UCLA8.6.2013

FOCUS GROUPS

SURVEYS

ETHNOGRAPHIES

EYE-TRACKING

Startup UCLA8.6.2013

DEFINE• User scenarios• User tasks• User stories• Features

What do you think you need to build?

Startup UCLA8.6.2013

You are stuck in North Korea and trying to book a flight out of the country from your Blackberry. Speed is of the essence.

User scenarioDEFINE

Startup UCLA8.6.2013

• Find and select the departure• Find and select the destination• Select travel time and date• View available flights• Pay for flight• Get ticket

User tasksDEFINE

Startup UCLA8.6.2013

As a user, I want to filter flights by time so that I can get out of North Korea as quickly as possible.

User storiesDEFINE

Startup UCLA8.6.2013

• Affordances = UI elements• Start with sketches• Think about how users move through the app• Use empathy

Boxes and arrows > colors and typographyDESIGN

Startup UCLA8.6.2013

Sketches — lo-fiDESIGN

Startup UCLA8.6.2013

Sketches — lo-fiDESIGN

Startup UCLA8.6.2013

Analogs and conventionsDESIGN

Startup UCLA8.6.2013

EmpathyDESIGN

Startup UCLA8.6.2013

• Paper prototypes youtube.com/watch?v=9wQkLthhHKA

• Wireframes Omnigraffle, Axure, Hype

• HTML prototype• Rails prototype Scaffolding

Make it quickly and cheaplyDESIGN

Startup UCLA8.6.2013

• “Hallway testing”• Ask users to complete tasks Example: how would you edit this widget?

• Watch for confusion• Incorporate feedback

Show it to some people — “beta” testersVALIDATE

Startup UCLA8.6.2013

• Real users are better• Continually refine your app• Agile development

Rinse and repeat

Hypothesize → Design → Implement → Measure

BUILD + LAUNCH

Startup UCLA8.6.2013

THANKS!skot@gophilosophie.com@skotcarruth