Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

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?

share|improve this question
    
What is the use case for this interface? –  cimmanon Nov 28 '13 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 Nov 28 '13 at 18:51

1 Answer 1

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

share|improve this answer
    
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 Nov 28 '13 at 19:03
    
@fdonelli Ignoring usability saves the screen space but cuts the money. That's why usability is important. –  Alexey Kolchenko Nov 28 '13 at 19:37
    
Of course. Thank you for your suggestion anyway, I am reworking on that anyhow. –  Timo Patek Nov 28 '13 at 19:47
    
The version of @Alexy supports the mental model of users better. –  sysscore Nov 29 '13 at 16:14

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.