G R O W T
H H A C K I N G : The journey to creating a kickass user experience. by @thedesignnomad

But it’s ten times more
irresponsible not to think about the product. PA U L G R A H A M “ It’s irresponsible not to think about business models.

Awesome to use! Geared for
growth U S E R E X P E R I E N C E

Who am I? M E
L I S S A N G

@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

“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

NOPE. T H E FA
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

Xin chào!

The Travelling Design Studio
@melewi

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

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 one C U S T O M E R E X P E R I E N C E

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 one C U S T O M E R E X P E R I E N C E

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

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

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

Coder / Hacker / Analytics
G R O W T H H A C K I N GMarketer

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 Engage Acquire Retain Convert * Acquire, Activate, Retain, Refer, Rev

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

Measure! Lean UX NOT a
one-size-fits-all Consists of other vital components Before we jump in…

10 Simple UX Hacks for
Growth M E L E W I ’ S

A C Q U I
R E E N G A G E C O N V E R T R E TA I N 01 Don’t drive blindfolded D O , M E A S U R E , L E A R N , R E P E AT

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

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

2 people 30 mins 5
responses1 (Samsung) phone

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

A C Q U I
R E E N G A G E C O N V E R T R E TA I N 02 Talk 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

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

Pretend you’re an actor in
a film Who’s your character? Mimic them Research them Talk to them TA C T I C : A N D … A C T I O N ! Be a creep without getting arrested

3 people 30 mins 24
responses

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

A C Q U I
R E E N G A G E C O N V E R T R E TA I N 03 Map 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

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

ADAPTIVEPATH’SGUIDETOEXPERIENCEMAPPING

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

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

E N G A G
E 04 Trust 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 TA I N

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?

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

E N G A G
E 05 Be the best hotel concierge O N B O A R D I N G : G E T U S E R S S TA 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 TA I N

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 FA C E B O O K , L I N K E D I N , I N S TA 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

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

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

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

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

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

Animating (pulsing) tooltips C A
S E S T U D Y: S L A C K

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

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

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

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?

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

E N G A G
E C O N V E R T 06 Get 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 TA C L E S , R E PA C K A G E R E Q U E S T S A C Q U I R E R E TA I N

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’

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

E N G A G
E R E TA I N 07 ⌘ + t f + ↵ C R E AT E A H A B I T A C Q U I R E C O N V E R T

T R I G G
E R The Hook

The Hook 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 Hook 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 Hook anticipation of reward A C T I O NT R I G G E R

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 Hook anticipation of reward

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

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?

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

08 So 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 AT E S + C L O S E T H AT 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 TA I N

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)

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

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/

E N G A G
E C O N V E R T R E TA I N 09 Go 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

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?

Scan your credit card Remove
pain points - cash payment C A S E S T U D Y: U B E R

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

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?!’

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?!’

Overall, a delight to use

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]

A C Q U I
R E10 Deliberately share the goodness A 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 TA I N

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 take H 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

Instagram Uber Dropbox Buffer E
X A M P L E S Hotmail (20%) Nastygal

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

conclusion 1. Don’t drive blindfolded
2. Talk to everyone, reach no one 3. Map the journey 4. Trust me 5. Be the best hotel concierge

conclusion 6. 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

Remember Good 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

Melissa Ng @thedesignnomad melissa@melewi.net www.melewi.net
Thankyou!