Redemption table - select all

Question

Here is a little UX problem I am working on. I am posting here because our UX testing indicated a user understanding issue, and research has not helped me greatly.

Build: Online redemption table

Objective: Users can access a view of their holdings, and provide an amount to redeem.

Issue: We added a ‘select all’ option on the right to help someone who just wants the full holding (reduce typing), but testers thought it was a holding select box that would activate the dollar entry input.

Possible considerations: Looked at adding text beside each checkbox that says select all but it space is limited. Thought of using text that says Select All and Clear, but not sure that would be intuitive.

Problem: How to give users an intuitive option to easily select all of a holding or all holdings?

Answer 1

That's a pretty strange result.

Anyway, I think your users are mentally merging the two columns by the Gestalt principle of proximity. With that in mind, I'd just try putting the last column at the beginning (which is a very common pattern, by the way). Something like this:

Answer 2

You could try radios instead of checkboxes, which still tells the user how much is available in each fund, but makes it more obvious that they're selecting the amount. You do lose having everything in one column for totaling, but that might not be a problem for your users.

Answer 3

Devin added a good pattern example, I just want to say, not surprisingly, the testers thought the checkbox referred to the dollar. There is a principle of proximity in design and it means "Items close together are likely to be perceived as part of the same group — sharing similar functionality or traits." That is why you need to keep the checkbox on the front of the row and try to follow this principle if you want to apply the checkbox for all row content.

Helpful article: https://www.nngroup.com/articles/gestalt-proximity/

Answer 4

So I pasted my exact question into ChatGPT and the answer is decent so I am sharing here:

If the site is not mobile friendly, you could consider using a dropdown menu with two options: "Select all holdings" and "Clear selection".

When the user selects "Select all holdings", all the holdings are automatically selected, and the dollar entry input is deactivated. When the user selects "Clear selection", all the holdings are deselected, and the dollar entry input is enabled.

To make this dropdown menu more intuitive, you can use a label that clearly communicates its purpose, such as "Redeem holdings" or "Select holdings to redeem". You can also add a tooltip that appears when the user hovers over the dropdown menu, providing additional context about its function.

Alternatively, you could use two buttons, one labeled "Select all" and the other labeled "Clear selection". The user would click on the "Select all" button to select all holdings and deactivate the dollar entry input, and click on the "Clear selection" button to deselect all holdings and enable the dollar entry input.

In either case, it's important to make the purpose and function of the dropdown menu or buttons clear and intuitive to the user. As with any UX design solution, it's always a good idea to conduct further testing with users to ensure that the design effectively addresses the issue and is user-friendly.