First Impressions Matter: LeanUX Design of Landing Page #2


Published on

My talk from Lean Startup Machine Tokyo 2013 held Dec. 13th - 15th.

Published in: Design, Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

First Impressions Matter: LeanUX Design of Landing Page #2

  1. 1. First Impressions Matter: LeanUX Design of Landing Page ‘13 @mariosakata (Courtesy of Jefrey Bulla) Lean Startup Machine Tokyo | Dec 13th-15th 2013
  2. 2. User Experience & User Experience Design
  3. 3. What’s the point? UX Design is NOT new
  4. 4. What’s the point? UX Design is NOT time consuming
  5. 5. What’s the point? UX Design IS added value
  6. 6. What’s the point? KNOW the User ⌃ UNDERSTAND
  7. 7. What’s the point? Think in their WORKFLOW
  8. 8. What’s the point? Speak in their LANGUAGE
  9. 9. Why? •  There is an intended behavior we want to create. •  We have no direct control over user behavior. •  Design gives us means to control the contextual environment and evaluate the resulting effect.
  10. 10. Why? “Customers don’t care about your solution. They care about their problems.” - @davemcclure
  11. 11. First Touchpoint Experience Customers are increasingly using the web as first touchpoint. *Winning  the  Zero  Moment  of  Truth  (ZMOT)   First impressions are 94% design related; positive first impressions lead to higher satisfaction. *Persuasive  Design  of  Des:na:on  Web  Sites:  An  Analysis  of  First  Impression   *Users  love  simple  and  familiar  designs  –  Why  website  need  to  make  great  first  impression  
  12. 12. “Powers of 10” 0.1sec: Form first impression about a website. 1sec: Stay focused on their current train of thought. 10sec: Often leave the website. 1min: Able to complete simple task. 10min: Long visit to a website. (Cont’d) *Powers  of  10:  Time  Scales  in  User  Experience  
  13. 13. Starting Point of Journey *User  Experience  Journey  Map  
  14. 14. Create & Encourage Emotional Connection Build ‘Memorable’ Website
  15. 15. Create & Encourage Emotional Connection What’s ‘Memorable’?
  16. 16. Create & Encourage Emotional Connection Attractive *Plutchik’s  Emo:on  Wheel  
  17. 17. Create & Encourage Emotional Connection Useful
  18. 18. Create & Encourage Emotional Connection Empathy
  19. 19. ‘Emotional’ Landing Page
  20. 20. Tinke
  21. 21. Knock
  22. 22. Path
  23. 23. Simplified Layout Headline •  Key Benefit •  Key Benefit •  Key Benefit Social Proof Large Graphic ççèè         éé           êê           Call-to-Action
  24. 24. Headline First thing read for customers to search for specific solution to their problem. *Airbnb   Big Picture Hypothesis = Solution Hypothesis = Value Proposition
  25. 25. Key Benefits How does your product or service benefit the customer? *Instagram  
  26. 26. Large Graphic Image high-lighting product and conveys happy customer experience. *Square  
  27. 27. Social Proof Social networks to establish credibility and trust by building multitouchpoints.
  28. 28. Call-to-Action Solicit one clear action that tests your riskiest assumptions. *Flickr   Total number and ratio of early adaptors, interests, etc.
  29. 29. Questions to be answered Stimulus Awareness Relevance Who is this for? How long will this take? What should I do next? Where should I go next? How should I do it? *ARCS  Model   Confidence Satisfaction
  30. 30. Lean Startup + User Experience
  31. 31. LeanUX *  LiU  of  Pi  
  32. 32. LeanUX LeanUX book is coming out in Japanese next month!
  33. 33. LeanUX Thinking Collaborative, Transparent, and Demystify.
  34. 34. LeanUX Thinking Documents don’t solve customer solutions.
  35. 35. LeanUX Thinking Build the right ‘it’ before build ‘it’ right.
  36. 36. Make An Assumption of Your Customers Name and Picture What does the persona look like? What’s the persona’s name? Characteristics What are the persona’s relevant characteristics? Need and Pain Why the persona want to use the product ? *Persona  Sets  
  37. 37. Make An Assumption of Your Customers
  38. 38. Test Your Ideas *Lean  ways  to  test  your  new  business  idea  
  39. 39. Test Your Ideas
  40. 40. How’s his/her journey? *User  Experience  Journey  Map  
  41. 41. Don’t blow it •  The headline is everything and will probably have the biggest impact on conversions—A/B Split Test the Headline. •  Don’t speak about your product or function, speak about your vision. •  Don’t be lazy about the page design. Polish = Credibility. •  People don’t read. Keep copy clear & concise.
  42. 42. Memorable Landing Page Attractive Makes you feel… Useful Helps you do… Empathy Says about your…
  43. 43. CPS Evaluation Problem Change Hypothesis KPI Setting Points of Improvement No Data Make an assumption Planning With Data Identify pattern Customer Change Target User Success! Solution Pivot or Die Hypothesis User Research Planning Execute Evaluation
  44. 44. First Impressions Matter: LeanUX Design of Landing Page @mariosakata