Redesigning the search experience — research, competitive analysis, A/B testing, prototyping.
- UX Research
- UI
- Prototyping
- Testing
- User Interviews
Careem is a vehicle for hire company which is a subsidiary of American company Uber. It is based in Dubai, with operations running in over 100 cities, covering 15 countries. In 2018, Careem launched a food delivery service app called Careem Now, delivering food and pharmaceuticals.
- Industry
- Ride-hailing · Food delivery · Mobility · B2C
- Role
- Sr. UI/UX Designer
Note: In my tenure of working with Careem I worked on several features/components which includes checkout flow, revamping restaurant cards, brand carousel, search flow, reorder component, service fee etc. This specific case study is about the revamp of Search Flow of Careem food delivery app.
Problem Statement
Search gathers around 40% of the traffic on the APP and is a critical path towards conversion. However the search experience is behind in terms of facilitating user interaction and assisting the user towards finding what they are looking for. Users today have only two ways of finding content in a directed way: Search or Filters.
Hypothesis
What do people expect when they click on the search bar? Elements that keep context or accelerate the search process:
- Suggestions and recent searches
- Categories that relate to navigating the selection exhaustively without going through recommendations
- Rich content suggestions that inspire me
Objective
The main objective is to provide users with an alternative to text based search that allows them to navigate our selection with some assistance. The secondary objective is to provide users with quick access mechanics to merchants or categories they have interacted with in the past.
Role and Responsibilities
Sr. UI/UX Designer
I was responsible for revamping the Search flow. I conducted usability sessions and user interviews in order to understand what the user expects from current flow of Search. After gathering relative information and data I designed the user flow and then high fidelity designs.
Design Process
Understand
- Competitive Analysis
- User research
Define
- Concept sketches
- User Flow
Test
- Usability Testing and User Interview (Hybrid Method)
Design
- High Fidelity Designs
- Prototypes
01
Understand
New Users Known Behaviour
- New user conversion in search is x2 the overall conversion rate
- Around 50k daily visits to the landing page
- 54% of all clicks on the search bar end in a past search
Selection Tiles and Search attribution
- Dubai: selection tiles are second to search, with 20% attribution
- KSA: the same behaviour as Dubai, with tiles capturing more orders
- Growth in tile attribution tracks growth in conversion across markets
How many user use search?
- Dubai: 16% of sessions visit search
- Amman: 25% of sessions visit search — up to 30% during Ramadan
Conversion of users interacting with search
- Dubai: 24% conversion, steady over three months
- Amman: 12% conversion, up 3pp after Ramadan
Competitive Analysis
Comparison of hierarchical layout and user experience within competitors. When doing the analysis it was just to understand the market because if one experience works for another brand users, doesn’t mean it will work for our users too.
🔥 Key insights
Zomato
- Along with recently searched we can see “trending near you”
- Search matches restaurants and dishes at the same time. differentiates by mentioning “dish” or “restaurant” in the details
- User can toggle between dine in and delivery directly from search
- Null results don’t recommend something else
Careem
- Search landing page is very bland and doesn’t offer much options
- With type of cuisine, so many headings might confuse the user. Should opt for a better way to display those options
- Careem only shows top 3 restaurants and user has to do an additional click for viewing more restaurants
UberEATS
- You can view all and top categories from search landing page
- Empty search shows recent and top categories
- You can switch between restaurants, grocery etc from the landing page
- If restaurant is closed that also appears in the search.
Talabat
- You can see recent, popular and featured restaurants
- User can switch between Restaurants and dishes
- User can also view them category wise
- In empty search - They recommend other restaurants.
Hunger Station
- landing page shows Most popular
- User can switch between food and grocery
- Empty search doesn’t recommend anything
Bolt Food
- Recommendation - Popular categories
- Fuzzy search shows textual lists then when user clicks ‘okay’ restaurant list appears
What the analysis suggested the landing page could offer
- Recently Searched (for existing users)
- Popular Search
- Top Categories
- Trending near you
- Popular Dishes
- Offers
- Recently ordered (for existing users)
02
Define
With the gaps from the analysis written down, the next step was to draw what the landing page could be and then set out the whole search journey — what a user sees at each step and where each step can lead.
Why search
Search is where the traffic goes and where the conversion is won — and almost all of it runs through something a user has already done, or a category they already trust.
- 40%
- of app traffic goes through search
- 54%
- of search-bar clicks end in a past search
- 40%
- of orders are placed through a category
The search flow
Entry point: When user clicks on Search input field on discover page. Flow Summary: User clicks on Search input field, enters an input text which eventually leads to restaurant page.
03
Test
Conducted a mixed method research method of usability testing of current flow and User interview to understand users expectation
Goal
To observe users using the search experience and understand where it lags behind, and how it can be made better.
Approach
Due to time and resource constraints I ran a mixed method study. Two prototypes were made from the data the analysis team supplied and the product team’s hypothesis, and a script was written for the interviews.
The two prototypes
Prototype 1
Recent searches, top categories and all categories on one landing page — the version built from the data the analysis team supplied.
Prototype 2
The same page built around the product team’s hypothesis, leading with suggestions rather than with the user’s own history.
What people said
Names are withheld. The notes are transcribed as they were typed during the session.
Question / focus area
- What do you expect to happen after tapping on ‘Search bar’
- Do you prefer or expect anything else on the page to make your search easier?
- Does this resonate with what you were expecting, or is there anything else you would’ve wanted to see? Anything that is confusing?
Prototype 1
User 1
- Popular searches it helps when i am not going with anything specific in mind
- Best rated ones in the past week
- Repetitive top categories +
- Prefer all categories
User 2
- Popular searches: helps when i am not going with anything specifiic in mind
- popular searches does help
- really like the top categories in the SLP
- Filter on SLP and on category pages
- All categories are alot of options, i want to be able to filter through
User 3
- i like popular searches
- i like top categories also
- all categories - similar to discover i am not sure i would click in it
User 4
- I like popular searches, i am interested in what people are buying also
- top categories: i would like to see aht peole are using so i hope it is based on it
- all categories : i do see myself clicking on catrgories
- careems pick for you: restaurants
User 5
- For a new usr its veery helpfulo to se popular search
- i really like top categories
- all categories as a new iser this would help me understand what careem has to offer
- need ratings filter
Prototype 2
User 1
- Popular searches it helps when i am not going wioth anything specifiic in mind
- Best rated ones in the past week
- Repetitive top categories +
- Prefer all categories
User 2
- i cant differntiate between dishes and restaurants for recent searches
- i would want to explore
- popular restaurants, if it’s not personliased then they dont make sense to me
What we found, and what we built from it
A few people agreed completely with the sections they were shown; the rest split down the middle. So rather than picking a winner, a third version was built out of both — the parts everyone wanted, the parts the interviews argued for, and nothing that had failed to earn its place. That version is the one at the end of this page.
- Kept:
Recent Searches — Kept, as chips rather than rows — the same content in a fraction of the space.
- Split response:
Popular Searches — A 50-50 response. Kept, but earning less of the page than it had.
- Kept:
Top Categories — 90% of people liked the approach.
- Kept:
All Categories — A strong response — and merged with Top Categories into one list, since two sections of the same thing cost a screen of scrolling for no gain. The categories that would have been the top ones carry a ‘Popular’ tag and sit first.
- Dropped:
Popular restaurants nearby — 80% were not interested. Dropped.
04
Design
The high fidelity designs that came out of the sessions — first against what they replaced, then as the flow a user moves through.
Design comparison
Search landing page
Old design
New design
Null results
Old design
New design
New search flow
- 01
Discover
User is on the discover page and clicks on ‘Search’ input field
- 02
Search Landing Page
User lands on search landing page. Here are few quick access options for user to choose from before writing any textual input.
- 03
Categories
If user clicks on any category, user is redirected to that specific categories screen where they can apply filters
- 04
Autocomplete
When user enters textual input, system autocompletes and auto suggests.
- 05
Restaurants
Once user ‘enter’ after inputting a text. They can see relevant restaurants in Restaurants tab.
- 06
Dishes
Once user press ‘enter’ after inputting a text. They can see relevant dishes in Dishes tab.
- 07
Null Results
If user’s input doesn’t match any restaurant, they are notified and suggested some similar results
- 08
Out of range
If user’s input doesn’t match a restaurant that is out of range, they are notified and suggested some similar results
Key Takeaways
This was an amazing experience as I got to work with Senior designers at Careem who have a very Product oriented thinking. I also got the chance to work closely with UX researchers. Improved my UX methods and their applications. Early collaboration with the users helped us gain insights on the problem users were facing and design an experience for them.