Screenshot of catalog, product, and cart UIs

eCommerce

Carter's Digital Transformation

Enhancing Carter’s digital experience with a UX-focused redesign to drive revenue and improve customer satisfaction. This case study details the approach to transform Carter’s online experience.

Screenshot of catalog, product, and cart UIs

eCommerce

Carter's Digital Transformation

Enhancing Carter’s digital experience with a UX-focused redesign to drive revenue and improve customer satisfaction. This case study details the approach to transform Carter’s online experience.

Project Overview

Making shopping easy for parents

Carter’s, a leading brand in children's apparel, needed an online experience that could match the brand’s value and meet evolving user expectations.

This unsolicited redesign focused on improving usability, optimizing the online shopping journey, and establishing a cohesive visual system to drive engagement and revenue.

The end result is an intuitive user journey that supports parents, family, and caregivers in their need to buy fashionable, quality clothes that withstand to the rigors of childhood.

Responsibilities

Accessibility

Design Systems

Interface (UI) Design

UX Design

Responsibilities

Accessibility

Design Systems

Interface (UI) Design

UX Design

Tools

Figma

HTML to Design

Vercel v0

Team

Independent project

The Problem(S)

Fragmented UI Design

Complex Filters & Search

Challenging Checkout Flow

Limited Competitor Parity

Going from Good to Great UX

Carter’s existing website had UX challenges that negatively impacted the user journey and potential revenue. Key problems include:

  • Inconsistent colors, UI components, and layouts that added friction to the shopping experience.

  • Users faced difficulties in navigating the catalog and completing purchases due to a disjointed layout and inefficient cart experience.

  • Competitors like Children’s Place and Nike offer smoother, more intuitive online shopping experiences, setting a high standard for UX that Carter’s was not meeting.

Fixing these problems would keep loyal customers shopping at Carters and away from competitors.

The Problem(S)

Fragmented UI Design

Complex Filters & Search

Challenging Checkout Flow

Limited Competitor Parity

Going from Good to Great UX

Carter’s existing website had UX challenges that negatively impacted the user journey and potential revenue. Key problems include:

  • Inconsistent colors, UI components, and layouts that added friction to the shopping experience.

  • Users faced difficulties in navigating the catalog and completing purchases due to a disjointed layout and inefficient cart experience.

  • Competitors like Children’s Place and Nike offer smoother, more intuitive online shopping experiences, setting a high standard for UX that Carter’s was not meeting.

Fixing these problems would keep loyal customers shopping at Carters and away from competitors.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

I created system map to better understand the connections and constraints of Carter's tech stack.

I created system map to better understand the connections and constraints of Carter's tech stack.

I created system map to better understand the connections and constraints of Carter's tech stack.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

I created system map to better understand the connections and constraints of Carter's tech stack.

Based on the service blueprint, these pages the primary pages that support user goals.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

Based on the service blueprint, these pages the primary pages that support user goals.

A style audit showed that some elements had slightly different styles. More consistency in these elements can reduce cognitive load for users.

I created a service blueprint to build design that directly support user goals of browsing, selecting, and purchasing clothes.

A style audit showed that some elements had slightly different styles. More consistency in these elements can reduce cognitive load for users.

Based on the service blueprint, these pages the primary pages that support user goals.

A style audit showed that some elements had slightly different styles. More consistency in these elements can reduce cognitive load for users.

Research

If the Shirt Fits, Buy It

If the Shirt Fits, Buy It

With customer goals in mind, I analyzed Carter's online reviews and sites like Children's Place, Nike, and REI, looking at their product catalog, product, cart, and checkout pages. I noted patterns that would support Carter's shoppers' goals.

With customer goals in mind, I analyzed Carter's online reviews and sites like Children's Place, Nike, and REI, looking at their product catalog, product, cart, and checkout pages. I noted patterns that would support Carter's shoppers' goals.

Carters reviews screenshot.

Online reviews revealed that common pain points were the "heart" feature and cart and checkout experience.

Carters reviews screenshot.

Online reviews revealed that common pain points were the "heart" feature and cart and checkout experience.

Carters reviews screenshot.

Online reviews revealed that common pain points were the "heart" feature and cart and checkout experience.

Carters reviews screenshot.

Online reviews revealed that common pain points were the "heart" feature and cart and checkout experience.

Children's Palce, Nike, and REI all have huge product catalogs similar to Carter's.

Children's Palce, Nike, and REI all have huge product catalogs similar to Carter's.

Children's Palce, Nike, and REI all have huge product catalogs similar to Carter's.

Children's Palce, Nike, and REI all have huge product catalogs similar to Carter's.

Product cards from Nike, REI  and Patagonia.

I did side by side card comparisons and looked for ways to improve for Carter's.

Product cards from Nike, REI  and Patagonia.

I did side by side card comparisons and looked for ways to improve for Carter's.

Product cards from Nike, REI  and Patagonia.

I did side by side card comparisons and looked for ways to improve for Carter's.

Product cards from Nike, REI  and Patagonia.

I did side by side card comparisons and looked for ways to improve for Carter's.

In my analysis I focused on understanding key user goals; ease of navigation, quick access to product details, and seamless checkout. Each site achieves these in similar but different ways.

Looking at online reviews, customers were having issues using the "heart" feature and finding items they had saved in previous sessions. They were also having issues updating sizes for items in the cart.

These insights and others guided my decisions on layout, interactions, and component design to ensure the experience aligned with peoples' expectations and supported their goal to buy clothes.

Design Process

Ideations and iterations

The redesign process began with collaborative brainstorming using Vercel v0 to explore ideas for improved performance and layout. In 30 seconds I was off and running. I took these and started playing with them.

I performed design linting to identify and correct inconsistencies in UI components, then standardized colors and elements to create a cohesive design system.

Prototypes of key pages—product catalog, product pages, and cart—were tested and refined iteratively, ensuring alignment with both business goals and user needs.

Screenshot of different UI components.

I brainstormed with Vercel v0 which was a great foundation upon which to build.

Screenshot of different UI components.

I brainstormed with Vercel v0 which was a great foundation upon which to build.

Screenshot of different UI components.

I brainstormed with Vercel v0 which was a great foundation upon which to build.

Screenshot of different UI components.

I brainstormed with Vercel v0 which was a great foundation upon which to build.

Solution

Lower friction, higher conversion

The final design introduced a streamlined, visually consistent e-commerce experience.

Key improvements included an optimized product catalog and card layout for easier scanning, a simplified product-to-checkout flow to reduce cart abandonment, and standardized UI elements to enhance brand credibility and usability.

These design decisions were made by keeping real people in mind. Tired parents, grandparents with different paradigms for technology, and other caregivers want stylish clothes for children that are easy to find, a good value, and easy to buy.

Key Successes

Consistent UI components

Improved search filters

Better product page UX

Improved cart page UX




Key Challenges

Access to analytics tools

The final design introduced a streamlined, visually consistent e-commerce experience.

Key improvements included an optimized product catalog and card layout for easier scanning, a simplified product-to-checkout flow to reduce cart abandonment, and standardized UI elements to enhance brand credibility and usability.

These design decisions were made by keeping real people in mind. Tired parents, grandparents with different paradigms for technology, and other caregivers want stylish clothes for children that are easy to find, a good value, and easy to buy.

Key Successes

Consistent UI components

Improved search filters

Better product page UX

Improved cart page UX




Key Challenges

Access to analytics tools

Before and after shot of Carters product catalog

Product catalog with improved filters and card layout to support browsing and putting items in cart.

Before and after shot of Carters product catalog

Product catalog with improved filters and card layout to support browsing and putting items in cart.

Before and after shot of Carters product catalog

Product catalog with improved filters and card layout to support browsing and putting items in cart.

Before and after shot of Carters product catalog

Product catalog with improved filters and card layout to support browsing and putting items in cart.

Screenshot of improved filters.

This new filter layout supports recognition over recall, improves filter search and product finability, and shows filter state.

Screenshot of improved filters.

This new filter layout supports recognition over recall, improves filter search and product finability, and shows filter state.

Screenshot of improved filters.

This new filter layout supports recognition over recall, improves filter search and product finability, and shows filter state.

Screenshot of improved filters.

This new filter layout supports recognition over recall, improves filter search and product finability, and shows filter state.

Screenshot of carters product page

New product page layout better supports user goal of finding the right size and moving item to cart.

Screenshot of carters product page

New product page layout better supports user goal of finding the right size and moving item to cart.

Screenshot of carters product page

New product page layout better supports user goal of finding the right size and moving item to cart.

Before and after shot of Carters product catalog

New product page layout better supports user goal of finding the right size and moving item to cart.

Screenshot of Carters Cart Page

Improved cart page supports checking item info, editing orders , and applying promo codes.

Screenshot of Carters Cart Page

Improved cart page supports checking item info, editing orders , and applying promo codes.

Screenshot of Carters Cart Page

Improved cart page supports checking item info, editing orders , and applying promo codes.

Screenshot of Carters Cart Page

Improved cart page supports checking item info, editing orders , and applying promo codes.

Helping users helps your business

This redesign enhances Carter’s online shopping experience, leading to an anticipated increase in conversion rates and customer satisfaction.

This is only a starting point. Carter's internal analytics tools for measuring UX can further improve on these interfaces.

These user-centered improvements position Carter’s as a stronger competitor in the digital retail space.

Results

Consistent UI components

Improved search filters

Better product page UX

Improved cart page UX


Consistent UI components

Improved search filters

Better product page UX

Improved cart page UX


Helping users helps your business

This redesign enhances Carter’s online shopping experience, leading to an anticipated increase in conversion rates and customer satisfaction.

This is only a starting point. Carter's internal analytics tools for measuring UX can further improve on these interfaces.

These user-centered improvements position Carter’s as a stronger competitor in the digital retail space.

Results

Consistent UI components

Improved search filters

Better product page UX

Improved cart page UX


Up Next