AT&T Search

Senior User Experience Designer for att.com
Mar 2019 - Feb 2021

Project goals

AT&T's website has 130 million unique visitors monthly and the call center receives 4 million calls a month. Each call costs $1.7 on average. So our goal is to increase revenue through conversion rate and save costs by improving call shed.

Att.com is a comprehensive website supporting their customer’s needs, mainly-
• Shopping for devices and services
• Account management for billing and subscription
• Troubleshooting and help for devices and services

Project overview

At the beginning of the project, the Search and the Browse Product teams joined hands to explore the redesign of the Global navigation menu on RWD. Should we enable wayfinding through Browse or through Search?

We conducted an A/B test to understand effects of exposing the Nav and hiding search vs exposing the search and hiding nav on engagement and conversion.
Conclusion: Engagement on search bar can be manipulated with the size and position of the search bar on Global Navigation Menu (GNAV)

Getting ducks in a row

UX Strategy

I conducted a competitive analysis to understand the relationship between user intent and wayfinding patterns. Simply put, broader user goals are met through browse, while specific situational goals are better met through Search.
Below is a word cloud of top 250 SEO queries for att.com. A big share of users come to AT&T web to complete specific transactions and seek support. This is easier to navigate through Search. For the smaller share of users who want to browse devices and plans, there would be an exposed navigation in parallel with a powerful Search.
‍
However, we needed to improve search efficiency and usability before we could offload any more traffic to Search.

To the drawing board

UX Planning and Roadmap

Our product manager and I studied the customer journey of a Searcher on att.com, and scoped it down into
‍Search bar • Search flyout • Search Results • In-page search widgets

Ours is a continuous collaboration with the Engineering team to follow a human-centered approach to the Search AI.

Gutting and cleaning

Goals: As a designer, it is my goal to augment human capability for the AI to yield better results. One of the ways we are doing this is to guide users to articulate better queries.
AI opportunities: Show personalized suggestions to support all user intent.

Research insights:
1. High character count queries improve relevancy of autosuggest
2. Users come to website for account management and support just as much as buying products or services
3. Poorly designed autocomplete interfaces make it difficult to understand the available options within autocomplete, and can be overwhelming or lead to unexpected interactions.

Design opportunities:
‍1. I updated placeholder text copy to one that elicits long-tail queries through an A/B test
2. I made search flyout scannable by dividing autosuggest results into panels for history, direct links (to destination URL), organic search suggestions. I avoid clutter by limiting each panel to 5 suggestions. Next steps include visually organizing suggestions by adding catalog images for products and adding previews for some suggestions.

Redesign and Testing
‍
1. Search bar and Search flyout

‍

Goals: To improve CTR by providing readable, reusable, dynamic and personalized results
AI opportunities: Show personalized results
‍
Research insights:
‍1. Users conduct 12 main types of search (see link below for more details)
2. Users come to website for account management and support just as much as buying products or services
3. Users don’t read past the first few results on the first page of results
‍
Design opportunities:
‍1. I designed a dynamic and modular two column layout for optimizing visibility and scannability of the top results. The results were categorized into 3 main tabs - Shop/ Support/ Entertainment.
2. The taxonomy of search was very useful in designing to include most scenarios. I mapped the 12 types to recommended layouts for displaying search results dynamically.We are currently following a top down approach, and slowly implementing and iterating for different sections on the results page.

2. Search results page overview‍

3. Next steps include designing for users based on authentication type. This is an opportunity to personalize results for unauth, semi-auth (cookies), and auth (signed in) customers. We are identifying top search keywords that can be personalized for to maximize business value. An example to show “order status” is shown below.

In addition to the global search bar, we have in-page search widgets on pages indexing large amount of content to provide contextual search results. Some pages that use an in-page search widget include Support, Service landers, Contact us, and Newsroom.
‍
Goals: To design a reusable and configurable in-page search bar and flyout and to flatten navigation

We have implemented a search widget that support basic autocomplete for titles with matching keywords only. Due to this limitation, it was necessary to provide alternatives for users to not hit a dead end. So I made sure to add options to conduct search inside the page domain as well as outside the page domain.

Next steps include adding personalization to suggest relevant support articles, and supporting an entry point to the chat VA for better assistance.

3. In-page Search widgets overview