DEV Community

Sebastian
Sebastian

Posted on AI-assisted

Building a browser-based room planner with Codex: what I learned

I'm building Small Room Solver, a free browser tool for trying furniture layouts before moving everything around. You draw your room, enter furniture measurements, move things around in 2D and open a 3D preview. No signup needed; edits stay in your browser unless you choose to share a snapshot.

I used OpenAI Codex for implementation and debugging. The stack is Astro, React and TypeScript, with SVG for the 2D editor and Three.js through React Three Fiber for 3D. Drafts save locally in IndexedDB.

The workflow has been small iterations: describe a behaviour, implement it with Codex, check the browser flow and screenshots, then adjust. I keep the project constraints in an AGENTS.md file so things like preserving measurements and keeping edits local stay explicit. I also added frontend design and accessibility skills to Codex. Vitest covers the geometry and other core logic; Playwright checks browser interactions and accessibility.

A few implementation lessons from building it:

  • Separate measurements from the artwork. Entered dimensions are stored as integer millimetres. Canvas zoom, furniture illustrations and the 3D view all use the same underlying measurements without changing them.
  • Undo needs to follow the user's action. A furniture drag generates lots of pointer updates, but should create one Undo step. Grouping those updates into a single gesture needed explicit handling in the editor state.
  • Load 3D when someone asks for it. The preview loads on demand, keeping it out of the initial editor load. If the renderer fails, the 2D editor remains usable.

The part I'm working on now is the first visit. People have reached the site, but I haven't seen much planner use or feedback yet. I've simplified the controls and added a short, silent looping demo to show what you can do before opening the planner.

If you're rearranging a bedroom or home office, what is the first thing that feels confusing or stops you getting further?

https://smallroomsolver.com/

Top comments (0)