1

On a mobile application I am developing, there is a screen that populates a list dependent on my client. For some clients, this list may contain only 2 items, and for others it may contain as many as 300 items.

Though the items are already sorted alphabetically, I wanted to add a search button/bar to my screen to help the larger clients find their desired list items even faster; however, this seems a bit distracting and cluttering for some of our smaller clients that may only have to look at 5-10 items. The size of this list could change from day-to-day, so a client that has only 4 items in their list may have 70 the next day. In such a case, I worry that the search option being visible only under certain conditions may confuse my users.

How do you guys think I should go about this? A few possible solutions I thought of:

  • only showing the search option if the number of items is greater than some pre-defined number
  • only showing the search option if there are enough items to make the screen scroll
  • not having one altogether since they are already sorted alphabetically, and making the user scroll

Any input is greatly appreciated, thanks!

1

You don't want to hardcode anything. You'll want this to scale dynamically, as screen sizes and resolutions differ vastly between devices.

Your best bet would be to utilize the size of the list, the container in which the items exist, and the resolution of the screen itself.

You could run into cases on large / high resolution devices in which the list fits in the container without scrolling, but it's still easier for the user to type a few letters than scan the list.

The formula you utilize to decide whether or not to display the search bar is up to you, but you should keep those factors in mind.

I also don't think that always showing it is too big of a deal.

0

Having a search box with very few items seems silly.

I feel it's best to show the search box only after the user has scrolled past a predefined number of items.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.
{"cc_re__cc_re__cc_by_sa_3_0": ["<li class=\"-item\"><a href=\"https://www.facebook.com/officialstackoverflow/\" class=\"-link\">Facebook</a></li>\r\n                    <li class=\"-item\"><a href=\"https://twitter.com/stackoverflow\" class=\"-link\">Twitter</a></li>\r\n                    <li class=\"-item\"><a href=\"https://linkedin.com/company/stack-overflow\" class=\"-link\">LinkedIn</a></li>\r\n                </ul>\r\n\r\n                <p class=\"mt-auto mb24\">\r\nsite design / logo &#169; 2019 Stack Exchange Inc; user contributions licensed under <a href=\"https://creativecommons.org/licenses/by-sa/3.0/\" rel=\"license\">cc by-sa 3.0</a>\r\n                            with <a href=\"https://stackoverflow.blog/2009/06/25/attribution-required/\" rel=\"license\">attribution required</a>.\r\n                    <span id=\"svnrev\">rev&nbsp;2019.7.16.34333</span>\r\n                </p>\r\n            </div>\r\n        </div>\r\n\r\n            </footer>\r\n            <script>StackExchange.ready(function () { StackExchange.responsiveness.addSwitcher(); })</script>\r\n    <noscript>\r\n        <div id=\"noscript-warning\">User Experience Stack "], "copyright__copyright__copyright": ["ch bar is up to you, but you should keep those factors in mind.\n\nI also don't think that always showing it is too big of a deal.\n\n0\n\nHaving a search box with very few items seems silly.\n\nI feel it's best to show the search box only after the user has scrolled past a predefined number of items.\n\nYour Answer\n\nBy clicking \u201cPost Your Answer\u201d, you agree to our terms of service, privacy policy and cookie policy\n\nNot the answer you're looking for? Browse other questions tagged or ask your own question."]}