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

Создание якорных ссылок в Adobe XD

  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. Советы и рекомендации
    11. Варианты условий подписки на Adobe XD
    12. Изменения в начальном плане XD
  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. Корпоративный групповой совместный доступ
  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 позволяет создавать якорные ссылки во время создания прототипов. По этим ссылкам можно быстро переходить к определенным разделам на монтажной области. Якорные ссылки делают навигацию по длинной форме или статье более быстрой и удобной.

Якорные ссылки
Улучшенная навигация в монтажной области

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

  1. Переключитесь в режим Prototype (Прототип). Выберите объект на монтажной области, к которому вы хотите добавить якорную ссылку.

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

  3. Нажмите на соединительную линию, чтобы просмотреть панель взаимодействий, которая появится в Инспекторе свойств со следующими параметрами.

    • Trigger (Триггер): установите значение Tap (Нажатие).
    • Action Type (Тип действия): выберите значение Scroll To (Прокрутить к). Хотите назначить несколько действий для одного триггера? Подробная информация есть в этой статье.
    • Destination (Место назначения): выберите слой назначения.
    • Y-offset (Y-смещение): введите значение смещения по оси Y относительно вершины соединенного объекта. Вы можете изменить смещение по оси Y, перетаскивая маркер y-смещения в левую сторону монтажной области. Любое значение выше соединенного объекта является отрицательным смещением, ниже — положительным смещением.
    • Easing (Смягчение): выберите этот параметр, чтобы смоделировать эффекты смягчения. Например, выберите Ease-Out (Замедление и ускорение), чтобы анимация в прототипе постепенно появлялась и исчезала.
    • Duration (Продолжительность): введите продолжительность. Максимальная продолжительность, которую вы можете установить между двумя переходящими монтажными областями, составляет пять секунд.
    якорные ссылки

    A. Выберите тип триггера B. Выберите действие Scroll To (Прокрутить) C. Выберите монтажную область назначения D. Введите значение смещения по оси Y E. Выберите эффекты замедления F. Укажите длительность 

  4. Чтобы просмотреть эффект прокрутки на монтажной области, нажмите .

Подробнее

«Воспользуйтесь якорными ссылками, чтобы создать красивую целевую страницу для книги о животных с интерактивным контентом». Говард Пинкси (Howard Pinksy), ИТ-евангелист XD в Adobe.

Посмотрите это видео, чтобы узнать больше. 

Продолжительность: 3 минуты

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

Скачать файл

Что дальше?

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

Есть вопрос или идея?

Спросите сообщество

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

Логотип Adobe

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