Adobe XD – это универсальное решение UX / UI для разработки веб-сайтов, мобильных приложений и многого другого. Он быстро стал фаворитом среди дизайнеров UI и UX из-за его простого и интуитивно понятного интерфейса, мощных функций и низкого барьера для входа.
В этом руководстве по Adobe XD вы узнаете все, что вам нужно знать о том, как использовать Adobe XD. Мы начнем с рассмотрения основ, таких как работа с монтажными областями, фигурами и изображениями, а затем перейдем к более сложным функциям, таким как работа с активами и создание адаптивных макетов. В последней главе мы также узнаем, как создать прототип Adobe XD и как работать с автоматической анимацией Adobe XD.
Мы создали исчерпывающее руководство, которое поможет вам изучить Adobe XD, независимо от того, начинаете ли вы с UX-дизайна или хотите изучить возможности создания прототипов и совместной работы.
Введение
Adobe XD – это очень популярное приложение для дизайна пользовательского интерфейса и UX, которое позволяет без труда создавать веб-сайты, мобильные приложения, интерактивный дизайн, значки и многое другое.
Будучи таким мощным приложением, оно имеет множество функций и инструментов, поэтому для этого курса мы собираемся сделать это шаг за шагом и разбить его на три части.
Первый – все об основах. Здесь вы узнаете, как работать с монтажными областями, фигурами, текстом и изображениями.
Во второй главе мы рассмотрим некоторые более продвинутые функции XD, такие как компоненты, адаптивные макеты и плагины.
Наконец, в третьей главе мы рассмотрим функции создания прототипов XD, в том числе автоанимацию, которая является простым и мощным способом добавления анимации в прототипы Adobe XD.
Основы работы с Adobe XD
Создание и управление артбордами
Первый урок этого курса, где вы узнаете о создании и управлении артбордами в Adobe XD. Но обо всем по порядку: давайте сначала посмотрим, как вы можете загрузить Adobe XD, а затем мы кратко рассмотрим интерфейс.
Работа с линиями и фигурами
На этом уроке вы узнаете, как работать с линиями и фигурами в Adobe XD. Они, наряду с текстовым инструментом, представляют собой хлеб с маслом любого дизайна пользовательского интерфейса. Мы собираемся вдаваться в подробности, так что давайте начнем.
Работа с текстовыми элементами
На этом уроке вы узнаете, как работать с текстовыми элементами в Adobe XD. Это очень важно, потому что текст присутствует практически в каждом дизайнерском проекте, который вы будете создавать.
Импорт и редактирование изображений
На этом уроке вы узнаете, как работать с изображениями в Adobe XD. Мы будем импортировать изображения, масштабировать их, маскировать их под фигуры и играть с режимами наложения. Мы также будем загружать векторную графику из библиотек Adobe CC.
Ссылки по теме
- Unsplash Demo Image 1
- Unsplash Demo Image 2
- Unsplash Demo Image 3
- Unsplash Demo Image 4
- Unsplash Demo Image 5
Расширенная функциональность Adobe XD
Объединение форм
На этом уроке вы узнаете, как комбинировать две или более фигур в Adobe XD; это очень полезно для создания более сложных форм. Инструменты, которые мы будем использовать, общие для большинства приложений векторного дизайна, используют четыре различных метода, называемых логическими операциями.
Выравнивание объектов
В этом уроке вы узнаете о выравнивании объектов. В Adobe XD есть несколько очень умных руководств, которые всегда помогут вам выровнять положение при перемещении элементов, но есть также некоторые инструменты по требованию, которые сделают работу более точной.
Работа с активами
На этом уроке вы узнаете, как работать с ресурсами в Adobe XD. Активы – это многократно используемые фрагменты вашего проекта, которые можно классифицировать как цвета, стили символов и компоненты. Итак, давайте посмотрим, как вы можете максимально использовать их и использовать их в своих интересах.
Работа с компонентами
На этом уроке вы узнаете, как работать с компонентами в Adobe XD. Как мы рассмотрели в предыдущем уроке, компоненты составляют часть ресурсов, которые вы можете создать в XD, и представлены объектами или группами объектов, которые вы можете повторно использовать в монтажных областях. Итак, давайте посмотрим, как их создавать и управлять ими.
Ссылки по теме
Работа с сеткой повторения
Пришло время изучить что-то совершенно особенное и сэкономить время для дизайнеров пользовательского интерфейса: повторяющаяся сетка. Это уникальная особенность Adobe XD; Я не видел, чтобы это было реализовано в каком-либо другом программном обеспечении или дизайнерских приложениях. Итак, давайте сразу же посмотрим, что мы можем с этим сделать.
Адаптивный дизайн Adobe XD
На этом уроке вы узнаете, как создавать адаптивные макеты в Adobe XD. Это стало проще благодаря новой функции под названием «Отзывчивый размер».
Традиционно для создания адаптивного поведения в приложении для проектирования необходимо вручную устанавливать ограничения для объектов, чтобы при изменении их размера они соответствующим образом перемещались и изменялись. Это очень много времени.
XD теперь выполнит этот процесс автоматически для вас. Он проанализирует выбранные объекты: как они сгруппированы и как они расположены по отношению к родителю. Затем он подсчитает, какие ограничения нужно применить, чтобы вы автоматически получали подобное поведение. Давайте посмотрим на адаптивный дизайн Adobe XD в действии.
Работа с плагинами Adobe XD
На этом уроке вы узнаете, как использовать плагины в Adobe XD. Плагины – это надстройки, которые вы можете установить, и они предлагают дополнительные функциональные возможности или функции, которые не являются родными для XD.
Экспорт в Adobe XD
Давайте теперь посмотрим, как экспортировать ресурсы и монтажные области в Adobe XD. Мы также быстро коснемся экспорта в сторонние приложения, такие как Zeplin, Avocode и ProtoPie.
Создание и обмен прототипами в Adobe XD
На этом уроке вы узнаете, как создавать и делиться прототипами в Adobe XD. Это очень мощная функция, которая позволяет визуализировать, как пользователи могут воспринимать ваше приложение или веб-сайт, и демонстрировать его другим.
Работа с Adobe XD Auto-Animate
Добро пожаловать обратно на курс. В этом последнем уроке вы узнаете, как использовать функцию «автоматической анимации» в Adobe XD. С помощью автоанимации вы можете создавать иммерсивные переходы для элементов между экранами-прототипами. Итак, давайте посмотрим, как использовать автоанимацию в Adobe XD.
Скрытый контент
- Вы не зарегистрированы
- Вы не вошли как пользователь
- У Вас просрочена подписка
- Ваша подписка не даёт вам право скачивать данный раздел