How to design stuff that matters fast - Dev Week 2014

#UX #Design @Ultraman

How to design stuff that matters, fast!

Eewei Chen @ultraman #UX #Design


11:00 - 11:30

13:00 - 14:00

15:30 - 16:00

17:30

Before we start...

Coffee Break

Lunch

Coffee Break

Finish

Wifi: DevWeek2014


1994

Eewei Chen @Ultraman

Design happinessPresent


Stay connected

ANYTIME

SKY+

SKY GO

EPG

MOBILE WEB


Why design fast?

Copyright 101DesignIngredients.com


Why design fast?

no longer exist

no one can live without

Stay alive


Why design fast?

How will they stay alive?

#UX #Design @Ultraman 8

no longer exist

Improve early

Problem- Findability and Usefulness of info

Why design fast?

Solution+ Simplified and Personalised


http://www.netpaths.net/blog/design-dividend-payback/

Increase value

Why design fast?


Is there a secret formula?



Is there a secret formula?

• Domain Research• Trend & Market Insight• Data Analysis• Competitor Benchmarking• Persona Creation • Requirements Gathering• Value Mapping• Business Model Generation • Strategy & Value Prop• etc...

• Lean Startup, Lean UX, UCD• Scenarios & Use Cases• Sketching• Mental Model• Interaction Design• Visual Design• Storyboarding• Technology Spiking• Rapid Prototyping• Usability Testing• Iterative Design• etc...

Optimisation

Agile delivery

Lean startup

Design thinking

Uncertainty Focus

• Roadmap & User Story Creation• Dev Integration & Support• Continuous Agile, Lean UX Design• Wireframes to Experience Maps• Entity Relationship Maps• Interaction Models & UI Patterns• Prototype to Live Code Evolution• Site Map & Page Types• Information Hierarchy & Page Layout• Design Style Guide, Mockups & Assets• Brand Guidelines & Principles• Presentations & Information Radiators• Co-location & Design Studio Flex• Usability Testing & Recommendations• Post-Launch Support & Testing• etc...

Yes, but not much time

today!


Form Teams



Product Word Match

15 mins

1. word + word = Product Name2. What problem are you solving?3. Who is it for?4. Why will it work?5. How will you make money?

30 sec pitch

Icebreaker


The Challenge

Analyse the data

Solve the right problem

Make a connection

Define success

Present early thinking

Agenda

Physical vs Digital

Prototype

Embrace chaos

Business Model

Presentation Prep

Pitch Ideas!

✓ Why design fast?

✓ Is there a secret formula?

✓ Form teams

1 2


The Challenge



• Self-service

• Customization• Personalization

• Anytime, anywhere

• Location awareness

People’s expectations are changing

People are changing

• Diversity of interests

• Generational differences• Reliance on technology

• Communication

• Mobility

The challenge Absorb this


• Digitally-connected customers

• Membership and community• Shared ownership: space, stuff, and skill

• Social culture

• Co-creation

How people interact with each other is changing

• Participation

• Crowd-fund• Crowd-source

• Networks and partnerships

• STEAM

How people interact with brands & institutions is changing

The challenge Absorb this


The challenge

*Facebook poll

TextText

Comedy Action

SportForeign

Happy

Sad

Inspired...

Not in the mood

Too much choiceNo Time

Didn’t know

Which device?

Absorb this


The challenge

Create a connected digital experience that better entertains people

where they want, when they want,

on any device they want.

Television 2.0


The challenge

Steve Jobs


culture

commute

conference

home

shop

holiday

work

play

exercise

family

friends

dine

sport

hobby

school

sleep

relax

colleagues

The challenge

Digital2D

Physical3D

Time4D

ConnectedUX

More connected the better?


Take a deep breath...

Work fast

No right or wrong

Be positive

Works as a team

Breadth not Depth

Have fun

Small screenLimited input

ControllersPerformanceBattery-life

Voice activationLocation-aware

TouchGestures


Analyse the data



Analyse the data

Discuss...

How can analysing data help?


Improve business KPIs

Analyse the data

We’re losing 10% of customers monthly. Help services need to be more:

• Useful

• Accurate

• Easy to get to

We need to increase our current 32% conversion rate to 50% with:

• Smarter upgrades

• Timely renewal offers

• Better personalisation

We need to raise new customers acquisition from 100K to 200K pa using:

• New brand values

• Innovative features

• Better marketing

Attract Increase Retain


Which KPI to focus on?


Align device experiences

Analyse the data

• 55% of Europeans prefer Android phones, 23% prefer iPhones• 80% of tablet use is at home: tablet users spend more online than smartphone users• 26% use tablets daily 1 to 4 hrs, 7% more than 5 hrs per day• Primary device is smartphone (77%), but tablets rising from 12% (2012) to 23% (2013)

http://www.digitalstrategyconsulting.com/intelligence/2013/08/mobile_usage_trends_80_of_tablet_use_happens_at_home.php

What on which device?


Focus on target demographic

Analyse the data Which age group?





Who is it for?


Identity Motivation

Explorer Personal curiosity, experience something new

Samaritan Does something on someone else’s behalf

Achiever Looking to satisfy specific interests or goals

Recognition Seeker Reputation / status of place or brand

Recharger Restoration, contemplation

Identifier Personal relation to subject / experience / brand

Now that you’ve analysed the data...


What’s the problem?

Who is it for?

I like going to places and events I see in movies like shops and restaurants.

My husband and I used to go on movies dates. I miss having time, just for the two of us.

It’s hard finding things to watch as a family so we end up watching what the kids want.

AnnIdentifier

JeffRecognition seeker

I love playing games, especially if there is a prize, but it needs to be challenging.

I voice my opinion on blog sites and like to hear what others think about hot topics.

I do a lot of research but can’t always find info on a new film or unusual director.

I try things out first then tell others about it so they know what’s good or bad.

My friends look to me for inspiration, so I end up organising meet ups.

We discuss movies we like but keeping up-to-date with everyone takes a lot of time.

AlistairExplorer


Which opportunities?

Mobile advertising

Connected multi-device synching

sentiment analysis (Data)

Mobile payments

Social TV



Which trends?

Point & Know(the matrix)

Crowd sourcing(right advice)

DIY Health(well being)

Second screen(multi task/context)

Gamification(beat the competition)

Status Skills(learn/improve)

Brand me(social good)



Triggers

Failed trigger

Target Behaviour Trigger

Core Motivators• Pleasure / Pain• Hope / Fear• Acceptance / Rejection

HIGHMOTIVATION

LOWMOTIVATION

LOWABILITY

HIGHABILITY

Facilitatore.g. Sharing knowledge on social network sites (pleasure)

Simplicity Factors• Time• Money• Physical Effort• Brain Cycles• Social Deviance• Non-Routine

Signale.g. Personalised notification settings (hope/time)

Sparke.g. Leader board (social deviance)

Make a connectionhttp://www.behaviormodel.org/

BJ Fogg


Coffee Break



Prove it

http://www.youtube.com/watch?v=b240PGCMwV0

Validating ideas is not a new concept...


Validate (Lean Startup + Agile)

•Guess•Consequence•ExperimentCornell U, 1964

•Assumption•Validate•MVPSeptember 2011

Richard Fenyman Eric Ries

Validating ideas is not a new concept...


Nordstrom iPad app prototype

https://www.youtube.com/watch?v=szr0ezLyQHY

In the wild...


Make a connection



Make a connection

Personas represent a target audience with similar needs.

They help to create customer:

• Behaviours• Needs & goals• Barriers• Features (output)• Scenarios / use cases

Why do we need personas?


Details

Behaviours

★ Loves playing games★ ...★ ...

Needs & Goals

• Share movie knowledge to show off

• ...• ...

Barriers

• No one to compete with• ...• ...

Output

• Leader board• ...• ...

“I helps me to stay no.1”

“I couldn’t ... before.”

Time poor Time rich

Summary

“It’s so ... now”

SpecificGeneric

SocialAnti-social

Lean forwardSit back


• 34 & single by choice• front-end developer (£55K)• Gadget crazy, foodie

Create your persona

Make a connection


Define success



Output

Delivered featuree.g. leader board (gamification)

Outcome

Immediate change by an output.e.g. Increase repeat visits by 15%

Impact

Larger change over time (KPI)e.g. Increase mobile ad impressions by 10%

Output, outcome, impact

Define success

Jeff Gothelf


Define outputs

Outcome

Behaviours

ImpactBarrier

Needs & Goals

30 mins

OutputsMarketingFriend’s shared TV shows on Facebook

Loves playing games

Wants to share movie knowledge to show off

Leader board(trigger)

No one to compete with

Make a connection


Output, outcome, impact

Outputs

Outcome

Behaviours

ImpactBarrier

Marketing

Needs & Goals

15 mins

Friend’s shared TV shows on Facebook

Loves playing games

Wants to share TV knowledge with friends

Leader board(trigger)

No one to compete with

Increase repeat visit rate by 15%

Increase mobile Ad impressions by 10%

Define success


ROI*

Business ImpactUser ImpactEffort

1 - low2 - Medium3 - High

15 mins

High Impact

High Effort

Quick Wins

Remove Innovate

TBD

Low Impact

Low Effort

Emotion detector

Mobile ad system

iOS7 revamp

* Based on relative Business & Customer impact

Define success

Leader board

Prioritise outputs


Define success 15 mins

Easy to use

Relevant

Hard to use

Irrelevant

More fun?

Inaccurate suggestions

Too Obvious

Expensive package

Information overload

Beat the competition

???

Old movies


Define success

Product statement / Marketing message

15 mins

For Jeff the experience seeker who wants to be recognised for his knowledge, “ReelSide” is an App that lets him watch the latest films, but unlike other entertainment apps , “Reelside” let’s him compete against other movie geeks to win exclusive viewing privileges

“Compete to watch films first”

Strapline

Dave Gray

http://www.gogamestorm.com


Present early thinking


15 mins

• Pick a spokes person

• Elevator pitch


Lunch


40 mins


✓ The Challenge

✓ Analyse the data

✓ Solve the right problem

✓ Make a connection

✓ Define success

✓ Present early thinking

Agenda

Physical vs Digital

Prototype

Embrace chaos

Business Model

Presentation Prep

Pitch Ideas!

✓ Why design fast?

✓ Is there a secret formula?

✓ Form teams

1 2


Sticky Whispers

15 mins

1. Think of a lyric or quote2. Write it on a post it3. Cover it with a blank post-it4. Pass on5. Look at covered post-it6. Draw on blank post-it7. Cover it with a blank post-it8. Pass on9. Repeat, alternate between text and drawing

Icebreaker

text

pic

text

pic

No talking!


Details

Behaviours

★ Loves playing games★ ...★ ...

Needs & Goals

• Share movie knowledge to show off

• ...• ...

Barriers

• No one to compete with• ...• ...

Output

• Leader board• ...• ...

“I helps me to stay no.1”

“I couldn’t ... before.”

Time poor Time rich

Summary

“It’s so ... now”

SpecificGeneric

SocialAnti-social



• 34 & single by choice• front-end developer (£55K)• Gadget crazy, foodie

Create your persona

Make a connection


15 minsDefine success

Details

Behaviours Needs & Goals

Barriers Output

Time poor Time rich

Summary

SpecificGeneric

SocialAnti-social


Create your persona


Physical vs Digital



Physical vs Digital

Physical to Digital

Digital OnlyReplacement for the physical

Digital Overlaydigital information layer

Physical Computingphysical and digital interact

Digital Gatewayuse digital to gain access to physical

Physical Onlypurely physical experience


Physical vs Digital

Engagement

PassiveViewing

Activeinteracting alone

InteractiveInteracting with others

CreativeCreating alone

Low engagement High engagement

Co-CreativeCreating with others


Physical vs Digital

Opportunity Map

PassiveViewing

Activeinteracting alone

InteractiveInteracting with others

CreativeCreating alone

Low engagement High engagement

Co-CreativeCreating with others

Digital OnlyReplacement for the physical

Digital Overlaydigital information layer

Physical Computingphysical and digital interact

Digital Gatewayuse digital to gain access to physical

Physical Onlypurely physical experience

Elliot Felix


Physical vs Digital

Write out core activities

15 mins

Common activities when looking for something to watch.

Entice Enter Engage Exit Extend

Hear about a good movie

Get reminder notification

Receive special offer

...

...

Launch app

Sign-in / Register

...

...

Browse genres

Add to watch list

Watch movie

...

...

Rate movie

Share movie

Review related movies

...

...

Social network

Subscribe / upgrade

View trailers

...

...

Browse latest movies


Physical vs Digital

Map out expected core experience

30 mins

1. Reflect on what, how, when & where experiences happen.

2. Write more accurate activities on a post-it and plot them on your opportunity map.

3. Make a note of missing opportunities?

23

Hear about a good movie

Read about a good movie on Facebook using my iphone on the train to work

Quick review!


Physical vs Digital

Map out New & Improved experience

30 mins

Brainstorm and document new activities or experiences that could fill in the opportunity spaces.

You could also think of ways to modify and improve existing activities/experiences.

Get location based movie recommendations on my smart watch as I walk home.What, how, when &

where...

Quick review!


ROI*

Business ImpactUser ImpactEffort

1 - low2 - Medium3 - High

15 mins

High Impact

High Effort

Quick Wins

Remove Innovate**

TBD

Low Impact

Low Effort

* Based on relative Business & Customer impact ** Also includes platform or processes that enable innovation

Physical vs Digital

Read about a good movie on Facebook using my iphone on the train to work

Get location based movie recommendations on my smart watch as I walk home.

Quick review!


Physical vs Digital

Join up ideal activities

take individual activities and experiences and...

Think about the relationship to each other, the spaces, the devices and interactions in context over time

Physical

Digital

Time

Expected/current experienceNew, improved (“filling in gaps”)

9. Get location based movie recommendations on walk home (Smart watch, street)



Prototype

People, spaces and activities

30 mins

4. Browse genres (iPhone, train)

6. Start watching movie at lunch time (laptop/office)

7. Rate movie after finishing it to move up the leader board on the train home (iPad)

8. Share movie whilst waiting for coffee (Google glass, cafe)

2. Launch app (iPhone, train)

3. Sign-in / Register (iPhone, train)

1. Read about a movie on the train platform to work (newspaper)

5. Add to “Watch list” (iPhone/train)

Digital

Physical

time

Waiting for train Train to work Train home / cafeTrain / Work Walking home

Pure Web

Web AppWrapped Web

Hybrid Native

Play, pause, resumeHolistic engagementMulti-device

Plot the happy path


Coffee Break



Prototype



Prototype

Things to remember...

Physical vs Digital

Triggers

Continuous connection

Persona

Engagement

DeviceTrends Data

Competition


Prototype

Concept creation

1

23

45 6

1 2 3 4

5 6 7 8

Note down:

• Physical vs Digital: Activities, Spaces• Devices: Tech / Tools, People / Services• 5 Es: Entice, Enter, Engage, Exit, Extend• Engagement: Alone or with others?

2. Launch app (iPhone, train)

3. Sign-in / Register (iPhone, train)

2. Launch app and sign-in/register (iPhone, train)

=

Group multiple outputs into 1 design & sketch!


Prototype

Concept testing in your team

20 mins

• Form pairs• Each Sketch 8 up - 5mins• Pitch to each other - 2 mins• Pair critique - 2 mins

Detail

USP

Key interactions

Data/KPIs

Trends/Opps

• Individually absorb feedback• 2-3 ways it solves problem• 1-2 ways for improvement• Each Sketch 1 up - 5mins• Pitch to your group - 5 mins• Group critique - 5 mins• Agree changes as a group

10 mins


Physical vs Digital

Storyboard group’s agreed experience

Digital

Physical

timeAt home Commute CommuteAt work At gym


10 mins


Quick practice pitch

5 mins

• Connected experience

• 8 up

• 1 in-depth sketch


• Practice pitch

Physical vs Digital

Trend/Opp

Device

Persona

Problem

Solution


Embrace chaos



Embrace chaos

Challenge your ideas

“Whenever we propose a solution to a

problem, we ought to try as hard as we can to

overthrow our solution, rather than defend it.”

- Karl Popper, philosopher


Embrace chaos

Pitch to investors


• 3 minutes to present concept to investors.

• Other teams are investors hearing a startup pitch. They listen in silence

• NO questions can be asked

• Investor team notes down everything wrong with the concept

e.g. why it won’t work, the holes and how competitors are better

3 mins


Embrace chaos

Investors discuss!

• Spokesperson faces away from investors and listens in silence

• Investor team discusses feedback out loud as harshly as possible.

• Spokesperson cannot respond to questions or defend the ideas.

• Spokesperson can only take notes on what they hear.

• Spokesperson take notes back to their startup team.

3 mins


Embrace chaos

Active Decision Model

3 mins

Comment Ignore Remove Innovate Best practice


Do it again

3 mins

Trend/Opp

Device

Persona

Problem

Solution

Physical vs Digital

• Connected experience

• 8 up

• 1 in-depth sketch

• Practice pitch


Embrace chaos

Ritual dissent & assent

• Early concept validation

• Quickly lowers inhibitions

• Removes fat

• Generates ideas

• Team buy-in

• Ownership/investment

• Avoid premature convergence

http://cognitive-edge.com/library/methods/ritual-dissent/

Design Ritual

dissent

Active

Decision

Model

Design

(80/20)

Ritual

dissent

Active

Decision

Model

Design Ritual

Assent

Dave Snowden


Business Model


https://www.youtube.com/watch?v=l5Tw0PGcyN0Simon Sinek


Business Model

Marketing

• Acquisition: arrival from channels (social?)

• Activation: enjoy the initial visit (trial?)

• Retention: re-visit (trigger?)

• Referral: tell others (advocacy)

• Revenue: pay for services (loyalty)

http://www.slideshare.net/dmc500hats/startup-metrics-for-pirates-long-version

Dave McClure

Pirate metrics


Business Model

Reduce risk

h(p://prac/cetrumpstheory.com/2011/10/the-‐10x-‐product-‐launch/

Ash Maurya


Business Model

Spend vs Revenue (12 months)

30 mins

1. ProblemNo one to compete with

1. Customer SegmentsExperience seeker

2. Early adopter:Compe//ve movie fan

3. Unique Value Proposi9on

Compete to watch films first

Unfair AdvantageThe more you play, the

more you earn

2. Solu9onAutoma/c sentence analysis of tweets and

posts

3. ChannelsSmartphone

TabletSocial media

4. Key MetricsSocial network traffic %

Purchase %Upgrade %(AARRR)

3. Cost Structure (spend)Staff

PR, Social MediaRental, Equipment, Hos/ng

2. Revenue StreamsRevenue Share?Affiliate links?

Mobile adver/sing?

1. Exis3ng alterna3ves:NeWlixNow TV

Amazon Prime...


12

user

s (m

illio

ns)

63

0.5

1

1.5

2

Reduce market riskTipping pointSeries A funding

Main features?Marketing?Platform?

infrastructure approach?

New channels?New features?

New revenue model?(beat the competition)

Months

2.5

3

3.5

Your plan

15 mins


Presentation prep



Presentation prep

1. The problem2. Elevator pitch3. Market opportunity4. Your solution prototype5. Business model

6. Technology7. The competition8. Marketing plan9. The team10. Money / Milestones

http://www.slideshare.net/dmc500hats/10-tips-on-how-to-pitch-a-vc-fowa-london

10 investment tips


Presentation techniques

Presentation prep

Tell a story Role play Advertise

Product demo Usability test

30 mins


Pitch Ideas!


30 mins


Thanks!

Eric Rieswww.startuplessonslearned.com

Eewei Chenhttp://101DesignIngredients.com

Steve Blankhttp://steveblank.com/books-for-startups/

Jeff Gothelf / Josh Seidenwww.startuplessonslearned.com

Dave Grayhttp://www.gogamestorm.com/

Ash Mauryahttp://runninglean.co/

PragProgEeweiChen101(25% off code)

How to design stuff that matters fast - Dev Week 2014

Design

lean ux design wireframes

ultraman stay

ultraman http

d connected ux

ultraman form teams

ultraman product word

challenge copyright

data copyright