VARAi
Virtual try-on that works inside real storefronts
Browser AR for eyewear, connected to product catalogues, merchant settings and live Shopify and Magento stores, and made predictable where those layers meet.
Browser AR · 3D rendering · Storefront integration · Production reliability
- product
- Virtual try-on
- platform
- VARAi
- role
- CTO & forward-deployed AI engineer
Results
- One documented gallery-query benchmark
- 38.3 s → 57 ms
- Central try-on route: 12,809 → 7,182 lines
- −44% code
- Overlay consolidated on the Visage gallery path
- 5 engines → 1
- Viewports × catalogue shapes in browser geometry tests
- 12 × 6
Problems solved
8 problems
01Transparent frames rendered opaque
- broke
- Rebuilding a material dropped the model's transmission properties, so clear frames and tinted lenses came out solid.
- changed
- The Three.js bridge now preserves physical material properties, handles colour space, and applies material presets and HDR lighting.
- proof
- Catalogue materials now match what the shopper sees in the camera view.
02Magento's loader hijacked the SDK
- broke
- RequireJS made the tracking SDK register as an AMD module instead of starting its browser runtime.
- changed
- I isolated the SDK's module detection inside its execution wrapper, leaving the store's own loader untouched.
- proof
- Try-on starts on Magento stores without disabling RequireJS.
03A Shopify app broke asset loading
- broke
- A subscription app's patched fetch assumed string URLs; Three.js passes Request objects, so models and lighting failed.
- changed
- A scoped compatibility adapter for that interaction.
- proof
- Regression tests cover it.
04Right glasses, wrong product
- broke
- Two products shared one 3D model, so try-on could show the wrong product while looking correct.
- changed
- Resolution now goes selected variant → SKU → parent product. Identity comes before asset availability.
- proof
- Fixtures give distinct products the same model URL on purpose.
05Kids' fit and masks conflated
- broke
- Frame width, fit tier and the face-occlusion mask were tangled together.
- changed
- One fit-profile resolver picks tier and mask together; colour and width stay independent; missing assets show as unavailable instead of silently swapping size.
- proof
- Mobile layout, scrolling and touch targets tested across 12 viewports and 6 catalogue configurations.
06Close and reopen raced itself
- broke
- Callbacks from a previous session could hit a new one mid-initialisation: camera, WebAssembly runtime and model loading.
- changed
- Session generation tokens and cancellation checks throughout start-up; superseded work stops and stale camera streams are released.
- proof
- Executable tests control when async steps resolve or reject, replaying close-and-reopen sequences.
07A slow gallery wasn't a graphics problem
- broke
- One catalogue query ran a multi-step model-resolution function across ~101,000 products.
- changed
- Discovery now runs off indexed model assets; detailed URL resolution only for the products returned.
- proof
- Benchmark: 38,349 ms → 57 ms for that query.
08Five engines, one product
- broke
- Retired try-on engines left competing routes, config and tests behind.
- changed
- Consolidated on one engine; removed the dead paths; kept compatibility for cached loaders; documented lost coverage and remaining work.
- proof
- Central route 12,809 → 7,182 lines.
Follow a failure across boundaries, find which component owns the decision, make that decision explicit, and test the exact condition that broke it.
stack · TypeScript · React · Node.js / Express · PostgreSQL · Three.js / WebGL · Visage SDK · WebAssembly · Jest · Playwright · Shopify · Magento
More from VARAi
- P-01AI Designer & Material StudioLive AI design chat · AI that acts, not just answers · 3D materials · Render automationChat → live 3DDesign mode changes materials, lighting and exposure in the scene; Apply or Reject each change in the chat
- P-02Lens JourneyDeterministic rules engine · Prescription upload · Catalogue sync · Multi-platform commerce1,500+ testsLens-journey suites, Sep 2026 (recorded runs of 1,431 and 1,772)
- P-03AI search and recommendationsAI search · Recommendations · Redis caching · Magento integration~2 s → ~50 msRepeat queries served from the Redis cache, skipping AI routing and the store's API
- P-04Store analysis and catalogue syncCatalogue sync · Data mapping · Shopify · Magento · Human approval43 products · 1,605 variantsLive run on a heritage British eyewear store; 6 accessories excluded and named
Need a senior AI engineer who can own delivery?
Tell me what you're building and where it breaks. I reply to every message myself.
Contract CTO · Principal AI engineering · Forward-deployed AI engineering · Enterprise AI architecture