3

I have a web page (although I don't think that's relevant, it could equally be a desktop or mobile app) that displays a list of events. More events arrive all the time, and are added to the top of the list as they arrive. We want to add sorting and filtering to this list, but I'm not sure what to do about incoming events when the list is sorted by anything other than latest first, or is filtered.

For example, if the user filters the list by (say) event type "Jim" and a new event of type "Fred" arrives, I presume I don't show it. The only thing is, they might leave the list filtered, and then not see most of the incoming events. This will probably confuse them.

Similarly, if they sort the list by (say) duration, shortest first, and a new event comes in that is of a longer duration than any shown, do I add it to the list? If so, does it need to be inserted in the correct place in the list?

Update In response to TripeHound's excellent questions, here is a bit more detail: The users will be watching the page during a campaign, and their main interest is seeing new events. They may filter to see what events particular users raised, they may sort to see what's been going on, who raised the most events, or the shortest, etc. So in short, it's very important for them to see new events.

Anyone able to advise. Thanks

7

Following the OP's update, I'll start with a specific suggestion for their problem. This will be followed by the sort of approach that you might take in the more general case (a slightly updated version of my original answer).

Specific Answer: Campaign Events

As I understand your needs, your users still need to be aware of new events as they arrive, even if they are filtering/sorting to focus on specific users and/or campaigns. Even if your users were happy for new events to suddenly pop into existence in the main list, the sorting/filtering in effect might prevent them from being seen.

I would therefore suggest two modes, depending on whether any sorting/filtering is being applied:

  • The default mode will be to show all events in the list-view, with new events popping into existence at the top of the list as the arrive.

  • Whenever any non-standard sorting/filtering is in effect, show new events in a "ticker strip" along the bottom of the window/screen. (I've just coined the term myself: no idea if there is an "official" name for such a thing).

The following shows a mock-up where three new events have arrived since the user started applying their own sorting and filtering operations:

List view and new event ticker

Obviously, you can vary which details of the new event are shown, and whether or not to use colour-coding as an indicator (as I have done for Event Type).

Should you get more new events than fit within the "ticker strip", then the cell at one end or the other of the strip can be used as summary. If it's more important to show the first few new events (since starting to sort/filter) then put the summary on the right (the three original events are shown; two newer ones are summarized):

ticker with newer events

If it's more important to show the most recent new events then put the summary on the left (the oldest two original events are summarized; the most recent original event and two new ones are shown):

ticker with older events

In all cases, clicking the "recycle" logo would return to "default mode": clear the ticker, clear all sorting/filtering, and re-display the main list with all events, newest at the top.

Depending on how much "real-estate" you have available, you could always leave space for the "ticker strip", even if the main list-view is showing a "live" feed. Alternatively, you could "steal" the space for the bottom few rows from the list-view when needed. This would probably best be done when the user first starts to apply sorting/filtering (as opposed to when the first new event arrives): that way it happens on a user-initiated action instead of randomly.


General Considerations

I think the right way™ will depend on individual situations. A couple of questions you should be asking Product Owners and/or users include:

  • Why are they using filters/sorting? Is it to perform some specific task, or to create a view? (Roughly, are they actively or passively using the features: see below).

  • How important is it to know about new events? Can they just be "made aware there are new events" or is the arrival of a new event so important that users need to know about it even if in the middle of something else?

Examples of the ways a user might be using sorting/filtering include:

  • Specific Task: An accounts Receivable clerk uses a filter to show only overdue accounts. They sort by date to show the oldest and select a number of entries. They then sort by amount owed, and select a number of the largest. Selected entries are then escalated.

    A user probably doesn't want to be interrupted in the middle of performing such a task by having new entries suddenly appear in the middle of their list.

  • Establishing a View: Someone on a Support Desk might sort incidents by severity (highest first) and age (oldest first), filtering out those waiting for customer response. Once set, they will repeatedly pick the top ticket in the list and contact the customer.

    In this case, if a new "Severity 1" incident comes in, it will want to be automatically inserted at the top of the list as soon as it arrives.

Depending on the answers to questions like these will inform you as to how best to handle things:

  • In some cases (e.g. the Support Desk example) it would be appropriate to insert new entries into the list as soon as they arrive.

  • In some cases, while it might be appropriate to insert new entries, the nature of the sorting/filtering would mean they wouldn't immediately be visible.

  • In other cases, it wouldn't be appropriate to interrupt what the user is doing by inserting new entries into the list (whether they would be visible or not).

In the latter two cases, you want some other way to indicate new entries exist:

  • It may be sufficient to have an area of the screen informing the user that there are new events, probably with an option to "refresh" the list to include them.
    New events button

  • It may be necessary to show (at least some) details from individual events.

For the latter case, one option might be to have two lists. One always unfiltered and organised so that new events appear at the top of the list; the other where the user can apply sorting/filtering. In most cases, I suspect this would be either cumbersome, or wasteful of screen real-estate. One possible method could be to normally show the unfiltered/new-events-on-top list. When the user wants to sort/filter, the list area goes into a "split-screen" mode, where the upper half remains unfiltered, but the lower half can be sorted/filtered as desired.

Another option would be to use something like the "ticker strip" paradigm I described at the top of this answer.

  • Excellent reply, thanks. I updated my question to (hopefully) answer your two questions. Please let me know if that changes your opinion. – Avrohom Yisroel Jul 25 at 16:07
  • @AvrohomYisroel I'll edit my answer when I get the chance, but in response to the update I'd probably have a "new events" section with new items appearing as soon as they arrive. I'd probably not update the main section if a sort/filter is in effect as this can be disconcerting (IMHO). – TripeHound Jul 25 at 16:12
  • @AvrohomYisroel I've updated my answer in light of your response. – TripeHound Jul 26 at 12:19
  • Thanks, that's excellent. – Avrohom Yisroel Jul 29 at 13:46
2

Filtering: When the list is filtered an an item is added it should only be displayed if it matches the filter. You are saying that you are afraid, that the user might leave the filter on. Yes, this is a risk but you would have to achieve to make clear to the user that the list is filtered. There are options like show the applied filters as chips, have a title like '22 filtered items out of 2000 items displayed' or the like. If a user filters the list i suppose that the user has a reason for it and does not want to see other items not matching the filter options even if they are new.

For the sorting: This seems more difficult for two reasons. A) the user might not see that a new item is added below of the current item. B) if the new item is inserted above the current item the list might move down which is extremely annoying when scrolling through a list. (but this is a problem you might have even without sorting implemented). So what you could do is, do not insert the new item into the list but bring a sticky message (top or bottom) which says something like '2 new items, reload list?'. This way it is the users decision if he want's to see this new items or not.

  • Excellent answer, thanks. I like the idea of the message, seems to give the best of both worlds. – Avrohom Yisroel Jul 25 at 20:11
1

Your design decisions should be made to highlight two critical info points, and clearly communicate how those are changing:

  1. Total entries of your dataset
  2. Total of your currently filtered sub-set

Ideally you would want some manner of animation applied as entries are added or removed from the total pool of data or your currently viewed filtered sub-set, and possible clear audio cues as well.


As far as actually adding them to the visualization: Respect the current filter, sorting, and position.

Add them into the list where they belong. Ideally with clear animation on it.

  • Such as green highlighting that fades to normal on a newly added entry.
  • disable the interactions and highlight entries in red for a short time before removing them if they should no longer be relevant to your list.

If the lists are long such that you need to scroll, then possibly allow for animations at the top/bottom of the scroll field to clearly communicate a change 'off screen' has occurred. But do not allow items added above or below the current scroll view to move what's on screen to avoid having stuff 'jump around'.

  • Clear animations on the 'total events' counter should serve well enough to communicate "Something was added in the background, but it does not fit within your current filtering"

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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