F
Figma figma.com
协作式界面设计的事实标准，组件与标注一体化。
设计工具 产品设计团队 2026-11-11
设计工具链：从原型到交付
一个界面从想法到上线会经过原型、视觉、切图、交付几个环节。这里按环节列出工具。
设计工具的选择取决于交付方式：如果开发要拿标注与切图，优先选协作型工具；如果要交可交互原型，选支持动效与分享链接的；预算有限时，开源工具已经能覆盖大部分场景。无论选哪个，先把设计规范和组件库建起来，比换工具更能提升效率。素材与字体授权仍需单独确认。
S
Sketch sketch.com
Mac 端老牌工具，插件生态成熟。
设计工具 Mac 设计师 2026-11-11
C
Canva 可画 canva.com
模板驱动，非设计师也能出图。
设计工具 运营与市场 2026-11-11
F
Framer framer.com
设计稿可直接发布成网站，交互动效强。
设计工具 做落地页的人 2026-11-11
W
Webflow webflow.com
可视化建站，能导出较干净的代码。
设计工具 做营销站的人 2026-11-11
P
Penpot penpot.app
开源设计工具，可自托管，适合内网团队。
设计工具 在意数据归属的团队 2026-11-11
I
InVision invisionapp.com
原型分享与评审流程完整。
设计工具 需要评审流程的团队 2026-11-11
P
Photopea photopea.com
浏览器里的类 PS 工具，应急改图很方便。
图片处理 临时改图的人 2026-11-11
P
Pixlr pixlr.com
轻量修图与拼图，模板多。
图片处理 做社媒配图的人 2026-11-11