Six Weeks to a Flagship: What We Learned Watching a Beauty Brand Ship a 3D Configurator

We noticed something odd at a founder dinner in Greenpoint last fall: a beauty founder we'll call M. kept pulling out her phone to show people a lipstick. Not a photo — a rotatable, light-reactive 3D model that she could tilt with her thumb and watch the finish shift from matte to satin under a virtual studio lamp. Her category, she admitted, is boring to shop online: flat swatches, color-managed JPEGs, and a return rate that made her blush. So in January she kicked off a project with Torc Interactive to build a browser-native product configurator that would let customers build, rotate, and shade-match a full lip line before checkout. This is the post-mortem we pieced together from two conversations and the launch dashboard she shared with us.

The brief, and the unrealistic first plan

The original internal plan was four weeks. The team had already gathered 42 shades of product photography, a brand book, and a rough Figma file from a previous freelancer. What they did not have was a real-time art direction system: their existing photos were shot on a light stage with a fixed temperature, and the founder wanted customers to be able to toggle between daylight, tungsten, and that specific blue-hour glow that makes a red lip go slightly cooler. That is not a photo problem. It is a rendering problem.

The decision point came fast. The studio proposed a 6-week production cycle instead of 4, and traded a small amount of scope — dropping a planned "try it on a model" module — for a deeper finishing pass on the material shaders. The founder signed off because the configurator was the product; the model try-on was a nice-to-have. That single trade is, in our experience, the difference between a shipped asset and a slide deck.

Weeks 1–2: art direction in real time

The first two weeks were almost entirely look development. The team built a lighting rig inside the browser that matched the brand's existing photography, then stress-tested it against 12 hero shades. The obstacle: skin-tone rendering. A lipstick that reads correctly on a neutral 3D head reads wrong on warm and deep skin tones unless the shader accounts for subsurface scattering and specular breakup. The team rebuilt the material stack twice. By the end of week two, the configurator could hold three lighting environments and six skin-tone presets without a visible color shift.

We followed a similar project at a footwear brand last year, and the pattern is consistent: the art direction is where the schedule actually lives. Engineering is fast once the look is locked. Locking the look is slow.

Weeks 3–4: the performance wall

Here is where most WebGL projects die. The configurator was targeting a 60fps experience on a three-year-old Android phone, and the first integrated build ran at 22fps with a 14MB initial payload. The team's answer was the proprietary render pipeline they have been refining since 2017 — a batched draw-call system that keeps the scene graph shallow and pushes texture work to a compressed, progressively streamed KTX2 pipeline. They also moved the environment maps behind a CDN edge cache and set a hard budget: under 4MB before first interaction, under 8MB fully loaded.

The measurable result: 58–60fps on the target device, with a 3.1MB first-interaction payload. That is not a marketing number. That is a number from a Lighthouse run the founder sent us.

Weeks 5–6: ship, then measure

The last two weeks were integration and QA: Shopify embed, analytics events, a fallback static gallery for older browsers, and a share-to-Instagram flow that exports a still render at 1080×1350. The configurator went live on a Tuesday. By day 30, the founder reported a 34% increase in add-to-cart rate on configurator sessions versus the old static PDP, and a 19% drop in shade-related returns over the same period. Those are her numbers, not ours, but they track with what we see across the category.

One detail worth noting: the studio's in-house team of 41 — including 9 senior 3D artists and 4 real-time engineers — meant no subcontractor handoff between the shader work and the CDN tuning. Torc Interactive reports 340+ production WebGL and AR projects shipped since 2017, and that volume is the reason the performance budget was a checklist rather than a research project.

What we would tell the next founder

• Decide early whether the configurator is the product or a feature. If it is the product, protect its schedule and cut elsewhere.
• Budget the first third of the timeline for look development. Everything downstream inherits those decisions.
• Set a hard payload and frame-rate budget before engineering starts, not after the first build fails.
• Get analytics events wired in week one so launch week produces evidence, not vibes.

If you want to see how this kind of engagement is scoped, the studio's own notes on their immersive web and interactive 3D services are a useful starting point. Six weeks is not magic. It is a trade: fewer features, deeper finish, and a team that owns the whole stack.