Designing better forms
•
1 like•187 views
This talk was originally given by Cristina Viganò and Sam Hooper at an event organised by Cyber-Duck for World Usability Day 2017.
Recommended
More Related Content
Similar to Designing better forms
Similar to Designing better forms (20)
More from Cristina Viganò
Recently uploaded
Recently uploaded (20)
Designing better forms
- 2. World Usability Day Welcome to Cristina Viganò Senior UX Designer @CrVigano Sam Hooper UX Designer @shooperux
- 4. SAID NO ONE EVER WHEN TALKING ABOUT FORMS…
- 5. 5 AGENDA Why forms are important Part 1 Forms 101: Dos and Don’ts of form Part 2 Q&A and Beers
- 7. 1st real interaction users have with a product or service
- 8. 1% increase in revenue for every 100 milliseconds that Amazon is faster
- 9. 12bn dollars a year lost by Expedia for asking users to enter ‘Company Name’ on their booking form
- 10. Forms 101 Dos and Don’ts of form design 2
- 11. 1. KEEP IT SHORT AND EASY
- 16. 30 less conversions if Captchas are used (Stanford University)
- 17. 2. ORDER AND GROUPING
- 20. www.airbnb.com
- 21. www.airbnb.com
- 24. www.alitalia.com
- 25. Eventbrite app
- 26. 4. LAYOUT
- 27. Vertical structure, with labels left aligned on top of each field www.cyber-duck.co.uk
- 29. Good size of fields and good spacing between fields make it easy to fill in www.cyber-duck.co.uk
- 30. Submit button is prominent www.cyber-duck.co.uk
- 33. www.dlcuk.com
- 38. 5. FIELD TYPES
- 39. Field states
- 40. Only use drop downs when you have to
- 41. Only use drop downs when you have to
- 42. Only use drop downs when you have to
- 43. www.gov.uk.co.uk Be smart where you can be
- 47. Identify what error has been made
- 48. Show error and completion messages, but only when the user stops typing
- 49. Don’t hide useful instructions
- 51. Useful resources - Design better forms - 58 Form Design Best Practices & Form UX Examples - Form design for complex applications