@JesseDodds once said he found pushing pixels in tiny icons soothing. I think I can say the same about fiddling with animation timings. I could spend all day getting it just right. You’ll definitely want to watch the video version.
This shot’s got a lot of things I’m pretty happy with:
• the text box is invisible! It’s like you’re typing into the website itself. It seems so much more immediate. The future!
• Enter-to-post. It makes it much more IM-like. And cleaner.
• The animation reminds me of peeling off post-its. It’s delightful and and quick enough to not be intrusive. I like the metaphor: you’re not typing into an abstract text box which inserts text over there; you’re typing your comment and this is it moving.
about 2 years ago
That'd make a nice chat client! Great job on the animations, would love to see the code for this :)
That's nice matthew! The animation really gives it a nice touch. I particularly love the way the "right now" text blends with the background once the message is sended.
Are you animating this using CSS animations/JS ?
SWEET! Love it, great job!
Love that the "text box becomes invisible" once it gets focused. Feels less claustrophobic and lets the words breathe.
You are so good at what you do. I'm inclined to hate you for it, but I usually just end up inspired.
Finally, I broke 99 likes :D
almost 2 years ago
I really liked Matthew's idea of removing the "input look", once you focus a text field. It frees up the claustrophobic feeling and lets your typing give some breathing room. Also the UX doesn't get compromised because in the unfocused state it's still screaming: "Hey, I'm a text input, click me".
So it's now also on tlk.io. But we still have to add that the text field grows when you type more than one line, otherwise it's not really freeing. ;-)
almost 2 years ago
Loving this ux.
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2013 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.
Follow Dribbble on Twitter