$30 off During Our Annual Pro Sale. View Details »

But Why? Designing For Strategy

Michelle Schulp
November 14, 2015

But Why? Designing For Strategy

Designers and non-designers alike can get caught up in the aesthetics and functionality of a website, and forget that every decision made should be supported by an underlying strategy. We will discuss how to find your site’s primary call to action and create experiences that support that goal. We will also evaluate design choices of many well-known sites as we examine how they help (or hinder) common goals. Whether you’re a designer, developer, or a person maintaining a site, you will come away with a critical eye for evaluating design patterns and a process for narrowing down a design strategy.

Michelle Schulp

November 14, 2015
Tweet

More Decks by Michelle Schulp

Other Decks in Design

Transcript

  1. @marktimemedia Designing For Strategy BUT WHY ?

  2. @marktimemedia I Design THINGS. USUALLY WORDPRESS. HI, I’M MICHELLE.

  3. @marktimemedia WHY DO PEOPLE VISIT WEBSITES?

  4. @marktimemedia VERB A word that represents an action or state

    of being
  5. @marktimemedia BUY JOIN READ DOWNLOAD CONTACT DONATE SUBSCRIBE SIGN UP

    SHARE COMMENT LIKE
  6. @marktimemedia WHY ARE PEOPLE VISITING YOUR WEBSITE?

  7. @marktimemedia Your website has a SINGLE PRIMARY VERB

  8. @marktimemedia YOUR PRIMARY WIN

  9. @marktimemedia Design should SUPPORT YOUR VERB

  10. @marktimemedia MAKE IT PAINLESS (or, dare we say, delightful)

  11. @marktimemedia THE ZERO INTERFACE DESIGN IDEAL:

  12. @marktimemedia EASY & FRICTIONLESS Design is

  13. @marktimemedia CLEAR CONTEXT Design is

  14. @marktimemedia DIRECTED PATH Design is

  15. @marktimemedia CONSISTENCY & PATTERNS Design is

  16. @marktimemedia

  17. @marktimemedia

  18. @marktimemedia

  19. @marktimemedia

  20. @marktimemedia FORMS ARE A BARRIER

  21. @marktimemedia BAD FORMS COST MONEY https://medium.com/uie-brain-sparks/the-300-million-button-76b566ae5f73

  22. @marktimemedia "The best way to speed up that process is

    not to ask the question at all.” –Luke W.
  23. @marktimemedia GOOD FORM DESIGN IS ABOUT BALANCE

  24. @marktimemedia MINIMAL FIELDS

  25. @marktimemedia CONTEXTUAL ERRORS

  26. @marktimemedia DELIBERATE WORKFLOW

  27. @marktimemedia CLEAR LABELING

  28. @marktimemedia FOLLOW CONVENTION

  29. @marktimemedia AFFORDANCES & CLICKABILITY

  30. @marktimemedia BAD DESIGN PATTERNS

  31. @marktimemedia CONFLICTING CALLS TO ACTION

  32. @marktimemedia UNCERTAINTY

  33. @marktimemedia COLLECTING TOO MUCH INFO

  34. @marktimemedia FORCED ACCOUNT SIGNUPS

  35. @marktimemedia ANTI-PATTERNS: OBSCURITY

  36. @marktimemedia SPECIFIC VERB PATTERNS: BUY JOIN DONATE

  37. @marktimemedia BUY The win: Complete purchase of product Call to

    action: Buy vs Add To Cart “The form couldn’t come at a worse time. You want to buy the items you’ve found. The store wants to close the sale so it can make money. Standing between both your goals is a form and as we know—no one likes forms.” - Luke W
  38. @marktimemedia BUY Primary info to communicate: •  Price •  Quantity

    Minimum info to collect: •  Name •  Billing Address •  Shipping Information? •  Credit Card/Payment Information Secondary messaging: •  Photos •  Sizes/Colors/Options
  39. @marktimemedia BUY Barriers: •  Long form fields for payment info

    •  Security of financial info •  Unsure of making purchase Solutions: •  Wish lists/save for later •  Hook up with PayPal or other third party •  One-click purchase if you have an account
  40. @marktimemedia AMAZON

  41. @marktimemedia AMAZON

  42. @marktimemedia AMAZON

  43. @marktimemedia AMAZON

  44. @marktimemedia COTTON BUREAU

  45. @marktimemedia COTTON BUREAU

  46. @marktimemedia COTTON BUREAU

  47. @marktimemedia COTTON BUREAU

  48. @marktimemedia WOOCOMMERCE

  49. @marktimemedia WOOCOMMERCE

  50. @marktimemedia WOOCOMMERCE

  51. @marktimemedia WOOCOMMERCE

  52. @marktimemedia JOIN The win: Complete & submit information Call to

    action: Sign Up vs Create Account vs Join “Just about everywhere people want to participate in social interactions online, forms get in the way. And since participation—number of members, number of activities completed, etc.—is how most social applications thrive, the organizations running these sites rely on forms for business success.” - Luke W
  53. @marktimemedia JOIN Primary info to communicate: •  Elevator pitch benefits

    message Minimum info to collect: •  Email •  Name/Username? Secondary messaging: •  Features •  Data/Numbers
  54. @marktimemedia JOIN Barriers & Solutions: •  Lots of potential profile

    fields •  Only collect minimum for signup
  55. @marktimemedia FACEBOOK

  56. @marktimemedia SLACK

  57. @marktimemedia SLACK

  58. @marktimemedia PEEPSO

  59. @marktimemedia PEEPSO

  60. @marktimemedia DONATE The win: Complete collection of money Call to

    action: Donate
  61. @marktimemedia DONATE Primary info to communicate: •  What are you

    donating to Minimum info to collect: •  Name •  Billing Address •  Credit Card/Payment Info Secondary messaging: •  Emotional appeal •  Specific results/numbers/stats •  Any gifts received •  Duration of donation period
  62. @marktimemedia DONATE Barriers & Solutions: •  Uncertain where money is

    going •  Dollar amount levels proportional to gifts, proportional to ask •  “Decisions not options” with high dollar amounts •  Anchoring and frame of reference
  63. @marktimemedia RED CROSS

  64. @marktimemedia RED CROSS

  65. @marktimemedia GOFUNDME

  66. @marktimemedia GOFUNDME

  67. @marktimemedia GOFUNDME

  68. @marktimemedia GIVE

  69. @marktimemedia GIVE

  70. @marktimemedia QUESTIONS? Michelle Schulp michelle@marktimemedia.com @marktimemedia bit.ly/design-for-strategy