App Ui Sign In Design

How to Design Better Login/Signup?

A guide to creating user friendly login and signup screens.

A login form is like the entrance to a house. It should be welcoming, easy to enter, and never mistaken for a different door. When your logins are like this, you'll encourage users to log in more frequently. Unfortunately, most login forms today aren't user-friendly entrances.

If you didn't read the previous article "How to design better forms?" then recommended you to read that first.

However, login and signup forms are so common part of application. So make sure that it isn't an problem to your users. You can follow the following tips for designing a better process.

Use social media for login & signup

Taking into consideration that some people want to create an account as fast as possible, you need to give them plenty of registration options on the sign up page. Your login page should contain an option that lets people sign up on your website using an external account.

This way, they won't need to go through the lengthy registration process to make a purchase or add a comment on your site.

Ask Less or ditch the username field

Ask minimum fields while sign-up, there is no need to ask everything at start.

Also it's not convenient to remember all the passwords and usernames we come up with when we see a signup form. It would much easier for me as a user to sign up with my email as I will remember it.

Use good copy or define the value

Avoid using general terms like 'Sign in', 'Log in'. Instead give the user idea of what to expect when they sign into the application.

Define the value proportion or tell them what value user will get from your application.

Show password option

Password confirmation doesn't help with conversions: it slows down the process and actually increases the chances of misspelling the password. Rather than asking for confirmation, allow your visitors to see what they just typed with an icon that unmasks their password.

Try to minimize errors

You should clearly identify and explain form field errors. Show them in which field the error occurred, and explain the correct way to fill out the field. Give users a hint of what type of input is expected in a particular field.

Remember your users

Is there anything more frustrating than returning to a website you logged into earlier only to find that you need to log in again?

When your user returns to your website, make sure they're already logged in or that certain fields are prepopulated for them for easy login.

Summary:

To keep your customers interested in your application and sign in after they download your app, make sure your login screen is simple and precise.

Clearly present the different options your customer has. Less is more. But also keep in mind that it has to be recognizable for your readers.