Forms : a UX manifesto
- 1. FORMS A MANIFESTO Danielle Swank Jim Fleming June 2011
- 4. most forms are designed for databases and not people
- 6. people can find those same forms hard, scary, confusing and slow
- 8. there are other ways...
- 9. the case for intelligent forms
- 10. 1. static forms EXAMPLES login forms, email sign-ups WHEN TO USE all or most of the fields are required
- 11. example image 1 goes here
- 12. example image 2 goes here
- 13. 2. ADAPTIVE forms EXAMPLES product data, surveys, task lists WHEN TO USE complex discrete data, few required fields
- 14. example slide 5 goes here
- 15. example slide 3 goes here
- 16. example slide 4 goes here
- 17. 3. Formless forms EXAMPLES content management systems, blogs, addresses WHEN TO USE large amount of simple data, standardized formats
- 19. demo goes here
- 21. there are other ways.
- 22. people should not find forms hard, scary, confusing or slow
- 23. create forms for people not databases
- 24. don’t be lazy
- 25. FORMS A MANIFESTO Danielle Swank Jim Fleming June 2011
Editor's Notes
- #3: we like to use frameworks paticurlay frameworks with automatic code generation (symphony, rails, cake) when is the last time you started compleatly from scratch on a project? go back and question first principles why do forms look like this?
- #5: most forms push the responsability of data standardization into the user. many developers first database is some type of SQL database. and the forms that they use reflect this. one field maps one cell.
- #6: you might as well, just give them a spreadsheet, it’s faster for them.
- #7: What are some of the other problems with forms?
- #8: This is a modern CMS It’s gotten rave reviews for it’s usability. I think it stinks. Too many fields The field names are esoteric for many users There is a lot of unnessicary fields You have to scroll down (a lot) to save
- #9: What if... people had freedom, mobility, and flexability in the way that they interacted with the data. What if we made forms that worked the way people do? If your users find it easier to work in word or excel first, then you should work with your users. the form should fit the task.
- #10: We think there are 3 different types of form patterns, static, adaptive, and formless. If we fit the form to the function here are some potential benifits: Increased user adpotion decreased user effort copy paste abilities back and forth with desktop applications form auto fill could potentially work better no unnessicary fields
- #11: Static forms, such as logins or sign-ups, should typically be simple forms with most of the fields required. Its often best if they request as little information as necessary to avoid intimidating the user. Login forms are familiar and there isn't a lot of room for experimentation without scaring users with security concerns. Most email signups are pretty basic and often don't require more than an email address – static forms are appropriate here Examples...
- #12: Easy Lower entry barrier Conversions Adoption rate
- #13: Simple Requests the minimal data Only what's necessary to perform its function
- #14: Adaptive forms, or dynamic forms, can be user-altered to expound on an set of initial form fields. This reduces the initial complexity of the form while allowing it to be expanded to fit the users needs. Adaptive forms work well when there are only a few required fields but potentially infinite optional fields. Examples...
- #15: Fast : Can use only the keyboard Loads/saves in the background vs. Basecamp... : Several clicks Requires waiting for saving with each new task
- #16: Fkexible Scales in complexity You can build just a top level navigation ...Or scale it 10 levels deep
- #17: More complex use case : Uses a form to build a form But same principle – start with the minimum and build up as necessary
- #18: Formless forms are freeform fields that allow users to enter arbitrary data; the data is then parsed afterwards in a save action for metadata. For instance, if someone writing a blog article, instead of having separate fields for title, author, date and body it feels more familiar and organic if it was just a single field, similar to MS Word or QuietWrite. These are great because they allow copying+pasting data easily, speeding up data entry in some use cases. They also don't impose any kinda of explicit structure on the user and allow them to be more creative and focus less on form fields and more on their content. Most abstract of the three “form” types.
- #19: Here's an anti-pattern Unnecessary complexity Lots of eye movement, not very linear
- #20: Another anti-pattern More unnecessary complexity It's better but could still be improved THE DEMO IS NEXT