Adobe XD

Для чего нужен Adobe XD

Программа нужна для того, чтобы:

• создавать прототипы дизайна. В Adobe XD можно с нуля создавать вайрфреймы и красивые дизайны веб-страниц, онлайн-сервисов, приложений и многого другого. Для этого используются векторные инструменты, такие как фигуры, линии, кривые, текст, а также растровые элементы: фотографии, иллюстрации и др. В Adobe XD можно импортировать файлы из Photoshop, Illustrator, что еще больше расширяет возможности программы;
• прототипировать интерактивность и анимацию дизайнов. Дизайн-макеты можно сделать живыми и реалистичными: создавать переходы между окнами и страницами, добавлять триггеры и другие элементы. С помощью Adobe XD вы также можете проверять свои прототипы на разных устройствах и разрешениях;
• делиться своей работой с другими людьми. Программа позволяет выгружать свои дизайны в разных форматах (PNG, JPG, SVG и др.), а также создавать ссылки для онлайн-просмотра, комментирования и редактирования. Дизайнер может сотрудничать с другими специалистами в режиме реального времени, используя функцию совместной работы, а еще получать обратную связь насчет удобства продукта от других пользователей, что очень важно в сфере UX.

Кто и для чего может пользоваться Adobe XD

Программа подойдет любому, кто хочет создавать красивые и функциональные дизайны для самых разных онлайн-продуктов. Вот несколько групп специалистов, которые чаще всего применяют Adobe XD.

UX-аналитики. Они изучают, как юзеры взаимодействуют с сайтами и приложениями, и создают интерфейсы, удобные для аудитории и обеспечивающие высокую конверсию своим владельцам. В Adobe XD аналитики могут создавать прототипы, а затем тестировать их на целевой аудитории. 

UI/UX-дизайнеры. Они рисуют дизайн в Adobe XD, а затем нередко анимируют его, чтобы создавать максимально реалистичные визуальные концепции. UI/UX-дизайнеры могут также получать обратную связь от своих клиентов или коллег, используя функцию совместной работы или создавая ссылки для онлайн-просмотра. 

Разработчики. Думаете, что они только пишут код? Вовсе нет. Часто разработчики работают с визуализациями тех или иных сервисов, чтобы упростить свою работу. Например, они могут экспортировать ресурсы из Adobe XD или получить код CSS для стилизации кнопок и окон. 

Проджект-менеджеры. Они могут использовать Adobe XD для координации и контроля работы дизайнеров и разработчиков: следить за ходом проекта, просматривать и комментировать дизайны и прототипы.

Возможности Adobe XD

Базовые функции — это те возможности Adobe XD, которые позволяют создавать и редактировать дизайны и прототипы. Вот некоторые из них.

Создание нового проекта. Вы можете выбрать размер и ориентацию холста, тип устройства, для которого вы создаете визуализацию (например, iPhone X или iPad Pro).

Артборды. Это отдельные страницы, «холсты», на которых вы размещаете свои элементы дизайна. Вы можете добавлять, удалять, копировать, перемещать и изменять размер артбордов, а также группировать их по разным категориям (например, сгруппировать артборды для главного экрана, меню, настроек и т.д.).

Инструменты рисования. Это кисти, фигуры, изображения и другие инструменты, с помощью которых создаются элементы интерфейса будущего продукта. У них можно менять цвет, размер, форму, стиль и другие свойства, выравнивать и распределять их на холсте.

Слои. Хорошо знакомый инструмент для всех, кто работает с Adobe Photoshop. Создавая дизайны в Adobe XD, вы можете добавлять, удалять, переименовывать, скрывать и показывать слои, а также изменять их порядок, видимость и создавать компоненты из слоев, чтобы многократно использовать их в разных местах проекта. 

Прототипирование. В Adobe XD это слово означает не совсем то, что в индустрии в целом. Здесь прототипирование — это добавление интерактивности и анимации к дизайнам. Вы можете создавать связи между разными артбордами или элементами на них (например, задавать переход на конкретную страницу по клику на кнопку), а также настраивать триггеры, действия и другие параметры для этих связей.

Список функций впечатляет, не правда ли? Но это еще не все. В Adobe XD есть ряд уникальных возможностей и фишек, которые отличают эту программу от других. 

Режим Repeat Grid. Это функция позволяет быстро создавать и редактировать сетки из повторяющихся списков, карточек, галерей и т.д. Это своего рода шаблоны для элементов, которые могут часто встречаться в вашем проекте: для интернет-магазинов это могут быть мини-карточки товаров в каталогах или параметры в фильтрах, для сайтов услуг — фотогалереи готовых работ или отзывов от клиентов и т.д.

Режим 3D Transforms. Эта функция позволяет применять 3D-эффекты к прототипам и дизайнам: создавать эффект перспективы, тени, отражения и др. В частности, такие дизайнерские ходы очень часто используются для анимации интерфейсов в мобильных приложениях.

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

Режим Coediting. Это функция, позволяющая команде совместно работать над одним проектом в режиме реального времени: добавлять, изменять и удалять элементы, оставлять комментарии и вопросы, видеть все изменения других пользователей на холсте.

Где скачать и сколько стоит Adobe XD

Приобрести программу, если вы находитесь в России или Белоруссии, сейчас не получится. Однако если вы живете в других странах СНГ или иных зарубежных государствах, проблем быть не должно. Тем не менее перед установкой программы рекомендуем вам внимательно прочитать условия ее использования на официальном сайте — все быстро меняется, поэтому информация из этого блока может устареть для вашего региона. 

Чтобы пользоваться Adobe XD, вам нужно иметь учетную запись Adobe ID и подписку на Creative Cloud. Для начала можно воспользоваться ограниченной по времени и функционалу пробной версией. Но для полноценного длительного использования понадобится подписка на Creative Cloud All Apps. Она дает вам доступ к более чем 20 приложениям Adobe, включая Photoshop, Illustrator, After Effects и другие, и стоит $54.99 в месяц или $599.88 в год. Это самый выгодный вариант, если вы зарабатываете с помощью дизайна и при этом применяете другие программы компании.

Плюсы и минусы Adobe XD

Как и у любого другого графического редактора, у Adobe XD есть плюсы и минусы. 

Преимущества Adobe XD:

• Простота и удобство использования. Adobe XD имеет чистый и интуитивно понятный интерфейс, который легко освоить даже начинающему пользователю. Программа лишена многих недостатков продуктов Adobe, связанных с перегруженностью интерфейса элементами.
• Интеграция с другими продуктами Adobe. Как ни крути, а программы от этой компании — это все еще золотой стандарт в сфере работы с графикой и видео. Adobe XD позволяет легко импортировать и экспортировать проекты в разных форматах, таких как PSD, AI, PDF и других, а также синхронизировать их с Photoshop, Illustrator, After Effects и т.д. 
• Возможности для коллаборации. В Adobe XD команда проекта может совместно работать над одним и тем же дизайном, что помогает всем быть в курсе процесса, быстро получать и реализовывать правки от заказчика и любых заинтересованных сторон.

Недостатки Adobe XD:

• Мало функций по сравнению с конкурентами. Сейчас программа обновляется не очень регулярно, так как это не приоритетный продукт для компании-создателя. Конкуренты чаще добавляют новые возможности, которыми не может похвастаться Adobe XD.
• Нестабильность работы на некоторых устройствах и платформах. Судя по отзывам, ряд пользователей жалуются на то, что Adobe XD иногда зависает, вылетает или работает медленно на некоторых устройствах или платформах, особенно на ряде версий Windows и Android. Программа требует достаточно много ресурсов для работы и не всегда хорошо оптимизирована для разных разрешений экрана или версий ОС.
• Высокая стоимость подписки для коммерческого использования. Бесплатная версия Adobe XD имеет ограничения по количеству проектов, артбордов и т.д. Она не подойдет для выполнения коммерческих задач — понадобится специальная версия, которая стоит довольно дорого и может не окупиться.

Аналоги Adobe XD

Не страшно, если вы по какой-либо причине не можете использовать Adobe XD. Существуют и другие программы для дизайна и прототипирования с похожим функционалом и собственными преимуществами. Вот некоторые из них. InVision Studio — это один из лучших аналогов Adobe XD, который позволяет создавать интерактивные прототипы, анимации и дизайн-системы, получать обратную связь, совместно работать с другими дизайнерами и разработчиками, а также интегрироваться с другими популярными инструментами, такими как Sketch, Photoshop, Illustrator и др.

Figma — это кроссплатформенный коллаборативный векторный редактор, который работает и в формате приложения на компьютере, и в браузере. Figma предлагает множество функций для дизайна, прототипирования и совместной работы. Например, в ней довольно простой и удобный механизм создания переходов между страницами и окнами на прототипе.

Sketch — один из самых популярных инструментов для дизайна интерфейсов, который работает только на компьютерах Mac. В программе можно создавать практически все элементы дизайна с нуля: иконки, кнопки, логотипы, меню, поля и окна форм, блоки с фото и многое другое. У Sketch также есть большая библиотека плагинов, которые расширяют его возможности.

UXPin — это менее известное, но весьма функциональное и полезное для разработчиков приложение, позволяющее создавать реалистичные прототипы и дизайн-макеты, используя HTML, CSS, JavaScript и другие технологии. Программа позволяет импортировать свои дизайны из Sketch или Photoshop, что ускоряет создание готового продукта.