I Built a CAD Editor in the Browser, then Taught an LLM to Use it
I built a CAD editor in the browser. Then I gave it to an AI.
The payoff happened during a demo. I asked the app, "How many doors and windows are there?"
The AI counted them. Then it added: "Note: D3 is only 300mm wide. Likely a mis-detected door. Want me to check it?"
The AI was right. My data pipeline turned a piece of geometry into a 30cm door. No human saw it. The model saw a door narrower than a shoebox and flagged it.
This project required solving massive technical hurdles:
• Parsing DWG files, which are notoriously difficult. • Reconstructing building models from thousands of random lines. • Building a 2D CAD editor from scratch using HTML5 Canvas. • Connecting Claude as an agent with a set of tools.
Here is how the system works:
- Upload: You drop a DWG file into the browser.
- Process: A background job converts the file and extracts geometry. It identifies walls, doors, windows, and rooms.
- View: You get a 3D viewer and a full 2D editor with snapping and undo history.
- Edit: You use a chat panel to tell an AI agent to make changes.
The AI does not just chat. It uses tools to edit the database. If you say, "Add a window to the longest wall," the AI identifies the wall and places the opening.
Key lessons from the build:
• Never trust file headers. DWG files often lie about units. I learned to ignore the header and look at the actual coordinate numbers to find the scale. • Use a single write path. The UI, the import pipeline, and the AI all use the same validated path. This ensures the AI cannot create impossible geometry. • Give the AI an undo story. When the AI makes an edit, the system folds that entire action into a single undo step. If the AI makes a mistake, you hit Ctrl+Z to revert everything. • Use topological rules, not math thresholds. I initially tried to find rooms by area. This failed on L-shaped buildings. I switched to a topological rule: the largest face in a connected arrangement is always the outside. Keep everything else.
The hard part was not the AI. It was turning anonymous lines into real building data. The AI feature only took days because the foundation was solid.
Source: https://dev.to/arif/i-built-a-cad-editor-in-the-browser-then-taught-an-llm-to-use-it-1l92
Optional learning community: https://t.me/GyaanSetuAi
