How to engage users with forms that don't suck

Learn how to improve your forms to increase conversions and better engage with users.

Transcript

1. How to engage users
   with forms that don’t suck
   

   View Slide

2. I am Steve Wells
   Co-founder and designer
   at Strategy11.
   You can find me at
   FormidablePro.com
   @SteveWellsJr
   HELLO!
   

   View Slide

3. I am Jessica Wittmier
   Strategic Marketing
   Consultant.
   You can find me writing blog
   posts at Formidablepro.com
   @JessicaWittmier
   HELLO!
   

   View Slide

4. Lake Isabel, San Isabel National Forest off HWY 165 West of Rye
   

   View Slide

5. @FormidableForms #formmatters
   

   View Slide

6. FORMS
   Gone are the days when forms were limited to
   a simple contact form or newsletter opt-in.
   

   View Slide

7. “
   What can visitors or users
   do on a website?
   

   View Slide

8. View Slide

9. View Slide

10. View Slide

11. View Slide

12. View Slide

13. Now, virtually all engagement on websites (aside
    from social sharing and commenting) happens via
    forms...
    and even social sharing and commenting are
    accomplished using... FORMS!
    

    View Slide

14. WAY
    Historically, users spent their time
    scrolling and clicking through the web
    ONE WWW
    Flow of information in the past
    

    View Slide

15. Not just browsing
    In 2016, the typical user wants to be a part of
    the web rather than a bystander
    

    View Slide

16. “
    Every second, approximately 6,000 tweets
    are tweeted; more than 40,000 Google
    queries are searched; and more than 2
    million emails are sent.
    * Internet Live Stats -- international Real Time Statistics Project.
    

    View Slide

17. WAY
    As website authors, we need to take
    advantage of this two-way flow of information.
    TWO WWW
    Flow of information today
    

    View Slide

18. WHY?
    Why do we need to engage our users?
    

    View Slide

19. #torontotunnel
    

    View Slide

20. The point is:
    We don’t know what goes
    on inside our users’ heads
    

    View Slide

21. How do we find out?
    With forms that don’t suck!
    

    View Slide

22. ✓ Contact
    ✓ Donation
    ✓ Order/ Payment
    ✓ Event registration
    Form Categories
    ✓ Lead generation
    ✓ Survey
    ✓ Contest
    

    View Slide

23. “
    What do you think is the lowest
    converting form category?
    Highest?
    

    View Slide

24. ✓ Contact 1%
    ✓ Donation 7%
    ✓ Order/ Payment 9%
    ✓ Event registration 11%
    Form Categories
    ✓ Lead generation 11%
    ✓ Survey 14%
    ✓ Contest 35%
    2015 average conversion rates across
    650,000 sites studied by Formstack.com
    

    View Slide

25. Why? W.I.F.M.
    

    View Slide

26. Form engagement from a psychological perspective
    https://leadformly.com/form-optimisation-pyramid/
    

    View Slide

27. Motivation
    Do I want the outcome of filling out this form?
    1.
    

    View Slide

28. Motivate visitors with great marketing copy.
    When crafting marketing copy,
    make sure W.I.F.M. is in play:
    ✓ in your offer
    ✓ in your page copy
    ✓ on your call to action button
    vs.
    YOU want them to submit.
    THEY want instant access.
    

    View Slide

29. But great marketing copy can't overcome form field friction.
    4x as many fields PLUS a required
    phone #. Better be a darn good ebook.
    

    View Slide

30. Ability
    Can I fill out this form?
    2.
    

    View Slide

31. Information
    Does this form require
    specific information I might
    not have readily available?
    Do I have what I need to complete this form?
    Time
    Does this form take more
    time than I have?
    

    View Slide

32. Information
    Outline any special
    requirements needed
    to complete the form.
    

    View Slide

33. “
    Increase conversion rates by allowing
    users to save their progress and return
    later to complete.
    

    View Slide

34. Accessibility
    To maximize your form
    accessibility, consider these tips
    ✓ Test your form with a screen reader
    ✓ Avoid small text
    ✓ Increase the contrast
    vs.
    

    View Slide

35. If you are taking them on a journey, provide a roadmap.
    No sense of direction, how long it's going to take or what is going to be needed.
    

    View Slide

36. What's needed. Roadmap provided. Ability to save and come back later.
    

    View Slide

37. Peace of Mind
    Will anything bad happen if I fill out this form?
    3.
    

    View Slide

38. “
    What are some "bad things" you might
    wonder will happen as you fill out a form?
    

    View Slide

39. Address the "bad things" in the copy but frame it positively.
    Don't worry. Wait. Should I worry?
    

    View Slide

40. Encrypt any sensitive data
    “I wish my website were
    less secure”
    -no one ever
    

    View Slide

41. Ease
    Is it easy to fill out this form?
    4.
    

    View Slide

42. “
    Simple forms don’t have to
    have fewer fields
    

    View Slide

43. Place your screenshot here
    Conditional Logic
    Only show fields your
    user needs to see
    and only when they
    need to see them.
    

    View Slide

44. Multi-Page Forms
    Breaking up long
    forms will improve
    completion rates—If
    you have progress
    indicators.
    

    View Slide

45. View Slide

46. More tips
    A few more things:
    » auto-populate fields whenever possible
    » save data from one session to another (save drafts)
    » make forms responsive
    » use repeatable fields for data sets
    

    View Slide

47. View Slide

48. View Slide

49. As if looking for new health insurance isn't bad enough.
    

    View Slide

50. After what we just went through on the other website... this is bliss.
    

    View Slide

51. Taking ease of use beyond
    the browser
    

    View Slide

52. Which devices are people using to access with the internet?
    47%
    Tablet
    80%
    Smartphone
    91%
    PC/Laptop
    Source: Global Web Index
    Text your favorite color to (720) 573-0128
    

    View Slide

53. Which devices are people using to access the internet?
    9%
    Smart Watch
    34%
    Smart TV
    37%
    Game Console
    Source: Global Web Index
    Text your favorite color to (720) 573-0128
    

    View Slide

54. Which devices are people using to access the internet?
    ?
    What’s Next?
    Text your favorite color to (720) 573-0128
    

    View Slide

55. IoT
    Internet of Things
    Text your favorite color to (720) 573-0128
    

    View Slide

56. As a result:
    Text your favorite color to (720) 573-0128
    

    View Slide

57. Engaging
    Do I enjoy filling out this form?
    5.
    Text your favorite color to (720) 573-0128
    

    View Slide

58. THE GOAL OF ENGAGING FORMS
    » Increase conversions
    » Collect actionable data
    » Build trust
    Text your favorite color to (720) 573-0128
    

    View Slide

59. t
    To build engaging forms,
    just pay attention to the
    rest of the pyramid.
    Text your favorite color to (720) 573-0128
    

    View Slide

60. t
    Text your favorite color to (720) 573-0128
    

    View Slide

61. Engagement doesn’t end there.
    What happens after form submission
    is just as important.
    Text your favorite color to (720) 573-0128
    

    View Slide

62. You’ve got mail
    Confirmation Emails
    • confirm submission
    • provide instructions
    • up-sale or promote
    Text your favorite color to (720) 573-0128
    

    View Slide

63. You will literally "blow them away" with boring copy and unnecessary
    captchas.
    I guess I could fill out this form.
    But I'd rather tell you about my junker.
    Text your favorite color to (720) 573-0128
    

    View Slide

64. And the winner is?
    

    View Slide

65. Any questions?
    You can find us at:
    » @SteveWellsJr
    » @JessicaWittmier
    THANKS!
    Text your favorite color to (720) 573-0128
    

    View Slide