Skip to content
Back to work

Case study · 2025

3D Room Designer (Ikea Kreativ-Inspired)

A 1-week prototype that allows users to place 3D furniture, manipulate scenes, and visualize room layouts with exportable configurations.

Demonstrates rapid prototyping, 3D interface engineering, and the capacity to ship complex interactive experiences quickly.

Next.jsTypeScriptThree.jsReact Three FiberZustandTailwind CSS
3D Room Designer (Ikea Kreativ-Inspired) screenshot

The Problem

IKEA's Kreativ tool is powerful but proprietary. There's no open-source equivalent that lets developers and designers prototype 3D room layouts without licensing a commercial SDK. Building one from scratch in a week was a challenge I set for myself to test rapid 3D prototyping speed.

The Solution

Built a full 3D room designer in one week using Three.js via React Three Fiber. Users can place furniture, move pieces around a 3D scene, switch between camera presets, and export their configuration. The architecture uses Zustand for scene state, keeping 3D logic separate from UI logic cleanly.

Key decisions:

  • React Three Fiber — declarative Three.js keeps the component tree readable and the state flow predictable
  • Zustand scene store — furniture positions, selections, and history (undo/redo) live in a flat Zustand store, not local component state
  • Snapping grid — pieces snap to an 8px grid to make placement feel precise without requiring exact coordinates
  • Bill of materials panel — a side panel lists every piece in the scene with counts, simulating a real furniture planning workflow
  • Camera presets — top-down, isometric, and first-person views switchable via keyboard or toolbar

The Outcome

A production-deployed open-source prototype built in one week. Demonstrates rapid prototyping capability, comfort with 3D interfaces, and the ability to ship complex interactive experiences quickly under self-imposed constraints.

3D Room Designer (Ikea Kreativ-Inspired) | Case Study by Orlando Ascanio