Logo of UI Challenges
Sign in
Wireframe example for Login
An example interpretation of the prompt
Icon of target

Login

Icon of book open

Design a standard login screen for returning users. Keep the layout tight and focused: one short heading, a brief helper line if needed, then the sign-in form.

Include email or username, password, a visible primary sign-in button, and a secondary forgot-password action. If you add remember me or keep me signed in, place it near the password field so it reads as part of the login decision, not a separate setting.

Show the important states: empty, filled, invalid credentials, loading after submit, and signed-in success. Errors should stay close to the field or form and explain what to fix without clearing the user’s input.

Design for quick return visits and keyboard use. The form should be readable at a glance, the button should feel like the obvious next step, and nothing important should depend on hover alone.

Icon of book open

Keep the navigation to the 'Forgot Password' and 'Create an Account' options subtle, yet accessible.

Better at UI design with every challenge

Select complexity and generate challenge.

You can always choose to receive scheduled challenges. A unique design prompt will be sent to your email daily for the duration you select.