1

Ok, so I'll try to make this as clear as possible.

So, I work in a PASS app product offering tech company and we've encountered the following issue while building a micro interaction task for one of our UIs:

At some point, the user must use a dropdown to pick two different values that will then appear side by side under the said dropdown. A colleague of mine brought up that it seemed weird to her that we asked the user to go back to the dropdown a second time in order to add the second value. According to the wireframe bellow, here are the sequential steps to complete the task at hand:

1- Use the "A" dropdown to select a value -> the selected value will then appear in the "B" area 2- Go back to the dropdown and pick another value that will appear in the "C" area. enter image description here

The two selected values can then be interchanged for the landing areas are draggable.

She was claiming that using two dropdown, one for each value, would be simpler. True, but the thing is that both values need to be easilly swapped and swapping dropdowns seemed a little uncommon.

Any comments will be appreciated. Also, I first looked up for UX principles that could have resolved the mather, but I haven't found anything satisfying so if any one out there could link me with appropriate UX sources to support the argument, it would eb super nice as well!

1

Try a dropdown where you can select multiple items at once.

When the user clicks on the dropdown (A), it expands. The user can then select multiple items (second and third image). After clicking close, the user will see the selected items (fourth image).

enter image description here

The idea is that you use only one. Multiple dropdown menu's with multiple options will confuse the user. Be very clear in your choice of dropdown. Use only one which has all the options.

Drop-down menus are often more trouble than they are worth and can be confusing because Web designers use them for several different purposes. Also, scrolling menus reduce usability when they prevent users from seeing all their options in a single glance.

Source: Drop-Down Menus: Use Sparingly

You might even consider not using a dropdown at all.

All too often mobile forms make use of dropdown menus for input when simpler or more appropriate controls would work better. Here's several alternatives to dropdowns to consider in your designs and why.

Source: Dropdowns Should be the UI of Last Resort

0

Here's another possibility:

  • no A dropdown
  • B and C are dropdowns, they don't have to be draggable areas as there's faster solution to interchange them (button)

enter image description here

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.