Engaging and Habit Forming Multi-media Search
Video Results Page (VRP) is one of the fundamental experiences for video searching and viewing in Bing.
By designing the structured VRP, we will be able to provide a more immersive, engaging, and rich browsing experience for Bing users, and encourage search users to get into exploration mode by fusing structured browsing in search results.
SUMMARY
Video Results Page (VRP) is one of the fundamental experiences for video searching and viewing in Bing. Although user comes to VRP mainly for search, user intention isn’t always specific and algo results cannot provide the richness that user needs.
Here are 2 screenshots as examples for the previous result page, when users search broad categories like ‘youtube’ and ‘movies’. The result pages look very similar for different queries and mainly provide algo results.
Query: {youtube}
Query: {movies}
We want to find a solution that can encourage search users to get into exploration mode by fusing structured browsing in search results. As a result, we can increase user engagement to convert MAU to DAU and open the funnel to acquire new users.
MY ROLE
Design strategy / End to end experience design / Usability study / Data analysis / Iteration
A quick look at the final design solution
1.0 USER RESEARCH FINDINGS
Do users have a requirement of browsing when they search?
In the past, we did experiments and learned that structuring the video results page will increase user engagement, at the meanwhile we also did a user study to understand users’ video browse habits, assess which information is useful to them when browsing videos and identify potential watch categories in video browse scenario.
Feedback from user about browsing videos:
Youtube is becoming more absurd with even how they handle recommended videos and curating what they want me to see rather than what I want to see. I want more freedom to curate, filter, and rely on the AI that handles how videos are organized and recommended to me.
Key findings from user research:
Users spend a significant amount of their time online video browsing.
In a search engine, video browse behavior is triggered based on a search intent providing relevant related/recommended video options.
Video recommendations play a significant role in people browsing within a search engine.
Irrespective of the video segment, the video title, and video image thumbnail were used by users to decide on which video to watch.
Youtube is a major platform used for video browsing and search by users.
2.0 WHAT’S THE USER PROBLEM?
Users do have a requirement for video browsing when they search on a search engine. Although the current browsing experience from other websites doesn’t always satisfy users, the main reason is the bad quality of the recommended video content with a boring layout. Users will lose interest after they find the video recommendation doesn’t fit their expectations.
What kind of experience do we want to build?
Bing crawls videos from all over the web. Competitors like youtube can’t go in this direction because of business impact or product positioning. We want to take this advantage to provide users not only a search experience but also build video browsing and discovery habits for users with high-quality structured video recommendations, so users can always find something interesting to watch even if he/she doesn’t have a strong and specific search intention. That will attract users to come back again and again to find more interesting videos to watch.
Establish a place for users to search + browse + discover the video content
Define the workflow
After we define the user problem and product goal, I started to design a complete end-to-end workflow. After the user comes to Bing to search for videos, we want to keep him stay to explore and find a video to watch with well-organized and structured recommendations. That will also provide users an easy way to browse more.
3.0 DESIGNING DOWN FROM A VISION
After doing some research about competitors’ video browse experiences, I designed 3 different interaction models for the structured VRP. Our goal is to provide a convenient and comfortable way for users to explore different types of videos and find interesting spots.
In our assumptions, option 3 is more in line with user browsing habits and I decided to continue my design explorations based on that model. But to know which way works the best for users, we want to find the answers in the usability study afterward.
Model 1
Inline filter
Model 2
Side menu navigation
Model 3
Promote a few sub-categories in related search
Trending videos
The top area on the structured VRP is focusing mostly on popularity with reasonable freshness. The design goal is to provide users immersive experience so the users will be attracted directly once he lands on this page.
Newly arrived
The top area on the structured VRP is focusing mostly on popularity with reasonable freshness. The design goal is to provide users immersive experience so the users will be attracted directly once he lands on this page.
Categories module
The categories module is the main structure of results and provides numerous various angles to structure the videos. In this design user can just easily scroll to check different sub-categories, and find the contents he’s interested in, or go deeper into each one by using a carousel and ‘see more’.
Related search
I designed a related search module that includes more category names on the page so users can easily navigate, go deeper and return back, combine different categories to filter, etc.
Algo results
The last section will show all the algo results, for users who didn’t find anything interesting in the structured categories, so they can still keep looking into the normal algo results.
Extend to more scenarios
After I have a quick exploration of the whole page’s look and feel, I also try the same design pattern on different queries to see will the experience be consistent in different scenarios.
Topic query: {Home decoration}
Entity query: {Scarlett Johansson}
Genre query: {Movies}
Create frameworks and templates
For different queries, the contents we surface on the page will be different too. That’s why I designed different frameworks and templates such as regular video cards, people cards, movie cards, music cards, social media video cards, categories, etc. as containers for all types of content to match different scenarios.
Using different design frameworks also will break the page in a good way, so users won’t feel bored and tired while they browse for a long time.
Hover experience
In the previous research on the hover experience, users prefer to see more useful information while they hover. But it shouldn't be overwhelming at the same time. So I designed different hover experiences for the hero tile, trending video tiles, and regular video tiles. In this way, we can meet users' expectations on hovering but also keep the hover experience consistent.
Hover on hero
Hover on trending video
Hover on regular video
Visual explorations
For the first look of the whole page - trending module, I designed different visual treatments considering different factors such as visual attraction, surfacing more content, serving different scenarios, and matching the trending user habits, etc.
​
4 proposals were picked for the upcoming usability tests to collect more input and feedback from real users.
Treatment 1
Using hero video and related high-quality pictures as background
Treatment 3
Removing background pictures and showing more results for special scenarios like adult query
Treatment 2
Iterate based on treatment 1, reduce the trending’s height to show more results below
Treatment 4
Using motion thumbnail as background and auto-preview, more in line with latest user habits
4.0 DESIGN VALIDATION AND ITERATION
After I had the first round of design exploration, I and our researcher started to make the plan of usability tests to collect feedback from real users.
​
There were 8 participants in total, 4 are bing users another 4 are google users. We showed the prototypes and mocks in Figma when we do the online interview with participants, let users interact with the page, and record their reactions.
3 key outputs we want to collect from the study:
What's the most common/convenient behavior when users explore videos?
​
Which visual treatment of the trending module does the user like the most?
​
Will users prefer a bigger play icon on video tiles or a smaller one?
What else we learned from the study:
Users like the Structured VRP design solution
They liked the decorative top results area over plain designs.
​
Users liked the breakdown by category and that they could either stay on the page (use the carousel) or see a page devoted to that category by clicking “see more”.​
Users have confidence in finding something interesting to watch on Structured VRP
They liked the decorative top results area over plain designs.
​
Users liked the breakdown by category and that they could either stay on the page (use the carousel) or see a page devoted to that category by clicking “see more”.​
Users want the opportunity to discover more categories near the top of the page​
They liked the decorative top results area over plain designs.
​
Users liked the breakdown by category and that they could either stay on the page (use the carousel) or see a page devoted to that category by clicking “see more”.​
The feedback we got from the interviews:
Users want the opportunity to discover more categories near the top of the page to save time.
More users like treatment 4 because it's more attractive and clean, and they also prefer there's no sound for autoplay.
​
Users prefer smaller play icons so they can see more content on the thumbnail picture.
I think I would prefer to just see more sort of choices, instead of one just big feature thing because that's something on YouTube that also exists.
Kyle
I did like the fact that even there were some popular categories listed, but also more categories and options where I was able to sort of see a little bit more especially that helps when I'm on a more general search like this.
Jay
I do think that this generated a lot of things that, you know, I'd be interested in putting on and just watching, I'd be more interested in this movie section.
Joshua
Yeah, that's pretty cool. Definitely be able to get, even all the subcategories here, that is quite cool. I think I'd be able to find something intetesting. Pretty neat.
Aiden
In users own words
Iteration
Based on the feedback we collected from the user study, I iterated the design in the following aspects:
Interaction model update
Users can easily go deeper or go back by clicking on the new design of related search. It features an easy-to-find, easy-to-use, and easy-to-understand UI for narrowing the scope of the search.
Proposal 4 for the trending model wins!
At the same time, the motion thumbnail will auto-play in the background, muted by default, because 'everyone hates auto-play with audio'.
Smaller play icon for all video tiles to show more content of the thumbnail.
7/8 users like the small button on all videos, no matter the size / prominence of the video on the VRP. Users just want to see more content, not a giant cool play icon.
Responsive design
I also set up the responsive rules for different screen sizes to make sure the experience across different devices is consistent.
For smaller screens like tablets and mobile, I designed a different framework to remove extra spacing and layers to make sure the content is displayed in a nice and clear way on the small screen.
Desktop
> 1366px
Tablet
1366> size > 1024
Tablet
1024> size > 600
Mobile
< 600
5.0 IMPACT
Metrics:
In V1 we’ve flighted 3 different scenarios - broad intention scenario, esports scenario, and Tiktok scenario.
​
For the broad intention scenario which coverage is 1.5%, the click-through rate is 14.5%. The video seen rate has a 2% increase. Session length has increased 2s but was mainly introduced by the adult scenario, in which session length increased 24s.
​
Esports videos have a similar click-through rate but a 7% increase on the video seen scorecard with 0.2% coverage.
​
We found that the click-through rate of Tiktok videos has reached 26%, which is double compared to the other two. And the session trigger rate has increased 10%, video seen rate increased 4%.
​
Learning from the flights:
-
Having an immersive experience will attract users to click more highlighted videos, especially it performs well in the adult segment when it’s hard for users to describe the exact intention.
-
Combining structured browsing experience with unique content works well in driving whole page engagement, we should explore more opportunities to bring in partner data.