UI Metaphor or Examples of configuration preset selection

Question

What is a good UI metaphor for selecting from a set of configuration options?

The tool I'm designing for has nearly 200 (!) inputs that can be set depending on your particular application and needs. You could think of the app as a single function with 200 input parameters.

We know there are ~10 common sets of settings, so we want to give users a way of quickly picking one of the preconfigured settings based on their needs. But of course have the option of doing whatever tweaking is necessary.

The closest analogy or metaphor I can think of is like the preseq EQ settings on your stereo receiver. You pick one of the presets (Classical, Rock, Pop, etc), and then you have the option of tweaking any of the individual bars to your liking.

• Can you think of any software tools that do something like this?
• How can I give the user some idea as to which settings get changed/updated when they change the preset?

Answer 1

^{download bmml source – Wireframes created with Balsamiq Mockups}

If you do a brief 'highlighting' animation on the items to right right as they change. Users will be able to quickly and easily see how the presets on the left are manipulating the complex options to the right.

When a new preset is checked: settings that are deselected 'uncheck' and turn red, brief pause, then they fall back to their original location in the list. Red fades out. Settings that are newly checked turn green and appear at the top of the list AFTER red items have left. Green fades out. Unchanged items are unchanged.

Obviously my names are place holders. This would make alot more sense, with real explanative preset names, and real settings.

Answer 2

Interesting problem.

You can have the presets menu placed horizontally at the top of the screen. A dropdown is also an option if you see you have a lot of presets, but then comparing presets will become very annoying, as you need to open the dropdown and locate your item every time.

Break your 200 items into categories. With such a large number of items within the same app, I'm sure that some meaningful categorization must be possible. Display them grouped by category, this way this amount of info is much easier to digest. 10 groups of 20 are much easier to handle than 200 items. If all else fails, even a "meaningless" alphabetical grouping is preferable to no grouping.

When you switch from preset to preset, both display the new values of the items and highlight the items that changed so your users can locate the changes easily. I did this with a bold font, but what should be used is background color or maybe something stronger. If you want to go the extra mile, you can also provide this indication on the category title, this way users can quickly identify which categories they should inspect more closely.

Have the list of presets fixed so it doesn't disappear when users scroll down to the bottom categories.

^{download bmml source – Wireframes created with Balsamiq Mockups}