Экспорт ресурсов дизайна

Вы можете экспортировать ресурсы, такие как растровые изображения, значки и фоновые рисунки, текст и монтажные области из XD в форматах PNG, SVG, JPG и PDF. Эти экспортированные ресурсы оптимизированы для развертывания в iOS, Android или в веб-приложениях.

Если вы используете XD на macOS, вы также можете добавить свои проекты в сторонние среды, например Zeplin, Avocode, Sympli, Kite Compositor и Protopie.

Выбор ресурсов и монтажных областей для экспорта

• Пакетная обработка. Вы можете выполнить пакетную обработку ресурсов для экспорта, отмеченных с помощью параметра Отметить для экспорта в инспекторе свойств. Чтобы экспортировать несколько объектов как один ресурс, сгруппируйте эти объекты перед экспортом.
• Выбрано. Вы можете выбирать и экспортировать отдельные ресурсы.
• Все монтажные области. Вы можете выбрать все монтажные области для экспорта из проекта дизайна.
• After Effects. Вы можете выбрать ресурс для экспорта в After Effects.

Пометка слоев для экспорта

Слои, помеченные для экспорта, включены в спецификации дизайна как ресурсы. Чтобы пометить ресурсы для экспорта, выберите любой слой на холсте и выполните одно из следующих действий: 

• Нажмите правой кнопкой мыши на слой на холсте и выберите «Пометить для экспорта» из выпадающего списка. 
• Откройте панель слоев и щелкните значок отметки для экспорта  рядом с названием слоя. 

Экспорт ресурсов в различных форматах файла

Ресурсы — это файлы дизайна, которые требуются разработчикам, чтобы воссоздать продукт вашего дизайна с помощью HTML/CSS/JS на веб-сайте или с помощью языков Swift или Java в приложениях для iOS и Android.

В общем, наиболее распространенными ресурсами являются растровые изображения, значки и фоновые узоры, которые можно экспортировать в следующих форматах: PNG, SVG, PDF и JPG. 

С версии XD 57 Adobe улучшила функциональность управления цветом в XD, позволяя экспортировать ресурсы JPG, PNG и PDF с согласованной цветопередачей.Для получения такого результата переключите цветовой профиль документа на sRGB. Если вы попытаетесь экспортировать ресурс из документа с неизменяемым цветовым профилем, вы получите сообщение о возможном несоответствии цвета в экспортированном ресурсе. Дополнительные сведения см. в разделе Управление цветом.

Экспорт в формате PNG

Выберите размер стандартного или установленного для платформы экспорта или настройте размер экспорта описанным ниже образом.

• Предустановленный или стандартный размер экспорта. Выберите один из предустановленных размеров экспорта: 0,5x, 1x, 1,5x, 2x, 3x, 4x. Кроме того, вы можете ввести размер экспорта от 0,1x до 10х.
• Интернет — ресурсы экспортируются с разрешением 1x и 2x.
• iOS — ресурсы экспортируются с разрешением 1x, 2x и 3x.
  
• Android — ресурсы дизайна оптимизируются и экспортируются для следующих значений плотности экрана Android.
  • ldpi — низкая плотность (75 %)
  • mdpi — средняя плотность (100 %)
  • hdpi — высокая плотность (150 %)
  • xhdpi — сверхвысокая плотность (200 %)
  • xxhdpi — сверхвысокая плотность плюс (300 %)
  • xxxhdpi — сверхвысокая плотность плюс плюс (400 %)

Экспорт в формате SVG

Когда вы экспортируете объекты или монтажные области как SVG, вы можете установить параметры, описанные ниже.

Визуальное оформление

• Атрибуты представления. Используются отдельные атрибуты XML для каждого отдельного свойства стиля в каждом теге SVG. Этот формат нужен для использования ресурсов SVG в Android Studio.
• Внутренние таблицы CSS. С классами CSS применяется один тег стиля, и для объектов с одним и тем же стилем используются одинаковые настройки стиля, что позволяет уменьшить размер файлов.

Встроенные или связанные изображения

• Встроить. Растровое изображение кодируется в файл SVG.
• Связать. Растровое изображение хранится отдельно со ссылкой на файл SVG.

Экспорт в формате PDF

Экспортировать ресурсы как файлы PDF можно способами, описанными ниже.

• Единый PDF-файл: можно выбрать несколько монтажных областей или ресурсов и экспортировать их как единый PDF-файл. 
• Несколько файлов PDF. Вы можете выбирать несколько монтажных областей или ресурсов и экспортировать их в качестве отдельных файлов PDF. Отдельные файлы PDF создаются для каждого из выбранных ресурсов или монтажных областей.

Экспорт в формате JPG

Когда вы экспортируете ресурсы как файлы JPG, вы можете установить параметры, описанные ниже.

Качество: 20 %, 40 %, 60 %, 80 % или 100 %.

Размер для экспорта

• Предустановленный или стандартный размер экспорта. Выберите один из предустановленных размеров экспорта: 0,5x, 1x, 1,5x, 2x, 3x, 4x. Кроме того, вы можете ввести размер экспорта от 0,1x до 10х.
• Интернет — ресурсы экспортируются с разрешением 1x и 2x.

Файлы JPG не преобразуются в PDF.Растровые изображения импортируются как изображения, поэтому кажется, что они превращаются в PDF.

Экспорт ресурсов в сторонние приложения

Вы также можете перенести свои проекты из XD в другие приложения, такие как Zeplin, Avocode, Sympli, Kite Compositor и Protopie. 

Вот пример технологического процесса XD на macOS с Zeplin:

Устранение неполадок

Возникли проблемы с экспортом ресурсов? Чтобы исправить проблемы, связанные с экспортом, см. Почему у меня не получается импортировать или экспортировать файлы в Adobe XD?

Есть вопрос или идея?