Redesign Search Experience

A friendly search experience is made up of many details, like searching assistance and displaying related search results in logical order. It takes more than a good looking search bar.
Challenges
There is a gap in the expectations of different roles, and how to align it is the challenge
Role
• Design (UX & UI)
• QA (Test Plan)
Objective
Improve the usability of Search experience across all devices
Overview
Outcomes
• A new UI pattern of search elements with great UX searching logic behind
Brief
As an OTT platform, searching is a frequently used feature for finding movies, and we often receive complaints from Customer Service about poor search experience. To deal with it, we define that the outdated design and experience make it unfriendly.
Design Process
1
Research & Scope Define
Go through all touchpoints and narrow the scope down with clear user stories
2
Stakeholder Alignment
Conduct a goal alignment meeting and describe the need of new API with Dev
3
Design Interfaces
Explore all possibilities in user interface - before & after search
4
Test Plan & Deliver
Deliver the test plan as well to make sure all cases are taken care of
Research & Scope Define
Go through all touchpoints and narrow the scope down with clear user stories
I conduct a meeting with PM to walk through all touchpoints in our product(Web+App) and give analysis from design perspective. To let our team empathize with users, I use user stories.
• User Stories
As an intent-based users,
。I can search for other users, so that I can follow great creators
。I want to browse the result page, so that I can find the result easily

As an intent-discovery users,
。I want to search with assistance, so that I can find the most suitable movie
。I need some recommendations, so that I can get a glimpse of what’s popular now
Stakeholder Alignment
Conduct a goal alignment meeting with Dev and describe the need of new API
To provide experience like user stories mentioned above, missing things like Tab of users, Auto suggest, and Recent and Popular search items need new API from backend. Therefore, I conducted a meeting to not only align the goal but also explain why we’re doing this.
Design Interfaces
Explore all possibilities in user interface - before & after search
• Before Search
Problems here are:
    1. The outdated style of search bar causes poor usability
    2. User can hardly find relation between suggestion items
Show ''Recent and Popular search terms'' and support user with ''Autocomplete''
The new design has clear visual clues (like clean button) and good interaction.
• After Search
Problems here are:
    1. poor visual and information hierarchy
    2. poor usability when having abundant results
• Grid (Tab) or list view ( No tab, filter instead) ?
Though the current design had a grid view, I had tried another design pattern of a list view. However, we decided to keep the grid view because of one reason.

Compared with other platforms like learning platform, users on OTT are usually searching for some eye-catching things. So the design should put more emphasis on the thumbnail rather than others.
• Scroll or pagenation ?
Do we keep the existing infinite scroll or have paginations?

To make the experience more immersive, I decided to keep the infinite scroll. However, users might get lost in abundant results, so I make the tab fix on top to help users.
Test Plan & Deliver
Deliver the test plan as well to make sure all cases are taken care of
Learning
At first, I thought it was a simple project, as the UI involved is simple. But I am wrong! Coupled with a pleasant look, a good search experience allows users to search for the most relevant answers from a large amount of information.