ALL WORK

REBODE / MASTERBRAND

Rebode Vision — Real-Time 3D Kitchen Visualizer

ROLECreator & lead developer
WHERERebode / MasterBrand
WHEN2024–2026

01 · THE PITCH

You wouldn't buy a car without driving it. In 2024, every serious competitor had a 3D kitchen visualizer and we didn't — we were playing catch-up in a category where seeing the product IS the product. So I made the case to leadership: don't chase parity, jump ahead. A visualizer at production fidelity, real-time, in the browser, on the phones people actually own.

They asked for a proof of concept. The first demo landed. The POC became a project, the project became a key initiative for Rebode and MasterBrand, and I ended up demoing early builds at a company-wide employee gathering.

02 · ARCHITECTING THE ENGINE

Initial team of four — data lead, AI layout-engine lead, and me as lead developer and acting lead designer, reporting straight to leadership. The architecture was mine end to end: the Three.js/React Three Fiber rendering engine, performance benchmarks and monitoring for mobile and desktop from day one, asset strategy (formats, textures, compression, blob storage, loader timing), API and endpoint design with latency monitoring, the Zustand store built specifically to keep re-renders down in a scene that never stops changing — and the dev tooling: scene-testing tools, sandboxes, and playgrounds where features earned their way into the main app.

Two playgrounds outgrew their purpose. One exercised our AI layout engine. The other generated cabinets from parameters — and became the Parametric Cabinet System.

The scene-testing playground, mid-sessionSEÑAL EN ESPERA

03 · THE ~10x MOMENT

Instead of hand-modeling a combinatorial catalog, we generated cabinet geometry from product data at runtime — a true collaboration: I owned geometry generation and rendering, our catalog lead owned the data model. Per-SKU 3D assets disappeared, load times dropped by roughly an order of magnitude, and leadership started talking about using it across MasterBrand's wider catalog.

The full story — Parametric Cabinet System

04 · SAYING NO TO PHOTOREALISM

From the first demos, leadership pushed hard for photorealism. I pushed back, every time — WebGL performance is chained to device compute, and photoreal on a mid-range phone is a slideshow, not a sales tool. Build it beautiful and fast first; make it photoreal when the platform allows. It was a constant struggle, and eventually they came around. I'd rather have that argument honestly than ship a demo that dies on real hardware.

Vision on desktop and on a phone, the same sceneSEÑAL EN ESPERA
SEÑAL EN ESPERA
As shipped, V1 2025

05 · TEAM & LEGACY

As the team grew, two developers reported to me for store management, 3D direction, and code organization. The one I'm proudest of started with zero Three.js, WebGL, or 3D of any kind — I trained her from scratch, and she became the product's main technical point of contact after I left. Systems and people that outlast my involvement: that's the outcome I design for.

LOAD-TIME IMPROVEMENT
~10xLOAD-TIME IMPROVEMENT
TO KEY INITIATIVE
POCTO KEY INITIATIVE
ENGINEER TRAINED FROM ZERO 3D
1ENGINEER TRAINED FROM ZERO 3D

WHAT SHIPPED

  • Vision, conceived and pitched by me, shipped in Rebode's V1
  • The rendering engine, the asset pipeline and the store architecture — mine end to end
  • The playground that became the Parametric Cabinet System
  • A trained successor carrying the product forward
Rebode Vision — Real-Time 3D Kitchen Visualizer

STACK

  • React
  • R3F
  • drei
  • TypeScript
  • Next.js
  • Tailwind
  • TanStack Query
  • Zustand
NEXT PROJECTUniversal Components — Rebode's Design System