Последнее обновление
25 авг. 2021 г.
Создавайте дизайны и прототипы в 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 можно использовать File > Import, перетаскивание или копирование и вставку изображений в Adobe XD из Finder.
В Windows нажмите меню «Гамбургер» и выберите «Импорт», либо перетаскивайте изображения, либо копируйте и вставляйте изображения из проводника.
\nТакже можно копировать и вставлять из браузера в 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 в приложение Creative Cloud для ПК или любое другое приложение Adobe (например, Photoshop, Illustrator и так далее).
\nПоддерживаются Adobe ID, Enterprise ID и Federated ID.
- Если вы поделитесь своим файлом дизайна, не добавив сначала взаимодействия, будут загружены все ваши монтажные области, и пользователи смогут перемещаться по ним с помощью клавиш со стрелками на клавиатуре. Порядок ваших монтажных областей будет следующий: начиная от верхней левой и по направлению вправо.
- Если ваш дизайн включает взаимодействия, будут загружены и опубликованы только монтажные области, связанные с монтажной областью «Главная».
- Монтажная область, определенная как «Главная», — это первая монтажная область, которую пользователи увидят при просмотре вашего опубликованного дизайна.
- Вы можете изменить монтажную область «Главная», выбрав значок главной монтажной области рядом с монтажной областью в режиме прототипа. Этот значок главной монтажной области отображается только для выделенных монтажных областей (или назначения выбранной цели).
- При просмотре прототипа в мобильном веб-браузере можно сохранить его ярлык на главном экране устройства. Так прототип будет более похожим на встроенное приложение при его представлении.
Связанные материалы
Проектируйте прототипы пользовательских интерфейсов при помощи Adobe XD
Создавайте интерактивные макеты для веб-сайтов и мобильных приложений.