Что такое экстракт
Новый Извлечение активов Особенность Photoshop CC 2014 решает форсаж на ненужном рабочем процессе создания образа для адаптивного веб-дизайна (RWD). Давайте рассмотрим, как команда Extract Assets может быстро сократить количество веб-страниц до готовых к сборке активов за пару минут.
Начнем с очевидного вопроса: что такое экстракты?
Проще говоря, Extract Assets - это новая функция в Photoshop, которая предоставляет функцию генератора Photoshop с интерфейсом, помогающим автоматизировать создание изображений для веб-дизайна и дизайна экрана из ваших файлов Photoshop. Команда Extract Assets позволяет определить, какой слой или слои вы хотите создать для своих активов, их физический размер, формат файла и сохраненное местоположение на диске. Эта функция не предназначена для текста, если не намерено превращать текст в растровое изображение, что на самом деле не очень хорошая идея.
Давайте начнем.
02 из 08Открыть файл .pdf.
Пример, который я использую, содержит Smart Object из Illustrator, некоторый текст, блок героя, содержащий текст, изображение и кнопку, а также ряд внешних изображений, которые усиливают тему сайта. Ключевым моментом здесь является организация слоев в группы. Это необходимо, потому что задача состоит в том, чтобы вытащить все эти элементы из Comp, чтобы их можно было быстро добавить в макеты веб-сайтов, которые адаптируются к различным разрешениям экрана и размерам экрана.
Два способа извлечения активов
В отличие от Generate, который также извлекает объекты путем добавления графического расширения к имени слоя, Извлечение активов использует интерфейс, к которому можно щелкнув правой кнопкой мыши слой или выбор слоя и выборФайл> Извлечь активы.
04 из 08Интерфейс Extract Assets
Диалоговое окно Extract Assets достаточно интуитивное. Вам будет показан слой или выделение, которое нужно извлечь. Над ним отображается размер файлов, а ниже - элемент управления, который позволяет вам увеличивать и уменьшать масштаб объекта. Правая сторона диалогового окна - это место, где происходит волшебство. Четыре кнопки в верхней части позволяют выбрать разрешение / размер объекта. Следующая полоса показывает выбранный слой и + sign позволяет вывести выделенный слой в другом формате. Trash Ca n удаляет слой из очереди. В следующей полосе вниз вы можете выбрать тип файла, и вы можете настроить ширину и высоту выходного изображения.
05 из 08Извлечение изображения SVG
Photoshop не обрабатывает все изображения svg, и браузеры и устройства не могут отображать изображение Illustrator. Это привело к появлению svg-файлов, используемых для векторных иллюстраций, таких как логотип Illustrator, показанный здесь. Будучи векторами, их разрешение является независимым от устройства, что позволяет масштабировать их без потери деталей или изображения. Чтобы преобразовать интеллектуальный объект Illustrator в svg, выберите SVG от всплывающего окна и нажмите экстракт.
06 из 08Процесс извлечения ресурсов
При нажатии кнопки «Извлечь» произойдет несколько вещей. Сначала вы будете предупреждены, что имя файла может измениться. Это не большая проблема. Затем вам будет рассказано, что создается новая папка для хранения актива. Как только процесс завершится, откроется папка, расположенная в том же месте, что и исходный .psd-файл, и покажет вам новый актив.
07 из 08Кнопка «Настройки» - ваш новый лучший друг
Нажмите настройки кнопка открывает Диалоговое окно настроек это очень полезно. Параметры слева - это коэффициенты масштабирования. То, что они делают, это создание различных копий изображения, которое разработчик будет использовать в медиа-запросах для таргетинга на разрешение конкретного устройства. Например, версия 3x будет нацелена на дисплей Retina для iPhone или iPad, тогда как на Android-устройстве будет указан коэффициент 1,25. Суффикс добавляется в конец имени файла, чтобы ваш разработчик мог легко идентифицировать изображение, которое будет использоваться в медиа-запросе. Когда вы закончите, нажмите Хорошо и ваши параметры загорятся в области «Извлечь активы» в диалоговом окне. Вы также можете получить доступ к настройке, щелкнув значок шестеренки в области «Извлечь активы» в правой части интерфейса
08 из 08Заканчивать
Когда вы нажмете кнопку «Извлечь», все активы будут созданы и добавлены в папку. На этом этапе вам нужно только отправить разработчику копию папки и перейти к следующему проекту.
