Website Form Design, User Interface Design and Table Design Case Study:
In this case study, We will analyze how user interactive forms are designed on different website.
uswitch
Money Super Market
Feature
Breadcrumb Navigation
Highlight and Tool Tip
Section Break Down
i.e About the car and using the car are in its own box or div
Image to represent information
Error Message
- Number if errors are displayed on top
- The container or div is highlighted in light red color
How data or information is displayed
Before Info was entered
After the info was entered
Once the car info is found, the the care information drops down below
Result Table Display
- The tables are filtered by clicking on title
- Provider is shown with the logo
- There are images to enhance user experience
Confused.com
Features
- Simple table
- Alternative row colours
- Hint tool tip text
- Error message below the error
Breadcrumb Navigation
Result Table
- The company have logo displaying
- When click on more, A spry drops down with information about the company
Compare the Market
Features
- Simple tables format
- Separate container for different section
- Error messages show on top, with error description
- Error field is highlighted
- When you click on hint (?), the tip field pops up on the right. Which can be closed
Result Table
- Clean big table
- Company Logos provided
- Clean images to show yes, no and NA
- Price is highlight
- List items withing the table
- Hint text on table title
- Filter on every title on table
Comments