3

I'm designing an analysis tool which displays a number of result items in a list/table. The items are issues the user should pay attention to and react upon, like "There's a problem with X". The user can choose to ignore the result items thus effectively removing them from the analysis. Later, result items can be "un-ignored".

I'm having trouble figuring out how to best design such a feature, including the bulk part of it (that is, ignoring/un-ignoring all result items at once).

A typical bulk operation design would be something like this using checkboxes:

Ignore feature design with checkboxes

However, a usability guideline claim that one should always use only positive phrasing of checkbox labels (as discussed in this thread). Thus, conceptually, it's confusing that to ignore an item the user has to "put a checkmark to it", and to un-ignore, the checkmark must be removed.

Another approach would be to rephrase it to "Include" and then having all checkboxes checked initially. However, such approach somehow de-emphasizes the ignore feature (and people might be thinking, initially, "yeah of course these result items are included".):

Ignore feature design with checkboxes - phrazed as Include

Yet another approach would be to have buttons with different icons depending on whether an item is ignored or not:

Ignore feature design with two different icons

The problem here, however, is that the bulk operation label doesn't apply to the ignored items. Furthermore, the icons are less familiar user interface widgets.

  • What is your take on this design challenge? Do you have an alternative design proposal?
1
  • Bigger CheckBoxes!
    – Barfieldmv
    Commented Dec 30, 2011 at 12:01

2 Answers 2

3

This depends a lot of what you're trying to do.

If Ignoring items is the norm and you don't expect a lot of items to keep simply show a list of checkboxes all checked.

If the user really has to choose between keeping and ignoring items I would go for three little rows of items.

  • List
  • Ignore
  • Keep

The Items in the main List would consist of a label and two buttons. One button for Keep and one for Ignore. It would be one fluent item where clicking on the left would keep and clicking on the right side would ignore the item.

Clicking Ignore would move an item to the ignore list with some very unobtrusive move animation. Clicking Keep would move an item to the keep list with the same unobtrusive move animation

Using drag and drop the user would be able to move items too, but that would be just an extra luxury.

4
  • In my intro text I have tried to clarify what result items could be: issues. The action of Ignoring items is completely optional and only meant to be performed rather infrequently. It's like saying: "Yeah, I know this issue exists, but I don't want to deal with it (right now at least), so stop nagging me". In my design "quest" I have explored dedicated lists as you suggest. However, I don't think it's a good idea because of the displacement of items jumping back and forth. Then it's probably better keeping everything inline and having a "Show ignored" toggle as I suggest in the mockups.
    – agib
    Commented Dec 30, 2011 at 13:21
  • 1
    The animations are just eye candy. Barfieldmv's concept of having 2 buttons (Keep & Ignore) for each item is great. You can make the controls as simple as radio buttons and have Keep selected by default.
    – dnbrv
    Commented Dec 30, 2011 at 13:55
  • The goal is having the user move the mouse as little as possible. Letting them keep the mouse 'above' the top item and selecting keep/block is a great way to move through the list. Simply move the clicked item to the bottom of the list. When we're moving the items we have to show some animation so the user knows what's happening.
    – Barfieldmv
    Commented Dec 30, 2011 at 14:38
  • 1
    This is a good idea. You really have 4 views here -- Ignored items, Kept Items, All Items and New Items. The item movement mentioned allows the user minimal eye and mouse movement while they are "working the new list." Once they are done working the "new list," then the user can switch to their normal workflow.
    – Jacob G
    Commented Dec 30, 2011 at 15:11
1

I have settled for using only one list and applying iOS style toggles for individual items and textual action links for bulk operations. Also, for extra clarity, I have applied strikethrough to ignored items:

The design using iOS style toggles and bulk action links

2
  • Seems like a pretty straight forward solution. Are the users happy?
    – Barfieldmv
    Commented Jan 25, 2012 at 8:51
  • 1
    After posting the answer we have revised the design, so unfortunately I can't tell you.
    – agib
    Commented Jan 25, 2012 at 10:26

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.