📚 Curious about learning UI Design? Check out our new 4 week Intro to UI Design course. Flexible Learning. Live Mentorship. Figma Fundamentals. Enroll now for 25% off.
Trending designs to inspire you
Work designers are riffing on
Interviews, tutorials, and more
Prompt to flex your design skills
Find your dream design job
An exclusive list for contract work
Get new leads in your inbox every day
Introduce yourself to new clients with Pitch
Learn product design in just 16 weeks...
Learn UI Design Basics and Figma Fundamentals...
Level up your skills with our interactive courses and workshops…
Portfolio creation made easy
Fresh leads in your inbox every day
Build your team’s pipeline or profile
A marketplace of digital assets…
Icons, Illustrations, Patterns, Textures…
Display, Script, Sans Serif, Serif…
Mock Ups, Social Media, Presentations…
Characters, Objects, Textures…
WordPress, Shopify, Bootstrap, HTML5…
Procreate, Affinity, Photoshop, InDesign…
Earn money doing what you love
Find, contact, and hire designers
The #1 job board for creatives
Board for freelance & contract work
So I was looking for a nice design to code up and play with at the weekend for fun. I love Oykun's work and wanted to code up the original to this shot.
I started tweaking and making changes to it and added some new elements. It's not the finished article, it's just a quick demo/experiment to prove/disprove a concept.
The idea being that there's no more work involved for the user, no additional steps or buttons, they still click on the username and start typing straight away. If they head straight for the submit button (which is disabled until the details are entered) a warning pops up.
I don't think this would be an ideal concept for mainstream sites but could maybe work on more techy/web savvy sites.
Played with a nice custom checkbox and some styled in tooltips. Button changes on entry of username and password too.
Thought: One concern I had was placing the forgot link inside the form. I think it should keep it's same position but probably be always visible. I kept it inside in this demo to make it extra teeny tiny :)
Check out the full screen attached.
Or to see what the heck I'm talking about visit... dvdhil.co/teeny