O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

First Impressions Matter: LeanUX Design of Landing Page #1

Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Carregando em…3
×

Confira estes a seguir

1 de 28 Anúncio

Mais Conteúdo rRelacionado

Diapositivos para si (20)

Quem viu também gostou (20)

Anúncio

Semelhante a First Impressions Matter: LeanUX Design of Landing Page #1 (20)

Mais de Kazumichi (Mario) Sakata (20)

Anúncio

Mais recentes (20)

First Impressions Matter: LeanUX Design of Landing Page #1

  1. 1. First Impressions Matter: LeanUX Design of Landing Page @sprmari0 Lean Startup Machine Tokyo | May 17th-19th 2013 (Courtesy of Jefrey Bulla)
  2. 2. What’s the point? Think in their workflow
  3. 3. 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.
  4. 4. Why? “Customers don’t care about your solution. They care about their problems.” - @davemcclure
  5. 5. 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 Destination Web Sites: An Analysis of First Impression *Users love simple and familiar designs – Why website need to make great first impression
  6. 6. “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. *Powers of 10: Time Scales in User Experience (Cont’d)
  7. 7. Starting Point of Journey *User Experience Journey Map
  8. 8. 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
  9. 9. Test Your Ideas
  10. 10. Create & Encourage Emotional Connection Build ‘Memorable’ Website
  11. 11. Emotional Design *Plutchik’s Emotion Wheel
  12. 12. Different emotional layers *Emotional Design: Why we Love (or Hate) Everyday Things Visceral ReflectiveBehavioral Visceral – Attractiveness Behavioral – Usage Reflective – Self-Image
  13. 13. ‘Emotional’ Landing Page
  14. 14. Simplified Layout Headline • Key Benefit • Key Benefit • Key Benefit Social Proof Large Graphic Call-to-Action   
  15. 15. Headline First thing read for customers to search for specific solution to their problem. *Airbnb Big Picture Hypothesis = Solution Hypothesis = Value Proposition
  16. 16. Key Benefits How does your product or service benefit the customer? *Instagram
  17. 17. Large Graphic Image high-lighting product and conveys happy customer experience. *Square
  18. 18. Social Proof Social networks to establish credibility and trust by building multi-touchpoints.
  19. 19. Call-to-Action Solicit one clear action that tests your riskiest assumptions. *Flickr Total number and ratio of early adaptors, interests, etc.
  20. 20. Questions to be answered Stimulus Awareness Relevance Confidence Satisfaction 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
  21. 21. 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 be lazy about the page design. Polish = Credibility. • People don’t read. Keep copy clear & concise.
  22. 22. 3 Pillars of Emotional Design Visceral Design Behavioral Design Reflective Design Makes you feel… Helps you do… Says about your…
  23. 23. Skeumorphism
  24. 24. Tinke
  25. 25. Momento
  26. 26. Path
  27. 27. First Impressions Matter: LeanUX Design of Landing Page @sprmari0

×