Here is early stage design, part of header... I'm trying few different ideas for notification and avatar parts, I think I'm gonna go with this. Notification-click opens a dropdown, just like avatar-click.
As usual, I'm going for clean concept with lots of white space...
Comments are much appreciated,
11 months ago
The search box detailing is excellent.
@Emil Andersson @Alex Pankratov Thanks folks!
It looks great!
Colors are spot on!
@Din Bisevac Thanks,
@Kyle Decker Thanks, I love when client lets me adjust colors :)
I like this! Looking good
@Dominik Schmidt @Ced Funches Thanks folks,
Clean is the only one direction to go. Very great, dude!
@Philip Singh lol! Thanks :)
@Alexandre Naud Thanks.
Love that dropdown, so sexy.
You have a wonderful combination of orange bar shadow and the grey background @Oykun. Perfect match. And this active grey color on the switch is so deep. I like!
1_You say both icons open a dropdown menu, then why is there an arrow next to the avatar, but not next to the notification icon? I think you could risk losing the arrow, imo.
2_The search bar sits a bit too high.
3_The maximize button could be a bit smaller I think. It just seems cramped in there while the rest of the elements get a lot more space. (If it is actually part of your design. If not, ignore this point ;)
Looking good @Oykun! I have a few things I'd do differently feel free to check this out.
First off, I'd move the elements within the header bar 1px lower than what you currently have, I don't know if others agree but I feel that they look a little off. Moving them slightly lower will just counter act the optical illusion.
Second I'd make the stroke darker on the bottom edge of the menu to add a little more prominence. I've also added a little gradient to the top and bottom of the menu bar to help with this too. I'd also make the drop shadow and highlight a little less intrusive.
Overall I think it looks good man, keep it up.
Here is very first approach to dropdown. Normally it is longer, showing 5 entries at a time and scrolling to see more in fixed height dropdown, but I made it little shorter to fit into Dribbble's 300px height : )
The titles are scrapbook groups, and memory updates listed below.
Comments are much appreciated!
Btw: I'm sorry for re-dribbbling this, I noticed I shared wrong one few hours ago, here is the one.
11 months ago
Looks clean. I would love to see the full screen. One comment I have is the avatar might be a bit small from this screen in context it may be good though. Keep up the good work!
10 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