5

I'm working on a web-based app that's similar to a control panel, with lots of different settings and features to configure. The challenge is making it easy for users to find what they want without making the interface too cluttered.

Could anyone recommend layouts, UI elements or design patterns that work well for this situation? Examples of good control panel interfaces would also be helpful.

By "control panel" I'm talking about an interface that presents a potentially large number of widgets that allow for things to be configured. There's usually a metaphor of drilling down into a particular area to find the settings you want to manage, and then pulling back out to a top level view.

Some well know examples would be the Windows Control Panel (Vista or later aren't bad), web hosting account management interfaces like Plesk, or the admin interface of WordPress.

Thanks!

Improve this question
2
  • 2
    I'd start with some sort of card sorting exercise to see if you can get things grouped into logical ways.
    – DA01
    Commented Feb 9, 2011 at 2:35
  • Also, since you're specifically asking about UI, this should probably be moved to userinterface. (I'm not a fan of the fragmenting of topics into all these separate sites...)
    – DA01
    Commented Feb 9, 2011 at 2:35

1 Answer 1

Reset to default
3

A good hierarchy is critical - DA01's suggestion about using cards is excellent since it lets you visually organize your categories before starting to code.

Plan for accessibility - controls that enable the largest group of people to easily use it make for the most popular designs. Stuff like redundancy (icons AND text), color coding (yes, it's less useful for color blind people but that's why you have redundancy) for "same as" controls (e.g., "Save", "Save as", "Save a Copy" etc. can all have similar colors / themes) and visual immediacy (most people read web pages in an "F" shape, so use the 80/20 rule and stick your most common / popular controls along the top row or along the left side) are all really useful in design of a UI.

Remember, most users these days have no idea what a "drop-down control" is but they know if there's a plate on the right-hand side of a door they should push the door open.

Improve this answer

Your Answer

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

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