LT 7.2 Designing a form

LT 7.2 Designing a form

There are many bad forms out there! Now that you know all about forms, it will be easy for you to spot bad form design. For this task, you will be redesigning a form used to make appointments at a vet.

Part 1

Apply what you’ve learnt as you critically analyse this form from the Paw Paws Vet Clinic and list out what you think is wrong with it. You only need to look at the first two steps:

  • Online booking 1/3
  • Online booking 2/3

Part 2

Use the software of your choice for this part e.g., Figma. Screenshot the website and then redesign the form section (both steps 1 and 2). To help guide you, here is the list of tips we covered in today’s lesson:

  • Keep it simple
  • Mark optional or required fields
  • Use visual design strategically
  • Use persistent labels
  • Consider the context within the user flow
  • Use verbs for the submission button text
  • Programmatically set the right keyboard for touchscreens
  • Make use of inline form validation when possible

Part 3

Choose three components anywhere in the form that will show error states i.e., what happens if the user submits the form and there is a problem? Remember that a good designer will try to help users with the use of error messages. Error messages are not there to make users feel bad if they’ve made a mistake filling out the form.


Part 1

The form looks confusing and overwhelming due to the amount of questions and the way they are asked. It also feels weird to start the form with these questions, instead of asking about personal information first. The form looks much longer and more advanced than it need to be.

Part 2

Part 3

Reklame

Legg igjen en kommentar

Fyll inn i feltene under, eller klikk på et ikon for å logge inn:

WordPress.com-logo

Du kommenterer med bruk av din WordPress.com konto. Logg ut /  Endre )

Twitter-bilde

Du kommenterer med bruk av din Twitter konto. Logg ut /  Endre )

Facebookbilde

Du kommenterer med bruk av din Facebook konto. Logg ut /  Endre )

Kobler til %s