10 Tips for Better Signup / Login UX
Sign-up forms are a necessary evil. We avoid them as much as we can online but at some point, we will definitely run into one. Many users actually get to the sign-up page on a website but leave because they have a hard time understanding three things:
1. what they need to fill in
2. why it is necessary for them to give out that
Information
3. how to submit the form successfully.
How can you make the sign-up process as smooth as possible to convert as many potential sign-ups as possible? Here are 10 tips:
1. Start with a value proposition
A value proposition is a benefit that you get from something. You need to communicate to your user what benefit they will get from signing up for your app, service, or product. For Facebook, it is the joy of connecting with friends and family. For LinkedIn, it is the promise of expanding your professional network.
What is your value proposition for your app or
website?
2. Let users know what page/screen they are on
Users need to know where they are at all times. One The reason for this is that they might have clicked on something by accident or have been redirected from another site and a heading helps them to know if they are in the right place or if they need to leave. So, make sure you have a nice big “Sign up” heading at the top.
3. Have an option for registered users to go to the
login page
You would be surprised how often people end up on the wrong form, whether they are signing up for or logging in to their account. Make it easy for someone who ended up there by accident to get to the right place.
4. Give your user different options for signing up
Social logins through sites like Google make the sign-up process easy for those who already use it. With one click they can sign up with all their details and without worrying if they put in the correct details or if they will remember the password they used. How do I know? I use it every single time it is available.
There are also specialist logins like GitHub for programmers. Research and find out what is popular with your specific set of users.
5. Keep the number of fields to a minimum
The more fields there are the lower the form completion rate. One reason is that the difficulty of filling in forms usually increases with each additional
field. Another reason is that users begin to question why certain information is necessary as they fill in more fields. In short, ask the user to provide only the most essential information when signing up. You can ask for the rest later.
A basic rule is to ask for only their name, email address, and password. Asking for information that is more personal like their date of birth raises the risk of
privacy concerns.
6. Place labels at the top
According to research from eye-tracking data by Matteo Penzo, forms are viewed and filled in fastest when labels are placed above inputs. This is because the eyes flow in one continuous motion from top to bottom. With side labels the eyes zigzag from the labels on the left to the inputs on the right, which slows down the user.
However, this principle does not always hold true. When designing for sensitive or important inputs, right-aligned side labels are best as they are the most difficult to read. This forces the user to slow down and take their time to process what kind of input is needed. This improves the chances of them entering the correct information required.
7. Use only one column
Just like placing labels above fields, it is all about creating a continuous user flow. While double or triple columns look cool and save on space, they force users to stop and think about whether side-by-side fields are related, and if so, what is the relation? This makes them slow down and could lead to them overthinking and misinterpreting the form.
8. Let your users see the password if they need to When typing in a password that you cannot see, there is a high likelihood that you will get it wrong. It has
happened to me a few times. “Confirm password” is one of the most frustrating things I encounter on sign-up forms. Without seeing the passwords, I cannot tell if it is the original password that is wrong or the
confirmation one. Or both.
A simple fix is to have an option to show the password if someone is having trouble with it. It will save a lot of anxiety and save you all the users who leave because they cannot match the passwords.
9. Avoid checkboxes
Checkboxes can be very confusing. Unlike radio buttons, they look optional even when they are not. This means that users often try to submit the forms
without having them selected and have their submission rejected while not understanding what the problem was.
You might have met this problem with Captcha when you had to fill in a form and forgot to click the “I’m not a robot”. Unless required by law (Like in Europe under GDPR guidelines), simply inform your user of what it is they need to know. Last but not least…
10. Use separate forms (and pages) for signing up and
logging in
Using the same form (or forms next to each other) for both signing up and logging in has three challenges. First, users get confused when similar options are placed before them. They begin to question whether they already have an account with you and what the difference is between logging in and signing up on your site.
Second, they might use the log-in form (or button) by accident when they are signing up and get frustrated when it does not work and vice versa. The last risk is double registration when someone already has an account tries to log in with a different email from what they registered with.
Conclusion
In summary, you want to make the sign-up experience as simple and easy as possible. This will make new users much more willing to join your service or product and improve your overall sign-up rate.
the most important parts of UX for eCommerce
