How to Make Your Sign Up Process Sing in 8 Steps.

Ben Luby
4 min readFeb 28, 2019

(See also: ‘Log In process — things to consider to improve UX’ by the same author.)

Generic sign up page

Registering on another new website or app is a chore. Especially when you came to the site to get the job done right now. Not tomorrow. If you want to help people start and complete your registration process there is plenty to think about.

It should go without saying that every additional field added leads to a higher abandonment rate. But the number of fields isn’t the only factor. Chunking your fields into meaningful blocks can reduce cognitive load. Dare I also mention the largely-obsolete fields like title? Or sex??

1. Alternatives to username

Usernames can be very frustrating when the system says the one you want is already taken — and you will undoubtedly forget it on your next visit anyway. So offer multiple ways to create a user account. i.e username, or email address, or phone number -

Keep users signed in immediately after registering. Why wouldn’t you?!

Auto-focus the first form field on desktop. You know what their first action is. Why make them use a mouse / trackpad?

Make sure developers invoke the appropriate keyboard on mobile devices. i.e. why haven’t I got the ‘@‘ symbol when I’m adding an email address? This is done using the correct attributes.

2. Show passwords requirements and strength upfront

Password strength meter

Complex passwords are hard to hack. Show password strength using a meter to enable people to know the complexity of the entered password. Then they can change the password according to the desired level of complexity. Show the password policy at appropriate place, for user to make the right password the first time. If you do decide to hide password then please alert me if my Caps-Lock is on.

3. Confirm password?

This practice originated from the use of hidden password fields and users will often bypass this using copy and paste. The friction of getting it right outweighs the reduction in user typos. It also doesn’t stop BOTH fields being identically mistyped. Formisimo shared a case study of removing ‘confirm password’:

The results were impressive, to say the least…

  • 14.3% more visitors started the form after visiting the page.
  • 56.3% increase in overall conversions.
  • 35.5% increase in the form completion among those who begin.
  • 23.9% decrease in the number of corrections made.

In fact, make sure you don’t ask the same information twice for anything. e.g. email address.

4. Necessary fields

If you do have to have optional fields make sure you mark them as such. But why have them if you don’t need them? Bear in mind, some questions can be asked later on in the customer lifecycle.

Always explain why you are asking for non-standard information.

Pre-populate IDS (International Standard Dialling Codes) based on geo location cookies. With option to change if necessary.

Pre-populate users info on subsequent visits to your site e.g. Amazon

5. Validation and error messaging

Inline and per-field validation is always preferable. i.e. don’t wait until I click submit to let me know what the issue is. Why do I need to scroll back to correct an error? When giving error messaging make it specific to the error. e.g. Don’t make people guess what the password requirement is that they have missed by giving all the requirements again.

6. Advanced automatic address look-up

If you’re asking for an address, make sure there is an advances address look-up system to reduce the number of fields needed to complete this task. Post code and house number is not as effective as using any single field entered combined with the IP address. This could mean just 1 field does the job of 5.

7. Show progress on longer forms

progress indicator on Post Office site for Gov.UK Verify

A progress indicator gives me confidence that I’m getting closer to the end of this form. Using a number of steps works well if your chunks / pages are of a comparable time/effort.

8. Confirmation of registration.

Switching someone’s context from your site to their email can disorientate them unnecessarily. A 4 digit text code that appears as a notification could help keep them in their browser and in the flow. This obviously works even better when they’re already on their mobile.

In addressing these points you’ve gone a long way to removing the frustations we all have with sign up. Now test it!

--

--

Ben Luby

User Experience with a focus on Content Design, accessibility, equity, cycling, father, son, astronaut.