Adobe XD 是 Adobe 提供的一款界面设计和原型协作软件，用来制作网页、App、桌面软件和其他数字产品的界面稿、线框图、高保真稿、可点击原型和团队交付内容。设计师可以用它排列画板、搭建组件、制作交互连线、共享原型链接，并输出标注信息，让产品想法从草图变成可浏览、可点击、可评审的设计方案。
主要作用
Adobe XD 主要用于数字产品设计，帮助团队把界面布局、视觉样式、交互流程和交付说明集中在同一工具里完成。它适合从页面构思到原型演示、再到团队查看和开发对接的完整工作场景。
适合谁使用
| 使用人群 | 常用内容 |
|---|---|
| UI 设计师 | 页面布局、按钮样式、图标、颜色、组件复用 |
| UX 设计师 | 信息架构、线框图、页面跳转、交互流程 |
| 产品经理 | 页面需求展示、原型沟通、评审方案 |
| 研发团队 | 查看界面尺寸、标注信息、组件样式和交互说明 |
| 设计团队 | 共享原型、统一组件、协作查看和反馈 |
常用能力
| 能力 | 可以完成的工作 | 适合场景 |
|---|---|---|
| 画板与网格 | 安排页面结构和元素位置 | 网页、App、桌面端界面排版 |
| 组件与属性 | 创建可复用按钮、卡片、导航栏 | 统一界面风格 |
| 原型连线 | 建立页面跳转和交互触发 | 演示操作流程 |
| 动效设置 | 设置滚动、淡入淡出、滑动等效果 | 展示页面交互感觉 |
| 共享链接 | 发送原型给团队成员查看 | 评审、沟通、演示 |
| 标注与交付 | 输出尺寸、颜色、字体和间距信息 | 开发对接 |
开始使用的流程
- 1、安装并打开 Adobe XD，新建一个设计文件。
- 2、选择设备画板，例如手机页面、网页页面或桌面应用页面。
- 3、使用矩形、文本、图片、图标等元素搭建页面框架。
- 4、创建可复用组件，例如按钮、卡片、导航栏、输入框。
- 5、切换到原型模式，用连线把页面之间建立跳转关系。
- 6、设置触发区域、过渡方式和时间效果，让原型可点击浏览。
- 7、生成共享链接，把原型发送给团队成员查看。
- 8、使用标注和交付面板，查看界面尺寸、颜色、字体和组件信息。
常用工作路径
| 阶段 | 操作内容 | 产出结果 |
|---|---|---|
| 构思阶段 | 整理页面结构和用户路径 | 线框图 |
| 设计阶段 | 选择颜色、字体、图标、组件 | 高保真界面稿 |
| 原型阶段 | 设置页面跳转和交互效果 | 可点击原型 |
| 协作阶段 | 发送共享链接给团队查看 | 方案评审 |
| 交付阶段 | 查看标注和组件信息 | 开发对接材料 |
总结说明
Adobe XD 是一款面向界面设计、原型制作和团队协作的软件。它适合需要把网页、App 或桌面软件界面快速做成可视化方案，并且希望团队成员能够在线查看原型和交付信息的场景。
免责声明：以上信息根据 Adobe XD 公开功能整理，具体功能名称、版本入口和协作方式以 Adobe 官方页面显示为准。团队可以结合实际项目选择合适的工作流程。
