Page To Design: 一个把网页转 Figma 设计稿的浏览器插件,也是自己独立开发第一个小工具

280 天前
 zhiliang
这个插件的作用是把网页转成可编辑的 Figma 设计稿,从而可以进行重新设计或者引用、参考学习等。支持捕获整个网页的内容,也可以根据需要选择网页中某块的设计、图片、图标等。所有的处理都是在浏览器本地处理,包括图片下载等,没有隐私问题的担忧。

地址如下:
Page To Design: https://pagetodesign.com
Chrome webstore: https://chromewebstore.google.com/detail/page-to-design/bppiipkgkacfbhihojbedicaampmcici

PS:
还有不完善的地方,持续测试迭代,欢迎拍砖建议。
也正好辞职在家“带娃”一年,尝试独立开发一些简单的工具,Page to design ,是最近两个月左右完成上线的。也简单弄了个 https://recpage.com 网站聚合,本来想做个大而全的浏览器插件,折腾来折腾去浪费了很多时间,最终还是决定重新一个个独立。
1917 次点击
所在节点    分享创造
14 条回复
param
280 天前
什么原理
C603H6r18Q1mSP9N
280 天前
不好用,试了苹果站,就拷贝了几个文字。。
wanniwa
280 天前
666
zhiliang
280 天前
@shanghai1998 不好意思,我自己测试的网址不太全,我来看看什么,谢谢
betty00
280 天前
码了
betty00
280 天前
试了一下这个,https://ably.com/ ,空白。。。。
zhiliang
280 天前
@betty00 收到,我对着处理下,感谢
crazychang
280 天前
请问 Capture successful 后如何 import ?没看到相关按钮
crazychang
280 天前
@crazychang 哦我看到了 进入 figma 网页版的一个 design 后就弹出了
MrDarnell
280 天前
还不错,我试了,虽然还有些问题,但是也能解决很多问题,我想问你这个是啥原理!
Justineo
279 天前
这个插件的效果相比 html.to.design 如何?我们有对这类工具(其实更需要的是库)的需求,用来把前端组件库输出的结果渲染到 Figma 。但是目前已有的工具在一些布局稍微复杂一些组件上效果都不太理想。你是不是可以拿 ant.design 之类的网站测试看看,复杂的前端组件转换的效果怎么样。
zhiliang
279 天前
@Justineo 还没有怎么对比过,目标是跟被捕获的网页比,我尽量多测试测试各种类型的网址,持续优化,感谢您的建议
zhiliang
279 天前
如果觉得有用,也欢迎大家在 https://www.producthunt.com/products/page-to-design ,给点评推荐下
janily
278 天前
@Justineo 我们团队做了一款把前端组件转设计稿的 figma 插件,现在支持 TDesign 和 AntDesign 两款组件库,渲染基本上覆盖 90% 以上,可以来尝试尝试,https://www.figma.com/community/plugin/1192146318523533547/ruyi-design-assistant

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1024565

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX