Granny Square Chart Tool

This started as a simple idea: take a written crochet pattern and turn it into a visual chart. It wasn't simple.

I'm a designer without a traditional engineering background, and this was my first time building a product end to end with AI. What I learned in the process changed how I think about both design and building.

Granny squares are one of crochet's most expressive formats. Their shapes, colors, and construction often aren't fully understood until they've actually been made. If you want to design one, you traditionally have to crochet it first to see the result.

My first instinct was to use AI to generate visuals directly from a text prompt. But after talking to experienced crocheters, I learned that wasn't possible — crochet construction doesn't translate that way.

What I found instead: some designers do create charts by hand, but it takes time, so many skip it and write patterns in text only. The problem is that users strongly prefer charts. They're clearer, easier to scan, and easier to understand across languages. That gap is what this tool is designed to close.

A crochet chart isn't just icons arranged on a canvas. Stitch placement depends on structure, sequence, and how the piece is actually worked. A result can look visually correct while still being structurally wrong.

Square and circular patterns also follow different construction logic, so one generic placement model couldn't cover both. What sounded like a simple translation problem turned out to be a systems design challenge.

I started by jumping in, building quickly in Cursor. For a while, it seemed to work. Then the charts started breaking, and no matter how I adjusted my prompts, the output kept getting messier. I couldn't prompt my way out of it.

Early broken output

Improved output

The problem was how I had defined the stitch. I was treating it as a visual token — a frame to place on a canvas. But a visual token has no memory, no rules, no structure. Every time I tried to build on top of it, the system had nothing to hold onto.

So I stopped building and started thinking, working with ChatGPT to figure out what the underlying structure actually needed to be. The stitch needed to be a logical unit, not a visual one. Once I rebuilt around that, everything stabilized.

I also defined a set of common failure cases and used them as consistent checkpoints throughout testing, rather than relying on prompting alone to catch mistakes.

Project rule

Common pitfall

I wanted users to be able to adjust the output and still trust the result. That meant chart and instructions had to stay in sync no matter what changed.

So I kept one source of truth for both chart rendering and instruction output. Edits in one place stayed reflected in the other, and the two never drifted apart.

The app supports a complete workflow: written pattern in, visual chart generated, instruction output synced. Users can adjust the chart manually, and the instructions update accordingly.

I tested the flow myself and gathered early feedback. The core loop works, and the structural approach holds up across different pattern types. Built solo, in one month.