Yahoo Search Results Pages (SRPs) are seen by more than 100 million users every month. Mobile and tablet are responsible for more than 10% of the total traffic. I started the design process by understanding competitive analysis, identifying tablet use cases, defining personas and sketching out concepts. It was highly collaborative and iterative process between stakeholders, engineers and designer in order to establish initial ground work for diverse screen sizes. The basic end to end experience was articulated by low fidelity wireframes and then the layout down to the pixel-level detail.
Responsibilities:
Design Iterations: The primary goal was to provide users with the most useful, relevant and meaningful results on the search result page yet immersive and rich content experience. By conducting qualitative & quantitative test with researcher, there have been countless design iterations. Below are some of the examples of initial designs for the major topic covers (Weather, Album, Finance, Movie, Local, Sports, News etc).
Search Demand Curve: I've found out there are strong patterns users type in the search box as a search intent.
Based on data we are getting from users, I've come up with different templates for each topic query to serve user needs and optimize its experience. Also when it comes down to long tail (most descriptive and specific query) I created its own layout so the experience becomes holistic and consistent from user's perspective.
Templates for Each Type: For quantitative data, we conducted multiple bucket tests on 7-8% of our live tablet users. We, as a team, analyzed the data and shaped content for templates of different topic types. I, as a desiger, prioritized the hierarchy of contents by metrics, while optimizing the layout for call to action and relevant ADs display.
Navigation/User Flow: This illustrates the high level search experience - how users navigate through the content while they are on the Yahoo properties from the Search Home (www.search.yahoo.com), Search Results to Detail Content (Image, Video, News etc).
Type 0: One of the example of Search Results Page which does not contain any direct displays of image, video, news and graphics components (Most degraded experience).
Left Column: Left column shows filters, facets, related searches and search history contextually.
Type 1: Often times, search results page contains direct displays of video, image, news and/or graphical components.
Detail Content: Users can deep dive into the actual photos, images, videos or news articles from either direct displays or deelp links on individual verticals as they wish.