Draftloom

Inspiration

Great ideas often start with a pencil and paper. Whether you're planning a warehouse, designing a movie set, blocking out a 3D environment, or organizing a physical space, sketching is one of the fastest ways to express an idea.

But turning that drawing into something you can actually edit, measure, optimize, and use in another application usually means recreating it manually in specialized software.

We wanted to bridge that gap.

Draftloom is our attempt to make the journey from a rough sketch to a functional 3D design much faster and more accessible.

What it does

Draftloom is a browser-based spatial design tool that uses AI and geometric reconstruction to transform hand-drawn sketches into structured, editable 2D and 3D environments.

Our intended workflow lets users:

Photograph a drawing on their phone and transfer it directly to their desktop through a QR code, without creating an account.
Define their own object categories using a handwritten color or symbol legend.
Convert detected walls, shapes, and objects into editable geometry rather than a flattened AI-generated image.
Edit dimensions, positions, and shared object definitions in a top-down 2D workspace.
Explore the same scene in an interactive 3D viewport.
Automatically arrange repeated objects within a selected region using spacing constraints.
Export the resulting 3D scene for further work in Blender.

Unlike a traditional image-to-3D generator, our focus is on preserving the structure and relationships of the original drawing.

A table should remain a separate table object. A wall should remain editable geometry. Changing one object definition should be able to update every linked instance.

Draftloom is designed for creatives and technical users, including architects, 3D artists, filmmakers, environment designers, and people planning physical layouts.

How we built it

We designed Draftloom around a shared, parametric scene model that keeps the 2D and 3D representations synchronized.

Our technology stack includes React, TypeScript, Vite, SVG, Three.js, and Node.js with Express.

The reconstruction architecture combines three approaches:

Computer vision identifies drawing marks, shapes, colors, edges, and geometry.

Multimodal AI interprets handwritten legends, object labels, and drawing annotations.

Deterministic geometry algorithms reconstruct editable objects, enforce dimensions, straighten imperfect lines, and support spatial layout operations.

Rather than asking AI to generate a single 3D mesh, we use structured scene data containing individual objects, definitions, dimensions, and transforms.

We also designed the project to support multiple reconstruction methods. The primary focus is top-down floor plans, while an isolated experimental module explores reconstructing box-like 3D volumes from isometric sketches.

Challenges we ran into

One of the biggest challenges is translating an imperfect 2D image into meaningful, accurate geometry.

Hand-drawn lines aren't perfectly straight, handwritten symbols can be ambiguous, and a photograph doesn't automatically provide real-world dimensions.

An isometric drawing introduces another challenge: some 3D dimensions are impossible to determine uniquely from a single image without additional constraints.

Our approach is to combine geometric rules with AI interpretation, preserve uncertainty when information is missing, and let users correct reconstructed objects instead of silently accepting inaccurate results.

Another major challenge is maintaining a single editable scene that supports 2D manipulation, 3D rendering, shared object definitions, layout optimization, and Blender-compatible exports.

Accomplishments that we're proud of

We established a modular architecture built around one authoritative scene format rather than separate, incompatible 2D and 3D representations.

We also designed a reconstruction contract that lets the editor and image-processing systems be developed independently by our two-person team.

Our central design principle is that the output should be real, editable geometry that users control, not simply an attractive image of what their drawing might represent.

What we learned

A convincing 3D rendering and a useful 3D model are very different things.

To make sketches genuinely usable, we need to preserve object identity, dimensions, spatial relationships, and the user's original intent.

We also learned the value of combining AI with traditional algorithms. AI is useful for interpreting ambiguous drawings and text, while deterministic geometry processing provides the precision and consistency needed for editing and layout calculations.

What's next for Draftloom

We want to expand Draftloom beyond top-down layouts to support isometric sketches, multiple orthographic views, and more complex 3D geometry.

Future capabilities could include procedural asset replacement, more advanced spatial optimization, improved uncertainty correction, and export workflows for Blender and other professional design tools.

Our long-term vision is to make Draftloom a flexible bridge between sketching and digital spatial design, allowing users to move from an idea on paper to something they can actually build upon.