UI Design

G’day Animations #4 – Password Validation

G’Day animations episode 4 is out! If you missed the previous episodes, here is how it works: every month, we pick a topic and select innovative, funny and of course user-friendly animations.


Here is situation we’ve all experienced:
You’re about to register for an(other) online service. You have to choose a new password. You submit it. The page reloads and an error message shows up: your password is not valid! How frustrating is this?

G’Day animations episode 4 showcases password validation animations. The following designs assit users in choosing or typing the right password in a nice, positive and instructive way, without disclosing any sensitive information.
We hope you like them!

Create Password and form validation by Emmanuel Torres
Modal windows & password input by Jakub Antalík
Password strength validation by Josh Overton
Password Input Field by Samuel Kantala
GoCardless Password Strength-O-Meter by Tom Petty
Show password by Prekesh
Create an account by privacy.com/signup
Reset Password by Peter Smith
Password Guide by Saptarshi Prakash
Password input by readme.io/login
Touch ID overlay by Marin Begovic
Show/hide password by Vitaly Silkin
Animated login form avatar by Darin


Feeling like working on your product password validation design now? Or even on its error messages? Here is an article written by Rhiannon Jones, Content designer at Deliveroo, Content design: How to write any error message.

See you next month for a new G’day Animations selection.


Leave a Comment

Your email address will not be published.

You may also like

Read More