work
PROJECT
BROWNS-RING-BUILDER
YEAR
2026
TIMELINE
5 wks
TEAM
3 senior
STACK
Shopify OS 2.0 · Metaobjects · Storefront API · Cart Transform Function · Lit islands
ROLE
engineering · solution architecture
Browns — the ring builder.
A configurable engagement-ring builder — pick a diamond, pick a setting, glide to one bundled cart. Built on Shopify-native primitives instead of a third-party app, so Browns keeps the catalogue and the checkout.
vol. 04
· archive
set · 18k au
· LIVE
042
jewellers, since 1970
SKU · BRN-042-A
0.9s · p75
Problem
Configuring an engagement ring is a high-value, high-consideration purchase over a combinatorial catalogue — up to ~504 variants per design across size, shape and metal, paired against a diamond feed that refreshes daily. Off-the-shelf ring-builder apps solve this by owning the data model, the pricing and the checkout, which locks the merchant out of their own platform and adds a runtime the store has to trust. Browns needed a builder that felt native, stayed fast, and kept the catalogue as first-class Shopify data.
The catalogue is Shopify data, not an app's private database.
Approach
We modelled the builder on Shopify-native primitives. Diamonds are products, paired to settings by a shape tag; ring designs are products with Size, Shape and Metal variants; shapes, metals and price bands are metaobjects the merchant edits directly. A Cart Transform Function bundles the chosen ring and diamond server-side and recalculates the total — the front end never sets the price, so it can't be tampered into a wrong one. Each step hydrates as a Lit island over server-rendered Liquid; a saved-ring metafield persists a shopper's configuration. The real diamond feed pushes daily, and none of the pairing logic depends on a third-party app.
- step 01 — shape · 8 shapes, metaobject-driven
- step 02 — design · filtered client-side by shape variant
- step 03 — metal · metaobject swatches, price by metal
- step 04 — diamond · Storefront API by shape tag + budget band
- cart — Cart Transform bundles ring + stone, priced server-side
504
VARIANTS PER DESIGN
0
THIRD-PARTY APPS
8
SHAPES · METAOBJECT-DRIVEN
1
CART TRANSFORM FUNCTION
Outcome
- The builder runs on Shopify primitives — products, variants, metaobjects — so Browns owns the catalogue, not an app vendor.
- The bundle price is computed server-side by a Cart Transform Function; a tampered front end can't produce a wrong total.
- Shapes, metals and price bands are metaobjects Browns edits directly — the range changes without a developer deploy.
- No third-party ring-builder app, no private data model, no lock-in.