Enhancing Customer Engagement Through a Redesigned Weekly Ad: Improved Information Architecture and UX Across Platforms

Man at a desk in front of an iMac viewing CVS weekly ad online.

Date Completed

April, 2023

Overview

The Weekly Ad feature is one of CVS’s most popular tools, offering customers personalized deals tailored to their local stores. However, its initial implementation faced significant challenges, including usability issues, inconsistent design across platforms, and limited accessibility. These problems negatively impacted customer engagement and satisfaction, as navigating the Weekly Ad was neither intuitive nor efficient.

To address these challenges, I led the redesign of the Weekly Ad experience at the request of CVS product leadership. My role involved improving the information architecture, refining filter functionality, and redesigning key UI components, such as deal tiles and navigation patterns. The focus was on creating a cohesive and accessible experience across web and mobile platforms.

By leveraging insights from user research and applying design best practices, I developed a streamlined solution that improved navigation, engagement, and accessibility. The redesign not only simplified the user journey but also established a consistent and intuitive interface that aligns with CVS’s commitment to enhancing digital customer experiences.

Accomplishments and Key Improvements

  1. Streamlined Navigation: Introduced a clear tab system for Weekly Ad versions, improving discoverability and functionality.
  2. Enhanced Filter Functionality: Simplified filtering options to provide a seamless experience across web and mobile.
  3. Optimized Deal Tiles: Designed consistent, tappable tiles that adhere to accessibility best practices and provide clear interaction cues.
  4. Improved Visual Hierarchy: Utilized design patterns that reduce clutter and enhance focus on content.
  5. Device Consistency: Unified the layout and interactions across desktop and mobile platforms, ensuring a cohesive experience.
Redesigned navigation and controls for CVS weekly ad desktop.

Understanding the Assigned Scope

Context and Goals

CVS’s Weekly Ad is one of the most-viewed features across its digital platforms, playing a critical role in customer engagement and driving sales conversions. With cvs.com attracting approximately 102.93 million visits in October 2024 and an average session duration of 4 minutes and 27 seconds, the Weekly Ad serves as a key touchpoint for millions of users. Traditionally distributed through Sunday newspapers, CVS transitioned away from print circulars in 2021, making the digital Weekly Ad available exclusively on cvs.com, the CVS app, and in-store platforms.

This strategic shift highlights the necessity of optimizing the digital Weekly Ad experience to maintain user engagement and achieve key business objectives in an increasingly digital retail environment. While specific online viewership metrics for the Weekly Ad are unavailable, its prominence on CVS’s high-traffic platforms underscores its importance in supporting both customer satisfaction and revenue generation.

Assigned Scope

During a PI planning session, product and director teams identified actionable areas for improvement aligned with standard eCommerce goals such as reducing bounce rates, increasing time on page, and driving conversions. These assessments informed the following Rally tickets assigned to me:

  1. Fix Get Weekly Ad Flow from Store Locator
    Improve user access to the Weekly Ad by simplifying navigation and enhancing entry points.
  2. Filter Functionality on Page View
    Enhance the discoverability and usability of filters, enabling users to refine their searches more effectively.
  3. Weekly Ad Width Changes
    Refine layouts for page, list view, and offer details to improve visual clarity, accessibility, and mobile responsiveness.
Photo of CVS storfront at dusk
Expanding the Scope

Although the tasks were defined within these parameters, I identified opportunities to deliver broader value. By proposing and implementing solutions that went beyond the immediate assignments, I sought to positively influence engagement metrics and improve the overall user experience, all while adhering to the overarching objectives of the product team.

Visual Context

To ground this scope in visual terms, the annotated image below highlights specific areas of the Weekly Ad page targeted for improvement, aligning with the defined tasks:

Close crop of the choice & filter chips on the weekly ad page
  1. List and Page View Tabs: The current layout displays oversized tabs with icons stacked in an unconventional arrangement, diverging from standard UX patterns. A more familiar horizontal layout would improve usability and visual clarity.
  2. Date Sorting for Weekly Ads: The selection of ad dates is controlled by a dropdown menu, which functions more like a combo-box without adequate visual cues. A clear and structured dropdown design would align better with user expectations.
  3. Filters as a Navigation Item: Filters are treated as a view, similar to “Page” and “List,” which is a misaligned pattern. Transitioning to Material Design conventions with filter chips or pills would enhance discoverability and remove the need for filters as a navigation tab.
  4. Collapsed Filters on Load: The filters load in a collapsed state, requiring users to interact with a modal-like structure to expand them. This introduces unnecessary friction, as modals typically disrupt the page flow. Filters should be accessible without interfering with the rest of the interface.
  5. Tile Layout and Spacing: The tiles suffer from poor design, with minimal top margins and excessive empty space between content and the “Shop now” button. Adjusting spacing and margins would create a cleaner, more cohesive visual presentation.
Broader Relevance

Enhancing features like the Weekly Ad is vital for retaining user engagement and driving sales in CVS’s digital ecosystem. As the primary digital replacement for the widely recognized print circular, the Weekly Ad not only caters to a large existing audience but also opens opportunities to attract new users through improved design and usability.

Summary

The work detailed here reflects an intersection of focused task execution and strategic foresight, leveraging design solutions to support CVS’s digital growth while addressing immediate product goals. By aligning efforts with broader business objectives, I ensured that the Weekly Ad experience remained a valuable and effective tool in CVS’s digital portfolio.

Aligning Store Locator Design with User Intent

The Store Locator solution was developed to improve not only how users select a store to shop, but how users navigate and select stores for viewing weekly ads. The original experience presented store locations like search results in a card-based layout, which included multiple links—one of which directed users to the Weekly Ad for that store. This design created unnecessary complexity by overloading users with excessive information and conflating distinct user tasks. The user intent when accessing the Store Locator typically revolves around selecting a store or viewing store-specific details, such as hours or directions. Adding a link to the Weekly Ad within store cards introduced an unrelated shopping intent—browsing deals—which disrupted the flow and increased cognitive friction.

Existing Solution (Page IA and card-based locator UI)
Annitated screenbrab of the store locator being redesigner.
  1. Page-based Information Architecture: The original implementation utilized a dedicated page for store selection. While a standalone page is a common pattern, combining it with features like Weekly Ads or store-specific actions created an unnecessarily complex workflow, requiring users to switch contexts repeatedly.
  2. Card-based Locator UI: Presenting store details, such as hours, directions, and Weekly Ad links, in a product listing page (PLP)-like card format blurred the distinction between store selection and other tasks. This structure introduced unnecessary steps and confusion, as it failed to separate the purpose of selecting a store from exploring other content.
  3. Unintuitive Placement of Weekly Ad Link: Placing a link to the Weekly Ad page within store cards in a PLP-like search results layout presents several issues. Primarily, user intent when navigating the Store Locator is typically focused on selecting a store or viewing store details, such as hours or directions. Introducing a Weekly Ad link in this context adds an unrelated shopping intent—browsing deals—which distracts users from the primary goal and creates cognitive friction. This design choice conflates distinct user purposes, potentially undermining the clarity and usability of both the Store Locator and Weekly Ad functionality.
The New Store Locator Solution

The updated solution, developed in collaboration with the Store Locator team, focuses on improving the clarity and efficiency of store selection for Weekly Ads. By implementing a modal-based experience, the design separates store selection from other actions, such as retrieving detailed store information. This approach aligns with user mental models by clearly delineating the purpose of the modal as selecting a store for the Weekly Ad display, while maintaining access to additional store details through a dedicated link.

The FigJam board highlights the evolution from the original card-based, page-level design to the new modal-based approach. The revised solution eliminates unnecessary steps and distractions by:

  1. Introducing a dedicated “Change Store” modal that simplifies store selection and provides users with focused controls.
  2. Including a “Store Details” link for accessing additional information about the store, such as hours and directions, without conflating tasks.
  3. Ensuring consistent interaction patterns across the Weekly Ad and Store Locator experiences, reducing confusion and cognitive load.

This streamlined approach enhances both the usability of the Store Locator and the accessibility of Weekly Ads, aligning with user goals and business objectives to deliver a more cohesive experience.

Improved Filter Functionality and Visibility

Filters play a critical role in enabling users to refine their search results on the Weekly Ad page. The task, defined as “Filter Functionality on Page View,” focused on addressing usability challenges with the existing implementation and ensuring the redesigned solution adhered to CVS’s broader platform design guidelines while maintaining accessibility and consistency across devices.

Existing Challenges
Annotated screen grab of filter functionality
  1. Misuse of Tabs: Tabs were used to toggle between page and list views as well as access filters, leading to a confusing and inconsistent user experience. This design resulted in broken interaction models and prevented users from efficiently applying filters in specific views.
  2. Hidden Filters: Filters were collapsed by default and accessible only through a modal. This added unnecessary steps, making it harder for users to quickly identify and interact with filtering options.
  3. Accessibility Gaps: The existing filters did not meet accessibility standards, limiting their usability for screen reader and keyboard-only users. Navigation was cumbersome, and active states were not communicated effectively.
The Redesigned Solution

This redesign simplifies filter interactions, reduces cognitive load, and ensures consistency across desktop and mobile platforms. The new design addresses the issues identified in the existing interface while emphasizing clarity, accessibility, and scalability. Key improvements include:

  • Component Consistency: Filters were redesigned as reusable components, ensuring consistency and efficiency across CVS platforms. Tabs and segmented controls adhere to industry-standard interaction patterns, avoiding misuse of components and enabling predictable behaviors.
  • Restructured Information Architecture: Weekly Ad versions (e.g., “This Week,” “Next Week,” “Ymas”) are now represented as top-level tabs, simplifying navigation and eliminating the confusion caused by nested tabs. Tabs follow established design patterns and include proper ARIA roles for accessibility.
  • Filter Visibility and Accessibility: Filters are prominently placed in an expandable accordion within List View, the most relevant context for their use. The accordion design clearly communicates active filter states and provides a “Reset to All” option for users to quickly revert to default settings. Accessibility improvements include full keyboard navigation, screen reader compatibility, and clear labeling of filter states.
  • Improved Mobile Experience: Filters and navigation controls are optimized for smaller screens, ensuring clarity and usability across devices. Mobile-specific layouts maintain alignment with desktop designs, preserving consistency while prioritizing ease of use.
Future state Weekly Ad page view

The redesign of the Weekly Ad Page View focuses on simplifying navigation, removing unnecessary elements, and improving consistency across devices. By addressing usability issues in the existing design, this solution enhances the browsing experience and aligns with user expectations.

Existing Challenges
Annotated screen grab of filter functionality
  1. Ad Version Navigation Misuse: Existing navigation for Weekly Ad versions was not recognizable as interactive. Users struggled to identify the navigation as functional, causing frustration and poor usability. Redundant and poorly placed navigation elements added unnecessary complexity to the user experience.
  2. In-Ad Category Navigation: Inconsistent patterns for navigating categories within the ad disrupted the browsing flow. The lack of clear, accessible navigation options created friction for users trying to find relevant offers.
  3. Empty Space and Distracting Elements: Unnecessary calls to action and redundant information cluttered the page. Poorly utilized space detracted from the content and made the interface less intuitive.
The Redesigned Solution
  • Streamlined Navigation: Weekly Ad version navigation is restructured into a clear tab system, improving discoverability and functionality. The simplified design eliminates redundancies and provides a more intuitive way to switch between ad versions.
  • Removal of In-Ad Category Navigation: Category navigation within the ad has been removed to align with user intent and expected workflows. Filtering and browsing functionalities now follow consistent design patterns for better usability.
  • Enhanced Visual Hierarchy: Empty space has been utilized effectively to improve content focus and reduce clutter. Distracting elements, including unnecessary calls to action and redundant information, have been removed to streamline the interface.
  • Device Consistency: The redesign is optimized for both desktop and mobile, ensuring seamless transitions for users across devices. Tabs and segmented controls remain consistent, providing a cohesive experience regardless of platform.
Listview Tile & Details Page Improvements

The redesign of the Weekly Ad List View addresses key challenges in navigation, visual design, and interaction to create a more intuitive and accessible shopping experience. By eliminating usability issues in the previous design and ensuring consistency across devices, the updated List View enhances functionality, improves clarity, and aligns with user needs. The design changes aim to simplify the shopping process, improve system status visibility, and ultimately support higher conversion rates.

Existing Challenges
Annotated screen grab of filter functionality
  1. Tiles Consistent with Coupons: Images are now sourced from product shots without embedded promotional copy, and the tile design follows consistent styles similar to coupons. Tiles act as a single tappable surface, improving accessibility and usability.
  2. Visual Navigation: The tab body uses a defined background color to provide visual separation, while tiles include drop shadows to clearly indicate their interactivity.
  3. Red Removed as a CTA Color: Red, previously used inconsistently for call-to-action elements, has been replaced with a more appropriate color to improve hierarchy and reduce confusion.
  4. User Intent and In-Store vs. Online: A new filter for ‘In-Store Only’ items enables users planning in-store visits to shop more efficiently, aligning the experience with their intent.
  5. Responsive and Consistent Coupon Tiles: Coupon tiles are now responsive, with uniform heights that adapt to content. The entire tile is interactive, providing a clear and consistent user experience.
  6. Interactive Elements: Interactive elements are now clearly styled, improving visibility of system status and guiding users to actionable options.
  7. In-Store Only Labeling: The ‘In-Store Only’ label is consistently styled as an informational element, reducing ambiguity and aligning with design standard.
Annotated screen grab of filter functionality
The Redesigned Solution

The redesign of the Weekly Ad List View addresses key challenges in navigation, visual design, and interaction to create a more intuitive and accessible shopping experience. By eliminating usability issues in the previous design and ensuring consistency across devices, the updated List View enhances functionality, improves clarity, and aligns with user needs. The design changes aim to simplify the shopping process, improve system status visibility, and ultimately support higher conversion rates.

Reflections & takeaways

The redesign of the Weekly Ad experience demonstrated the critical balance between addressing user needs and meeting business objectives. Through a user-centered approach grounded in customer feedback, I delivered solutions that not only enhanced usability and accessibility but also supported CVS’s goals of increasing engagement and conversion rates. This project served as a valuable reminder of the importance of designing for both user satisfaction and measurable business outcomes.

Balancing Business Goals and User Needs

This project reinforced the importance of aligning design solutions with both user expectations and business objectives. By focusing on customer feedback and metrics, I was able to identify pain points and deliver improvements that supported engagement and conversion rates while meeting CVS’s strategic goals.

Cross-Platform Consistency

Creating a unified design across desktop and mobile platforms highlighted the value of consistent UI patterns. It ensured a cohesive experience for users while streamlining design and development workflows, reducing the time and effort required for future updates.

Iterative Collaboration

Although the prototype did not fully incorporate written lists, the iterative process established a strong foundation for future exploration of list-making functionality. By focusing on user needs and leveraging a modular design approach, the project delivered scalable solutions aligned with CVS’s broader digital strategy.

Future Opportunities

While the redesign resolved key usability and accessibility issues, there are opportunities for further optimization. Enhancing integration with CVS’s broader digital ecosystem, such as personalized shopping lists or loyalty rewards, could drive even greater value for customers and the business.