Mobile Forms: What To Replace Drop-down Lists

Tips UX-designer from IBM Zoltan Collina. Form drop down lists seem to be an obvious design solution.

They are easy and cheap to create, they dont take up too much space, automatically confirms the entered information, supported in all browsers and platforms, and users are already used to them. Designers often use drop-down lists in the wrong place, but according to the Director of product Google Luke Wroblewskis, this pattern should be resorted to only in extreme cases.

Lets look at some limitations. The good news is that there are a large number of alternative elements for data entry, which in many cases will work better than drop down lists.

Do not use drop-down lists for solutions and choose one of two options. Instead, try a checkbox or radio button.

For a small number of mutually exclusive options suitable form of radio buttons or buttons Segmented Control. The user will immediately see all the available options, and he will not have to expand the list. Use the input form with a filtered dropdown list for a large number of the specified options when the user knows exactly what he needs to find.

For large and diverse list it is better to use existing user data to the list includes popular options are the answer. In this case, 90% of users can immediately choose the desired option, and the remaining 10 percent clicked on the “Other” option, which will be updated in the next question.

One of the advantages of the drop-down list is that users do not need to print a lot. However, if you need to print a bit, and the data is requested quite often (for example, personal information), they are easier to type and not to select from a list.

Generally speaking, the numeric keyboard is the most efficient way to enter a numeric value. If you need to confirm the data that enters the person, use a form input with a filtered dropdown list.

This is especially important if the sort order of the list items is not clear until the end. The same applies to the list of countries.

For integers — for example, the number of passengers or commodities in the basket — it is best to use a stepper. It will allow users to increase or decrease the value with one click.

For decimal numbers or variables, arranged upon the scale, it is best to use the slider. Users may be inconvenient to specify a date using a list of multiple choice.

If we are talking about the nearest date use the calendar. But never use it for input date of birth. Of course, you should not abandon these templates.

In some cases they cannot be avoided. And thats okay, just try to make the dropdown list as more convenient for users. To learn more about designing drop-down list, view the lecture of a famous UX designer Golden Krishna and Erica Campbell from the SXSW festival.

Send your speakers and front-end cases [email protected]

Leave a Reply