Process
Why This Exists
Struqo is a personal project that sits at the intersection of my two backgrounds: architecture and digital product design. Wood frame construction is growing in Europe, but the planning tools available to small builders and self-builders are either oversimplified or require expensive CAD licenses. I wanted to build something useful for that gap.
More practically: this project is a testbed for building a real product with AI as the primary development partner. Every line of code was written with Claude Code. The question was not "can AI help?" but "how far can one person go with AI, domain knowledge, and a clear product vision?"
What It Does
Struqo is a canvas-based tool for planning wood frame structures. Users draw walls, place structural components (studs, beams, rafters, joists, panels, posts), select wood species, and get an automatically calculated material list with quantities and dimensions.
The canvas supports pan, zoom, grid snapping, multi-select, and undo/redo. All measurements are stored in millimeters internally and displayed in the user's preferred unit. The material list aggregates components by type, species, and dimension, giving builders a clear overview of what they need.
Technical Decisions
The stack is intentionally lean: Next.js 15 for the application shell, Konva.js for the HTML5 canvas (four layers: grid, components, selection, dimensions), Zustand with Immer for state management, and undo/redo via Zundo. Design tokens follow an 8px grid with Inter for UI and IBM Plex Mono for measurements.
The construction engine is a separate package with its own test suite: material properties for 6 European wood species, standard lumber dimensions, and structural calculations. 41 tests cover the core logic. CI runs on GitLab with quality gates (type checking, linting, tests) before every merge.
Every architectural decision prioritized simplicity. No ORMs, no state management libraries beyond Zustand, no CSS-in-JS. Biome for formatting and linting instead of the ESLint/Prettier combination. The fewer moving parts, the easier it is to reason about the system and for AI to assist effectively.
What I Learned
Building a canvas application with AI taught me where the collaboration works well and where it breaks down. Boilerplate, test scaffolding, state management wiring, CSS layout: AI handles these reliably. Complex spatial logic (canvas coordinate transforms, hit detection, snap-to-grid behavior): AI needs precise context and frequent correction.
The most valuable pattern was keeping the architecture simple enough that AI could reason about the entire system. When I tried abstracting too early or adding unnecessary layers, the AI produced worse code. Simplicity was not just a design preference but a practical requirement for effective human-AI collaboration.
My Role
Everything. Product vision, UX design, architecture decisions, and development with Claude Code. This is a solo project built to explore what one person with domain expertise and AI tooling can ship.
Status
Work in progress. Core canvas and construction engine are functional. Next: authentication and project persistence (Supabase), export to SVG/PDF, and a public landing page. The project is open-source on GitLab.
Stack
Next.js 15 · Konva.js · Zustand · Tailwind v4 · Vitest · Claude Code