2

I have a form on a page where the user can edit a lot of information for a specific model. One of the properties of this model is a small icon of about 20x20 px. There are about 100 of these small icons in the application.

The question is, how do I let the user select an icon in the simplest/least cluttered way? I was thinking about a few different solutions:

  1. I could make a huge table containing each icon and a radio button, but this would seriously clutter the page.

  2. I could make a drop down list with images, though this proved to be complicated in HTML, and I couldn't get it to work. Also the list would be very tall. This would probably be the best of my ideas if it was actually supported by HTML.

  3. I could have a separate page containing all the icons in a table like in #1, but this would take away simplicity from the editing, and require separate saving to the database for the icon field.

Would be great with some more ideas!

Improve this question
0

1 Answer 1

Reset to default
2

How about using an approach similar to emoticons for IM programs? The user would be presented with a button then when clicked would display the list of icons in a grid, like this -

Communicator smiley selection

I've taken this example from office communicator program, but its similar in live messenger. Icons are small so you should have space to be able to display all of them, but have them hidden away when not needed to stop the UI getting too cluttered.

Improve this answer
1
  • Great idea! Thanks for the input. I didn't think of this myself.
    – Accatyyc
    Dec 9, 2011 at 11:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.