Test project 1
My goal was to create a login experience that feels clean, intuitive, and trustworthy. We've all used clunky forms, and I wanted this to be the opposite of that. The design is inspired by the familiarity and clarity of iOS, focusing on readable text and a simple path forward
The real value is in how the form communicates with you. You get instant feedback as you type your email—a green checkmark for success or a red icon if something's wrong. This removes the guesswork and helps you fix mistakes before you even hit submit
For the signup password, we're showing the rules right up front. As you meet each requirement, like adding a symbol, the list updates in real-time. This turns a potentially frustrating task into a simple checklist
Ultimately, every choice, from the eye icon that lets you double-check your password to the smooth animations, is about building confidence. It’s about making sure the very first screen a user sees is helpful, respectful of their time, and works for everyone
From brief
Share
Reviews
2 reviews
awesome work mate!
The micro animations are so fun, Suren! How did you build this?
It’s probably just me, but I’m not familiar with your hide and unhide password icon. I usually see an eye open or closed, and its diagonal line looks a bit like a pirate eye 🧐
The circle checklist gets slightly cut on the bottom right when it turns green to mark a met requirement. That looks like `overflow: hidden` issue in web term. Matching the circle’s dimensions between states, or giving the container a touch more room with a consistent min-height and a little padding, should prevent the cut.
Looking forward for your Test Project 2!
You might also like

Grammarly sign-up accessibility optimization

404 error page design

Turning a Notion Resource into a Live Website

Color System

MindNest Color System
