3

This UI is for a B2B web ecommerce page, where a buyer can enter quantities for multiple sizes of a product. They first click a size in the top row which reveals up/down arrows on the qty, which the user than taps to increase or decrease qty as needed.

tab Size Quantity

on the click: up and down arrows to change the quantity of the Size 6

enter image description here

Can you suggest any alternative or new UI that save space but is scalable and is suitable for mobile gestures?

2
  • What is the use case for this interface?
    – cimmanon
    Commented Nov 28, 2013 at 18:37
  • To be placed in a Product Page in a B2B Ecommerce website. 1 Buyer "Searches for products" 2 Selects "Quantity" for each "Size" 3 Click "Add to order" to Add the selection to the current order
    – Timo Patek
    Commented Nov 28, 2013 at 18:51

1 Answer 1

5

Current design has some bad features:

  • Per-column layout isn't scalable, as the screen width is limited. And horisontal swipe for scrolling could conflict with screen changing gesture interaction.
  • Per-column interaction isn't convenient, as the data is best readed row by row.
  • Increase and decrease buttons rather small for touch interaction. enter image description here

You could use more convenient layout, which has no mentioned issues:
enter image description here

4
  • Thank you so much for the feedback. I totally agree with both your point, the only thing is that I am trying to stay as short as possible in terms of verticality and 4/5 might be the average number of rows in this feature.
    – Timo Patek
    Commented Nov 28, 2013 at 19:03
  • @fdonelli Ignoring usability saves the screen space but cuts the money. That's why usability is important. Commented Nov 28, 2013 at 19:37
  • Of course. Thank you for your suggestion anyway, I am reworking on that anyhow.
    – Timo Patek
    Commented Nov 28, 2013 at 19:47
  • The version of @Alexy supports the mental model of users better.
    – sysscore
    Commented Nov 29, 2013 at 16:14

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.