I have built an order form in which the users requires to enter their order details. One of the fields on the order form is 'Required Number of Passengers', in this field the user enter how many passengers he want to take to the expedition (this is a form submitting for expedition).

The problem I have is:

  • The user is not usually suppose to request more than the available passengers, or at least he needs to be aware of that.
  • The site administrators who handle the form submission, doesn't want me to prevent entering more passengers than the available because sometimes when there is an high demand they get additional transportation.
  • What actually happen is that the users are requesting way more than what they suppose to, they claim that they don't see the alert of how many passengers available are left.

Attached is a screenshot of the order form focus on the relevant area. I hope you can suggest how to make the alert more visible - right now i think they are visible (but the users think otherwise)

enter image description here

Please note, the red rectangle on the screenshot was added just to show where the relevant field is located

  • I think it requires some thinking around the business process/logic of the form, because the number of buses also comes into the equation of how someone might fill in the form. In general when you don't put in a sensible rule against a form for validation then you would expect this type of error. This suggests that you should make the logic sensible which will remove the issue around the UI design. I think the user can overlook the availability because of its position and the way it is styled (e.g. if it is in red then people might pick up on it as being rather important).
    – Michael Lai
    Mar 20, 2017 at 3:03
  • @MichaelLai I understand your point but I do have two comments. In regards to the business process, the number of available passengers at the point of submission is Important because you don't want the user to over request seats. But on the same time the organizers (system administrator) would expect 10% of over request because they reserve the option to order a bigger transportation. In regards to color the information in red wont you think it will make them feel as they are doing something wrong, red color is link to an error or something bad such as a low score..
    – Silagy
    Mar 20, 2017 at 5:32
  • 1
    I can't speak much for how to balance the business process (requirements) and what the system administrator does to accommodate the customers. In terms of the colour, I am not suggesting to use red (unless it is part of the brand or style guide for this purpose), it is just to point out that the blue is similar to other colours that are on the interface as part of the normal style, so it is hard for it to stand out (and for the user to take notice).
    – Michael Lai
    Mar 20, 2017 at 6:48
  • @MichaelLai I missed your point about the blue color and the fact it is not stand out. Point taken, thanks!
    – Silagy
    Mar 20, 2017 at 6:50

1 Answer 1

  • Show the warning AFTER the user entered the amount. User focused on entering the info, and the existing message can be just missed (something similar to the banner blindness)
  • Some animation will draw user's attention
  • Apply warning color of the entire area to increase visibility and show the relation
  • Propose a way for the user to get more info and solve this problem

enter image description here

And "60 available out of 180"... This looks a bit disappointing.

  • Thanks you very much, I like your approach. But I can't remove the alter of "60 seats available out of 80". So the alert you suggested will be in addition to the existing alerts?
    – Silagy
    Mar 19, 2017 at 17:18
  • @Silagy yes, you can use the approach along with additional info. Again, 60 of 80 looks a bit ambiguous. If 60 is the available limit, why do you point 80? It it "top max limit"? Mar 19, 2017 at 17:57
  • I must say that i don't have a good answer to you. I will ask the customer about it. I might remove it
    – Silagy
    Mar 19, 2017 at 18:04
  • 1
    @Silagy I'll be glad to hear from you about the purpose of that number. The UI and interaction can reflect that logic in more elegant way. Mar 19, 2017 at 18:19
  • 1
    @Silagy you can have something like "Request more seats" link (along with input field with max limit), which reveals a panel/dialog with additional info of how to request more passangeers and the splitting rules. Mar 21, 2017 at 7:35

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.