← All work

Case study · Founder · Design + Build

Pincushion.

Point at any pixel on a live web app and tell your AI agent exactly what's wrong. A Chrome extension + MCP server + VS Code extension — closing the visual feedback loop for vibe-coding.

RoleFounder · design + build
Timeline2025 — present · early access
StackTypeScript · React · MCP · Stripe · Slack OAuth
Distributionpincushion.io · npm · Chrome Web Store · VS Code Marketplace
acme-app.vercel.app
Build something beautiful today
Get Started
Learn More
J
Josh
pincushion Feedback
.hero > h1 Open
"Make this headline more compelling — try Welcome Home"
.cta-button Open
"CTA should say Start Free Trial"
.nav > .logo Done
"Logo needs more padding"
hero-section.html
styles.css
1<section class="hero">
2 <div class="hero-inner">
3 <h1>Build something beautiful today</h1>
3 <h1>Welcome Home</h1>
4 <p>The platform for modern teams</p>
5 <div class="cta-row">
6 <a class="cta-button">Get Started</a>
7 </div>
8 </div>
9</section>
10
11<!-- Updated by pincushion AI Agent -->
$
Pin resolved. Changes shipped.
Pin feedback
AI reads & ships
Resolved

The loop, in 4 seconds.

Click anywhere on a live app, type what's wrong, and hit send. The agent reaches into the codebase and patches the layout in front of you. Pincushion does this against your local repo — point at a pixel, describe the fix, and the change shows up as a diff you can approve.

The path is short and legible: Chrome extension → MCP → VS Code → diff. A pin and a note become a patch, scoped to the exact element and the exact line.

Vibe-coding broke the feedback loop.

When you're prompting an agent to write a feature, the bottleneck isn't the code — it's describing what's wrong with the output. Designers and PMs end up screenshotting, annotating, pasting back, hoping the agent finds the right component.

Before Pincushion

Take screenshot → open Figma → annotate → copy-paste → "the button on the third card under the header." Minutes per pin, ambiguous, and stale within seconds.

With Pincushion

Click → type → send. The agent knows which element, which file, which line. Seconds per pin, unambiguous, and sourced to the line of code.

One feedback report, four surfaces.

The hard problem isn't the UI — it's threading a pixel-level report through the agent's tool layer and back into a code change the user can approve. Pincushion sits between the browser, the model, and the editor.

Chrome extension

Pin · sketch · note on any live web app.

MCP server

Exposes the report as a tool call any MCP-aware agent can read.

Coding agent

Claude · Cursor · Windsurf locate the source and draft the patch.

VS Code

Diff · approve · push — the developer stays in control.

TypeScript React MCP Stripe Slack OAuth Chrome extension VS Code extension

Three calls that shaped everything.

Every product has a small set of moves that decide what it is. Here are mine.

01 · Pin, not screenshot.

Screenshots are dead the moment the layout changes. A pin is a live anchor — when the dev re-renders, the pin re-attaches to the same element via a stable DOM signature. Same conversation, fresh state.

02 · MCP, not API.

Building one API client per agent (Claude, Cursor, Windsurf, etc.) is a quarter of work and a permanent maintenance tax. Going through MCP means anyone with an MCP-aware agent can read Pincushion reports for free — including agents that don't exist yet.

03 · Approve in the editor, not the browser.

It's tempting to apply the patch and have the user accept it visually. But the diff is the contract. Showing it in VS Code keeps the developer's mental model intact and lets them edit the agent's work before accepting.

Shipped surfaces.

Pincushion is in early access — built solo and live in market. The honest version of the outcomes page: what shipped, where it ships, what's next.

4
Surfaces shipped: Chrome ext · MCP server · VS Code ext · web.
8+
MCP clients: Cursor · Claude Code · VS Code · Claude Desktop · Windsurf · Antigravity · Codex · Zed.
3
Pricing tiers: Free · Pro $19 · Team $49 — Stripe live.
npm
Distribution via pincushion-mcp — 1-command install.

What's next · Q3

  • Mobile-screen pinning (React Native preview).
  • Pin → Loom-style replay for async review.
  • Team mode: pin assignments + state machine.

What I'd do differently

Shipped the Chrome extension before the MCP server was solid. Got most of the experience working, but the integration story was confusing for two months. Next time, the protocol layer ships first.

Want the full demo?

Pincushion is live in early access. Try it, or get in touch.