Work /Design in Code

Zoro.com — Case Study

DESIGN IN CODE

I built the same prototype twice. Five days in Figma, four hours in Cursor. Then Aaron and I spent the next year finding out how far that could go.

Role

Lead Experience Designer. Gen AI Champion.

Timeline

March 2025 to 2026

Partner

Aaron Miramontes. All of it remote and async.

Company

Zoro.com, a Grainger company

5D→4HR

Build time. Same prototype, built twice.

90 MIN

Working hackathon plugin, coded on mock data

OCT '25

First designer repo shipped to production

2 TEAMS

Covered in the same 40-hour weeks as one

The test nobody asked me to run

In March 2025, I built the same prototype twice.

The first time was the normal way. A real project needed user testing, so I built the prototype in Figma. Started Monday, ready Friday. Five days of copying screens and wiring up connections, for a prototype where the forms don't actually work and every click fakes the data. That part has always bothered me. Fake interactivity confuses testers and can bias the results.

Zoro didn't have Cursor yet. I did, on a personal subscription I'd gotten proficient with on my own projects. So the following Monday, I logged in on my work computer and rebuilt the same design as a real website. Actual pages, actual navigation, forms that work. This was before the Figma MCP existed, so it was screenshots and descriptions. Four hours later it was hosted on Vercel with a URL. By the end of the day I'd run the test on UserTesting and had my results.

Five days to build the fake version. Less than one day to build the real one, test it, and read the results.

Nobody asked me to run that test. I had a hunch and wanted to know if it was real. It was.

The normal way

5 days

Process

Figma → more Figma → wire every screen and connection → ready to test on Friday

The new way

4 hours

Process

Same Figma designs → Cursor → live on Vercel → tested with results the same day

Same prototype. Same quality bar. Same user test. Different process.

Talking my way into the trial

A couple of months later, Zoro announced it was trialing Cursor. Engineering org only. I reached out anyway, showed them the prototype and the time savings, and asked to be included even though I'm not an engineer.

They approved it. Now I had official access, and one question: how far could this go?

Partners in AI crime

I demoed the prototype to Aaron Miramontes, a work friend who works the way I work. That demo changed both of our jobs. We started experimenting on our own and meeting every week, sometimes a few times a week, to share what we tried and what we learned. Notes, prompts, failures, all of it. When the Figma MCP released in June 2025, we were learning it immediately.

By fall, the workflow had flipped. Figma was for ideation: throw everything on a board, see what you like. The refinement and polish happened in code, in a real environment, where you feel how a design behaves instead of guessing at it.

From here on, none of this story is mine alone. Aaron lives in California. Every second of this work has been remote and async, and the partnership is what made it possible. Two people constantly asking each other "how can we make this easier?" gets you a lot further than one.

Before

Research and framing

Full Figma exploration

2–3 days

Prototype build in Figma

1–2 days

User test

Half day

5+ days

After

Research and framing

Figma — only what needs to be designed

Less Figma, not no Figma

Build in Cursor

Hours, not days

User test

4 hours

Figma is still in the process. It's doing less of the work.

The handoff that changed

In October 2025, I designed a small component in Figma, polished it in Cursor, and handed the engineer a GitHub repository instead of a Figma file. It was built to our exact stack. Vue, TypeScript, Vuetify, SCSS, structured the way our production code is structured. The engineer took my AI-generated code and used it in production.

For the first time, the handoff wasn't a picture of the thing. It was the thing.

After that, Cursor stopped being a prototyping tool and became the springboard for entire projects. Meeting notes, engineering documents, meeting recordings. All of it goes in a project folder Cursor can read for context before any work starts. We still work that way today.

The hackathon

Our promo work had created a new problem. We could run a dozen promotions at once, including exclusive offers assigned to individual customers. Onsite messaging surfaced them and email blasted them out. But Customer Service had no way to see a customer's offers or understand them. So we scheduled a full-day hackathon, catered lunch and all, to build a Chrome plugin that pulled it together from Talon.One and NetSuite.

I'd already designed it in Figma, and I kept it simple on purpose. It's an internal CS tool, it doesn't need to be fancy. At 9am the engineers jumped on the hard data problems. I used Cursor to build the entire plugin against a local database I made to impersonate our real endpoints. Functionally correct in about 90 minutes, no waiting on anyone.

The engineers cloned my repo, connected the real APIs, and wired up auth through our work Chrome profiles. We were basically done before lunch. We practiced the demo after we ate, and at 3pm we showed leadership a working product that nobody was scrambling to hold together.

Mock data meant nobody waited on anybody. Two tracks, merged before lunch.

I got a shout-out to senior leadership for the Cursor work. More useful than the shout-out: the method held up under a deadline, in front of engineers, on their turf.

Hackathon — one day, two parallel tracks

9:00

Both tracks
start

10:30

Plugin functionally
complete on mock data

12:00

Tracks merged.
Real APIs, real auth. Lunch.

3:00

Working demo
to leadership

Why it worked

Mock database

A local stand-in for every real endpoint, so the front-end never waited on the data work

Parallel tracks

Engineers on Talon.One and NetSuite, design on the working UI. Neither blocked the other

Clean merge

Engineers cloned the repo, swapped mock for real, added auth. Done before lunch

The afternoon went to rehearsing the demo, not saving it.

The side project that followed me to work

On my own time, I built an agentic workflow to learn how agentic workflows work. A web scraper, an AI filter, and a daily newsletter that's been running on its own since August 2025. It was never meant for work. I wanted a more focused newsfeed and figured that was a good excuse to learn automation.

Then I posted about it on LinkedIn. The next day, our Senior Director of Product called to ask how it worked. He shared it with engineering leadership. Between that and the work I was already doing at Zoro, I was invited into the Gen AI Champions cohort, with early access to the AI tools Zoro was evaluating for the product org.

That's a pattern by now. The side projects keep showing up at work.

Daily AI news newsletter — agentic workflow

Scraper

Monitors AI news sources on a schedule. Collects raw articles.

Runs automatically

AI filter

Scores relevance, removes duplicates and noise. Keeps the signal.

Runs automatically

Formatter

Structures filtered content into a readable daily summary.

Runs automatically

Delivery

Sends to subscribers. No editing, no approval, no human in the loop.

Runs automatically
Running since August 2025. Hasn't needed intervention.

What actually changed

Here's the honest part: nobody else adopted it. We presented design in code at a company-wide meeting and leadership loved it. But no other designers wanted to work this way, and there was never a mandate that anyone had to. For all of 2025, it was Aaron and me.

The two of us got fast, though. Fast enough that our product team work fit in less than half the week, without either of us ever working more than 40 hours. That surplus turned into invitations. I picked up a second team. Engineering asked me to build the front-end of an internal tool, and Aaron got tapped for another one. And when the company announced in early 2026 that it wanted to be "AI first" without quite knowing what that meant, we already knew.

What we did with that time is its own case study.

Sixteen months, compounding

MAR '25

The experiment

Same prototype, built twice. Five days in Figma, four hours in Cursor, tested with results the same day.

Bought: Proof worth showing around

MAY '25

Into the trial

Showed the numbers, asked into an engineering-only Cursor trial as a designer.

Bought: Official access

JUN '25

The partnership

Demoed to Aaron. Weekly experiment-and-share sessions. Figma MCP adopted on release.

Bought: Two people learning at once

FALL '25

The inversion

Figma for ideation, code for refinement and polish. Prototypes became real.

Bought: Better tests, faster iterations

OCT '25

The handoff

A GitHub repo instead of a Figma file. Designer-built code shipped to production.

Bought: A new definition of done

2026

The surplus

Product team work fit in under half the week. Second team, HITL, AMP, all in the same 40 hours.

Bought: The time to build the ecosystem

Each improvement bought the time that funded the next one.

The through line

None of this was a plan. It was a habit. I'm always experimenting, always improving how I work. Faster, more efficient, better results. Every improvement on this page bought back time, and that time got reinvested in the next improvement. Sixteen months of compound interest.

A lot of designers are afraid AI is going to take their job. I disagree. Designers won't be replaced by AI. They'll be replaced by designers who actually use it, and the fear is what keeps them from being one of those.

My job isn't to be good at a tool.

This doesn't feel any different than Figma replacing Adobe XD. And something will replace Figma eventually, too. My job is to be good at strategy, architecture, and design. The tools are whatever currently helps me do that best. Right now, nothing helps more than AI.