Booklet

author

Mike V Dijssel

Design

How to design a better login page

design

Design

|

HOW TO DESIGN A BETTER LOGIN PAGE

Why?
Because a good login page will easily drive users to your product or convert visitors to leads.

so, HOW TO DESIGN A LOGIN PAGE?

MAKE IT CLEAR
You don't want users to stuck at the login form. They longer they have to search, the more frustrated they will be. This increases the change of leaving your product.
Make sure the login page is obvious and easy to use.

SIGN UP VS SIGN IN
Make new- and returning visitors clear where to go.
Make different visual expressions of the sign up and login section.
Don't make it to complex, minimal visual difference can be enough.

REMEMBER USER
When you come back to a product and you constantly have to fill in all your credentials again, it can be very annoying, again and again.
Give users the option to remember their login credentials, so they speed up their workflow.

SHOW PASSWORD OPTION
It can be frustrating when you fail on logging in and you can't see what you are typing. Some users therefore like to see what they are typing. Give them the option to show what they type in the password field.

SOCIAL LOGINS
Social logins have become hugely popular. On average 88% of the users have used this before. So it's impossible to ignore this way of login.
It's a great way to create an account because it allows to use the data from their social media accounts. It's easy and very intuitive for your users.

SOME EXTRA TIPS
(JUST..BECAUSE I LIKE YOU)

  • Keep it simple
  • Minimize fields & information
  • CAPS LOCK ALERT!!
  • Try new login technology like fingerprint
  • Is a username really necessary?

DON'T ANNOY YOUR USERS
MAKE THEIR LIFE EASY

More booklets by Mike V Dijssel

More Design booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets