Как создать маску в adobe xd: Узнайте, как создать маску с фигурами.

Узнайте, как создать маску с фигурами.

Руководство пользователя Отмена

Поиск

Последнее обновление Feb 21, 2023 05:20:06 PM GMT

1. Руководство пользователя Adobe XD
   
2. Введение
   1. Новые возможности Adobe XD
   2. Распространенные вопросы
   3. Создание дизайна, прототипов и совместная работа в Adobe XD
   4. Системные требования
      1. Требования к оборудованию и программному обеспечению
      2. Adobe XD, Big Sur и Apple Silicon | macOS 11
   5. Основные сведения о рабочей среде
   6. Изменение языка приложения в Adobe XD
   7. Доступ к наборам для дизайна пользовательского интерфейса
   8. Доступность в Adobe XD
   9. Сочетания клавиш
   10. Советы и рекомендации
3. Дизайн
   1. Монтажные области, направляющие и слои
      1. Начало работы с монтажными областями
      2. Использование направляющих и сеток
      3. Создание прокручиваемых монтажных областей
      4. Работа со слоями
      5. Создание групп прокрутки
   2. Фигуры, объекты и путь
      1. Выделение, изменение размера и поворот объектов
      2. Перемещение, выравнивание, распределение и упорядочивание объектов
      3. Группирование, блокирование, дублирование, копирование и зеркальное отражение объектов
      4. Задание обводки, заливки и теней для объектов
      5. Создание повторяющихся элементов
      6. Создание перспективных проектов с помощью 3D-преобразований
      7. Редактирование объектов с помощью логических операций
   3. Текст и шрифты
      1. Работа с инструментами для рисования и создания текста
      2. Шрифты в Adobe XD
   4. Компоненты и состояния
      1. Работа с компонентами
      2. Работа с вложенными компонентами
         
      3. Добавление нескольких состояний для компонентов
   5. Маскировка и эффекты
      1. Создание маски с фигурами
      2. Работа с эффектами размытия
      3. Создание и изменение градиентов
      4. Применение эффектов наложения
   6. Макет
      1. Адаптивное изменение размера и ограничения
      2. Установка фиксированного отступа для компонентов и групп
      3. Создание динамичных проектов с подборками
   7. Видео и анимации Lottie
      
      1. Работа с видео
      2. Создание прототипов при помощи видео
      3. Работа с анимацией Lottie
4. Создание прототипа
   1. Создание интерактивных прототипов
   2. Анимирование прототипов
   3. Свойства объекта, которые поддерживаются при автоматическом анимировании
   4. Создание прототипов с клавиатуры и геймпада
   5. Создание прототипов с помощью голосовых команд и воспроизведения
   6. Создание синхронизированных переходов
   7. Добавление наложений
   8. Создание голосовых прототипов
   9. Создание якорных ссылок
   10. Создание гиперссылок
   11. Предварительный просмотр проектов и прототипов
5. Публикация, экспорт и проверка
   1. Публикация выбранных монтажных областей
   2. Предоставление совместного доступа к проектам и прототипам
   3. Настройка разрешений на доступ к ссылкам
   4. Работа с прототипами
      
   5. Просмотр прототипов
      
   6. Работа со спецификациями дизайна
   7. Предоставление общего доступа к спецификациям дизайна
   8. Проверка спецификаций дизайна
   9. Навигация в спецификациях дизайна
   10. Проверка и комментирование спецификаций дизайна
   11. Экспорт ресурсов дизайна
   12. Экспорт и загрузка ресурсов из спецификаций дизайна
   13. Корпоративный групповой совместный доступ
   14. Резервное копирование или перенос ресурсов XD
6. Системы дизайна
   1. Системы дизайна с библиотеками Creative Cloud Libraries
   2. Работа с ресурсами документа в Adobe XD
   3. Работа с библиотеками Creative Cloud Libraries в Adobe XD
   4. Переход от связанных ресурсов к библиотекам Creative Cloud Libraries
   5. Работа с проектными токенами 
   6. Использование ресурсов из библиотек Creative Cloud Libraries
7. Облачные документы
   1. Облачные документы в Adobe XD
   2. Совместная работа и совместное редактирование проектов
   3. Совместное редактирование документов, к которым вам предоставили доступ
8. Интеграция и плагины
   1. Работа с внешними ресурсами
   2. Работа с ресурсами проекта из Photoshop
   3. Копирование ресурсов из Photoshop
   4. Как импортировать или открыть проекты Photoshop
   5. Работа с ресурсами Illustrator в Adobe XD
   6. Импортирование и открытие проектов Illustrator
   7. Копирование векторных объектов из Illustrator в XD
   8. Плагины для Adobe XD
      
   9. Создание плагинов и управление ими
   10. Интеграция Jira с XD
   11. Подключаемый модуль Slack для XD
   12. Подключаемый модуль Zoom для XD
   13. Публикация работы из XD на Behance
9. XD для iOS и Android
   1. Предварительный просмотр на мобильных устройствах
   2. Часто задаваемые вопросы по Adobe XD для мобильных устройств
10. Устранение неполадок
    1. Выявленные неполадки и исправленные ошибки
       1. Выявленные неполадки
       2. Исправленные неполадки
    2. Установка и обновления
       1. XD отображается как несовместимый в Windows
       2. Код ошибки 191
       3. Код ошибки 183
       4. Проблемы при установке плагинов XD
       5.  Запрос на удаление и переустановку XD в Windows 10
       6. Проблемы с миграцией предпочтений
    3. Запуск и сбой
       1.  XD аварийно завершает работу при запуске в Windows 10
       2.  XD закрывается при выходе из Creative Cloud
       3. Проблема со статусом подписки в Windows
       4. Предупреждение о заблокированном приложении при запуске XD в Windows
       5. Создание аварийного дампа в Windows
       6. Сбор и отправка журнала сбоев
    4. Облачные документы и библиотеки Creative Cloud Libraries
       1. Проблемы с облачными документами XD
       2. Проблемы со связанными компонентами
       3. Проблемы с библиотеками и ссылками
    5. Прототип, публикация и обзор
       1. Не удается записать взаимодействия прототипов в macOS Catalina
       2. Проблемы с процессами публикации
       3. Опубликованные ссылки не отображаются в браузерах
       4. Прототипы некорректно отображаются в браузерах
       5. На общих ссылках внезапно появляется панель комментариев
       6. Невозможно опубликовать библиотеки
    6. Импорт, экспорт и работа с другими приложениями
       1. Импорт и экспорт в XD
       2. Файлы Photoshop в XD
       3. Файлы Illustrator в XD
       4. Экспорт из XD в After Effects
       5. Файлы Sketch в XD
       6. В разделе экспорта не представлены сторонние приложения

Узнайте, как создать маску с фигурами.

Используйте маски, чтобы обрезать части изображений или объектов и создавать результаты с фокусом на определенных элементах в ваших проектах. 

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

Хотите узнать, как создать, отредактировать или удалить эффект маски? выполните следующие действия.

1. Нарисуйте фигуру, которую вы хотите использовать в качестве маски, и поместите ее на ту часть изображения, которую хотите сохранить. Выберите изображение и форму. 

2. Выберите Объект > Маска с формой (MacOS) или щелкните правой кнопкой мыши выделенное содержимое и выберите Маска с формой (Windows). Часть изображения или рисунка, которая находится за пределами фигуры, маскируется.

3. Чтобы отредактировать содержимое в пределах формы маски, дважды щелкните замаскированное содержимое.  Замаскированная область не удаляется из вашего проекта. Вы можете перенастроить маску, чтобы выделить другую часть изображения.

4. Чтобы отключить или удалить маску, выделите объект и щелкните правой кнопкой мыши (Windows) или Cmd + щелчок (Mac) и выберите Разгруппировать маску из контекстного меню.

Ограничения

• Когда вы маскируете один векторный объект другим, объект в верхней части подборки действует как маска. 
  
• Текст на фигурах, компонентах, группах или символах маскировать нельзя.
  
• XD не поддерживает маски с альфа-каналом или маски с непрозрачностью. Здесь вы можете найти интересные обсуждения, к которым вы можете подключиться, а также проголосовать за эту функцию в UserVoice.

Примеры и образцы файлов

Вы знали, что когда вы запускаете проект с использованием замещающего графического элемента, например, круга вместо изображения профиля, вы можете создавать маски, перетаскивая ресурсы внутрь фигуры? 

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

Время просмотра: 1 мин.

Анимация счетчика чисел используется для отображения чисел в интересной и привлекательной форме. Хотите узнать, как использовать маскировку для создания подвижного табло? Посмотрите это видео и скачайте образцы файлов, чтобы попробовать их самостоятельно.

Время просмотра: 1 мин. 2 сек.

Использование маскировки для создания анимированного счетчика чисел

Примеры и руководства также можно найти в сообществе поддержки XD.

Руководства

Используйте маски, чтобы поместить изображение внутрь пользовательской формы и вырезать части изображения, которые вы хотите спрятать. Посмотрите это руководство о том, как работать с изображениями и маскированием в XD.

Время просмотра: 1 мин.

Связанные ресурсы

• Выделение, изменение размера и поворот объектов
• Инструменты для рисования и работы с текстом

ЕСТЬ ВОПРОС ИЛИ ИДЕЯ?

Если вы хотите задать вопрос или поделиться интересной идеей, вступайте в сообщество Adobe XD. Мы будем рады услышать ваши идеи и увидеть ваши работы.

Вход в учетную запись

Войти

Управление учетной записью

Вход в учетную запись

Войти

Управление учетной записью

Создавайте дизайны и прототипы в Adobe XD быстрее с помощью этих советов и рекомендаций.

Руководство пользователя Отмена

Поиск

Последнее обновление May 21, 2021 06:31:12 AM GMT

1. Руководство пользователя Adobe XD
   
2. Введение
   1. Новые возможности Adobe XD
   2. Распространенные вопросы
   3. Создание дизайна, прототипов и совместная работа в Adobe XD
   4. Системные требования
      1. Требования к оборудованию и программному обеспечению
      2. Adobe XD, Big Sur и Apple Silicon | macOS 11
   5. Основные сведения о рабочей среде
   6. Изменение языка приложения в Adobe XD
   7. Доступ к наборам для дизайна пользовательского интерфейса
   8. Доступность в Adobe XD
   9. Сочетания клавиш
   10. Советы и рекомендации
3. Дизайн
   1. Монтажные области, направляющие и слои
      1. Начало работы с монтажными областями
      2. Использование направляющих и сеток
      3. Создание прокручиваемых монтажных областей
      4. Работа со слоями
      5. Создание групп прокрутки
   2. Фигуры, объекты и путь
      1. Выделение, изменение размера и поворот объектов
      2. Перемещение, выравнивание, распределение и упорядочивание объектов
      3. Группирование, блокирование, дублирование, копирование и зеркальное отражение объектов
      4. Задание обводки, заливки и теней для объектов
      5. Создание повторяющихся элементов
      6. Создание перспективных проектов с помощью 3D-преобразований
      7. Редактирование объектов с помощью логических операций
   3. Текст и шрифты
      1. Работа с инструментами для рисования и создания текста
      2. Шрифты в Adobe XD
   4. Компоненты и состояния
      1. Работа с компонентами
      2. Работа с вложенными компонентами
         
      3. Добавление нескольких состояний для компонентов
   5. Маскировка и эффекты
      1. Создание маски с фигурами
      2. Работа с эффектами размытия
      3. Создание и изменение градиентов
      4. Применение эффектов наложения
   6. Макет
      1. Адаптивное изменение размера и ограничения
      2. Установка фиксированного отступа для компонентов и групп
      3. Создание динамичных проектов с подборками
   7. Видео и анимации Lottie
      
      1. Работа с видео
      2. Создание прототипов при помощи видео
      3. Работа с анимацией Lottie
4. Создание прототипа
   1. Создание интерактивных прототипов
   2. Анимирование прототипов
   3. Свойства объекта, которые поддерживаются при автоматическом анимировании
   4. Создание прототипов с клавиатуры и геймпада
   5. Создание прототипов с помощью голосовых команд и воспроизведения
   6. Создание синхронизированных переходов
   7. Добавление наложений
   8. Создание голосовых прототипов
   9. Создание якорных ссылок
   10. Создание гиперссылок
   11. Предварительный просмотр проектов и прототипов
5. Публикация, экспорт и проверка
   1. Публикация выбранных монтажных областей
   2. Предоставление совместного доступа к проектам и прототипам
   3. Настройка разрешений на доступ к ссылкам
   4. Работа с прототипами
      
   5. Просмотр прототипов
      
   6. Работа со спецификациями дизайна
   7. Предоставление общего доступа к спецификациям дизайна
   8. Проверка спецификаций дизайна
   9. Навигация в спецификациях дизайна
   10. Проверка и комментирование спецификаций дизайна
   11. Экспорт ресурсов дизайна
   12. Экспорт и загрузка ресурсов из спецификаций дизайна
   13. Корпоративный групповой совместный доступ
   14. Резервное копирование или перенос ресурсов XD
6. Системы дизайна
   1. Системы дизайна с библиотеками Creative Cloud Libraries
   2. Работа с ресурсами документа в Adobe XD
   3. Работа с библиотеками Creative Cloud Libraries в Adobe XD
   4. Переход от связанных ресурсов к библиотекам Creative Cloud Libraries
   5. Работа с проектными токенами 
   6. Использование ресурсов из библиотек Creative Cloud Libraries
7. Облачные документы
   1. Облачные документы в Adobe XD
   2. Совместная работа и совместное редактирование проектов
   3. Совместное редактирование документов, к которым вам предоставили доступ
8. Интеграция и плагины
   1. Работа с внешними ресурсами
   2. Работа с ресурсами проекта из Photoshop
   3. Копирование ресурсов из Photoshop
   4. Как импортировать или открыть проекты Photoshop
   5. Работа с ресурсами Illustrator в Adobe XD
   6. Импортирование и открытие проектов Illustrator
   7. Копирование векторных объектов из Illustrator в XD
   8. Плагины для Adobe XD
      
   9. Создание плагинов и управление ими
   10. Интеграция Jira с XD
   11. Подключаемый модуль Slack для XD
   12. Подключаемый модуль Zoom для XD
   13. Публикация работы из XD на Behance
9. XD для iOS и Android
   1. Предварительный просмотр на мобильных устройствах
   2. Часто задаваемые вопросы по Adobe XD для мобильных устройств
10. Устранение неполадок
    1. Выявленные неполадки и исправленные ошибки
       1. Выявленные неполадки
       2. Исправленные неполадки
    2. Установка и обновления
       1. XD отображается как несовместимый в Windows
       2. Код ошибки 191
       3. Код ошибки 183
       4. Проблемы при установке плагинов XD
       5.  Запрос на удаление и переустановку XD в Windows 10
       6. Проблемы с миграцией предпочтений
    3. Запуск и сбой
       1.  XD аварийно завершает работу при запуске в Windows 10
       2.  XD закрывается при выходе из Creative Cloud
       3. Проблема со статусом подписки в Windows
       4. Предупреждение о заблокированном приложении при запуске XD в Windows
       5. Создание аварийного дампа в Windows
       6. Сбор и отправка журнала сбоев
    4. Облачные документы и библиотеки Creative Cloud Libraries
       1. Проблемы с облачными документами XD
       2. Проблемы со связанными компонентами
       3. Проблемы с библиотеками и ссылками
    5. Прототип, публикация и обзор
       1. Не удается записать взаимодействия прототипов в macOS Catalina
       2. Проблемы с процессами публикации
       3. Опубликованные ссылки не отображаются в браузерах
       4. Прототипы некорректно отображаются в браузерах
       5. На общих ссылках внезапно появляется панель комментариев
       6. Невозможно опубликовать библиотеки
    6. Импорт, экспорт и работа с другими приложениями
       1. Импорт и экспорт в XD
       2. Файлы Photoshop в XD
       3. Файлы Illustrator в XD
       4. Экспорт из XD в After Effects
       5. Файлы Sketch в XD
       6. В разделе экспорта не представлены сторонние приложения

Создавайте дизайны и прототипы в Adobe XD быстрее с помощью этих советов и рекомендаций.

Вот несколько рекомендаций по использованию Adobe XD.

Общие советы и рекомендации

• Вместо того чтобы копировать и вставлять группы элементов в дизайн, можно использовать инструмент «Повторяющаяся сетка» (доступен в инспекторе свойств).
• Чтобы продублировать фигуру, выберите ее и, удерживая клавишу Option (в Mac) или клавишу Alt (в Windows), перетащите ее новую копию.
• Элементы можно заблокировать, выбрав Объект > Блокировать (или Cmd + L) в Mac. Это действие переключает блокировку, поэтому эта же команда используется для разблокирования элементов. В Windows щелкните правой кнопкой по объекту и выберите «Блокировать» в контекстном меню.
• Включите частичное выделение, удерживая клавишу Cmd или Ctrl. Так вы можете выбирать вложенные объекты.
• Для быстрой маскировки поместите изображение на фигуру: заливка фигуры станет изображением.
• Создайте редактируемую маску, импортировав изображение, а затем нарисуйте поверх него фигуру. Выделите и то, и другое, а затем выберите Объект > Маска с формой (в Mac) или щелкните объекты правой кнопкой мыши и выберите «Маска с формой» в контекстном меню. Вы можете отредактировать маску или изображение позже, дважды щелкнув на замаскированной группе.

Рисование и текст

• Вы можете отключить направляющие привязки, удерживая нажатой клавишу Cmd / Ctrl.
• Дважды щелкните любую опорную точку, чтобы переключиться между кривой и углом.
• Нажмите Opt/Alt при перетаскивании маркера кривой, чтобы сделать его независимым. (Чтобы снова сделать его зависимым, дважды щелкните для возвращения к углу, затем дважды щелкните еще раз).
• Вы можете выбрать опорные точки при рисовании с помощью инструмента «Перо».
• Дважды щелкните, чтобы войти в контекст редактирования группы (в этом контексте можно добавлять элементы), или просто щелкните объект внутри группы с нажатой клавишей Cmd / Ctrl, чтобы выбрать его.
• Выберите текстовый элемент, затем создайте новый, чтобы применить все стили из первого элемента ко второму.
• Путевые комбинации (Добавить/Вычесть/Пересечь/Исключить наложение) обратимы. Их можно включать и выключать.

Импорт содержимого

• Чтобы добавить содержимое из Illustrator, выберите векторную фигуру в Illustrator, скопируйте и вставьте ее в Adobe XD.
  
• Чтобы добавить растровое содержимое из Photoshop, выберите все (Cmd+A или Ctrl+A) в растровом или текстовом слое (либо сначала преобразуйте векторный слой или группу в смарт-объект), скопируйте, а затем вставьте его в Adobe XD. Слой вставится как растровое изображение. Вы также можете скопировать содержимое из Photoshop, выделив его с помощью инструмента «Область». Затем в меню выберите «Правка > Копировать» (чтобы получить выделение на активном слое) или «Правка > Копировать объединенные слои» (чтобы получить выделение во всех слоях в выделенном фрагменте).
• Чтобы добавить содержимое из Sketch, выделите один или несколько слоев или групп и нажмите «Сделать экспортируемым». Выберите формат SVG и перетащите слой из Sketch в Adobe XD. Так вы получите редактируемое векторное содержимое в Adobe XD.
• Чтобы импортировать ресурсы (PNG, JPG, TIFF, GIF, SVG), на компьютере Mac выберите Файл > Импорт, или перетащите, или скопируйте и вставьте изображения в Adobe XD из Finder.
  В Windows щелкните меню «гамбургер» и нажмите «Импорт», или перетащите, или скопируйте и вставьте изображения из проводника.
  Вы также можете копировать и вставлять компоненты в Adobe XD из браузера.

Управление с клавиатуры

• Чтобы откорректировать радиуса скругления только одного угла, удерживайте нажатой клавишу OPTION.
• Чтобы временно отключить привязку при перемещении или изменении размера элементов, удерживайте нажатой клавишу Cmd или Ctrl.
• Изменяя размеры элемента, удерживайте нажатой клавишу SHIFT, чтобы сохранить пропорции элемента.
• Пока рисуете фигуру, удерживайте клавишу ALT, чтобы рисовать из центра, а не из верхнего левого угла (по умолчанию).
• Чтобы быстро изменить непрозрачность выбранного элемента, нажмите следующие клавиши с цифрами. Здесь 1 = 10%, 2 = 20% и т. д.; 0 = 100%.
• При выполнении сдвига фигуры или контрольной точки с помощью клавиш со стрелками удерживайте нажатой клавишу SHIFT, чтобы сдвинуть на 10 пикселей.
• Удерживайте ПРОБЕЛ, чтобы включить режим руки. В этом режиме можно нажать и перетащить для охватки холста.

Монтажные области

• Чтобы выбрать монтажную область, щелкните заголовок монтажной области, затем щелкните по ее фону, удерживая Cmd / Ctrl, или дважды щелкните фон.
• Чтобы выбрать пустую монтажную область, щелкните по фону монтажной области.
• Чтобы дублировать монтажную область (и ее содержимое), выберите монтажную область и перетащите ее, удерживая Cmd (в Mac) или Alt (в Windows), чтобы сделать копию.
• Чтобы переименовать монтажную область, дважды щелкните ее заголовок.

Повторяющаяся сетка

• Чтобы откорректировать отступ между повторяющимися элементами в повторяющейся сетке, выберите эту сетку, затем наведите указатель мыши на пространство между элементами и перетащите. Если вы редактируете элемент в повторяющейся сетке, вам нужно нажать ESCAPE, чтобы выйти из режима редактирования.

Создание и предварительный просмотр прототипов

• Выберите любой объект на монтажной области (или всю монтажную область) и перетащите соединительную линию, чтобы вызвать взаимодействие между монтажными областями.
• Перетащите соединительную линию от места назначения, чтобы разорвать установленное взаимодействие.
• Используйте переход «Растворение» при дизайне для веб-сайтов.
• Чтобы увидеть все соединения между своими монтажными областями (кроме тех, которые запускаются непосредственно из монтажных областей), нажмите Cmd + A (в Mac) или Ctrl + A (в Windows) в режиме прототипа.
• Окно предварительного просмотра отображает монтажную область с текущим выделением. Если ничего не выделено, окно предварительного просмотра откроется с монтажной областью «Главная».
• Из окна предварительного просмотра вашего интерактивного прототипа можно записать видео. Чтобы начать видеозапись, нажмите значок записи на панели заголовка.
• Чтобы остановить видеозапись, нажмите кнопку записи еще раз ИЛИ нажмите ESC.
• Вы можете использовать сочетания клавиш или триггеры геймпада на прототипах в зависимости от типа создаваемого вами дизайна. 

Обмен файлами

• Для предоставления общего доступа необходимо с помощью учетной записи Adobe войти либо в приложение Adobe Creative Cloud для настольных ПК, либо в любое другое приложение Adobe (например, Photoshop, Illustrator и т. д.).
  Поддерживаются идентификаторы Adobe ID, Enterprise ID и Federated ID.

• Если вы поделитесь своим файлом дизайна, не добавив сначала взаимодействия, будут загружены все ваши монтажные области, и пользователи смогут перемещаться по ним с помощью клавиш со стрелками на клавиатуре. Порядок ваших монтажных областей будет следующий: начиная от верхней левой и по направлению вправо.
• Если ваш дизайн включает взаимодействия, будут загружены и опубликованы только монтажные области, связанные с монтажной областью «Главная».
• Монтажная область, определенная как «Главная», — это первая монтажная область, которую пользователи увидят при просмотре вашего опубликованного дизайна.
• Вы можете изменить монтажную область «Главная», выбрав значок главной монтажной области рядом с монтажной областью в режиме прототипа. Этот значок главной монтажной области отображается только для выделенных монтажных областей (или назначения выбранной цели).
• При просмотре прототипа в мобильном веб-браузере можно сохранить его ярлык на главном экране устройства. Так прототип будет более похожим на встроенное приложение при его представлении.
  

Справки по другим продуктам

• Сочетания клавиш

Вход в учетную запись

Войти

Управление учетной записью

Вход в учетную запись

Войти

Управление учетной записью

Узнайте, как создать маску с фигурами.

Руководство пользователя Отмена

Поиск

1. Руководство пользователя Adobe XD
   
2. Введение
   1. Что нового в Adobe XD
   2. Общие вопросы
   3. Дизайн, прототип и публикация с помощью Adobe XD
   4. Системные требования
      1. Требования к аппаратному и программному обеспечению
      2. Adobe XD, Big Sur и Apple Silicon | macOS 11
   5. Основы рабочего пространства
   6. Изменить язык приложения в Adobe XD
   7. Комплекты для разработки пользовательского интерфейса Access
   8. Специальные возможности в Adobe XD
   9. Сочетания клавиш
   10. Советы и рекомендации
3. Дизайн
   1. Монтажные области, направляющие и слои
      1. Начало работы с монтажными областями
      2. Используйте направляющие и сетки
      3. Создание прокручиваемых артбордов
      4. Работа со слоями
      5. Создать группы прокрутки
   2. Фигуры, объекты и пути
      1. Выбор, изменение размера и вращение объектов
      2. Перемещайте, выравнивайте, распределяйте и упорядочивайте объекты
      3. Группировать, блокировать, дублировать, копировать и отражать объекты
      4. Установка обводки, заливки и тени для объектов
      5. Создание повторяющихся элементов
      6. Создание перспективных проектов с 3D-преобразованиями
      7. Редактировать объекты с помощью логических операций
   3. Текст и шрифты
      1. Работа с инструментами рисования и текста
      2. шрифтов в Adobe XD
   4. Компоненты и состояния
      1. Работа с компонентами
      2. Работа с вложенными компонентами
         
      3. Добавить несколько состояний к компонентам
   5. Маскирование и эффекты
      1. Создание маски с фигурами
      2. Работа с эффектами размытия
      3. Создание и изменение градиентов
      4. Применение эффектов наложения
   6. Макет
      1. Адаптивное изменение размера и ограничения
      2. Установить фиксированное заполнение для компонентов и групп
      3. Создание динамических дизайнов с использованием стеков
   7. Видео и анимация Lottie
      
      1. Работа с видео
      2. Создавайте прототипы с помощью видео
      3. Работа с анимацией Lottie
4. Прототип
   1. Создание интерактивных прототипов
   2. Анимированные прототипы
   3. Свойства объекта поддерживаются для автоматической анимации
   4. Создание прототипов с клавиатурой и геймпадом
   5. Создание прототипов с помощью голосовых команд и воспроизведения
   6. Создание временных переходов
   7. Добавить накладки
   8. Разработка голосовых прототипов
   9. Создание якорных ссылок
   10. Создание гиперссылок
   11. Предварительный просмотр проектов и прототипов
5. Общий доступ, экспорт и просмотр
   1. Общий доступ к выбранным монтажным областям
   2. Обмен проектами и прототипами
   3. Установить права доступа для ссылок
   4. Работа с прототипами
      
   5. Обзор прототипов
      
   6. Работа с ТЗ
   7. Совместное использование спецификаций дизайна
   8. Проверка спецификаций дизайна
   9. Технические характеристики дизайна навигации
   10. Просмотреть и прокомментировать спецификации дизайна
   11. Экспорт проектных активов
   12. Экспорт и загрузка ресурсов из спецификаций дизайна
   13. Общий доступ к группе для предприятия
   14. Резервное копирование или перенос ресурсов XD
6. Системы проектирования
   1. Системы проектирования с библиотеками Creative Cloud
   2. Работа с активами документа в Adobe XD
   3. Работа с библиотеками Creative Cloud в Adobe XD
   4. Миграция со связанных ресурсов в библиотеки Creative Cloud
   5. Работа с токенами дизайна
   6. Используйте ресурсы из Creative Cloud Libraries
7. Облачные документы
   1. Облачные документы в Adobe XD
   2. Совместная работа и совместное редактирование проектов
   3. Совместное редактирование документов, которыми с вами поделились
8. Интеграции и плагины
   1. Работа с внешними активами
   2. Работа с дизайнерскими ресурсами из Photoshop
   3. Скопируйте и вставьте активы из Photoshop
   4. Импорт или открытие дизайнов Photoshop
   5. Работа с ресурсами Illustrator в Adobe XD
   6. Открыть или импортировать проекты Illustrator
   7. Копирование векторов из Illustrator в XD
   8. Плагины для Adobe XD
      
   9. Создание плагинов и управление ими
   10. Интеграция Jira для XD
   Плагин
   11. Slack для XD
   12. Плагин Zoom для XD
   13. Публикация дизайна из XD на Behance
9. XD для iOS и Android
   1. Предварительная версия на мобильных устройствах
   2. Adobe XD для мобильных устройств: часто задаваемые вопросы
10. Устранение неполадок
    1. Известные и устраненные проблемы
       1. Известные проблемы
       2. Исправлены проблемы
    2. Установка и обновления
       1. XD отображается как несовместимый с Windows
       2. Код ошибки 191
       3. Код ошибки 183
       4. Проблемы при установке подключаемых модулей XD
       5.  Запрос на удаление и переустановку XD в Windows 10
       6. Проблемы с переносом настроек
    3. Запуск и сбой
       1.  Сбой XD при запуске в Windows 10
       2.  XD завершает работу при выходе из Creative Cloud
       3. Проблема со статусом подписки в Windows
       4. Предупреждение о заблокированном приложении при запуске XD в Windows
       5. Создание аварийного дампа в Windows
       6. Сбор и совместное использование журнала сбоев
    4. Облачные документы и библиотеки Creative Cloud Libraries
       1. Проблемы с облачными документами XD
       2. Проблемы со связанными компонентами
       3. Проблемы с библиотеками и ссылками
    5. Создание прототипа, публикация и проверка
       1. Невозможно записать взаимодействие с прототипом в macOS Catalina
       2. Проблемы с рабочими процессами публикации
       3. Опубликованные ссылки не отображаются в браузерах
       4. Прототипы неправильно отображаются в браузерах
       5. Панель комментариев внезапно появляется на общих ссылках
       6. Невозможно опубликовать библиотеки
    6. Импорт, экспорт и работа с другими приложениями
       1. Импорт и экспорт в XD
       2. файлов Photoshop в XD
       3. Файлы Illustrator в XD
       4. Экспорт в After Effects из XD
       5. Файлы эскизов в XD
       6. Сторонние приложения не отображаются при экспорте

Узнайте, как создать маску из фигур.

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

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

Хотите научиться создавать, редактировать или удалять эффект маски? Выполните следующие действия:

1. Нарисуйте фигуру, которую хотите использовать в качестве маски, и поместите ее на ту часть изображения, которую хотите сохранить. Выберите изображение и форму.

2. Выберите Object > Mask with Shape (MacOS) или щелкните правой кнопкой мыши выбранное содержимое и выберите Mask with Shape (Windows). Часть изображения или рисунка, выходящая за пределы формы, маскируется.

3. Чтобы изменить содержимое в форме маски, дважды щелкните маскированное содержимое. Замаскированная область не удаляется из вашего проекта. Вы можете перенастроить маску, чтобы выделить другую часть изображения.

4. Чтобы отключить или удалить маску, выберите объект и щелкните правой кнопкой мыши (Windows) или Ctrl + Click (Mac) и выберите Разгруппировать маску в контекстном меню.

Ограничения

• Когда вы маскируете один векторный объект другим, объект на вершине стека действует как маска.
  
• Нельзя маскировать текст на фигурах, компонентах, группах или символах.
  
• XD не поддерживает альфа-маски или маски с непрозрачностью. Вот интересное обсуждение, в котором вы можете принять участие и проголосовать за эту функцию в UserVoice.

Примеры и файлы образцов

Знаете ли вы, что когда вы начинаете дизайн с замещающей графикой, такой как круг вместо изображения профиля, вы можете создавать маски, перетаскивая ресурсы в формы?

Чтобы узнать больше о перетаскивании объекта в фигуру или использовании существующей фигуры в качестве маски, ознакомьтесь с приведенным ниже руководством или загрузите примеры файлов, чтобы опробовать их самостоятельно.

Время просмотра: 1 минута.

Анимация счетчика чисел используется для отображения чисел в интересной и привлекательной форме. Хотите узнать, как использовать маскирование для создания динамического табло? Посмотрите это видео и загрузите образцы файлов, чтобы попробовать их самостоятельно.

Время просмотра: 1 минута 2 секунды.

Используйте маскирование для создания анимированного счетчика чисел

Вы также можете посетить сообщество поддержки XD, чтобы найти примеры и учебные пособия.

Учебные пособия

Используйте маски, чтобы поместить изображение в пользовательскую форму и обрезать части изображения, которые вы не хотите видеть. Ознакомьтесь с этим учебным пособием о том, как работать с изображениями и маскированием в XD.

Время просмотра: 1 минута.

Связанные ресурсы

• Выбор, изменение размера и поворот объектов
• Инструменты для рисования и текста

ЕСТЬ ВОПРОС ИЛИ ИДЕЯ?

Если у вас есть вопрос или идея, которой вы хотите поделиться, приходите и участвуйте в сообществе Adobe XD. Мы будем рады услышать от вас и увидеть ваши творения.

Войдите в свою учетную запись

Войти

Управление учетной записью

Войдите в свою учетную запись

Войти

Управление учетной записью

3 способа маскировки в Adobe XD — M.

Вы новичок в Adobe XD? Или, может быть, вы просто застряли на том, как создать простую маску? Вот 3 быстрых совета о том, как замаскировать ваши фотографии и проекты в Adobe XD.

Предпочитаете смотреть туториал?

Посмотрите это двухминутное обучающее видео, чтобы увидеть эти 3 варианта маски в действии.

1. Используйте фигуры для маскирования

Одним из самых простых способов маскирования в Adobe XD является использование фигур. Например, допустим, я хочу, чтобы это фото профиля было помещено в круг.

Используйте инструмент  Эллипс  , нажмите и перетащите, используя клавишу  Option  , чтобы создать идеальный круг.

Используйте инструмент «Эллипс», чтобы нарисовать круг

Выберите круг и фотографию и используйте сочетание клавиш  Command + Shift + Mask , чтобы замаскировать фотографию внутри фигуры.

Комбинация клавиш для маски: Command + Shift + Mask

Если вы хотите изменить положение или масштабировать фотографию в рамке, дважды щелкните группу.

Дважды щелкните, чтобы изменить масштаб или положение

Перетаскивание

Аналогичная техника заключается в том, чтобы сначала нарисовать фигуру, а затем перетащить фотографию в фигуру.

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

Перетащите изображения в формы

2.

Используйте инструмент «Перо»

Другой вариант — использовать инструмент «Перо» в Adobe XD для рисования любой формы. Это лучший вариант для создания более сложных масок для ваших фотографий.

Используйте инструмент «Перо» в Adobe XD для создания более сложных форм маски

Как и в первом варианте, выберите фигуру и фотографию, используйте сочетание клавиш  Command + Shift + M  , чтобы замаскировать.

Комбинация клавиш для маски: Command + Shift + Mask

3. Используйте инструмент «Перо»… в Photoshop

Этот последний вариант является своего рода обманом. Иногда я предпочитаю делать индивидуальную маску в Photoshop, так как это проще и точнее.

Для этой фотографии я хочу, чтобы рука и чашка были вырезаны из фона. В Photoshop я воспользуюсь инструментом Quick Selection и нажму Select Subject .