xo, Fetti: Warehouse Management System

/

xo, Fetti: Warehouse Management System

0 → 1 internal tool to manage the entire e-commerce process of ordering inventory from manufacturers, organizing in the warehouse, receiving orders, and shipping to consumers

xo, Fetti: Warehouse Management System

0 → 1 internal tool to manage the entire e-commerce process of ordering inventory from manufacturers, organizing in the warehouse, receiving orders, and shipping to consumers

xo, Fetti: Warehouse Management System

0 → 1 internal tool to manage the entire e-commerce process of ordering inventory from manufacturers, organizing in the warehouse, receiving orders, and shipping to consumers

xo, Fetti: Warehouse Management System

0 → 1 internal tool to manage the entire e-commerce process of ordering inventory from manufacturers, organizing in the warehouse, receiving orders, and shipping to consumers

Product Design

User Research

Product Management

xo, Fetti is an e-commerce company that offers well designed, quality, feminine party products, from temporary tattoos to decor for a bachelorette party. After their beginning in 2018, they now offer 550+ products across two brands to 3M+ customers.

xo outgrew the basic inventory management tools offered by e-commerce platforms including Shopify and Etsy, and they churned through SaaS platforms built for companies their size and larger. No singular platform handled the entire inventory lifecycle—from product design, ordering, receiving, order fulfillment, customer service, to accounting— and combining SaaS products was not economical nor efficient.

Activities

UX Design, UI Design, In-Person Research

Activities

UX Design, UI Design, In-Person Research

Activities

UX Design, UI Design, In-Person Research

Timeline

3 months

Timeline

3 months

Timeline

3 months

Team

Anthony Colangelo (Engineer)

Ryan Irelan (Engineer)

Team

Anthony Colangelo (Engineer)

Ryan Irelan (Engineer)

Team

Anthony Colangelo (Engineer)

Ryan Irelan (Engineer)

Company Type

E-commerce

<25 employees

Company Type

E-commerce

<25 employees

Company Type

E-commerce

<25 employees

Project Goal

Design an intuitive, user-centered interface that supports xo, Fetti's complete inventory management workflow while improving efficiency and reducing operational complexity.

Project Goal

Design an intuitive, user-centered interface that supports xo, Fetti's complete inventory management workflow while improving efficiency and reducing operational complexity.

Project Goal

Design an intuitive, user-centered interface that supports xo, Fetti's complete inventory management workflow while improving efficiency and reducing operational complexity.

First, we needed to understand the complexity of warehouse management.

This immersion revealed a critical design challenge: creating a powerful system that appeared simple to users while addressing key needs for inventory tracking, adaptable workflows, management dashboards, and efficient search functionality.

With no background in warehouse management or e-commerce, I divided my first two weeks between shadowing staff across facilities and consulting with Fetti's CEO to understand their complex ecosystem.

First, we needed to understand the complexity of warehouse management.

This immersion revealed a critical design challenge: creating a powerful system that appeared simple to users while addressing key needs for inventory tracking, adaptable workflows, management dashboards, and efficient search functionality.

With no background in warehouse management or e-commerce, I divided my first two weeks between shadowing staff across facilities and consulting with Fetti's CEO to understand their complex ecosystem.

First, we needed to understand the complexity of warehouse management.

This immersion revealed a critical design challenge: creating a powerful system that appeared simple to users while addressing key needs for inventory tracking, adaptable workflows, management dashboards, and efficient search functionality.

With no background in warehouse management or e-commerce, I divided my first two weeks between shadowing staff across facilities and consulting with Fetti's CEO to understand their complex ecosystem.

First, we needed to understand the complexity of warehouse management.

This immersion revealed a critical design challenge: creating a powerful system that appeared simple to users while addressing key needs for inventory tracking, adaptable workflows, management dashboards, and efficient search functionality.

With no background in warehouse management or e-commerce, I divided my first two weeks between shadowing staff across facilities and consulting with Fetti's CEO to understand their complex ecosystem.

This diagram shows what’s happening with the inventory as it moves from being manufactured to ending up on a consumer’s doorstep.

We focused design efforts on typographical hierarchy and table design.

The core of the system relied on data tables displaying dense information. I selected IBM Plex Sans, a typeface with a narrower body that maintained readability while displaying more information. Strategic color coding helped users quickly identify specific information, while clear section divisions created a natural information flow.

We focused design efforts on typographical hierarchy and table design.

The core of the system relied on data tables displaying dense information. I selected IBM Plex Sans, a typeface with a narrower body that maintained readability while displaying more information. Strategic color coding helped users quickly identify specific information, while clear section divisions created a natural information flow.

We focused design efforts on typographical hierarchy and table design.

The core of the system relied on data tables displaying dense information. I selected IBM Plex Sans, a typeface with a narrower body that maintained readability while displaying more information. Strategic color coding helped users quickly identify specific information, while clear section divisions created a natural information flow.

We focused design efforts on typographical hierarchy and table design.

The core of the system relied on data tables displaying dense information. I selected IBM Plex Sans, a typeface with a narrower body that maintained readability while displaying more information. Strategic color coding helped users quickly identify specific information, while clear section divisions created a natural information flow.

When possible, we added color-coding to the tables. In most cases, the xo, Fetti team members were looking for a specific item, such as a late shipment.

Product detail pages were designed to tell the "story" of each inventory item through a multi-panel layout displaying various aspects of the product's lifecycle. Each panel contained key information about inventory levels, order details, specifications, and status indicators against a subtle gray background. This design allowed users to quickly understand a product's complete status at a glance, supporting faster decision-making without navigating between screens.

While the platform was primarily used on desktop, all warehouse ops needed intuitive mobile designs.

The interface accommodated these variable paths while maintaining data integrity, using intelligent defaults and single-tap interactions to increase efficiency during physical tasks.

One of the biggest design challenges was building flexibility into the workflows. For example, when receiving shipments, staff might scan a box and immediately place it in its warehouse location, or alternatively scan it and group it with other boxes to move later.

While the platform was primarily used on desktop, all warehouse ops needed intuitive mobile designs.

The interface accommodated these variable paths while maintaining data integrity, using intelligent defaults and single-tap interactions to increase efficiency during physical tasks.

One of the biggest design challenges was building flexibility into the workflows. For example, when receiving shipments, staff might scan a box and immediately place it in its warehouse location, or alternatively scan it and group it with other boxes to move later.

While the platform was primarily used on desktop, all warehouse ops needed intuitive mobile designs.

The interface accommodated these variable paths while maintaining data integrity, using intelligent defaults and single-tap interactions to increase efficiency during physical tasks.

One of the biggest design challenges was building flexibility into the workflows. For example, when receiving shipments, staff might scan a box and immediately place it in its warehouse location, or alternatively scan it and group it with other boxes to move later.

While the platform was primarily used on desktop, all warehouse ops needed intuitive mobile designs.

The interface accommodated these variable paths while maintaining data integrity, using intelligent defaults and single-tap interactions to increase efficiency during physical tasks.

One of the biggest design challenges was building flexibility into the workflows. For example, when receiving shipments, staff might scan a box and immediately place it in its warehouse location, or alternatively scan it and group it with other boxes to move later.

Box quantity and units per box had defaults depending on the SKU — this meant users rarely had to change these numbers, and if they did, it usually took one tap of the (+). No typing in numbers.

Error states, and specifically, the text on the error states was crucial in letting warehouse employees know what happened next. Sometimes, they would be blocked by manager approval.

Every shipment’s box had a barcode on it. While employees typically scanned it, we needed a way of entering digits in case scanning didn’t work.

This example shows the process of putting away a SKU. They first had to receive it, then put it away, and this grouping of SKUs was part of a larger task.

Inspired by product management tools including Jira, we designed a simple task management tool for managers to monitor all warehouse operations and be alerted when their approval was needed.

Unified search across all data

This unified approach dramatically reduced the time required to locate specific items within millions of records, enabling staff to quickly respond to operational needs.

I designed a search system that allowed users to find information across the entire data ecosystem from a single interface. The experience incorporated keyboard shortcuts, real-time filtering, and contextual results prioritized by the user's current task and role.

Unified search across all data

This unified approach dramatically reduced the time required to locate specific items within millions of records, enabling staff to quickly respond to operational needs.

I designed a search system that allowed users to find information across the entire data ecosystem from a single interface. The experience incorporated keyboard shortcuts, real-time filtering, and contextual results prioritized by the user's current task and role.

Unified search across all data

This unified approach dramatically reduced the time required to locate specific items within millions of records, enabling staff to quickly respond to operational needs.

I designed a search system that allowed users to find information across the entire data ecosystem from a single interface. The experience incorporated keyboard shortcuts, real-time filtering, and contextual results prioritized by the user's current task and role.

Unified search across all data

This unified approach dramatically reduced the time required to locate specific items within millions of records, enabling staff to quickly respond to operational needs.

I designed a search system that allowed users to find information across the entire data ecosystem from a single interface. The experience incorporated keyboard shortcuts, real-time filtering, and contextual results prioritized by the user's current task and role.

The modal that was ultimately launched as an MVP.

Outcomes

Our custom warehouse management solution revolutionized xo's operations, enabling rapid scaling of their multi-brand business while significantly reducing operational costs and complexity.

Outcomes

Our custom warehouse management solution revolutionized xo's operations, enabling rapid scaling of their multi-brand business while significantly reducing operational costs and complexity.

Outcomes

Our custom warehouse management solution revolutionized xo's operations, enabling rapid scaling of their multi-brand business while significantly reducing operational costs and complexity.

Outcomes

Our custom warehouse management solution revolutionized xo's operations, enabling rapid scaling of their multi-brand business while significantly reducing operational costs and complexity.

60x

faster reporting with Story, which takes seconds, compared to their previous reporting tools Brightpearl and Shopify, which took minutes

60x

faster reporting with Story, which takes seconds, compared to their previous reporting tools Brightpearl and Shopify, which took minutes

60x

faster reporting with Story, which takes seconds, compared to their previous reporting tools Brightpearl and Shopify, which took minutes

60x

faster reporting with Story, which takes seconds, compared to their previous reporting tools Brightpearl and Shopify, which took minutes

$300k+

in savings through Story, compared to paying for SaaS warehouse management tools, over 3 years

$300k+

in savings through Story, compared to paying for SaaS warehouse management tools, over 3 years

$300k+

in savings through Story, compared to paying for SaaS warehouse management tools, over 3 years

$300k+

in savings through Story, compared to paying for SaaS warehouse management tools, over 3 years

Interested in working together?

© Courtney Sabo, 2025