Calling Paper a "Figma killer" is catchy, but the more useful framing is this: Paper is a design canvas built for agents, not only humans.
In the main video, Andrew Warner and Cathryn Lavery test Paper live. Claude Code, with Fable 5 behind it, connects to Paper through MCP, reads the open board, creates graphics, pulls visual references, builds a sponsor deck, and compares the result against Claude Design. The interesting part is not that AI can make another pretty page. We already knew that. The interesting part is that the agent can work inside a canvas that a designer can still edit by hand.
Video credit: Andrew Warner and The Next New Thing, with design expert Cathryn Lavery. This post also embeds related Paper videos from Riley Brown, The Design Project, and Nick Sarafa/Saraev, as requested.
Source Note
This article uses the supplied transcript from the Andrew Warner and Cathryn Lavery video, plus Paper's official website and docs as the factual spine. The official Paper pages describe Paper as a connected design space for teams shipping with agents, built on web standards, with an MCP server that lets agents read and write design files.
The practical caveat: Paper is early enough that the right verdict is not "replace Figma tomorrow." The better question is which design tasks become more fluid when an agent can manipulate a shared visual canvas instead of only returning a chat artifact.
Link Map
| Useful link | Why it matters | How to use it |
|---|---|---|
| Andrew Warner and Cathryn Lavery video | Main live test of Paper, Claude Code, Fable 5, Paper MCP, thumbnail research, pitch decks, and Claude Design comparison. | Watch first for the actual workflow and designer reaction. |
| Paper official site | Paper's product page for the agent-native canvas. | Start here to understand the product promise and download path. |
| Paper docs | Official docs for Paper setup and workflows. | Use before trying to connect agents or troubleshoot. |
| Paper MCP setup | The important technical page: Claude Code, Codex, MCP endpoint, plugins, and verification prompts. | Use this when wiring Paper into Claude Code, Codex, Cursor, or another MCP-capable agent. |
| Paper vs Figma | Paper's own comparison, including its argument for HTML/CSS and agent readability. | Useful for understanding the "Figma killer" claim without swallowing it whole. |
| Paper blog: a real space to design in the age of agents | Paper's deeper thesis: execution is cheap, context and coherence become the hard parts. | Read this for the philosophy behind agent-based design. |
| Mobbin | Mentioned in the video as inspiration for product design references and side-by-side exploration. | Use it to gather real app screens before asking Paper to synthesize a design direction. |
| Claude Code | The agent surface used in the main workflow to control Paper through MCP. | Use when you want the design canvas connected to code, files, and agent tooling. |
| Claude / Claude Design | The comparison point in the video: fast design artifacts versus Paper's editable canvas. | Use Claude Design for quick one-shot visuals; use Paper when you need an editable workspace. |
| Figma | The incumbent design tool Paper is being compared against. | Still strongest where teams already have Figma libraries, handoff, and design-system gravity. |
| Riley Brown Paper workflow | Additional creator perspective on using Paper with agent-native design workflows. | Use as a second walkthrough after the Andrew and Cathryn test. |
| The Design Project Paper video | Design-focused coverage from The Design Project. | Useful for the visual-designer side of the conversation. |
| Nick Sarafa/Saraev Paper video | Another builder/creator test of Paper in the current Fable-era design stack. | Watch for more applied prompts and output patterns. |
What Paper Changes
Most AI design tools give you an output. Paper is trying to give you a workspace.
That difference matters. A chat artifact is useful when you need one page, one deck, one mockup, or one concept. A workspace is useful when you need to compare options, keep references next to the work, rearrange pieces, manually fix the awkward parts, and let another agent continue where the first one stopped.
Paper's official language is very agent-forward. The product page describes a connected canvas for teams shipping with agents. The docs say the Paper MCP server lets agents read and write design files. The compare page argues that Paper's HTML/CSS canvas is easier for AI agents to understand than a proprietary design format.
That is the real thesis. If agents are becoming part of the design process, the design file has to become legible to agents.
Setup In Plain English
The video shows the practical setup path: install/open Paper Desktop, ask Claude Code to set up the Paper MCP connection, then test that the agent can see the current board and create something simple.
Paper's official docs show a plugin path for Claude Code:
/plugin marketplace add paper-design/agent-plugins
/plugin install paper-desktop@paperThey also show a manual Claude Code MCP command:
claude mcp add paper --transport http http://127.0.0.1:29979/mcp --scope userFor Codex, Paper's docs show the plugin marketplace route:
codex plugin marketplace add paper-design/agent-pluginsThe useful connection-test prompt from the video can be adapted like this:
Tell me which Paper board is open. Then create one simple graphic so I can confirm you can control Paper.Andrew's small tactical tip is right: run the connection test with a cheaper or lower-effort setting before spending expensive Fable-level reasoning on the actual creative work.
Four Workflows From The Videos
1. Thumbnail research wall
The first strong use case is not "make me a thumbnail." It is "research the thumbnails that already work, bring them into one visual board, then let me compare and remix."
In the video, Andrew uses Paper to pull thumbnail inspiration into a canvas. Cathryn's reaction is important: side-by-side references help a designer see patterns faster than a linear chat thread. Once the references are in the board, the human can edit and direct the work instead of accepting whatever the model guessed.
2. Sponsor pitch deck from messy context
Another creator prompt asks Paper to build a sponsor pitch deck in a Perplexity-style visual direction. The value is not that Paper magically knows the perfect deck. The value is that messy voice notes, website context, screenshots, and visual preferences can become an editable deck quickly.
This is a good fit for founder work: sponsorship decks, sales decks, event proposals, product one-pagers, workshop outlines, and client-facing recap decks.
3. Deck to landing page
The workflow becomes more interesting when the deck is treated as structured product context. Once the deck exists, the agent can use it as the input for a landing page or website. That starts to blur the line between design canvas, content system, and code handoff.
My caution: still review the generated page like a real website. Check mobile layout, forms, analytics, accessibility, speed, SEO tags, image rights, and whether the copy makes a believable offer.
4. Mobbin plus Paper for product design
The Mobbin mention is one of the most useful links from the video. A practical workflow is:
- Search Mobbin for real product screens in the category you are designing.
- Bring references into Paper as a board.
- Ask the agent to summarize the reusable patterns.
- Generate three design directions from those patterns.
- Manually edit the best one before asking a coding agent to build it.
This is much stronger than prompting from vibes. You are giving the agent a visual field to reason over.
Paper Vs Claude Design
The comparison in the video is the right way to think about this. Paper does not have to beat Claude Design at every task to matter. It only has to win the tasks where an editable canvas changes the workflow.
| Use case | Paper is stronger when... | Claude Design is stronger when... |
|---|---|---|
| Thumbnail exploration | You want references, variants, notes, and manual positioning in one board. | You only need one quick concept or a fast visual draft. |
| Pitch decks | You expect to rearrange, compare, and keep improving the file. | You need a fast deck artifact from a simple brief. |
| Product design | You need inspiration boards, design references, and agent-readable canvas context. | You need a quick UI concept before a deeper design pass. |
| Design to code | You want the design file to become structured context for a coding agent. | You are fine copying a generated spec into your builder manually. |
| Team design systems | Paper may help when the team is ready to experiment with agent-native workflows. | Figma remains safer when the company already has mature libraries and handoff rituals. |
My verdict: Paper is not a universal Figma replacement today. It is a serious signal that the design file is becoming an agent workspace.
Builder Playbook
If I were testing this inside JQ AI SYSTEMS, I would not start with a full client site. I would start with a bounded workflow:
- Create one Paper board: call it "landing page direction test" or "thumbnail exploration."
- Add references: Mobbin screens, brand screenshots, competitor pages, previous client assets, and notes.
- Ask the agent to map patterns: typography, density, layout, colors, calls to action, visual motifs.
- Generate three directions: conservative, expressive, and conversion-focused.
- Manually edit: move elements, delete weak ideas, fix hierarchy, and add taste.
- Convert the winner: ask Claude Code or Codex to turn the selected direction into a responsive component or page.
- Verify outside Paper: run the page locally, check mobile, forms, performance, accessibility, and copy.
The human job is not disappearing here. It is moving earlier and later in the loop: choose the right references, set the goal, judge the outputs, and decide what deserves to ship.
Guardrails
- Say "use Paper" explicitly. Agents often choose the easiest available surface unless you name the target tool.
- Test the MCP connection first. Ask for one simple object before starting a high-token creative run.
- Keep permissions narrow. Paper MCP can write to design files, so treat it like a real editing surface.
- Separate experiments from client files. Use duplicate boards or scratch files until the workflow is stable.
- Check image rights. Inspiration is not a license to reuse creator thumbnails, screenshots, logos, or photographs.
- Review responsive structure. A canvas can look good while the eventual page still collapses badly on mobile.
- Keep taste in the loop. The best outputs in the video came from human judgment plus agent speed, not blind automation.
Featured Videos
The main Andrew Warner and Cathryn Lavery test is the best starting point. These extra videos give the broader creator view around Paper, Fable 5, and agent-native design.
Sources
- Andrew Warner and Cathryn Lavery: Meet the Figma Killer, tested live with a design expert
- The Next New Thing
- Andrew Warner on X
- Riley Brown Paper workflow video
- The Design Project Paper video
- Nick Sarafa/Saraev Paper video
- Paper official site
- Paper docs
- Paper MCP setup docs
- Paper vs Figma comparison
- Paper: A real space to design in the age of agents
- Mobbin
- Claude Code
- Figma