Decided to design a mini email client myself.
1) New mail is displayed by a green vertical bar on far left of message
2) Swiping/dragging to the right the message, buttons for “reply” and “spam” appear.
3) Swiping/dragging to the left, shows the delete button (not show in screenshot)
4) Write new mail by clicking on top right icon. When in “writing mode”, the button changes to “send”.
5) To view additional pages/functions, like “deleted”, “spam”, “sent mail” keep the mouse on top left button hovered for 2sec (or swipe down on the icon on mobile)
1) The new mail (“Twitter – Design job position”), has the message title in bold as well.
On other news, check out my guide to making a popular shot on Dribbble →
about 1 year ago
For me this is the best one I've seen. Great work :)
Wonder if theres a nice way to select more than one message?
@Matt I was thinking how to delete more than one message at a time, and did some iterations.
Thought when swiping/dragging to the left for the “delete” button to appear, to show select points instead of “favourite” icon to click on desired messages and change the “write new mail” button to a “delete” button.
Or another idea would be with “ctrl” pressed, to click on several mail messages to select them all, and again change the icon to a “delete” button.
@Alex Cican I like the idea of the "write new mail" changing. You could just have swipe to the right to select a message or multiple messages, then show the 3 options at the top where "write new mail" is.
Will this project end at the PSD phase? Would love to play around with a (at least) clickable prototype.
@Igor Kochajkiewicz I’m working on another mail client called “Mailer”: http://rnailer.com/
though it’s totally different than this shot
Such great UI work man!
Looks clean, nice job. One UX suggestion is that 'swiping' on a desktop environment (i.e. with a mouse) is not the easiest or cleanest interaction. It obviously works great on touch interfaces, but I've found users prefer clicks in desktop apps. Maybe hovering over a message slides it over to reveal the action buttons?
9 months ago
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