Merchandising manager

An internal tool that helps product and
e-commerce teams manage and organize product catalogs efficiently

Role:

UX/UI Designer, UX researcher

Details:

Industry: Fashion & e-commerce
Duration: September - November 2025

Tools:

Figma, notion, Figjam

The problem:

The product team faced difficulties managing multiple catalogs and categories due to outdated manual processes. Tasks like organizing products, updating visibility, and keeping catalog data consistent required unnecessary steps.

To design an intuitive internal tool that allows product and e-commerce teams to easily manage multiple catalogs, organize and update product details quickly, reducing manual effort.

This goal is going to be measured with usability tests and satisfaction surveys.

The goal:

UX Research

Stakeholder interviews

Early in the project, I sat down with the Product Manager and the Design Lead to truly understand the story behind the product. We met in person to discuss their business goals and how they handled their catalog operations day to day.

Selected interview questions:

Q: What is the goal that we are trying to achieve?

A: The goal is to simplify the daily management of catalogs and products through an intuitive interface adapted to the real needs of users.

Q: Who are the main users of this tool?

A: The product team that manages products visibility and updates.

Q: How do these users currently manage catalogues and categories?

A: Through a salesforce platform. It’s a complex outdaded interface for the team that needs to manage catalogues and products.

Q: What are the most important actions users need to perform?

A: Reorder products through drag & drop, duplicate products, change product images, identify unsorted, out of stock and high rotation products.

Affinity mapping

Catalog & category management

Teams manage multiple catalogs (Mexico, Portugal..)

Need hierarchical control of categories and subcategories.

Categories mirror the website structure.

✎ The previous platform required several steps to reach the catalogues screen.

The catalogs screen needs to be the very first thing users saw

Current platform navigation

Product sorting & positioning

Products can be manually sorted using drag and drop.

Unsorted products appear after the positioned ones because they have no fixed order.

Must distinguish between manually placed products and unsorted ones

Users can set a fixed numeric position (“position 35” → shows in slot 35 on the site).

✎ The previous platform made it hard to identify out-of-stock and fast-selling products, limiting visibility and quick decision-making.

Current product page with blurred product images

Image management & duplication

After duplication, users should be able to modify product images.

Duplicated products (double looks) need to be marked clearly.

Must be able to delete, add, and replace images easily.

✎ In the previous platform, managing product images, from reordering to uploading or deleting, was overly complex and time-consuming.

Current product image management

Views & layouts

First view: 2 products per row (alternating 2–1 pattern).

Users want to control product order according to both views.

Second view: 5 products per row.

✎ Users needed both website views, grid and list, to organize and reorder products while keeping a clear sense of how these changes would reflect on the live website.

Current view controls

Filtering & sidebar

Need filters for bestsellers (by day, week, month).

Out-of-stock products must be visually identifiable.

Ability to filter by name, ID, or season.

Must support quick actions in the sidebar, such as dragging products into categories.

✎ The current platform makes it difficult to quickly see best sellers or filter products by day, week, or month, slowing down decision-making.

Current sidebar

Operational pain points

Catalog management is currently manual and prone to errors.

Heavy dependence on technical or manual processes to maintain product lists.

Workflow is fragmented, repetitive, and time-consuming.

Lack of visibility causes frustration.

We need to give the product team an intuitive interface to keep products organized within categories, without relying on manual or technical workarounds
— Stakeholder insight

Information architecture

Merchandising manager

Catalog selection

Catalog overview

Categories

Products

Image management

Research Findings

Manual and time-consuming processes

Teams rely on repetitive manual updates to manage categories, visibility status, and product positions, which often leads to errors and slows down catalog operations.

Image management is essential

Teams need to reorder, duplicate, or replace images easily within each product to ensure the right visuals appear online.

Need for flexible control

Users want more control when organizing products, such as drag-and-drop or positioning by number, to speed up daily management tasks.

Clarity for out-of-stock items

Teams need a clear visual indicator to easily identify unavailable products and act quickly when replenishment is needed.

UX Design

Task flows

I focused on two main user flows:

  • Selecting a catalogue;

  • Managing products within a category.

    Breaking down these processes step by step helped me uncover hidden complexities such as handling different types of categories, product variations, and unsorted items.
    This phase was essential to ensure the system could adapt to real-world catalogue operations.

Start

User logs into the system

Select catalog

Catalog dashboard: overview

“Open PLP Management” button

Goes to category management

The end

Start

Enter a category

Sees the product list of that category and its details

Wants to reorder products?

Yes

Drag and drop one or more products

No

Stays on the list

Order updated

Wants to edit a specific product?

Yes

Edits or duplicates the product



Wants to use the sidebar?

No


Expand sidebar


No

The end

  1. Sketches

With the help of task flows, I started by sketching quick ideas on paper to explore layout and flow possibilities.

First sketch - select catalog

This initial sketch represents the first screen of the merchandise hub. It’s where the user selects a catalogue before starting to work.

Second sketch - overview dashboard

This second sketch represents the next screen of the merchandise hub. It shows an overview of the previously selected catalogue, including the number of categories and the active products it contains.

Third sketch - categories management

This third sketch represents the third screen of the merchandise hub, featuring a data table with all existing categories, including their status, ID, and dates.

Fourth sketch - products in the category

The fourth sketch represents the screen inside a category, showing all its products, details, and the sidebar.

2. High-fidelity explorations

I then translated the main ideas into High-fidelity designs to test structure, hierarchy and key interactions before refining the final design and deciding on colors.

First screen - select catalog

When entering the Merchandise Hub, users are now greeted by a clean welcome screen with a simple dropdown to choose their catalogue.

Before the redesign, reaching this step required three clicks and unnecessary navigation.
Simplifying it into a single, focused action helps users start their work faster and with less friction.

Second screen - overview dashboard

A quick snapshot of catalogue performance offering a clear entry point to manage content more efficiently.

Third screen - categories management

By consolidating everything into a single table with quick access to visibility, product count, and status, this design reduces navigation effort and gives users clearer control over their categories. offering a clear entry point to manage content more efficiently.

Fourth screen - products in the category

Inside each category, users can now easily reorder items with drag and drop or by setting a position number, search by name or ID, and quickly spot unsorted products.

This page gives users full control over product organization, something that previously required several disconnected steps across different tools.

UI Design

Design system

At this stage, I wanted to bring clarity and coherence to the interface while staying true to the brand. Since there wasn’t a fully established design system yet, I took the existing color palette and typography as a starting point, then built over 35 components from scratch to support this project’s specific needs.

Foundations

Components

Final screens

First screen - select a catalog

Second screen - chosen catalog’s overview

Third screen - catalog’s categories

Fourth screen - reordering a products position

Fifth screen - reordering product images

Prototype