Client project · Fashion e-commerce
Editorial fashion, built around the path to purchase.
Visit the live e-commerce siteWithin the AGD team, I designed the e-commerce UX/UI across the homepage, categories, product listings, filters, product-detail flows, and responsive behavior.
Live e-commerce website
Multi-page website design and launch
The problem
The website had to preserve an expressive fashion identity while making a broad catalog, variants, sizing, delivery, and purchase actions easy to understand.
What I delivered
A live multi-page fashion e-commerce website and original Figma system covering discovery through product selection.
Original Figma designs in presentation mockups. The live commerce website may have evolved after handoff. Work created within the AGD team.
Design decisions
Editorial modules and commerce components needed to share one visual system across a long, image-heavy responsive website.
01 / Design rationale
Pair editorial collection imagery with direct category and product routes throughout the homepage.
Explore the original Why this structure
Visitors can enter through the brand story and still understand where to browse or shop next.
02 / Design rationale
Keep categories persistent, introduce filtering as a distinct action, and repeat a consistent four-column product card.
Explore the original Why this structure
The structure makes a large catalog scannable while giving the campaign image space to set the category tone.
03 / Design rationale
Place the gallery beside variants, sizing, quantity, delivery, care, measurements, and the add-to-cart action.
Explore the original Why this structure
The main questions required to choose a fashion product stay in one decision area, with deeper information available progressively.
04 / Design rationale
Use complete-the-look and related-product modules after the core product information.
Explore the original Why this structure
The modules extend the shopping journey through complementary pieces without interrupting the primary purchase decision.
Interface tour
The home balances collection imagery, direct category routes, product discovery, and the handmade story. Commerce begins inside the editorial experience instead of replacing it.
Persistent product categories establish the assortment before the grid. A visual category opening, a dedicated filter action, and consistent product cards give browsing a predictable rhythm.
Experience structure
A retrospective map based on the original Figma designs and the live website. The scenarios are illustrative usage cases, not research participants.
See the current collection and the visual world of the brand.
Use a featured route or the persistent product navigation.
Review the grid and narrow the assortment from the filter action.
Inspect imagery, price, variants, size, and product information.
Use the postal-code field or client-advisor route when more support is needed.
Add the selected product to cart or continue through the look and related items.
Illustrative scenario
A visitor arrives through a campaign image and wants to compare dresses without browsing the entire assortment.
Illustrative scenario
A visitor likes a piece but needs more confidence about size, care, and delivery timing.
The PDP keeps imagery and decision-making side by side: price, installment information, colors, sizes, quantity, shipping, measurements, garment care, and access to a client advisor.
Complete-the-look and related-product modules extend discovery after the primary decision. They keep the product language consistent while offering clear paths into complementary pieces.
Interface vocabulary
#FFFFFF#F5F5F5#707070#363636#000000Full-bleed campaign imagery combines with concise category or collection labels to move from brand story into shopping.
Consistent imagery, naming, and price placement create a repeatable browsing rhythm across the assortment.
The primary choices stay visible while measurements, care, shipping, and description use expandable rows.
Complete-the-look and related-product modules preserve the card language and offer clear routes to complementary items.
Delivery
A live multi-page e-commerce experience spanning editorial home content, category navigation, product listings, filtering, product-detail decisions, delivery information, and cross-sell modules. The available material does not include verified conversion metrics.
Next design question
The next useful study would follow the full commerce funnel: category discovery, filter use, product-page comprehension, size confidence, add-to-cart, and checkout completion. Those signals would show whether the editorial experience supports purchase rather than only attracting attention.