Figma

Figma 是什么？

Figma 是一款以协作为核心的界面设计工具，可用于创建产品界面、组件库、交互原型和设计交付资料。团队成员可以在同一文件中编辑、评论和查看版本，让设计、产品和开发更容易围绕同一份内容沟通。

Figma 的重点不是单独绘制一张漂亮图片，而是建立可复用、可维护、能清楚表达交互与状态的产品设计。

适合哪些人？

• 设计网站、App 和后台系统的 UI/UX 设计师。
• 需要查看流程、评论方案和确认需求的产品经理。
• 需要读取尺寸、样式和资源的前端开发者。
• 建立品牌规范与组件库的设计系统团队。
• 通过 FigJam 进行流程梳理和头脑风暴的协作团队。

五步快速开始

1. 创建一个设计文件，并按功能或流程规划页面。
2. 使用 Frame 建立目标设备或界面的画布。
3. 用文字、形状、图片和布局工具完成第一个界面。
4. 把重复元素整理为组件，并使用一致的颜色与文字样式。
5. 添加原型连接，邀请成员评论，然后根据反馈迭代。

新手可以先完成一个登录页或设置页，不必一开始就制作完整应用。先理解 Frame、图层、约束和 Auto Layout，再逐步使用组件与变量。

核心概念

Frame 与图层

Frame 用于承载界面区域，也可以控制布局、裁剪和响应式行为。清晰的图层命名能减少交付和后续维护成本。

Auto Layout

Auto Layout 可以根据内容自动调整间距、排列和尺寸，适合按钮、列表、卡片和导航。建立组件时，应尽量用布局规则表达关系，而不是依赖大量绝对坐标。

组件与实例

组件适合复用按钮、输入框、卡片等重复元素；实例继承组件结构并允许一定范围的修改。组件命名和属性过多同样会增加学习成本，应从真实复用需求出发。

原型与交互

原型连接可以表达页面跳转、弹窗和状态变化。原型用于验证流程，不应代替完整的需求说明和边界条件。

常见工作流

从线框图到高保真界面

先确认信息结构和操作流程，再补充颜色、字体、间距和视觉细节。过早追求高保真容易掩盖流程问题。

建立小型设计系统

从颜色、文字、间距、圆角和常用组件开始，为组件记录用途、状态和禁用规则。不要为了“完整”创建没有真实使用场景的组件。

设计评审

提交评审时说明本次目标、关键变化、尚未解决的问题和希望获得的反馈。使用评论定位具体区域，避免反馈散落在聊天软件中。

开发交付

设计文件应包含清晰图层、组件状态、响应式规则和必要说明。开发者读取设计参数后，仍需根据代码库中的组件和可访问性要求实现，不能把设计稿直接当成最终代码。

协作与文件管理

• 按项目和功能统一页面、Frame 与组件命名。
• 不在同一个文件中长期保留大量无说明的废弃方案。
• 重要修改前确认分支、版本或备份策略。
• 分享外部链接前检查团队、项目和文件权限。
• 图片、字体、图标和品牌资源应确认授权范围。
• 设计敏感产品时，不在公开社区文件中暴露真实用户数据。

优点与局限

优点

• 多人实时协作、评论和设计交付集中在同一文件。
• Auto Layout、组件和变量有利于保持界面一致性。
• 原型可以快速表达流程和交互方向。
• 浏览器与桌面端便于不同角色参与评审。

局限

• 大型文件、复杂组件和过多嵌套会影响理解与维护。
• 设计系统需要持续治理，不能只创建不维护。
• 某些协作、开发或管理能力取决于套餐和团队设置。
• 设计稿不能替代真实数据、可访问性测试和代码验证。

常见问题

Figma 和 FigJam 有什么区别？

Figma Design 更适合界面、组件和原型；FigJam 更适合白板、流程、便签和团队讨论。

什么时候应该创建组件？

当元素会重复出现、需要统一维护，或拥有多个明确状态时。只出现一次的简单元素不一定需要组件化。

Auto Layout 必须使用吗？

不是所有图层都需要，但列表、按钮、卡片和响应式容器通常值得使用。关键是让布局规则表达真实关系。

设计完成后可以直接生成生产代码吗？

自动生成内容可作为参考，但生产实现仍需符合项目架构、响应式、性能、可访问性和测试要求。

官方资料

• Figma 官方网站
• Figma Design 帮助中心
• Figma 入门课程
• Figma 服务状态

适合场景

适合将工具用于日常内容消费、创作、协作或个人效率提升。开始前先明确目标、输入材料和希望得到的结果，再选择最小可行流程。

使用建议

先用免费或低风险样例熟悉核心功能，重要内容保留原始文件和可回退版本。涉及账号、付费、上传或公开分享时，逐项检查权限、套餐限制和导出格式。

功能边界

工具的自动化结果仍可能出现错误、延迟或兼容性问题，不能替代人工审核、正式备份和专业判断。功能、地区支持与价格可能随版本更新。

成本与隐私

使用前确认免费额度、订阅续费和第三方集成范围。不要上传不必要的个人信息、客户资料或密钥，公开链接和团队空间应设置最小可见权限。