6 tips for designing a better registration interface
Signing up to an application or service is one of the most crucial performance indicators for many businesses. A good UI design on a registration page can be the determining factor whether or not the user completes the registration process or abandons it.
In this article I will discuss some tips that will help you design a registration page or process that will increase the users likelihood of completing the process.
No Distractions
The registration page should be all about the sign up process… Duh right?
There should be no distractions, this includes hiding navigation that may be visible on other pages on the site or application. The user should be able to focus on completing registration without being distracted.
It is however a good idea to allow the user to navigate from the registration page to a log in page where they can log into an existing account. Many users who already have an account accidentally wind up on the registration page while trying to log in.
One way that you can reduce the amount users who incorrectly end up in the wrong area is to use different terminology. Using ‘Create Account’ for sign up and ‘Log in’ for signing in can help to give a more clear differentiation between the two options.
Also be sure to give the user a way to close the process.
Fast and Effortless
The registration process should be a fast experience for the user. One way to speed up the process is to remove any input fields that are not absolutely necessary. If information is needed but not in order to create the account it can be asked for later at a more convenient time. Right now, the goal is to sign the user up.
Autofocusing on the first input field is a small automation process that allows the user to input to the first field without clicking on it themselves. Moving from one field to the next automatically as well as pre-populating characters such as slashes for dates save valuable seconds for our busy users.
Top to Bottom Input
In the input fields should be displayed below one another in sequential format. Having a mixture of the user moving down and to the side will lead to confusion. This places too much cognitive load on the user and they have to think which is the next logical input field, should they move to the input field to the right or below?
Having the input fields stacked avoids this as the user simply moves from one to the other without thinking.
Provide Feedback
In all UI design it is important to give the user feedback on their inputs and the same applies to sign up pages.
Validate the input fields by confirming if the users inputs meet requirements. For example confirm if their email address is valid, or if the password they have chosen meets requirements. If it does not meet requirements, it is important to display the requirements to the user to avoid them getting frustrated by having to guess what is required.
Specialised keyboards.
When a user is inputting their email address, one thing is for sure. They are going to use the @ character. Using HTML you can present the user with a keyboard that has this symbol displayed without the user needing to switch the keyboard to special characters. This can speed up the process as well as make navigation of the keyboard easier for users.
Remind the user why they are signing up.
Dont forget to remind your user why they are signing up in the first place. Add a tagline to your registration page that refreshes the users memory about the benefit of signing up.
So there you have it, some of the most important things to remember when designing a registration or sign up interface. I hope you liked reading this article.
More articles relating to all kinds of topics surrounding UI/UX design will be coming over the next few weeks. Please comment anything you would like me to cover and also if there is anything you would like to add to this article feel free to discuss it in the comments.
Thank you.
