Inspiration
Apartment hunting is a high-stakes guessing game. A floor plan can look spacious while hiding the things that matter: whether a bed fits, whether a dining table blocks circulation, or whether a room still feels livable once real furniture is inside it.
We wanted to make apartment planning more honest and more collaborative. A person should be able to edit a plan visually, while an AI agent can understand the same apartment through safe, structured actions, not by guessing where to click.
What it does
Dwellwise is an apartment planner for testing a real layout before committing to it.
You can create a private apartment project, draw and reshape its exterior and interior walls, add doors and windows, furnish rooms with real-world dimensions, and inspect the same saved layout in 2D and 3D. The 3D view includes an illustrative sunlight preview, editable supported finishes, and camera controls.
The important difference is that Dwellwise is WebMCP-ready. Compatible browser agents can inspect the open apartment and use semantic tools to add or update furniture, walls, openings, exterior corners, finishes, preview settings, and history. They do not need to simulate clicks or drag pixels.
How we built it
Dwellwise is built with Next.js, React, TypeScript, Three.js, React Three Fiber, PostgreSQL, and WebMCP.
One meter-based scene document powers the 2D editor, saved project data, furniture-fit checks, and 3D renderer. Walls, exterior corners, doors, and windows define the apartment; rooms are derived from the closed wall network; furniture keeps its own dimensions, position, rotation, and room assignment.
For agent interaction, Dwellwise progressively registers page-scoped WebMCP tools through document.modelContext. Dashboard tools manage the current browser’s projects. Editor tools inspect and modify only the apartment already open in that browser.
Both people and agents use the same application commands. That means agent edits receive the same geometry validation, collision checks, optimistic revision protection, save queue, undo/redo history, and visible UI updates as human edits.
Challenges we ran into
The hardest part was not exposing buttons as tools. It was preserving the product’s rules when an agent changes geometry.
Wall edits can split or merge rooms, change furniture assignments, and affect doors and windows. Openings need to stay attached to their host wall, respect wall boundaries, and behave predictably when they meet another opening. A stale browser tab must never silently overwrite a newer apartment state.
We addressed this by building shared, atomic architecture commands and using revision-checked saves. WebMCP tools call those same commands rather than maintaining a separate AI-only editing path.
We also kept sunlight honest: it is presented as a visual planning aid, not as a quantitative daylight or building-code analysis.
Accomplishments that we’re proud of
- A complete private multi-project apartment workspace without requiring an account.
- One shared scene model for 2D planning, 3D rendering, geometry validation, and furniture fit.
- Semantic WebMCP tools for the dashboard and editor, with 32 distinct registered tool names.
- Shared human and agent editing commands for furniture, architecture, finishes, preview controls, and undo/redo.
- Revision-safe saving that prevents stale tabs from overwriting newer work.
- Browser-owned project isolation: tools never receive cookies, owner IDs, raw database access, or unrestricted scene writes.
- A normal visual editor that remains fully usable when WebMCP is unavailable.
What we learned
An agent-ready app is not just a traditional UI with an AI layer attached. The tools need to express the real product concepts: walls, openings, rooms, furniture, revisions, and confirmation, not pointer gestures.
WebMCP works best when it makes the safe path the easy path: bounded tools, clear inputs, shared validation, visible results, and a person still in control of destructive actions.
What’s next
We want to make complex floor-plan recreation more reliable, improve the visual fidelity of 3D apartment previews, and continue hardening the geometry and agent workflows against messy real-world plans.
Built With
- html/css
- javascript
- neon
- next.js
- postgresql
- react
- react-three-fiber
- three.js
- typescript
- vercel
- webmcp
Log in or sign up for Devpost to join the conversation.