Certtime Login

Shot_1281379406

12 Responses

  1. Alex Pankratov Alex Pankratov

    Simple Login form for the CertTime project.

    The button took a couple of weeks of on and off experiments. Also if you have the screen calibrated, you may notice a subtle unevenly shaped drop shadow and the highlighting of the form edges. The "reset" link is initially dimmed and brightens up after a few seconds, so to attract the attention of users that hesitate (presumably because of not remembering the password).

    (edit) Here is a live version if anyone wants to play with it.

    over 3 years ago

  2. Matt Ward Matt Ward

    Really, really nice. I like the effect around the submit button. It works really well. The only thing that strokes me, right off the bat, is that there seems to be a lot of padding. I definitely feel that the closing X should be closer to the top right corner.

    over 3 years ago

  3. James Buckley James Buckley

    I'm ok with the padding, thought I think the "Reset" is a little vague. Very nice overall, I love the button.

    over 3 years ago

  4. Bryant Maroney Bryant Maroney

    The fading of the background is nice. How about separating the top part (the the login text is) and the login info section. Then making the top part a slightly darker color?

    over 3 years ago

  5. Alex Pankratov Alex Pankratov

    @Bryant - Tried that actually (I did over two dozen variations of the form styling). It looked pretty decent, but in the end I decided against it. Nothing wrong with it, simply liked this style better.

    @James - you are not the first one to say "reset" sounds ambiguous. The assumption here is that if user forgets the password, he will be looking for a way to reset it. The choice of the word and its positioning next to the password target those looking to reset the password.

    @Matt - the "x" is right-aligned to the input boxes. If it sits closer to the right edge, it looks odd... sort of unrelated to any other form elements.

    over 3 years ago

  6. Error handling of the form inputs. Messages hang outside the form on a dimmed background, and once the field gets a focus its error message is faded out.

    over 3 years ago

  7. Jon Rundle Jon Rundle

    I love the style of this. The only thing I would suggest is just that there is a lot of font style variation, the reset button is all lower case, the login text is upper case and everything else is regular case, I would maybe eliminate one of those variations, maybe make the login text normal case. Just a thought.

    over 3 years ago

  8. Alex Pankratov Alex Pankratov

    Thanks, Jon. Never occurred to me to assess the design from this angle. One more thing to obsess about now.

    BTW I am considering replacing the "reset" link with an icon embedded at the right end of the password entry field. This should make the whole form more consistent and compact.

    over 3 years ago

  9. As I had stated in my comment, how about something that cuts off the 'login' text from the fields?

    Now that I look at it, it may look better to keep the top part dark and the bottom light.

    over 3 years ago

  10. over 3 years ago

  11. Mads Burcharth Mads Burcharth

    Yummy. This reminds me of why I drafted you.

    likes

    over 3 years ago

  12. over 3 years ago

keyboard shortcuts: previous shot next shot L or F like