> AI agents: this is the Markdown version of https://figmatica.com/cases/gud. Full index of Figmatica for LLMs: https://figmatica.com/llms.txt

# GUD: 5.5 weeks from research to final design: an online store redesign for a backpack brand

- Year: 2026
- Industry: E-commerce & brands
- Services: UX research, Web design
- Result: Redesign, Simpler navigation
- Stage: Established brand

## Input

GUD is a Ukrainian brand of men's backpacks and bags for the city and for travel. Its online store looked dated, and finding the right bag took too many steps. The client asked for two things: a modern interface that shows the brand as it is, and navigation a buyer does not have to think about.

## Reasoning

We started with the store as it was: an analysis of its UX and structure. Four goals came out of it: an easier path to the product, simpler navigation and filtering, a stronger visual identity and more room for conversion. The information architecture was rebuilt and the buyer's scenarios cut down. The look rests on three things: black and white with one GUD yellow, a clear hierarchy, and nothing on a screen that does not help to choose or to buy.

## Outcomes

A redesigned store for desktop and phone: the homepage, a catalogue with filters and sorting, the product page, the cart, registration, the About page and corporate orders, plus a UI kit of product cards, buttons, controls and icons. The design took 5.5 weeks: a week of research, a week of UX, a week and a half of wireframes and two weeks of UI. The store runs on Shopify.

> Figmatica delivered a powerful redesign of our store that perfectly captures the brand's bold, sporty, and masculine character. The new website feels modern, reliable, and provides comfortable and enjoyable shopping experience.
> Igor Gud, Director and co-founder, GUD

## Design notes

- **One product on the first screen.** The homepage opens with a single bag, the ROAD 2.0 BLACK, its description and one button. Bestsellers follow right under it, so the first scroll already leads to the catalogue.
- **The catalogue in a phone.** On a phone the store is one long list: categories as pictures at the top, then sorting and a filter, then product cards with the price and an add-to-cart button on each.
- **Three steps from the homepage to the cart.** From the main screen a buyer goes to the store, bestsellers, bags, backpacks, accessories or the Utility Line. From there it is the catalogue, the product and the cart.
- **A kit the store is built from.** Product cards in their normal and hover states, primary and secondary buttons, add-to-cart, checkboxes and radio buttons, the language and currency switch, search, and a set of icons for the product features.
- **Research first, then everything else.** A week of research: interviews, competitors and what buyers of such products are used to. A week of UX with personas behind every decision. A week and a half of low- and high-fidelity wireframes. Two weeks of UI.
- **Two typefaces and one colour.** DIN Pro for headings and buttons, Aeroport Mono for text and labels. The palette is black, a scale of greys and the brand's yellow, used only where the eye should go.

## Links

- [Live site](https://gudbags.com/)

## Frequently asked questions

### How long does an online store redesign take?

For GUD the design took 5.5 weeks: a week of research, a week of UX, a week and a half of wireframes and two weeks of UI. Development comes after that, and its length depends on the platform and on how many products and pages the store has.

### How do you simplify navigation in an online store?

Start from the structure rather than the screens. For GUD the main screen leads to six sections: the store, bestsellers, bags, backpacks, accessories and the Utility Line, and each of them to the catalogue, the product and the cart. On a phone, sorting and filters sit right above the list.

### How do you keep a brand's character in a store redesign?

Limit the means and use them consistently. GUD's store has one accent colour, the brand's yellow, and two typefaces: DIN Pro for headings and buttons and Aeroport Mono for text and labels. Everything else is black, white and the product.