上次更新日期:
2022年2月25日
- Adobe XD 用户指南
- 简介
- 设计
- 画板、参考线和图层
- 形状、对象和路径
- 文本和字体
- 组件和状态
- 蒙版和效果
- 版面
- 视频和 Lottie 动画
- 原型
- 共享、导出和审阅
- 设计系统
- 云文档
- 集成和插件
- iOS 和 Android 版 XD
- 故障排除
- 已知问题和已修复问题
- 安装和更新
- 启动和崩溃
- 云文档和 Creative Cloud Libraries
- 创建原型、发布和预览
- 导入、导出和使用其他应用程序
了解如何使用自动制作动画来创建微交互。
借助自动制作动画功能,您可以创建沉浸式过渡,以便呈现内容在画板之间的移动。
它同时提供“拖动”和“时间”触发器的功能,可以帮助您创建各种效果(例如 YouTube 滑动和拖动效果),以便您更好地讲述原型故事。
要创建动画原型,请按照下列步骤操作:
-
-
在原型模式下连接画板。
-
单击连接器以查看“属性检查器”中显示的交互面板,并设置以下选项:
- 触发器:选择一个选项以触发动画。例如,要模拟点击卡体验,请选择“点击”。
- 操作:选择“自动制作动画”。 您现在可以在单个触发器中分配两个操作,如点击。要进行这一操作,请将“属性检查器”中的第一个“操作 +”按钮设置为“过渡”、“自动制作动画”、“叠加”、“滚动至”或“上一个画板”,然后将第二个“操作 +”按钮设置为非过渡性操作,例如“音频播放”或“语音播放”。 请注意,如果选择“音频播放”或“语音播放”作为第一个操作,则无法添加第二个操作。
- 目标:选择目标画板以过渡动画。
- 缓动:选择一个选项来模拟缓动效果。例如,如果您希望自己的动画实现从原型渐出的效果,请选择“渐出”。
A. 选择触发器类型 B. 选择要自动制作动画的操作 C. 选择目标画板 D. 选择缓动效果
-
在受支持的浏览器中选择 “预览动画”。
请记住,在预览通过自动制作动画功能制作的画板时,XD 不支持滚动。
示例和示例文件
想了解自动制作动画的具体细节吗?开始使用此 UI 套件,它提供基本的交互、UI 元素、拖动示例等等。
您也可以使用更多这样的示例文件,试验自动制作动画功能。
希望实现 YouTube 滑动效果而不必费力地使用时间线和关键帧?
连接画板并在“属性检查器”原型中选择以下选项:
- 触发器:选择“拖动”。
- 操作:选择“自动制作动画”。
- 目标:选择目标画板以创建动画过渡效果。
- 缓动:选择一个选项来创建缓动效果。例如,选择“渐入渐出”可实现从原型渐入渐出的动画效果。
请下载示例文件并亲自尝试,或者观看本视频以了解更多信息。
观看时长:1 分钟。
希望了解如何使用渐入效果创建动画移动菜单?
- 下载示例文件。
- 在原型模式下,将汉堡菜单连接到 home_expanded 画板,然后在“属性检查器”原型中选择以下选项:
- 触发器:选择“点击”。
- 操作:选择“自动制作动画”。
- 目标:选择目标画板以创建动画过渡效果。
- 缓动:选择“渐入”效果。
- 持续时间:将持续时间选择为 0.8 秒。
希望向您的设计中添加高级动画?观看此视频以使用 After-Effects。
从 Adobe XD 导入 After-Effects(观看时长:1 分钟)
了解详情
要了解有关 XD 中的自动制作动画的更多信息,请观看此视频。
观看时长:6 分钟