Project portfolio Browse selected work

Shopify Plus: up to US$4,800 development credit

Designer womenswear and international retail

Fabrique

Fabrique is a designer-collective womenswear brand. Its storefront must combine designer storytelling, a large catalog, editorial edits and international transactions without relegating the designer to a footnote.

Visit the live project
Fabrique editorial designer-womenswear product visual
Official public brand visual

Core implementation review

Three storefront journeys from model choice to purchase

A designer collective fails when storytelling and checkout live on separate planes. Fabrique has to hold a dense garment catalog, editorial merchandising and cross-border buying at once. The work is to keep edit, designer, size and styling as maintainable layers that still resolve to one sellable SKU.

Project context

Define how customers choose before defining the storefront

Buying decision

Customers enter through New In, best sellers, dresses, tops, denim, bags or edits such as Marrakech and Modern Classic, then decide by designer, silhouette, fabric, size and price. Designer and Inspiration, Style With, delivery and returns complete the decision.

Delivery boundary

WESWOO establishes a designer-range-product-styling relationship so brand storytelling drives discovery and purchase, supported by stable Shopify components for frequent launches and a large catalog.

01Editorial entry

Give edits, designers and categories the same garment identity

A shopper may arrive from Marrakech, dresses or a designer name. Collection cards and search still have to return one designer, price and size reading rather than three competing answers.

  1. 01Arrive from New In, a category or an editorial edit
  2. 02Read designer, price and size state on the collection card
  3. 03Use search suggestions to reach the right range or piece
  4. 04Open the garment page to judge fabric and cut

Implementation

  • Collections carry designer and occasion merchandising, and product cards keep designer credit, title, price and size state in one hierarchy instead of hiding the designer on hover.
  • Predictive Search returns product and collection suggestions while the shopper types, sending them into the right designer or category before a long result list appears.
  • Editorial rails and collection cards share a sliding reading pattern, so homepage films and purchasable listings stay in one browsing rhythm.

Deployment and acceptance

  • Editorial navigation, announcement bars and collections can be updated separately, so a seasonal drop does not require a rewritten garment template.
  • Search keeps loading and no-result states, so an empty query does not break the edit.
ResultWhat changes after implementation
  • Whether the entrance is an edit, a designer or a category, the garment identity stays recognisable and stock-aware.
  • A new season mainly maintains collections and edits; discovery still lands on the existing product template.
View script and Shopify API evidence
predictive-search.jsShopify Predictive Search APIswiper-bundle.min.jscard-product-slider.jscard-slider.js
02Fabric confirmation

Let weave and finish be inspected before a size is committed

A considered garment has to prove its cloth, embellishment and cut before colour and size are chosen. Zoom and variant state must describe the same piece, not a pearl tweed in the gallery and a sold-out size in the form.

  1. 01Read designer credit and garment title on the first screen
  2. 02Inspect weave and embellishment in the wide gallery or lightbox
  3. 03Choose a colour and an available size
  4. 04Submit that variant through the product form

Implementation

  • Size and colour belong on variants, with product-variants.js broadcasting sellable state; styling partners stay out of option values so the SKU matrix is not inflated by outfits.
  • The garment gallery, a separate desktop viewer and a PhotoSwipe lightbox split browsing from inspection, so weave can be checked without leaving size selection.
  • The product form always submits the active variant, and sold-out sizes get distinct feedback rather than an ambiguous disabled button.

Deployment and acceptance

  • JSON templates keep gallery, sizing and styling sections independently editable, including designer and fabric modules.
  • After Section Rendering API rerenders or a theme-editor reload, variant, lightbox and drawer widgets rebind so inspection and size state do not drift apart.
  • Mobile crops editorial art while keeping size controls tappable, instead of letting gallery gestures capture the buy action.
ResultWhat changes after implementation
  • The shopper can inspect cloth and finish, then add the size actually selected.
  • New garments mainly need media and designer content; the purchase interaction can be reused.
View script and Shopify API evidence
product-variants.jsproduct-media-gallery.jsdesktop-product-image-viewer.jsphotoswipe.umd.min.jsphotoswipe-lightbox.umd.min.jsVariant behaviorProduct form behaviorMedia/model behaviorSection Rendering APIShopify section eventsShopify theme editor mode
03Styling and cart

Keep styling in related products so the cart only receives a sized garment

Style With should place a vest and jeans in one buying context without turning outfits into variant options. After add-to-cart, the drawer has to identify the sized garment and continue the look.

  1. 01Confirm the active size on the garment page
  2. 02Read related pieces from Style With
  3. 03Submit the current variant through Ajax Cart
  4. 04Show line items in the drawer and refresh suggestions

Implementation

  • The current product context calls Product Recommendations so Style With is modelled as related products rather than extra options.
  • quick-cart-drawer.js and cart.js keep line items in sync through Cart Ajax add, change and update, with returned cart JSON as the drawer source.
  • Once a garment is added, drawer suggestions refresh in the same action flow instead of sending the shopper back to the page to complete the look.

Deployment and acceptance

  • Recommendations load asynchronously and never block price, size or the buy control if the request fails.
  • Opening the drawer locks background scroll so a long gallery cannot keep moving underneath.
  • Partial rerenders remount drawer and variant listeners so the added line still matches what the page is showing.
ResultWhat changes after implementation
  • A sized garment can pick up styling partners without contaminating colour and size variants.
  • The drawer immediately identifies the line item and lets quantity or related pieces continue from there.
View script and Shopify API evidence
Product Recommendations APIcart-best-seller-recommendations.jsquick-cart-drawer.jscart.jsCart Ajax: addCart Ajax: changeCart Ajax: updatebodyScrollLock.min.js

Operational handoff

The operating team can continue after launch

Catalog and content
  • Collections merchandise by category, designer and edit, covering New In, dresses, denim, bags and themes such as Marrakech and Modern Classic.
  • Size and colour live on variants; designer, silhouette and fabric remain selection content rather than extra option values.
  • Styling partners are related products; editorial articles stay content objects outside the SKU matrix.
Market operations
  • The storefront is merchandised across multiple country and language versions, with market-merge routing before a product template so the wrong price or returns copy never renders first.
  • Designer, fabric and product records can stay shared; price, size availability, delivery and returns remain destination content rather than extra options.
  • Editorial navigation, announcement bars and redirect copy can ship independently, so seasonal drops reuse the same variant and gallery scripts.
Research notesPublic sources and verification boundary

Public research sources

Content verification

Industry, product and observable feature notes are verified against the brand site. Apps, admin configuration and commercial data that cannot be confirmed from the storefront are not inferred. WESWOO scope is stated only from project records and client authorization.

Public information last reviewed: 2026-08-12

Your next move

Turn your storefront into infrastructure for sustainable growth

Discuss your project