The story of the login screen

home-curve-01
February 7, 2014
2
min read

The Rex logo contains a secret.People don't always see the secret right away, that's ok, because when they do it's a bigger surprise.I designed the Rex logo, and initially I was split between wanting to point out the secret and wanting to let people find it on their own... Turns out not enough people found it, so I got impatient, and started pointing it out willy nilly.One of these pointing-it-out opportunities presented itself while designing the login screen for new Rex. It was a great time for a reveal because the logo could take centre stage with not much else going on. Not much going on was important because it meant I wasn't distracting the user while they were trying to do things other than finding secrets in logos (like sell real estate).The login screen works like this: as you type in your username and password the Rex logo to the left of the input fields fades out and the negative space of the logo fades in. The fade-in and fade-out is controlled by how many characters have been typed.I love this playful moment in the system – I imagine a user typing forward then backspacing to toggle between the two states of the logo. I've always been so glad that we added this detail because I think it sets the tone for Rex. Right at the start of your experience, through your own actions, a secret is revealed to you. It lets you know that there is hidden depth to the system and the interface isn't just a collection of impersonal pixels, it represents the thoughtfulness, care and craft of the people who made it.This kind of playful and delightful moment is so important to designing beautiful and compelling interfaces. This kind of moment makes the difference between apathetic users and enthusiastic fans.Revealing the secret house in the Rex logo is the kind of moment that makes me love design so much.

login screen password

Here's some more articles you might be interested in

For hints, tips, and community support follow