Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have a table that users need to interact with (insideweb application), at the most basic level they need to place a checkmark which shows that an item is available on a product. If it were so simple it wouldn't be a problem. However, they also can make a number of other notations for that checkmark.

These are boolean flags on the checkmarks. Currently there will be 3 boolean flags for each checkmark.

The users' input to this screen is a spreadsheet where they will map a set of codes into these three boolean flags. Because all the information is contained in the spreadsheet it would be nice to see all the information together and not to split all the booleans into different view. However, I'm concerned that it would be too much information for one view - hence the splitting into one view for each boolean flags.

So, here's one idea of how the views could be shown, but I'd like to hear of other ideas or similar UI that might provide some inspiration!

The first image is just the simple view of adding checkmarks:

enter image description here

When the user wants to see/set a boolean flag they can click on that flag radio button above, which changes the view and allows them to change those flags. (The B is there to use something different than the checkmark.)

enter image description here

share|improve this question
2  
If you can, please explain what kind of data we're working with. It will help us assist you with the problem. Right now, just talking about check marks and boolean flags is too abstract. –  Rahul Feb 9 '12 at 15:38
    
The booleans describe how the end user will see the data. So, let's say an end user wants to buy the basic version of the product - this table says that the basic version comes with Item A1. One of the boolean flags says whether or not that item MUST come on the the product or if the user can choose to remove it. –  Laura Beckwith Feb 9 '12 at 15:53
    
What do the other boolean flags do? –  Rahul Feb 9 '12 at 16:19
    
boolean flag 1: Required (can user deselect this item) boolean flag 2: User can select manually select this optional item (vs. it appears disabled to the end user, meaning they can get it, but the item gets selected when another selection is made --- all of this is specified in rules which are not part of this screen) Boolean flag 3: Default (is this item selected for the end-user when they say they want to buy the Basic Version?) –  Laura Beckwith Feb 9 '12 at 17:45
    
I think you need to consider the implications of this kind of design on smaller devices. This kind of UI will quickly become unusable on a smaller mobile screen. –  artdog May 22 at 9:24
add comment

1 Answer

It all sounds quite complicated so let's try to break this down.

  • It sounds like you're building a user interface with which to manage products and associated features.
  • Each product comes in different versions (basic, mid, and fancy) and can offer any combination of features depending on what is configured on this screen.
  • Then on top of that, you can configure how each feature is made available:
    • is it just part of that version of the product (fixed),
    • can customers decide not to include that feature by deselecting it (optional), and
    • is it possibly a feature that is optional but is selected by default (default)?

First of all, alarms are going off in my head. Why would you want to create such an incredibly complex situation? Why are all these plans so configurable down to the individual behaviour of checkbox selection criteria on the product information page?

I would go back and talk with the product designers and see if you can't simplify things. This entire setup sounds like it would be a headache to deal with as a customer - never mind that I could visit one and see a certain product combination, then return another day and someone's been in and changed things and now the product selection is different.

It reminds me of Windows Vista's dozens of different editions that no one can tell apart.

However

In case you can't do anything about it and you still need this dashboard, I mocked up a quick HTML version:

http://uxse.handcraft.com/interactive-table

enter image description here

Rather than having "boolean flags", why not just show each option as what it is: an option? In UIs, optional flags are best displayed as checkboxes.

It's possible that I'm not interpreting your question correctly. If that's the case, let me know, and we'll refine this screen to see if we can figure out a better setup.

share|improve this answer
    
Thanks - I'm trying to figure out ways that I can break this down a bit more, if possible. Meanwhile I got some inspiration from your choices of to the labeling of checkboxes and making them slightly smaller. It takes more space, but opens my mind up to other directions to take. –  Laura Beckwith Feb 13 '12 at 13:15
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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