Spreadsheet rows. Into a sitemap you can drag.

A request, a stack of spreadsheets, and a question.

My manager forwarded a request from the content, SEO, and eCommerce team (one group at Ruggable, three hats). They had Excel sheets, one per category, dozens of rows each, listing every page on the site. URLs, indexability, monthly searches, click data, backlinks. What they couldn't do was see structure. Which pages were similar. Which were duplicates. Which categories were swollen and which were thin. They were trying to organize and simplify the site, and the only tool they had was a spreadsheet that didn't show shape.

The ask was vague: "can we have a way to visualize the pages?" The scope was mine.

Cards over rows. Drag-and-drop. Multi-user.

A spreadsheet flattens hierarchy and forces sequential reading. A sitemap is the opposite: structure at a glance, levels you can scan, parts you can move around. The shape that fit the problem was card-based — homepage at the top, categories beneath, subcategories nested under those, individual pages as draggable units that could move within or across categories.

A few things had to come along:

• Per-page SEO context (searches, clicks, backlinks, indexability) surfaced where the page lived, not in a separate sheet.
• Drag-and-drop reorganization, because the whole point was to see and rearrange.
• Multi-user editing, because multiple people on the team would touch it from different angles.
• Version history, so a wrong drag didn't destroy a week of work.
• US and UK as separate datasets, because Ruggable runs both as distinct catalogs.

Figma Make for the surface. Supabase for the spine.

I designed and built the app solo. Figma Make was the build partner for the front end, the way Claude was for Grounded. I wrote the spec, prompted my way through the components, and let the AI generate the implementation I'd otherwise have to engineer from scratch. I'm a designer, not a software engineer; the AI made it possible to ship a real tool, not a prototype.

The backend ran on Supabase, with Realtime channels for live sync and edge functions for data operations. React DnD handled the drag layer. React Router carried the region-specific URLs and a dev-mode route for safe experimentation. The full stack was honest about what I am: a designer who used AI to build the thing the team needed.

What the tool actually does.

Six capability groups carry the bulk of the work. None of them are clever on their own; together they're the difference between a spreadsheet and a sitemap.

Page indexability, at a glance

The status badge on each card is the single most-consulted piece of data on the page. Four states, color-coded, the same vocabulary across both regions.

Figma-style, because the team would use it Figma-style.

Multiple stakeholders meant multiple people editing at the same time. The patterns to borrow were obvious — auto-save, presence, version history, conflict prevention — so I borrowed them. Realtime channels carry sync events back through Supabase. Auto-save fires one second after editing stops. Version history captures both the auto-saves and explicit manual save points, with who-made-what and one-click revert. Presence indicators show who's looking.

The version history was the piece I cared about most. Reorganizing a sitemap is destructive by nature — every drag changes someone's mental model of where a page lives. The team needed to be able to try a structure, look at it, and undo it without ceremony. The history panel filters between all versions and manual-save checkpoints, tracks reverts back to their source version, and lets a stale state get restored with one click. Conflict prevention compares timestamps so an editor's own changes don't come back at them through the Realtime echo.

Adopted. Praised. Still running.

The tool launched as a small internal request and got adopted by the team that asked for it. Leadership pulled it into broader planning conversations. The US side shipped into active use; the UK side I built and shipped ready-to-go, but the team was still pulling its own data together when I left, so I never got to see the UK version in production. The piece I didn't expect: the US side is still running after my departure. Nobody asked me to maintain it. Nobody asked me to hand it off. It just kept running, because Figma Make and Supabase did the part that would have needed an engineer otherwise, and the team that asked for the tool stuck around to use it.

What building solo with AI taught me.