在 Sketch 中选择一个或多个图层或组,然后单击“制作可导出内容”。
- Adobe XD 用户指南
- 简介
- 设计
- 画板、参考线和图层
- 形状、对象和路径
- 文本和字体
- 组件和状态
- 蒙版和效果
- 版面
- 视频和 Lottie 动画
- 原型
- 共享、导出和审阅
- 设计系统
- 云文档
- 集成和插件
- iOS 和 Android 版 XD
- 故障排除
- 已知问题和已修复问题
- 安装和更新
- 启动和崩溃
- 云文档和 Creative Cloud Libraries
- 创建原型、发布和预览
- 导入、导出和使用其他应用程序
了解如何将资源从 Photoshop、Illustrator、Sketch 和 Web 浏览器导入 Adobe XD 中,以及如何将资源导出到 After Effects。
您可以将资源从 Adobe 应用程序(例如 Photoshop 和 Illustrator)、第三方应用程序(如 Sketch)和 Web 浏览器导入 XD 中。在 XD 中改进这些资源,或者使用它们开发交互式原型。您也可以将资源从 XD 导出到 After Effects 以进一步改进它们。
您可以根据应用程序以多种方式使用外部资源:
如果要将 Photoshop 和 Illustrator 文件转换为 XD 文件,请使用“打开”。如果要将这些文件的内容添加到现有 XD 文件中,请使用“导入”。
使用 Photoshop
您可以使用以下任意方法将 Photoshop 资源导入 XD:
- 通过选择文件 > 打开,直接在 XD 中打开 .psd 文件。然后,即可在 XD 中编辑该文件(如同其他任何 XD 文件一样)、为交互连线以及以原型或设计规范的形式进行共享。
- 通过选择文件 > 导入将 .psd 文件导入 XD 中。
- 从 Photoshop 中复制位图和矢量内容,并将其粘贴到 XD 中。
- 将 Photoshop 资源从“资料库”面板中拖放到 XD 画布上。如需更多信息,请参阅 Adobe XD 中的 Creative Cloud Libraries。
将 .psd 文件复制到操作系统剪贴板并使用“粘贴外观”选项,将图像直接粘贴为图像填充。
如需更多信息,请参阅使用 Photoshop 中的设计资源。
从 Photoshop 中复制和粘贴 SVG
如需从 Photoshop 中复制和粘贴 SVG,请在 Photoshop 中右键单击形状图层或矢量图层,单击“复制 SVG”,并将其粘贴到 XD 中。
从 Illustrator 导入资源
您可以在 XD 中打开 Illustrator 文件,也可导入它们。
您还可以从 Adobe Illustrator 复制矢量图和位图图像并将其粘贴到 XD 中,此时将保留与打开或导入 Illustrator 文件时相同的保真度和可编辑性。Illustrator 文件放在打开的文档中,而不是作为单独的文档打开。智能对象作为展开图层而不是位图导入,并且调整图层会得到保留。但是,您无法将 Illustrator 画板复制并粘贴到 XD。
您也可以将矢量文件复制到操作系统剪贴板并使用“粘贴外观”选项,将图像直接粘贴为图像填充。
您还可以通过将资源从“资料库”面板拖放到 XD 画布中,来将存储在 Creative Cloud Libraries 中的 Adobe Illustrator 资源导入 XD。如需更多信息,请参阅 Adobe XD 中的 Creative Cloud Libraries。
从 XD 将 SVG 复制和粘贴到 Illustrator
如今,您可以将 XD 矢量内容复制到剪贴板,然后将其作为完全可编辑图层粘贴到 Adobe Illustrator 中。
如需将任何内容从 XD 复制并粘贴到 Illustrator,可执行如下操作:
1. 在 XD 中右键单击形状图层或矢量图层,然后从上下文菜单中选择复制。
2. 在 Adobe Illustrator 中,依次选择“编辑”>“粘贴”,以粘贴矢量内容。
在 XD 中打开 Illustrator 文件
您可以直接在 XD 中打开 Illustrator (.ai) 文件,并将其转换为 XD 文件。打开文件后,您可以在 XD 中进行编辑,通过连线构建交互,并以原型或设计规范的形式进行共享。
如需在 XD 中打开 Illustrator 文件,请执行以下操作:
- 在 XD 中,选择“文件”>“打开”。导航至所需的文件夹,选择 一个 .ai 文件,并在 XD 中打开。您也可以使用 Cmd+O (Mac) 或 Ctrl+O (Windows) 键盘快捷键。
- 要在 XD(仅限 Mac)中打开文件,请将 Ai 文件拖动到 XD 图标上。
- 右键单击 Illustrator 文件并从子菜单中选择“打开方式”>“XD”。
在 XD 中打开 Illustrator 文件时,并非所有元素都能完全保持其保真度。如需查看受支持和不受支持的元素的列表,请参阅在 XD 中打开 Illustrator 文件时受支持的元素。
导入 Illustrator 文件
要将 Illustrator 文件导入到 XD 中,请选择“文件”>“导入”。如果导入的 Illustrator 文件具有画板,这些画板将放在 XD 画板之下。如果 XD 画板下方没有空间,则导入的画板将放在可用空间中。如果导入的文件没有画板,其资源放在画布的中心。如果导入的文件没有画板,其资源放在画布的中心。
从 Sketch 导入资源
- 您可以直接在 XD 中打开 .sketch 文件。然后,即可在 XD 中编辑该文件(如同其他任何 XD 文件一样)、为交互连线以及以原型或设计规范的形式进行共享。如需更多信息,请参阅在 XD 中打开 Sketch 文件。
- 您也可以从 Sketch 中复制资源,并将其粘贴到 XD 中。如需更多信息,请参阅从 Sketch 导入选定的资源。
- 您也可以直接从 Sketch 中将资源复制并粘贴到 XD 中,这样资源在 XD 中仍是可编辑的。
- 您也可以将 Sketch 文件复制到操作系统剪贴板并使用“粘贴外观”选项,将图像直接粘贴为图像填充。
- 您可以将 Sketch 内容转换为 XD 设计系统。有关详细信息,请参阅转换 Sketch 库。
在 XD 中打开 Sketch 文件
您可以直接在 XD 中打开 Sketch (.sketch) 文件,并将其转换为 XD 文件。打开文件后,您可以在 XD 中进行编辑,通过连线构建交互,并以原型或设计规范的形式进行共享。
您只能打开使用 Sketch 版本 43 或更新版本创建的 Sketch 文件。如果您拥有较旧的文件,请使用最新版本的 Sketch 保存该文件,然后在 XD 中打开该文件。
如需在 XD 中打开 Sketch 文件,请执行以下操作之一:
- 单击“文件”>“打开”。导航到所需的文件夹,选择 .sketch 文件,然后在 XD 中将其打开。
- 将 Sketch 文件拖放到 XD 图标上,即可在 XD 中打开文件(仅限 Mac)。
- 右键单击 Sketch 文件,并从上下文菜单中选择“打开方式”>“XD”。
您也可以使用 Cmd+O (Mac) 或 Ctrl+O (Windows) 键盘快捷键。
在 XD 中打开 Sketch 文件时,并非所有元素都能完全保持其保真度。如需查看受支持和不受支持的元素的列表,请参阅在 XD 中打开 Sketch 文件时受支持的元素。
从 Sketch 导入选定的资源
-
-
选择 SVG 作为格式,然后将该图层从 Sketch 拖到 XD 中。
内容将以可编辑的矢量内容的形式插入到 XD 中。
将 Sketch 库转换为 XD 设计系统
现在,您可以将 Sketch 内容移到 XD 中,然后继续在设计系统上工作。您不仅可以将 Sketch 符号和元素转换为 XD 组件,而且还可以将它们作为链接资源使用。
- 在 XD 中打开设计系统。
- 在资源面板上,单击链接资源。如果“资源”面板中存在现有的资源,请单击加号图标 (+)。
- 在链接资源窗口中,选择转换 Sketch 库,然后从文件选择器中选择 Sketch 文件。XD 转换源 Sketch 文档,自动将其保存为云文档,并将颜色、字符样式和组件链接到您的 XD 文档。
- 如果您有多个必须使用的 Sketch 库,请在“资源”面板中单击加号图标,然后重新导入其他 Sketch 库。
Sketch 库和组件
在 XD 中处理组件时,请使用以下准则:
- 将转换的组件拖到画板上。
- 如需编辑源组件,请单击组件实例,右键单击并选择在源文档中编辑主组件。
- 如需编辑资源,请从“资源”面板中选择资源。
- 应用更改后,切换到您在处理的文档。
- 单击“更新”以接受更改。
如需更多信息,请参阅在 XD 中使用组件。
了解详情
观看此动画演示,了解有关将 Sketch 库转换为 XD 设计系统的更多信息。
观看时长:30 秒。
从 Web 浏览器导入资源
您可以从所有新式 Web 浏览器中直接将图像拖放到画板上。您也可以将图像拖放到画板上的对象中,在这种情况下,系统会自动调整图像大小,使之适应对象。
您也可以将图像复制到操作系统剪贴板并使用“粘贴外观”选项,将图像直接粘贴为图像填充。
导入其他文件
导出到 After Effects
从 XD 中,您只能导出到 After Effects 2018 及更高版本。如果您安装的是旧版本,则将禁用“导出到 After Effects”选项。要启用此选项,请登录 Creative Cloud 桌面应用程序,并将 After Effects 更新到最新版本。
如果您想使用 After Effects 将 XD 设计转换为自定义动画或微互动,请执行以下操作:
- 在 XD 中,选择要在 After Effects 中设置动画的图层或画板。
- 选择“文件”>“导出”>“After Effects”。如果计算机上未安装 After Effects,则此选项灰显。您也可以使用 Cmd+F (Mac) 或 Ctrl+Alt+F (Windows) 键盘快捷键。After Effects 启动(如果已关闭)或移至前台(如果在后台运行)。
- 选定的图层或画板将作为原生形状、包含段落间距的文本、资源、内外描边和嵌套合成转移到 After Effects 项目中。您可以对同一个 After Effects 项目执行多个资源传输,并分阶段或从多个 XD 文件创建动画。
当把 XD 内容导出到 After Effects 时,并非所有元素都能完全保持其保真度。如需受支持和不受支持元素的列表,请参阅将 XD 文件导出到 After Effects 时支持的功能。
导入和导出限制
要了解导入和导出限制,请参阅为什么我无法在 Adobe XD 中导入或导出文件?