Dropdowns for OpenGovernment (web app interface UI UX)

by Morgan Allan Knutson Pro Sep 23, 2010

in Open Government

161 likes

10 buckets

3 rebounds

5,708 views

20 Responses

Eugenio Berzal

Looks nice man! Are the list elements in 'Track' and 'Write' also have that space in between like the icons? How do plan to do that? SO far for the icons looks great.

over 1 year ago
Pro Andrew Fiorillo

Yes, I like these.

over 1 year ago
Pro Corey Haggard

Sweet man, these drops look awesome!

over 1 year ago
Pro Rick Murphy

Love em. Smooth, shiny, no noise and pixel perfect!

1likes
over 1 year ago
Pro Cap

The dropdowns look incredible. Only thing I'd say is maybe work on the thumbs-up icon a little more (kinda looks like a comb to me) and brighten the green a little (I had to squint a little to tell it wasn't black).

Beautiful job, overall!

over 1 year ago
Pro Harry Harrison

I'm with Cap, but i'd also say that maybe the drop-shadow underneath each element is a little too dark? It might just be because the border you've got around the edges is also being applied to the bottom on-top of the shadow?

Does that make sense? Still, loving these and your subtle color-schemes. :)

over 1 year ago
Pro Pete Orme

Really love this!

over 1 year ago
Pro Morgan Allan Knutson

Thanks guys, much appreciated.

Eugenio, there will be similar spacing.

Cap, I think I need to extend the wrist more. Thanks.

over 1 year ago
Tory Hobson

lovely

over 1 year ago
Pro Justin Lascelle

fuck yeah son!

over 1 year ago
Thumbs Up it may be a case where you can get away with three fingers on the fist, rather than being too literal. or you could always go bigger. September 24, 2010

Rebound

Thumbs Up

by River Brandon

it may be a case where you can get away with three fingers on the fist, rather than being too literal. or you could always go bigger.
- 2
- 1
- 668
over 1 year ago
Button Tweak the only other thing bugging me was that little box for the arrow on the right of the expanded button. i think there's still a lot of empty space between the... September 24, 2010

Rebound

Button Tweak

by River Brandon

the only other thing bugging me was that little box for the arrow on the right of the expanded button. i think there's still a lot of empty space between the main verb (share) and the options in this, which could probably be improved too.
- 4
- 1
- 779
over 1 year ago
Open Button Tweak could be something like this... September 24, 2010

Rebound

Open Button Tweak

by River Brandon

could be something like this...
- 2
- 2
- 926
over 1 year ago
Pro Cap

@River Brandon: I actually think the spacing is pretty fantastic as is.

over 1 year ago
Pro Joel Glovier

So what script are you using to style your select elements?

over 1 year ago
Pro Morgan Allan Knutson

River, thanks for the suggestions.

Rebound 1: I do kind of like the third one, i'll give it a shot.
Rebound 2: I don't want to fade the line there, as the only images are the arrow and the social icons, and I like it that lightweight.
Rebound 3: I'm actually a huge fan of the symmetrical white-space that I have going, but this is a good compromise.

Thanks again.

Joel, I'm not using any scripts. CSS all the way.

over 1 year ago
Pro Brand Winnie

Stellar Morgan.

over 1 year ago
Pro Morgan Allan Knutson

Thanks Brandon.

over 1 year ago
Pro Joel Glovier

Cool! So no select element then, huh? Just all ul's? I've been focused on some donation form styles lately so I've been researching scripts for styling the select element. When I saw your drop downs I instantly associated them as such - but obviously they're not part of a form, huh.

over 1 year ago
Pro Morgan Allan Knutson

Yeah, they're not forms. Just links, some with code generated html.

But the HTML looks something like this:

<div class="hov">
<h4>Share</h4>
<span class="arrow"></span>
<ul>
<li><a> </li>
</ul>
</div>

over 1 year ago