UX Best Practice: When to remove item from filtered list?

  • I have a list of items to be displayed to the user. The user is able to select an item and configure its properties. The user can also filter the list based on some of those properties. If the user configures an item so that it should no longer be in the list based on the current filter, what is the best way to proceed? I can think of three possibilities.

    1. Remove the item as soon as the user confirms their changes, risking confusion because the item they just edited has vanished.
    2. Leave the item in the list until the user next alters the filter, even though the item no longer conforms to the current filter.
    3. Pop up a warning that the item is about to disappear, forcing the user to click an acknowledgement before the item disappears.

    What it the best method from a user experience perspective? Are there better options?

  • A few options, one complex one and two simple ones:

    Option 1:

    1. Wait a short time, maybe 800-1000 ms
    2. Filter controls (or filter description if controls are hidden) and Line Item both blink twice with red highlight, with the timing perfectly synced so they're blinking "together".
    3. There's a brief pause where nothing happens
    4. Line item zips to the left (left is important as it implies "backwards")
    5. The list items below the removed item move up to "settle into place"

    Steps 2-5 take like 1500 ms in total.

    The following story is not consciously recognized by the user, but their subconscious will use this story to make sense of what happened:

    1. pause: just-edited Item is settling into its new state/identity
    2. blinking: Item and Filter are having an "argument"/"conflict"
    3. pause: Item is deciding what to do
    4. zip left: Item runs away
    5. list shifts up: The list "closes ranks" after the offender's been pushed away

    The overall story is "After changing, Item had to leave"

    Obviously that whole story would be way too dramatic if it were interpreted consciously, but as a series of little animations it provides the intended conscious interpretation: that item was removed from the list because it didn't fit.

    Option 2:

    Make the edit form for Item aware of the current filter. Highlight any field values as they're editing that cause a filter violation. Just above your Save button put put the message "Heads-up: After save this item won't match the filter and will be hidden". ("hidden" is key word to avoid them thinking it was deleted)

    Option 3:

    Filter and item blink once together, then item fades out and list closes up.

Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2