User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I'm designing an e-commerce app, and I'm looking for some options for the best way to select the quantity of an item before adding to the cart
The first (on the left) is when the user selects the Quantity, and the iOS drop-down selection is be triggered and the user can update that way.
Or on the right, the user can increment by pressing + or -
What are your thoughts?
I have found that users prefer using keyboard for numeric input over both of these methods. This is especially relevant if the numbers are large (both hitting "plus" 100 times and scrolling to it is a frustrating experience).
I would maybe go for some hybrid solution - having 1 as a default value and switching to a keyboard input as soon as the user hits "plus" a couple of times. It depends on what you are selling as well :)
I personally don't find the iOS drop-down selection very intutive.
The increment +/- takes up less space. So I might go for that. Although I wonder if the buttons might be a bit small to comfortably press with your finger.
Option 1 allows you to slide to any number in a matter of seconds, while for option 2, at least as it is now, you need to click that n of times. A good option would be to add an input for the second option, so the user can write the number. I personally prefer to have all the information I need in the same screen, because I don't like things being covered by other things, even tooltips. I would only go for this option if I could put the drop-down in a way that it didn't take other important element's space.
The iPhone solution is better.
It takes up less space since it only appears when you click on the quantity field. The plus-minus buttons are there always.
In terms of the number of taps - the only ones better served by the plus-minus buttons are people who want to buy exactly 2 items. For higher quantities, the wheel means less taps, and this difference grows larger the higher the quantity (for someone who wants 15 items, it means tap - swipe the wheel - stop the wheel - select number vs. tap-13 more taps. For people who only want 1 the wheel is also preferable since they won't even see it and it means less clutter. The buttons are always there, as mentioned.
If it's likely that people are going to be ordering large quantities, it's best to just use a text field.
1st one (select menu) is best option.
Because: With the select menu(drop down menu) user can select the quantity with two taps.
2nd one: If the user want to give the quantity value 12 or 20, he has to taping on '+' button 12/20 times.
Option 2 is better.
However, the default value should be close to the typical/average quantity purchased by users.
Why?
Faster: It's also more convenient for someone to press + or - rather than first "pressing" Quantity and then "Scrolling" to the desired quantity.
Less ambiguity for the user: Because it doesn't cover up the screen. The user clearly knows what happens on clicking + or -. Compare this with the uncertainty of not knowing what happens on clicking the Quantity button in option 1.
Immediate feedback + greater sense of control: pressing + or - gives immediate feedback. Compare this with longer time that it takes for the user to see the result of first "pressing" and then "scrolling". The immediate feedback of pressing + or - also gives the user a greater sense of control.
I am more familiar with option 2 design. The quantity in option 1 is quite overwhelming and the button 'done' seems bit out of place(it took few more seconds to figure out). If one opts for input field, bringing in 'update cart' button will be necessary. Which is missing from both options.
