Video wird geladen...
Video konnte nicht geladen werden
Getting started in Paper is now really easy You can start your design from your: • live site • figma design • codebase No more screenshots. Check out these flows. (I love this vid, sound on 🔊🎶)
101,828 Aufrufe • vor 2 Monaten •via X (Twitter)
59 Kommentare

Paper is amazing. I was hacking on a harness yesterday that takes an img or vector and traces its outline in one line art style in Paper and once done with final tweaks in Paper it moves it back to code to animate

that's super cool, love seeing this

paper snapshot remains undefeated

so true

@hugosaintemarie Was just messing with it. It seems it doesn't capture backdrop-filter: blur? Also ran into some issues trying to run it with dev tools open. Overall works quite well though

@hugosaintemarie we should be able to capture backdrop filters -- can you send me the URL where it's not working correctly?

@hugosaintemarie Sure! The nav bar here, after scrolling down:

@stephenhaney Ah it does work but you need to grab the entirety of the navbar (#navigation not nav.inner) :) I'm also seeing issues with the devtools open, can't hit the arrow keys to finetune. Is that what you were seeing? We'll look into it :)

@stephenhaney Also there's an alignment issue when grabbing the search bar, also reported internally! Thanks for sharing 😊 Please keep letting us know if you see more of these quirks!

Whoever's your motion designer does phenomenal work 🔥

Thanks Kevin! Credit to @ValentinoGuerra, this is our first collab together. And @agusegui on art direction and feedback ✨ I really like this one too, we'll be doing a lot more like this

@ValentinoGuerra @agusegui Just checked out his profile and wow—he went from creating a concept for fun and working with you guys. That's so awesome!

@ValentinoGuerra @agusegui I know, so cool. It was a really good concept 😁

@douges I love the product but most importantly the way the paper logo is revealed in the end is a chef’s kiss! 🧑🍳

@douges 💯 Val nailed it on this one

👀

this is so exciting!!! i’m at the point where design garden is working with a mediocre AI slop design and now it needs to get better!

Oooo. And the codebase can be local, too?

Yeah! That's actually the way it works best. Paper Desktop runs the MCP locally. When we start a new design for like, a panel, we either use: a) Paper Snapshot to grab some existing UI from the app b) ask an agent to copy in components and styles from the Paper repo, locally Agents work best in smaller chunks, like components rather than full pages

Please if you want to add Components feature, I suggest you include a dedicated components page like Sketch does it.

paper snapshot is great - although pasting a figma design in does mess up in a few places

if you ever run into that please shoot me a DM or post it in our community slack or discord... we'll get it fixed up :)

Paper is new figma but kinda better

Love the clean and modern execution.

awesome

want a grid in flex layout plz!

on it for sure!

i started my design the other day this way: - claude get all the flows and pages into paper and it's been fantastic

love this!!

code-to-design is just :chef's kiss: worked wonderfully for

I wish @figma enabled pasting from Paper to Figma as well.

Great concept and great video explainer

you guys are absolutely cooking with Paper

thanks Daniel!

Looking forward to what you guys ship next

Oh heck yeah. Excited to try this!

This is huge. 🔥

Super cool! Love pulling in the web app as the starting point. I want to do the 'agent pull your codebase straight into the canvas' but wasn't exactly sure how to start that process. I'm talking to Claude with the Paper MCP installed and it says it's less of an import and more reconstructing the website to be on Paper. Would love to know if I'm missing crucial for the codebase/canvas connection!

goddamnit why so good

hell yeah

starting from the codebase is huge!

design to code to design to code to design ♻️

soon it'll all converge to create create create

just upgraded to paper pro!

let's gooo, send me feedback any time 🙏

local codebase access turns Paper into part of the repo, not another import step.

importing straight from the live site beats cropping screenshots all day

Bravo! This looks beautiful.

Will there be support for copying tokens from Figma? I'm really looking forward to it

if you connect both MCPs you can ask your agent to copy them over. For tokens, it tends to work accurately I'll check about copy/paste!

Thanks for the MCP example—I’ll try it! So far, I’ve only used MCP for reading, not writing. My team still does a lot of copy/paste, so doing this in a few clicks instead of waiting for agents would be great. Thanks for the support—I’m a big believer in Paper!

Good 太酷了,设计师在用的figma可以丢弃了,我得抓紧学习下

codebase import is the hard path, how do you handle design tokens drifting

is this an update? or just re-launching paper snapshot lol If it's just a re-launch I had a ton of issues with it a couple of weeks ago, it didn't even really work on the demo site 😬 I LOVE Paper, if this was fixed I could convince our entire design team off Figma

Hey, we're always improving Paper Snapshot based on new cases. If you ever run into sites that don't copy well, just send them our way ([email protected], our discord/slack, or DM me) and we will fix them up

are there any skills built by the paper team so my agent won't drift as much?

does that mean I can pull UI from a live react app through the repo?

Cooking hard ngl

Music 👏 Without knowing any context (me 👋) this video does not tell me *exactly* what Paper does. Why would a designer copy/paste from Figma into Paper, what is the big advantage of yet another tool? Agents pull in code.. so is it an all-in-one design/app shipping platform?

