用户指南 取消(C)

开始使用 Adobe XD 中的画板

  1. Adobe XD 用户指南
  2. 简介
    1. Adobe XD 的新增功能
    2. 常见问题
    3. 利用 Adobe XD 进行设计、原型创建和共享
    4. 颜色管理
    5. 系统要求
      1. 硬件和软件要求
      2. Adobe XD、Big Sur 和 Apple Silicon | macOS 11
    6. 工作区基础知识
    7. 在 Adobe XD 中更改应用程序语言
    8. 访问 UI 设计套件
    9. Adobe XD 中的辅助功能
    10. 键盘快捷键
    11. 提示和技巧
  3. 设计
    1. 画板、参考线和图层
      1. 开始使用画板
      2. 使用参考线和网格
      3. 创建可滚动画板
      4. 使用图层
      5. 创建滚动组
    2. 形状、对象和路径
      1. 选择对象、调整对象的大小和旋转对象
      2. 移动、对齐、分布和排列对象
      3. 为对象分组、锁定、重复、复制和翻转对象
      4. 为对象设置描边、填充和投影
      5. 创建重复元素
      6. 使用 3D 变换创建透视设计
      7. 使用布尔运算编辑对象
    3. 文本和字体
      1. 使用绘图和文本工具
      2. Adobe XD 中的字体
    4. 组件和状态
      1. 使用组件
      2. 使用嵌套组件
      3. 向组件添加多个状态
    5. 蒙版和效果
      1. 创建一个形状蒙版
      2. 使用模糊效果
      3. 创建和修改渐变
      4. 应用混合效果
    6. 版面
      1. 响应式调整大小和约束
      2. 为组件和组设置固定的内边距
      3. 使用堆叠创建动态设计
    7. 视频和 Lottie 动画
      1. 使用视频
      2. 使用视频创建原型
      3. 使用 Lottie 动画
  4. 原型
    1. 创建交互式原型
    2. 制作原型动画
    3. 自动制作动画支持的对象属性
    4. 使用键盘和游戏手柄创建原型
    5. 使用语音命令和播放创建原型
    6. 创建定时过渡
    7. 添加叠加
    8. 设计语音原型
    9. 创建锚点链接
    10. 创建超链接
    11. 预览设计和原型
  5. 共享、导出和审阅
    1. 共享选定的画板
    2. 共享设计和原型
    3. 为链接设置访问权限
    4. 使用原型
    5. 审阅原型
    6. 使用设计规范
    7. 共享设计规范
    8. 检查设计规范
    9. 设计规范导航
    10. 审查和评论设计规范
    11. 导出设计资源
    12. 导出和下载设计规范中的资源
    13. 企业版的组共享
    14. 备份或转移 XD 资产
  6. 设计系统
    1. 带 Creative Cloud Libraries 的设计系统
    2. 在 Adobe XD 中使用文档资源
    3. 在 Adobe XD 中使用 Creative Cloud Libraries
    4. 从链接资源迁移到 Creative Cloud Libraries
    5. 使用设计令牌
    6. 使用 Creative Cloud Libraries 中的资源
  7. 云文档
    1. Adobe XD 中的云文档
    2. 协作与协同编辑设计
    3. 协同编辑与您共享的文档
  8. 集成和插件
    1. 使用外部资源
    2. 使用 Photoshop 中的设计资源
    3. 从 Photoshop 中复制和粘贴资源
    4. 导入或打开 Photoshop 设计
    5. 在 Adobe XD 中使用 Illustrator 资源
    6. 打开或导入 Illustrator 设计
    7. 将矢量从 Illustrator 复制到 XD
    8. 用于 Adobe XD 的插件
    9. 创建和管理插件
    10. XD 的 Jira 集成
    11. XD 的 Slack 插件
    12. XD 的 Zoom 插件
    13. 将设计从 XD 发布到 Behance
  9. iOS 和 Android 版 XD
    1. 在移动设备上预览
    2. 适用于移动设备的 Adobe XD 常见问题解答
  10. 故障排除
    1. 已知问题和已修复问题
      1. 已知问题
      2. 已修复的问题
    2. 安装和更新
      1. XD 似乎与 Windows 不兼容
      2. 错误代码 191
      3. 错误代码 183
      4. 安装 XD 插件时出现问题
      5. Windows 10 上提示卸载并重新安装 XD
      6. 迁移首选项有问题
    3. 启动和崩溃
      1. XD 在 Windows 10 上启动时崩溃
      2. XD 在您注销 Creative Cloud 时退出
      3. Windows 上订阅状态相关问题
      4. 在 Windows 上启动 XD 时出现“应用程序被阻止”警告
      5. 在 Windows 中生成故障转储
      6. 崩溃日志收集和共享
    4. 云文档和 Creative Cloud Libraries
      1. XD 云文档相关问题
      2. 链接组件的问题
      3. 库和链接的问题
    5. 创建原型、发布和预览
      1. 无法在 macOS Catalina 上录制原型交互
      2. 工作流程发布相关问题
      3. 浏览器中未显示发布的链接
      4. 浏览器中的原型呈现不正确
      5. 共享链接上意外出现评论面板
      6. 无法发布库
    6. 导入、导出和使用其他应用程序
      1. 在 XD 中导入和导出
      2. XD 中的 Photoshop 文件
      3. XD 中的 Illustrator 文件
      4. 从 XD 导出到 After Effects
      5. XD 中的 Sketch 文件
      6. 第三方应用程序在导出中不可见

了解如何使用画板在 XD 中创建设计项目。

来认识一下 Jeanee,她是一位被选为 UX 设计项目负责人的图形设计师。她正在向团队宣传 Adobe XD,团队成员在 UX 设计和工具方面所拥有的专业知识水平不同。

 
  • 她正在寻找资源来快速帮助她启动该项目。

 

  • 她需要一些快速入门教程,以及可随时随地学习的示例文件。

Jeanee 正在自我培训基本的设计术语,并将使用画板在 XD 中创建她的第一个原型。继续阅读,了解如何帮助她开始。

继续操作之前

了解 XD 的基础知识:

通过 4 个简单的步骤设置画板

什么是画板?画板表示应用程序中的屏幕或网站中的网页。它可以简化设计流程,并在一个文档内创建适用于多种屏幕大小的交互式设计。使用画板创建 XD 项目。

请继续阅读,了解如何设置画板。

创建新画板

Adobe XD 可为您提供适用于常见屏幕大小的画板,例如适用于不同版本的 iPhone、iPad 和 Web 的画板。如果可选画板不符合您的要求,可以创建自定义画板。

主页屏幕

使用预设画板大小或创建自定义画板。

自定义画板

XD 应用程序

使用“画板”工具创建其他画板。 

画板属性

从“属性检查器”中选择画板预设,或在画布上拖动以创建自定义画板。

使用 Photoshop 和 Illustrator 中的现有画板

您可以将 PhotoshopIllustrator 中的现有画板导入 XD,而不必重新创建画板。

使用 Photoshop 和 Illustrator 中的现有画板

使用 XD 中的“文件”>“导入”在 XD 中打开 Photoshop 或 Illustrator 画板,每个画板和图层都将保持不变并且可编辑。

对于 XD 57 和更高版本,当您从 Photoshop 和 Illustrator 将现有采用 sRGB 颜色配置文件的资源用于采用 sRGB 颜色配置文件的 XD 文档时,您将获得一致的颜色。如果 XD 文档采用非托管颜色配置文件,则您将看到一条消息,该消息提示您将颜色配置文件切换为 sRGB

管理画板

是否对画板大小改变了主意?请调整画板大小。您还可以根据自己的设计需求重命名画板。是否要创建更多画板并管理其位置?重复并重新排列画板。

重命名

重新排列

双击画板标题。

调整大小

调整大小

拖动画板边缘上显示的圆形手柄。

重复

复制粘贴画板

选择画板并按 Ctrl/Cmd+D

对齐与分布

对齐与分布

选择多个画板并单击“属性检查器”中的“对齐与分布”四处拖动画板以重新排列它们。

应用布局或方形网格

是否要定义添加到画板中的设计内容的底层结构?应用布局网格。是否要了解如何在画板上布置对象或文本时快速测量并对齐设计内容?使用方形网格

布局网格

布局网格

选择一个或多个画板,然后在“属性检查器”“网格”部分中,选择“布局”

方形网格

布局网格

选择一个或多个画板,然后在“属性检查器”“网格”部分中,选择“方形”

设计画板

现在,您已创建了第一个画板,请了解如何添加视觉元素和文本元素、更改背景以及创建滚动效果。

添加视觉元素和文本元素

创建可滚动画板

添加视觉元素和文本元素

现在,基本画板已准备就绪,您可以创建或修改背景颜色、添加图形以及创建文本样式或将文本样式格式设置为可重用资源。是否要创建重复元素的可编辑网格?使用重复网格。

添加视觉元素和文本元素

添加元素

使用绘图工具创建自定义元素,或选择“文件”>“导入”从设备文件夹导入现有元素,如图像和图标。使用工具,以创建文本样式、设置文本样式格式并将文本样式捕获到可重用资源中。

要更改画板的背景颜色,请从“属性检查器”中选择“填充”,然后从拾色器应用颜色。

创建可重复元素

重复元素

使用重复网格创建具有可重复元素的对象,如列表和基于卡的布局。

创建可滚动画板

是否要在设计中添加垂直和水平滚动效果?使用滚动组为内容窗口创建原型。

是否要在桌面和移动设备上实现逼真的滚动模拟效果?在画板上设置元素的固定位置,以允许其他元素在下方滚动。

垂直滚动

虚线和可滚动的内容

要将画板扩展到视口高度以外,请使用标记。标记将指示访问内容需要滚动到的位置。

滚动时固定位置

虚线和可滚动的内容

要将设计元素钉在某个固定位置,请在“属性检查器”中选择“滚动时固定位置”

最终设计

现在,您对画板有了足够的了解,可以利用至今所学到的知识,为设计项目创建更出色的画板。

可更改

请继续操作并下载最终设计,查看设计项目的外观。

了解详情

下面是一个 4 分钟的快速入门示例视频。您还可以下载示例文件,边看视频边尝试。

示例文件

提示和技巧

现在,您已经掌握了 XD 中画板的基础知识,下面是一些实用提示和技巧:

  • 要测量对象与画板边缘之间的距离,请单击对象,然后按 Option(在 macOS 上)或 Alt(在 Windows 上)键。
  • 要在画板中关闭滚动选项,请选择画板,在“属性检查器”中,将滚动更改为

有关使用画板的更多专业技巧,请在 Twitter 上关注 XD 产品经理 @Elainecchao


接下来学什么?

我们已向您介绍如何开始创建、管理和共享画板。请进一步了解如何创建自定义画板参考线,以及如何使用网格定位画板

有疑问或想法?

询问社区

如果您有问题要问或要分享想法,欢迎加入 Adobe XD 社区。我们很乐意倾听您的心声并欣赏您的创意作品。

 Adobe

更快、更轻松地获得帮助

新用户?