AAA Contact Us Page Redesign
Data-Driven Design
The AAA Contact Us page needed a redesign to improve mobile usability, streamline navigation, and enhance self-service options. With over 60% of users accessing the page on mobile, the goal was to reduce friction, make information easier to find, and provide clear pathways to support without relying on call centers.
ROLE
UX/UI Designer & Researcher
Identifying the Problem
Mobile Usability Issues
The page required excessive scrolling, making it difficult for users to locate relevant information.
Limited Chat Functionality
The current MVP chat feature in AAA MyAccount only answered membership-related questions, leaving insurance, travel, and banking users without an easy way to find solutions.
Lack of Self-Service Options
Users were forced to call the contact center for inquiries that could have been resolved with proper help links and common solutions directly on the page.
RESEARCH AND SOLUTION EXPLORATION
The Initial Concept
To begin, I sketched out initial concepts focused on reorganizing the content for better usability. My main goal was to make the page more intuitive by structuring information around AAA’s key service areas—membership, insurance, travel, and banking—so users could easily find the relevant contact information without excessive searching.
To optimize for mobile users, I introduced an accordion layout, allowing large amounts of information to remain hidden until needed, reducing scrolling while keeping the content accessible. This was a critical improvement because, in the existing mobile version, the contact information was hidden behind a button, requiring users to take an extra step just to view basic details. Many users overlooked this entirely, leading to frustration and unnecessary calls to support. The redesigned layout ensured that key contact details were immediately visible when relevant, improving the overall user experience.
Optimizing CTAs for Mobile and Desktop Users
Beyond restructuring the page layout, I also analyzed click data to understand how users were currently interacting with the page. I found that the top three CTAs varied significantly between mobile and desktop users. To address this, I ensured that the most-clicked CTAs for mobile users were placed above the fold, while desktop users had their top CTAs clearly visible without excessive scrolling.
CHALLENGES FACED
Balancing Innovation with System Limitations
While designing the new layout, I encountered some limitations due to AAA’s design system. My initial concept included additional buttons in the hero section to help mobile users navigate quickly, but after reviewing the design with developers, we realized this wasn’t feasible within the constraints of the existing component library. I revised the design to work within the system while maintaining a strong user experience.
USER TESTING AND VALIDATION
Measuring Task Success and Information Architecture
To validate the redesign, I conducted tree testing using the Userlytics platform. The test results showed that overall tasks had 80% or more of users successfully completing them, confirming that the new information architecture was effective. However, based on user feedback and data, the tree test revealed that users didn’t understand the difference between “Auto Loans” and “Auto Buying,” so I combined them into one clear section.
98% of Users Choose the Redesign for Faster, Easier Navigation
Next, I set up an unmoderated usability test, users completed the same tasks on both the existing page and a prototype of the redesign. After interacting with both versions, they were asked to choose their preferred design. The results were overwhelmingly positive—98% of users favored the redesigned page, and task completion times significantly decreased, indicating improved findability. Users specifically highlighted the accordion layout as a major improvement, making information easier to access compared to the previous scrolling-heavy design.
User Feedback
“I like the accordions and how easy everything was to find... It was so much easier than the previous design.”
“I prefer the second one. I like the accordions, I like the listing style of everything. I just thought it was easier and more fluid.”
“Definitely more interactive... It was short, sweet, and to the point, and I did not have to scroll very far to find information.”
BEFORE
REDESIGN
MEASURING SUCCESS
Impact and Results
The redesigned Contact Us page delivered measurable improvements for both users and AAA’s business goals:
Enhanced Navigation: Clear categorization of services made it easier for users to find the right support option.
Faster Task Completion: Reduced friction in locating information led to increased efficiency and decreased frustration.
Lower Call Center Volume: More users successfully found answers through self-service options, reducing unnecessary support calls.
Temporary Solution for Help Chat Limitations: Since the help chat couldn't provide assistance for all business categories, the redesign ensured users could still access the right contact information easily.
By surfacing key help links and structuring information intuitively, the redesign created a more user-friendly, efficient, and self-service-driven experience, allowing customer service teams to focus on complex inquiries rather than routine information requests.
LESSONS LEARNED
This project reinforced several important UX lessons:
Early collaboration with developers prevents major redesigns later in the process.
Data-driven design decisions lead to tangible improvements—click analytics helped prioritize high-impact CTAs.
Testing different iterations is crucial. Tree tests and usability testing identified key refinements before launch.