Embeddable AR for commerce
E-commerce · SaaS · AI/ML — We delivered a production embeddable AR try-on widget, a multi-tenant company console, and a Node.js API with queued imports, AI-assisted workflows, and AWS-ready operations, so shoppers can visualize products in their space without leaving the merchant’s site.
Client & context
- Industry: E-commerce and retail technology
- Product: An AR widget platform that lets brands offer 3D visualization and AI-assisted “try in your room” experiences on their own storefronts.
- Engagement: End-to-end product engineering — backend, admin experiences, embeddable widget, and cloud deployment patterns.
Details are summarized at a level appropriate for public sharing; metrics and attributions are omitted where confidentiality applies.
The challenge
Merchants need low-friction AR, not a separate app or heavy integration. That implies:
- A single-script embed that works on real store themes and does not break host styling — isolation and solid behavior on mobile browsers.
- Trust and scale: multi-company tenancy, role-based access, domain-bound widget use, and usage or credit behavior.
- Rich catalog operations: manual catalog management plus URL and CSV import at volume, without blocking the API.
- AI in the loop for scraping-assisted import, scene compositing, and safety controls on generated imagery.
Our approach
We treated the system as four products in one:
- Embeddable widget — minimal surface area for third-party sites, Shadow DOM for isolation, Preact with a Vite IIFE build.
- Company panel — React 18 and TypeScript, Redux Toolkit and RTK Query, shadcn/ui for a consistent admin experience.
- API platform — Express with layered architecture (routes, controllers, services, models), explicit validation and RBAC.
- Operations — Redis caching, BullMQ for async work, S3 for media, and an infrastructure layout oriented toward Elastic Beanstalk on AWS.
We prioritized async pipelines for imports and clear separation between widget traffic, company users, and platform administrators.
What we built
For end customers (shoppers)
- Upload or capture a scene; AI composites the product into the image.
- Placement modes (for example floor, wall, or surface) and safeguards such as automated moderation of generated imagery.
- Widget behavior tied to company credits — for example hiding triggers when daily limits are reached.
For merchant teams
- Product lifecycle: drafts, publish, archive; variants; localization hooks; analytics-oriented dashboards.
- Import at scale: single URL import with domain validation, CSV batch import, queued processing, and visibility into failures.
- Widget configuration: per-product copy, embed code generation, domain allowlisting.
For platform operators
- Super-admin capabilities: company lifecycle, credits, cross-company visibility, render oversight.
- Security-minded analytics: consent for sensitive render logs, time-bounded history, and UI measures to reduce casual saving of generated images.
Outcomes & value
We describe outcomes without inventing numbers. Add KPIs only when a client approves them (for example time-to-embed, import volume, or support load).
- Shipped a multi-tenant AR commerce stack from catalog to embed to AI render pipeline.
- Reduced integration risk for merchants via one script tag and domain-scoped widget security.
- Protected operations with queues, caching, and layered backend design suited to growing traffic.
- Aligned product and engineering through maintained requirements and system documentation.
Planning AR or AI
on your storefront?
Tell us about your catalog, traffic, and compliance needs — we’ll map a pragmatic path to ship.