5

I have an app that allows users to browse stored data in a list format. All users see the same state of the data. Users can click on a "hide" button which removes a particular item from the list and this action is propagated to all other connected users with the help of WebSockets.

The issue is that if user A starts removing some items from the list, all other connected users will see a "jumping" list and will not be able to do anything until user A stops.

Is there a UX pattern or some study case that would help me avoid the "jumping" issue? I know that I could just "disable" removed items or just make them grey + unclickable, but I would like to keep the feeling that the list is getting shorter thanks to other users.

4

You can use visual indications for displaying state on a record, and allow it to gently fade after x time. You can also use a banner or lozenge notification that shows records are being removed.

I don't know all your constraints, but you can use a combo of visual change, indicators in proximity to the change, and fading animation when the list updated due to removals / additions.

Similar to G Suite, if you have knowledge that others are viewing / editing the document, that helps set expectations that some edits may take place.

enter image description here

Update: suggestion to refresh manually

@jsejcksn had a excellent consideration to add manual refresh. I imagine one approach is to bake it into thee small banner/ lozenge above the table, and you can have the command in close proximity.

enter image description here

| improve this answer | |
  • 1
    These are good suggestions. One more thing: Don’t modify list item positions without user interaction. Instead, supply the user with a “refresh/update” button to let them clear the items that have been indicated as removed and reflow the list when they’re ready. – jsejcksn May 24 at 12:02
  • +1 Good point. Perhaps a small 'refresh' near the indicator. nice consideration... – Mike M May 24 at 13:39
  • 1
    Just upvoted your response, @MikeM, with two minor caveats: 1) The OP used the term "Hide" items from the list, not "Remove." Those are two very different interactions that might require clarification as to which one applies here. 2) I'm not a friend of requiring users to manually refresh lists. In this particular case, I'd try to avoid giving the impression that that is something that generally required, by testing with a slightly different label for the command, such as "Clean Up List" or "Remove Hidden Items." – JochenW May 24 at 17:42
  • 1
    @JochenW +1 Agree on tweaking the language for clarity on the command labels. Perhaps 'Clean up' could be enough to suggest it's not required. – Mike M May 24 at 18:23

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.