Building a great mobile search experience
Best practices in design and functionality.
Sorry, there is no results for this query
Editor’s note: this post is first in a three-part series on creating amazing mobile search experiences. Check back in the coming weeks for part 2 where we’ll deconstruct mobile search success elements and part 3, which will explore mobile search best practices.
Whatever your app development stage — a brand new idea, iterating on a v2 or finally tackling that long-neglected feature — mobile search can be the decisive element of your app’s success. When executed correctly, search gives your users incredible access to all of your content. Done wrong, it will quickly cripple your app, making it a digital ball of stress and frustration. Before diving into how you can design successful mobile search, let’s analyze some of the pitfalls of mobile user experience (UX) that can make implementing search a real nightmare.
Most difficulties developing for the mobile platform come from the extreme limitation of space to display information on the user’s screen. A common rookie developer mistake is wanting to display all the data at hand, similar to our desktop experiences. With mobile, more so than anywhere else, rule #1 is less is more.
When the time comes to transfer information from your brain to a digital device the most common input method today is the keyboard. You can usually count on having your ten chubby fingers to do this… unless you are using a mobile device. Then you have at most two thumbs available. On mobile, information output is dramatically reduced.
We use our mobile phones in less than optimal conditions — on a shaky train, on our bike at a red light, while walking (when we should probably pay attention to the intersection ahead). Those environments are not conducive to good focus and can lead to harder information input/processing on the user’s end.
We take our phones everywhere and we want them to work as well on the top of a mountain as from our bed. Coverage won’t be perfect, even in the busiest cities. Poor connectivity is extremely frustrating. As mobile developers, we must anticipate for the user being offline and plan accordingly.
Less is more… That’s great in theory but not that simple for our search use case. You’ll need more than a simple text input to create a powerful search experience. At a bare minimum, you’ll also need to display results. How many results you display and how much information you provide about each result is the difference between information overload and a successful search experience. Limiting the volume of displayed results on page means an even higher constraint on relevance — you can’t allow a single poor hit if you only show 5 total hits. The amount of information per hit should be kept to a minimum to fulfill two simple goals: is this hit relevant to the query? And is this hit interesting in itself?
Then comes the trickiest part: filtering and refinement inputs. On a desktop, the sidebar provides a liberal amount of space for including plenty of filters and facets; however, when screen real-estate is precious and UI is touch-based, you have to think about the UI sliders/counters, and prioritize one attribute over another. Our mobile devices give users the impression of having access to everything at their fingertips; but you need to provide the tools to find a needle in your mobile app’s haystack of information.
Apps today are optimized to provide the most frictionless experience to users. We strive to minimize the amount of taps, scroll, and inputs. When you are simply consuming content in a semi-passive way, tapping a title, scrolling, reading an article or swiping through a few pictures, then a touch screen is perfect. Search isn’t that simple unfortunately. While the end goal is identical: providing relevant content with the least amount of user effort, for search, a number of steps are needed at every query. The user has to first think of an appropriate word that represents what he/she’s looking for, type it letter by letter, evaluate the result and finally reformulate his/her query if results aren’t satisfying enough. In a few words, this process is far from a one tap action. We must serve relevant content with the least reformulations possible from the user.
We, users, have been spoiled by a few products without noticing it. For years, Google has been serving super relevant as you type query suggestions in a matter of milliseconds. We are so used to this functionality that we don’t even notice anymore, it’s part of a natural flow, day-to-day experience and we expect great suggestions at the first keystrokes.
On a different use case, Amazon completely revolutionized the way we shop. To give us access to their huge and constantly growing catalog, they implemented a blazing fast autosuggest dropdown menu in addition to powerful dynamic refinements. To provide what will be perceived as a great search experience, we must meet or exceed users expectations previously set by big players.
Virtual keyboards are awful. They feel very uncomfortable to use and are prone to generate typing mistakes. From a mobile search UX standpoint, it means that without a typo-tolerant search engine that returns results at the first keystroke, you have an extremely high probability of frustrating users that will inevitably hit the wrong letter and get zero results. To ease user inputs and search process, we must be forgiving of typing mistakes and implement a typo-tolerant search solution.
Developing a great user experience for your mobile app is a challenge in itself. Add search to the equation and things get even trickier. Yet, while implementing search on mobile is a demanding task, it is not mission impossible. There are definitely some great examples to explore today and we will get some inspiration from them in the following posts.
In Part 2, we will deconstruct all the moving parts of a good search on mobile; this will give us a solid ground to finish by exploring the best practices in Part 3.