Overview
Concept to seven figures — art direction, product design, and full-stack engineering for a viral handcrafted brand.
Secret Wood made jewelry that went viral — tiny landscapes embedded in resin rings, handcrafted one at a time. I owned the full product layer: visual concept, art direction, UX, storefront design, and every line of front-end and back-end code. The goal was to build infrastructure that could scale without eroding what made the product worth buying.
Storefront · Click to expand
The Project
Secret Wood's rings — tiny hand-poured resin worlds you could wear on your finger — spread fast on Facebook and Instagram. Almost overnight, a small studio in Vancouver was processing orders from customers in forty countries.
The product itself was irreplaceable: every ring required casting, curing, shaping, polishing, photographing, and finishing by hand. But the infrastructure supporting it wasn't built for this scale. The storefront was rigid, the production workflow was manual, and the team had no real-time visibility into what was happening operationally or commercially.
I came in as the sole technical owner — conceiving the visual direction, designing the UX, and building the full stack from storefront to database. Every customer-facing experience and every internal tool was designed, built, and iterated by me, informed by customer behaviour and production data as the brand grew.
Scope
This wasn't a brief to execute — it was a blank canvas. Art direction, brand expression online, UX flows, technical architecture, and production tooling were all originated here, shaped around the reality of a handmade product and real customer data.
How it's made
Original concept. Pure CSS. No libraries.
The Azure Falls hero panel was conceived as an experience that matched the brand's handcrafted nature — atmospheric, tactile, alive. Everything you see is a raw PNG file, positioned, layered, and animated with plain CSS keyframes. The waterfall is a scrolling tile. The mist is the same cloud asset used twice at different speeds. The ring frame is a single cutout image. No video. No canvas. No WebGL. This was 2016.
Achievements
The growth wasn't driven by a single launch — it was multiple systems compounding. A faster, more confident checkout. Promotional experiences designed to be shared. A production tracker that turned waiting into anticipation. Design and product decisions were continuously refined against real usage data, not assumptions.
Work Done
Six systems — each conceived, designed, and built to close a specific gap between studio capacity and brand ambition.
No screenshots survive from this era.
E-Commerce · UX Design
BigCartel → Shopify Migration & Custom Storefront
Led the full platform migration as order volume outgrew BigCartel. Designed and built the storefront from scratch in Shopify Liquid — custom layouts, bespoke product display components, and visual design conceived to express the brand's handcrafted aesthetic at scale. Continuously refined against conversion data as mobile social traffic grew.
Marketing · Creative Direction
Interactive Seasonal Promotion System
Conceived and built a gamified holiday promotional experience — animated gift boxes customers interacted with to unlock discount codes. Included phone motion detection: shaking the device triggered the opening animation. An original interaction concept designed to match the brand's playful, tactile identity. Discount codes were dynamically generated and piped directly into Shopify checkout.
Customer Experience · Product
Custom Production Tracking System
Designed and built a private per-customer order status page generated at checkout. Each page tracked the ring's progress through every handcraft stage: casting, curing, shaping, polishing, photography, packaging, and shipment. Conceived as a product experience, not a support tool — turning the wait into part of what made the ring feel special.
Operations · Systems Design
Barcode-Driven Production Workflow
Designed and implemented a physical barcode system connecting the studio floor to the digital tracking platform. Each order physically followed the ring through production — staff scans triggered real-time status updates on the customer's page. Gave production managers live throughput visibility and eliminated manual progress updates entirely.
Automation · Photography Pipeline
Automated Photography & Notification System
Replaced a manual photography-to-email workflow with a CMS-integrated upload system. Once a ring was photographed, images were automatically attached to the order and a notification dispatched. Designed the customer-facing experience so buyers could view — and sometimes choose between — finished pieces directly from their order page.
Internal Tools · Data Visualisation
Real-Time Global Order Dashboard
Designed and built a live Shopify-webhook order visualisation displayed on studio screens. Each new order animated onto a world map — zooming from a global view to the customer's location, surfacing their name and order details. Summary metrics alongside: today vs yesterday. Gave the team an immediate sense of momentum and commercial reality during peak periods.
Stack
React before it was standard in e-commerce. FeathersJS for real-time event-driven APIs. AWS for infrastructure. All selected and architected for this specific product context — not convention.
Frontend
Backend
Infrastructure & Integrations