growth hacking ux: the journey to creating a kickass user experience

84
GROWTH HACKING: The journey to creating a kickass user experience. by @thedesignnomad

Upload: melissa-ng

Post on 14-Jul-2015

9.732 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Growth hacking UX: The journey to creating a kickass user experience

G R O W T H H A C K I N G :

The journey to creating a kickass user experience.

by @thedesignnomad

Page 2: Growth hacking UX: The journey to creating a kickass user experience

But it’s ten times more irresponsible not to think about the product.

P A U L G R A H A M

“It’s irresponsible not to think

about business models.

Page 3: Growth hacking UX: The journey to creating a kickass user experience

Awesome to use!

Geared for growth

U S E R E X P E R I E N C E

Page 4: Growth hacking UX: The journey to creating a kickass user experience

Who am I?

M E L I S S A N G

Page 5: Growth hacking UX: The journey to creating a kickass user experience

@thedesignnomad Nomadic UX UI designer + Product strategist

Clients in 5 continents (21 cities)

McDonalds, Samsung, Namecheap, Citibank

Lean + Agile

Founder of Melewi: travelling design studio

Page 6: Growth hacking UX: The journey to creating a kickass user experience

“Build pretty shoes and they will come!”

W H E N I W A S 1 9 Y E A R S O L D

Page 7: Growth hacking UX: The journey to creating a kickass user experience

NOPE.

T H E F A C E O F T H E U N W I T T I N G LY & F O O L I S H LY O P T I M I S T I C

Page 8: Growth hacking UX: The journey to creating a kickass user experience

Xin chào!

Page 9: Growth hacking UX: The journey to creating a kickass user experience

The Travelling Design Studio

@melewi

Page 10: Growth hacking UX: The journey to creating a kickass user experience

Engaging, Converting & Retaining users is both an art and a science necessary to growth.

You DON’T need massive resources

Keep it lean, 80/20 rule

Keep it agile, respond to feedback

Page 11: Growth hacking UX: The journey to creating a kickass user experience

U S E R E X P E R I E N C E

The experience a user has interacting with your brand at one touchpoint

oneC U S T O M E R E X P E R I E N C E

Page 12: Growth hacking UX: The journey to creating a kickass user experience

U S E R E X P E R I E N C E

The experience a user has interacting with your brand at one touchpoint

oneC U S T O M E R E X P E R I E N C E

Page 13: Growth hacking UX: The journey to creating a kickass user experience

C U S T O M E R E X P E R I E N C E

Page 14: Growth hacking UX: The journey to creating a kickass user experience

U S E R E X P E R I E N C E

The experience a user has interacting with your brand at one touchpoint

A series of methods & tools you use to

test and validate assumptions

one

two

Page 15: Growth hacking UX: The journey to creating a kickass user experience

A growth hacker is a person whose true north is growth

Everything they do is scrutinized by its

potential impact on scalable growth

S E A N E L L I S

G R O W T H H A C K I N G

Page 16: Growth hacking UX: The journey to creating a kickass user experience

Coder / Hacker /

AnalyticsG R O W T H H A C K I N GMarketer

Page 17: Growth hacking UX: The journey to creating a kickass user experience

G R O W T H H A C K I N G

U S E R E X P E R I E N C E

+B U I L D

M E A S U R E

L E A R N

Measure & Optimize

EngageAcquire

RetainConvert

*Acquire, Activate, Retain, Refer, Rev

Page 18: Growth hacking UX: The journey to creating a kickass user experience

A great UX can only help growth; without it, it will be extremely

difficult to Engage, Convert & Retain.

F I X T H E L E A K Y B U C K E T P R O B L E M

Page 19: Growth hacking UX: The journey to creating a kickass user experience

Measure!

Lean UX

NOT a one-size-fits-all

Consists of other vital components

Before we jump in…

Page 20: Growth hacking UX: The journey to creating a kickass user experience

10 Simple UX Hacks for GrowthM E L E W I ’ S

Page 21: Growth hacking UX: The journey to creating a kickass user experience

A C Q U I R E

E N G A G E

C O N V E R T

R E T A I N

01Don’t drive blindfolded

D O , M E A S U R E , L E A R N , R E P E A T

Page 22: Growth hacking UX: The journey to creating a kickass user experience

End goal: Validate & convert

Process: Optimizing

Get feedback & decide hypothesis

Implement incremental tweaks

B U I L D

M E A S U R E

L E A R N

Measure engagement (middle of the funnel)!

Feedback = Quantitative + qualitative

Page 23: Growth hacking UX: The journey to creating a kickass user experience

Acquisition, no problemo

BUT, users weren’t returning

What made users come back?

C A S E S T U D Y : T W I T T E R

Discovery: Following 5 - 10 accounts

Rebuilt a new UX around following others

Page 24: Growth hacking UX: The journey to creating a kickass user experience

2 people 30 mins 5 responses1 (Samsung) phone

Page 25: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

User surveys

Focus groups

Usability testing

Google Analytics

KISSmetrics.com

optimizely.com

mixpanel.com

crazyegg.com

F U R T H E R R E A D I N G

@hnshah - Hiten Shah

@neilpatel - Neil Patel

@unbounce - Unbounce

Page 26: Growth hacking UX: The journey to creating a kickass user experience

A C Q U I R E

E N G A G E

C O N V E R T

R E T A I N

02Talk to everyone, reach no one

K N O W W H O Y O U R U S E R S A R E - I N S I D E & O U T

Page 27: Growth hacking UX: The journey to creating a kickass user experience

Know who you’re targeting inside and out

What do they like and value? How do they think and behave?

You cannot target everyone!

Does your target audience segment even exist?

Cater your UX and messaging accordingly

Page 28: Growth hacking UX: The journey to creating a kickass user experience

Pretend you’re an actor in a film

Who’s your character?

Mimic them

Research them

Talk to them

T A C T I C : A N D … A C T I O N !

Be a creep without getting arrested

Page 29: Growth hacking UX: The journey to creating a kickass user experience

3 people 30 mins 24 responses

Page 30: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

User research - includes secondary research online

User personas

User surveys - shoulder taps, camp out at cafes, offer vouchers

Focus groups

F U R T H E R R E A D I N G

1. ux-lady.com/introduction-to-user-personas

2. pinterest.com/bearclaws75/ux-personas

Page 31: Growth hacking UX: The journey to creating a kickass user experience

A C Q U I R E

E N G A G E

C O N V E R T

R E T A I N

03Map the journey

I D E N T I F Y O P P O R T U N I T I E S W I T H I N A U S E R ’ S J O U R N E Y

Page 32: Growth hacking UX: The journey to creating a kickass user experience

The journey begins before the ‘Buy now!’ button appears

Understand the journey (highs & lows) to leverage them

User Experience Mapping or User Journey or Consumer Journey Map

Page 33: Growth hacking UX: The journey to creating a kickass user experience

AD

AP

TIV

E P

AT

H’S

GU

IDE

TO

EX

PE

RIE

NC

E M

AP

PIN

G

Page 34: Growth hacking UX: The journey to creating a kickass user experience

Identified who user was

Mapped out a typical day

Identified opportunity to leverage MySpace

C A S E S T U D Y : Y O U T U B E

INSANE growth!

Never would have happened otherwise

Page 35: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

User experience mapping User interviews User research

F U R T H E R R E A D I N G

1. smashingmagazine.com/2015/01/15/all-about-customer-journey-mapping

2. adaptivepath.com/ideas/the-anatomy-of-an-experience-map

3. mappingexperiences.com

4. Case study: Airbnb & Craigslist

Page 36: Growth hacking UX: The journey to creating a kickass user experience

E N G A G E

04Trust me

M A K E U S E R S F E E L S A F E

A C Q U I R E

C O N V E R T

R E T A I N

Page 37: Growth hacking UX: The journey to creating a kickass user experience

Not convincing to say you’re trustworthy

Proof comes externally

Social proof: Actions of the group influence actions of the individual

Make it as relatable as possible

Credibility can be borrowed

Perception of security level

Can I talk to you?

Page 38: Growth hacking UX: The journey to creating a kickass user experience
Page 39: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Testimonials

Face piles

Real names

Press / Biz logos

Social media widgets

Support / live chat

Credit card merchants

Security seals

F U R T H E R R E A D I N G

1. blog.kissmetrics.com/social-proof-factors-2

2. slideshare.net/QuiffBoy/pet-designing-for-persuasion-emotion-and-trust

Page 40: Growth hacking UX: The journey to creating a kickass user experience

E N G A G E

05Be the best hotel concierge

O N B O A R D I N G : G E T U S E R S S T A R T E D , E N G A G E D & I N V E S T E D

A C Q U I R E

C O N V E R T

R E T A I N

Page 41: Growth hacking UX: The journey to creating a kickass user experience

Increase pleasure, decrease pain

Preempt confusion and questions

Don’t talk at them (the lazy way)

Guide by getting users to take action

Get them invested!Have them give you a reason to be back in touch

F A C E B O O K , L I N K E D I N , I N S T A G R A M , A M A Z O N

S L A C K

B U F F E R , T W I T T E R

Page 42: Growth hacking UX: The journey to creating a kickass user experience

Step-by-step signup

Friendly & guided

Preempt possible issues

C A S E S T U D Y : S L A C K

Clear hierarchy + CTA

Page 43: Growth hacking UX: The journey to creating a kickass user experience

Step-by-step signup

Friendly & guided

Preempt possible issues

C A S E S T U D Y : S L A C K

Clear hierarchy + CTA

Page 44: Growth hacking UX: The journey to creating a kickass user experience

Step-by-step signup

Friendly & guided

Preempt possible issues

C A S E S T U D Y : S L A C K

Clear hierarchy + CTA

Page 45: Growth hacking UX: The journey to creating a kickass user experience

Step-by-step signup

Friendly & guided

Preempt possible issues

C A S E S T U D Y : S L A C K

Clear hierarchy + CTA

Page 46: Growth hacking UX: The journey to creating a kickass user experience

Step-by-step signup

Friendly & guided

Preempt possible issues

C A S E S T U D Y : S L A C K

Clear hierarchy + CTA

Page 47: Growth hacking UX: The journey to creating a kickass user experience

Animating (pulsing) tooltips

C A S E S T U D Y : S L A C K

Page 48: Growth hacking UX: The journey to creating a kickass user experience

Animating (pulsing) tooltips

Status indicator - no “how long is this gonna take?!”

C A S E S T U D Y : S L A C K

Page 49: Growth hacking UX: The journey to creating a kickass user experience

Animating (pulsing) tooltips

Status indicator - no “how long is this gonna take?!”

Ability to skip

C A S E S T U D Y : S L A C K

Page 50: Growth hacking UX: The journey to creating a kickass user experience

Animating (pulsing) tooltips

Status indicator - no “how long is this gonna take?!”

Ability to skip

C A S E S T U D Y : S L A C K

What’s this?! IT’S A TALKING ROBOT

Page 51: Growth hacking UX: The journey to creating a kickass user experience

Animating (pulsing) tooltips

Status indicator - no “how long is this gonna take?!”

Ability to skip

C A S E S T U D Y : S L A C K

What’s this?! IT’S A TALKING ROBOT

This is so exciting; does this feel like a form?

Page 52: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Usability testing

User experience mapping

F U R T H E R R E A D I N G

1. useronboard.com

Page 53: Growth hacking UX: The journey to creating a kickass user experience

E N G A G E

C O N V E R T

06Get rid of the ‘ugh’ parts

R E D U C E F R I C T I O N , R E M O V E O B S T A C L E S , R E P A C K A G E R E Q U E S T S

A C Q U I R E

R E T A I N

Page 54: Growth hacking UX: The journey to creating a kickass user experience

Increase pleasure, decrease pain

Reduce to the bare minimum

Ease the pain

Get creative (but test this)

Make it look simpler (than it actually is)

Offer value in exchange

Identify what that makes you go ‘UGH’

Page 55: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Usability testing

KISSmetrics.com

mixpanel.com

crazyegg.com

F U R T H E R R E A D I N G

1. Web Form Design: Filling in the Blanks by Luke Wroblewski

2. @lukew

Page 56: Growth hacking UX: The journey to creating a kickass user experience

E N G A G E

R E T A I N

07⌘ + t f + ↵

C R E A T E A H A B I T

A C Q U I R E

C O N V E R T

Page 57: Growth hacking UX: The journey to creating a kickass user experience

T R I G G E R

The Hook

Page 58: Growth hacking UX: The journey to creating a kickass user experience

The Hook

T R I G G E R A C T I O N

Page 59: Growth hacking UX: The journey to creating a kickass user experience

V A R I A B L E R E W A R D

The Hook

T R I G G E R A C T I O N

Page 60: Growth hacking UX: The journey to creating a kickass user experience

V A R I A B L E R E W A R D

The Hookanticipation of reward

A C T I O NT R I G G E R

Page 61: Growth hacking UX: The journey to creating a kickass user experience

T R I G G E R A C T I O N

V A R I A B L E R E W A R D

The Hookanticipation of reward

Page 62: Growth hacking UX: The journey to creating a kickass user experience

T R I G G E R A C T I O N

V A R I A B L E R E W A R D

I N V E S T M E N T

The Hook

Page 63: Growth hacking UX: The journey to creating a kickass user experience

Way too addicted to Facebook

Identify a compelling reward

Understand what drives your users

Leverage that

* Not all businesses need habit-forming products

How can you be more present / accessible? Chrome plugin?

Page 64: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Incentivize to share

Backlinks

Connect your network (viral loops)

Promo codes

User experience mapping

F U R T H E R R E A D I N G

1. Hooked by Nir Eyal

2. @nireyal [Twitter]

3. Viral Loop: From Facebook To Twitter, How Today’s Smartest Businesses Grow Themselves by Adam L. Penenberg

Page 65: Growth hacking UX: The journey to creating a kickass user experience

08So close… Click ‘Buy now’ *

R E D U C E C A R T A B A N D O N M E N T R A T E S + C L O S E T H A T S A L E

C O N V E R T

A C Q U I R E

E N G A G E

R E T A I N

Page 66: Growth hacking UX: The journey to creating a kickass user experience

Guest checkout - 30% abandon cart when forced to register

Stop with the insane forms!!

Identify areas for possible duplicates (e.g. shipping & billing address)

Autofill, but leave editable

Trusted payment gateways / 1-click payment

Step 1 of 4: Progress indicator

Be helpful with extra info (but don’t surface them until needed)

Page 67: Growth hacking UX: The journey to creating a kickass user experience

Abandoned just before checkout

Replacing "register" button with "continue"

What made users come back?

C A S E S T U D Y : $ 3 0 0 M I L L I O N B U T T O N

1st month: Sales went up 45% ($1 million)

1st year: $300 million

S U P P O S E D LY

Page 68: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Usability testing

A/B split testing

crazyegg.com

mixpanel.com

KISSmetrics.com

usertesting.com

F U R T H E R R E A D I N G

1. rjmetrics.com/resources/webinars/a-marketers-guide-to-ecommerce-growth-hacking

2. grow.kissmetrics.com/optimize-growth-with-km

3. uie.com/brainsparks/2011/10/17/the-back-story-for-the-300-million-button/

4. smashingmagazine.com/2012/09/04/the-state-of-e-commerce-checkout-design-2012/

Page 69: Growth hacking UX: The journey to creating a kickass user experience

E N G A G E

C O N V E R T

R E T A I N

09Go the extra mile to delight

I N C L U D E L I T T L E T O U C H E S T O M A K E A N A W E S O M E E X P E R I E N C E

A C Q U I R E

Page 70: Growth hacking UX: The journey to creating a kickass user experience

Increase pleasure, decrease pain

Keep it accessible, friendly, welcoming

A step-at-a-time, don’t overwhelm

Transparency

Preempt questions

Is there a way to do things better?

Page 71: Growth hacking UX: The journey to creating a kickass user experience

Scan your credit card

Remove pain points - cash payment

C A S E S T U D Y : U B E R

Page 72: Growth hacking UX: The journey to creating a kickass user experience

Scan your credit card

Keep me in the loop

Remove pain points - cash payment

C A S E S T U D Y : U B E R

Page 73: Growth hacking UX: The journey to creating a kickass user experience

Scan your credit card

Keep me in the loop

Remove pain points - cash payment

C A S E S T U D Y : U B E R

Remove ambiguity - ‘what’s going on?!’

Page 74: Growth hacking UX: The journey to creating a kickass user experience

Scan your credit card

Keep me in the loop

Remove pain points - cash payment

C A S E S T U D Y : U B E R

Give users a voice - rate drivers

Overall, a delight to use

Remove ambiguity - ‘what’s going on?!’

Page 75: Growth hacking UX: The journey to creating a kickass user experience

Overall, a delight to use

Page 76: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

User Personas

Use Cases & Scenarios

User Stories

Storyboards

Brand’s Tone of Voice

F U R T H E R R E A D I N G

1. abookapart.com/products/designing-for-emotion

2. developers.google.com/events/io/sessions/326368573 [pg 89]

Page 77: Growth hacking UX: The journey to creating a kickass user experience

A C Q U I R E10Deliberately share the goodnessA G O O D R E A S O N T O S H A R E + I N B U I LT S H A R I N G M E C H A N I S M S

E N G A G E

C O N V E R T

R E T A I N

Page 78: Growth hacking UX: The journey to creating a kickass user experience

Chuck in social media buttons and… MAGIC!

Don’t include sharing as an afterthought

Build sharing INTO your product

User: what does this do for ME?

Repackage what you want them to do into what they want from you

Piggyback off actions users takeH O T M A I L , B U F F E R

D R O P B O X , U B E R

N A S T Y G A L

Page 79: Growth hacking UX: The journey to creating a kickass user experience

Instagram

Uber

Dropbox

BufferE X A M P L E S

Hotmail (20%)

Nastygal

Page 80: Growth hacking UX: The journey to creating a kickass user experience

T O O L S

Incentivize to share

Backlinks

Connect your network (viral loops)

Promo codes

User experience mapping

F U R T H E R R E A D I N G

1. Crunched presents Growthhacking - vimeo.com/55465048

2. @mattangriffel

Page 81: Growth hacking UX: The journey to creating a kickass user experience

conclusion1. Don’t drive blindfolded

2. Talk to everyone, reach no one

3. Map the journey

4. Trust me

5. Be the best hotel concierge

Page 82: Growth hacking UX: The journey to creating a kickass user experience

conclusion6. Get rid of the ‘ugh’ parts

7. ⌘ + t f + ↵ - Make it a habit

8. So close… Click ‘Buy now’

9. Go the extra mile to delight

10. Deliberately share the goodness

Page 83: Growth hacking UX: The journey to creating a kickass user experience

RememberGood growth hacking vs. Bad growth hacking =

Good UX vs. Bad UX

Go through the funnel! Don’t just focus on ‘Acquire’

Deck: slidesha.re/1A5xY4x

Page 84: Growth hacking UX: The journey to creating a kickass user experience

Melissa Ng @thedesignnomad

[email protected]

www.melewi.net

Thank you!