[UI] A better action box

Here is a demo of a CSS-based action box that could replace existing dropdown.

Original: http://www.absolve.com/main.php?g2_view=core:ShowItem&g2_itemId=6&g2_page=1
My take: http://24.80.14.84:5190/web/gallery/main.htm

Benefits: no click required, user can see and click most important actions without having to scan all the junk inside dropdown. Anything can go inside now, for example submenus and action icons.

kinda cool, but i'm not sure if the majority likes it more than the usual drop down list.
what about a poll?

To tell you the truth, I agree with valiant. The primary purpose of gallery is to display images, there is no reason to take up so much display space with infrequently used options. Such a miniscule number of users will ever want to add the photo to their basket, print it or download it that it just doesn't make sense to force them to see the options ALL the time.

I do however like the idea and think it could be applied else where. Perhaps if there was an "edit" or "admin" mode that could be invoked inside an album, this would be the ideal place for it. When you are going through an album and fixing rotation, adding captions or generally doing stuff that you want quick and easy access to many functions, this could be useful.

The color, shape and placement actually draws my attention away from the thumbnail itself, but this could easily be corrected. Maybe if the whole thing were smaller, with perhaps the SINGLE most used function always appearing and having the rest hidden?

I think the changes you made make it look really great! I would actually like to see a mock up of the matrix theme, which places these things under instead of to the side. Is there a way to make it expand ONLY when you have the mouse over the "more actions" instead of over the whole thing?

valiant: refresh to see the "minimal distraction" variant in right column. How would you make it more beautiful?

Added: a different variant that uses a downward-looking triangle to indicate expansion (yes, the image is ugly, I know that).
http://24.80.14.84:5190/web/gallery/main2.htm

Yup I agree with FryFrogs last comment, that menu thingy lookz pretty damn snazzy...

John

KAC, they work for me, don't forget to activate javascript.

FlamingFoo, main2.htm, but a mix of the two.
text "Item Actions" when not selected, but make it more "distracting", a needs to make a little distraction, i.e. signal that it is an active part of the page. i.e. make it blue text like a link or make the background a little yellow or something.

this is nearly perfect

the html form drop down list required javascript anyway, so this is no argument against the new solution. and it seems to work IE6, Firefox, and opera 7.11.

Hahaha, I was working with him to make it less distracting... Gallery is for browsing images, not being distracted by menus that are trying to get your attention. They look enough like drop down boxes to attract anyone that needs to use them and at the same time they won't attact the people that don't need to bother.

as long as it's editable by css, it's great. IMO "Item actions" should be the default link color of the theme to signal that it is an active field, something to interact with.

Just voted for "Original" - I feel the normal dropdown menues fit better into the overall presentation. The alternate style "jumps out " too much.

FlamingFoo, I personally don't like the yellow background and the size not so much. The color for 'popping' out of the theme and for the size, I would prefer having it the same width as the column (as the dropdowns) are.
So, if it would have the same width as the whole column and a color more like a light grey it would - I assume - look more harmonic (at least to me).

Thanks, man. That explains it!

Text alignment is fine for me. I don't do anything special to it, and allow browser to render text as it normally would.
And please pardon me for having those broken for some time. I am trying to improve them, and does not always end nicely . Should be fine now.

Keeping width that is sufficient to fit in all the entries, and no wider is kind of hard. I got it working "nicely" for Opera and FF/Moz at http://24.80.14.84:5190/web/gallery/main3.htm , but IE requires heavy hacks, and I do not feel like adding a load of crap to code just to kill hover width expansion. It is fine for me already, and I don't want to uglify the code to fix something that might as well be considered a feature ;).

I like this. Even if I didn't like it, I'll defend the right for somebody else to like it. This means that we need to make sure that our theme designers have the liberty to make changes like this.

We've discussed this quite a bit in IRC over the past day or so and I think that we have a tentative plan for how we can give this kind of power to the theme designers. It'll take a little while to evolve though. In the meantime, it would be nice to build up a library of widgets such as this one so that we can get a set of UI building blocks that's a little better than the standard HTML widget set.