I have a requirement for a user story I am working on requesting that on checking a check box in a check box list, the selected items appear at the top of the list.

My gut is telling me this is confusing for users, but I would like a more "UX-y" type description to provide my Product Owner.

  • What happens if you un-check the box? What happens when more than one checkbox is checked?
    – Mark Bubel
    Jul 9, 2014 at 20:55

4 Answers 4


There are a variety of issues I see with that suggestion, most notably:

  • Breaks Conventions: Checkboxes are a very familiar element on web-pages and that suggestions is considerably different than the very familiar and widespread convention of the list staying static and only the checkbox changing (e.g. toggled as checked/unchecked), and as Jakob Nielsen's Law of the Web User Experience states "users spend most of their time on other websites," so you'd better have a really good reason for flouting established conventions.
  • Off-Page Elements: If there is any chance that the list will expand beyond the 'fold' I can't think of any way to do this interaction gracefully. The user will be presented with A)Items that disappear after they select them or B) A (likely) disruptive animation that jumps them to the top of the list, thereby removing them from the context they had been in.
  • Breaks Sorting: If you have any type of sorting on the list, this movement will make the sorting either inconsistent (i.e. non-checked and checked items will sort differently), or overly convoluted (i.e. sorting overrides the checkbox at top convention, but that convention comes back when user selects another, etc.).
  • picking this as the answer. that link to Jakob Nielsen's page is great! This is going to help with lots of discussions! Jul 10, 2014 at 15:56

This is a classic case of a user trying to design a solution themselves, rather than just stating what problem they are trying to solve.

Ask the user what they want to achieve with this interaction.

Once you have this information you are in a better place to discuss alternate solutions.

(Asking questions is a good strategy to get someone to be open minded. Telling someone they are wrong will just make them defensive and more likely to stick with their original position.)

I strongly suspect that they want a mechanism to be able to easily find the items they have just changed.

A better solution for identifying changes would be to highlight the rows with changes in a different colour. If you have a large volume of rows (i.e. you have rows that are off the screen), you can also provide a filter that will switch the view to show only the rows with changes.

  • And to save your time in cases when you're pretty sure about your suspection, you can even try to skip the user. You may need to position the "they want a mechanism to be able to easily find the items they have just change" as a suspection only and let your Product Owner express, whether s/he agrees with it. If you both are on the same side, present two or three alternative solutions to the original, that solve the problem. One danger of doing this is - once you make a mistake in your guess based on experience in the field, you'll have the responsibility for it, not a Product Owner.
    – digsrafik
    Jul 10, 2014 at 9:27
  • @digsrafik No matter how sure I am, I always ask first to confirm my assumptions about the use case. I may be the "development expert", but I am not the "workflow expert". Only the user who requested the feature can give me the information I need to solve the problem. (Although, my users are all in the same building as me, I guess for long distance it might be harder.)
    – Franchesca
    Jul 10, 2014 at 9:34
  • Hey, I envy you your working environment! :)
    – digsrafik
    Jul 10, 2014 at 11:15

Alternatively, you can animate the item to move to the top - animation always conveys more information. But it's true, as it's been stated above, that it would be confusing if there are so many items that it would "disappear".


I suggest, that Product Owner has "good" intentions of making the selection obvious and easy-to-perceived by users.

Indeed, the pattern of dividing all the set of elements into un-selected and selected is convenient if there are a lot of elements. You can see an example:
enter image description here

Moving the selected checkboxes is an attempt to implement this pattern, though it's not the best.

My proposition is slightly different, please watch the mockup:
enter image description here
The points are:

  • Duplicate selected elements in the Main area to provide quick reference to them
  • Provide easy way to delete checked elements from Main area (also uncheck appropriate elements in the Checkbox area)
  • Make selected elements in the Checkbox area less prominent to focus users' attention on un-checked ones

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.