Checklist – A better password form fields


Table of Contents

A big issue

One major mistake a lot of signup forms today is that many times, a user is required to fill in their password the second time just to get through the initial step. These causes users to abandon the signup process completely without thinking twice.

Below is an example:

comparisonUsers were required to fill in their passwords again because they missed out the uppercase letter requirement.

What is missing?

First, there is no indication of the limitation for the password. A user has no idea the password needs to be “at least 6 characters, including one number, one uppercase, and one lowercase character”. According to Don Norman in Norman’s door theory, the door design provided no indication on whether to push or pull the door, which can be confusing to users. Instead of playing the guessing game with the user, registration should be straightforward.

How to do better?

A good way to design the password indicator is simple:

  1. Let the user know there are limitations
  2. Let the user know what are the limitations

1 80I5A 7RcDR5vHWyFZe uQ

The above is one solution on improving the design to allow the user to know what password to fill in when they want to proceed with registration.1 BJ O0bBdzevUpo73pRcCkA


Password field can also be temporarily unmasked so that the user can fill in the field quickly and accurately. Unmasking the password for a moment can decrease typos and make it easier for users to catch what they’re typing.1 zF6VFrTEIClYVeS8T2EJagreference:

Reduce the friction between user experience and usability

Our job at JIN Design is to remove as many steps as possible to let user complete their job as fast as possible. A good form is needed such that users do not feel frustrated when he/she just want to register. Whether it’s performance or design, it’s about recognising that we make things people use, and people are generally busy. They want to get on as quickly and most definitely do not want to wrestle with technology. The best we can do for them is to make things quick and easy.

JIN Design

15 Aug, 2017


Our End-To-End Web Services.

JIN Design services icon - Start

Design & Development

Web design and web development for your  custom website requirements.

JIN Design services icon - convert

WordPress & Website

WordPress, Webflow or WooCommerce design & development services for your website needs.

JIN Design services icon - optimise

Convert & Optimise

Optimise your website  performance and enhance its Google PageSpeed score. 

JIN Design services icon - maintain

Website Maintenance

Maintain your website content and ensure your website is safe and secure.

More From the Blog.

Thumbnail for Top 17 Web Design Companies In Singapore

Top 42 Web Design Companies In Singapore

In today’s digital age, a company’s website is often a potential customer’s first impression of their business. A well-designed website attracts visitors, promotes engagement, and boosts conversion rates.