Переключитесь в режим Prototype (Прототип). Выберите объект на монтажной области, к которому вы хотите добавить якорную ссылку.
Последнее обновление
10 февр. 2023 г.
Узнайте, как создать якорные ссылки, чтобы улучшить навигацию по монтажной области.
Adobe XD позволяет создавать якорные ссылки во время создания прототипов. По этим ссылкам можно быстро переходить к определенным разделам на монтажной области. Якорные ссылки делают навигацию по длинной форме или статье более быстрой и удобной.
Хотите быстро перемещаться к определенным разделам на монтажной области? Выполните следующие действия, чтобы начать.
Перетаскивайте соединительную линию прототипа по монтажной области, пока не дойдете до точки, к которой хотите привязать ссылку.
Нажмите на соединительную линию, чтобы просмотреть панель взаимодействий, которая появится в инспекторе свойств со следующими параметрами:
- Триггер: установите значение Нажатие.
- Тип действия: выберите значение Прокрутить к. Хотите назначить несколько действий для одного триггера? Подробная информация есть в этой статье.
- Назначение: Выберите целевой слой.
- Y-смещение: введите значение смещения по оси Y относительно вершины соединенного объекта. Вы можете изменить смещение по оси Y, перетаскивая маркер y-смещения в левую сторону монтажной области. Любое значение выше соединенного объекта является отрицательным смещением, ниже — положительным смещением.
- Смягчение: выберите этот параметр, чтобы смоделировать эффекты смягчения. Например, выберите Замедление и ускорение, чтобы анимация в прототипе постепенно появлялась и исчезала.
- Продолжительность: введите продолжительность. Максимальная продолжительность, которую вы можете установить между двумя переходящими монтажными областями, составляет пять секунд.
A. Выберите тип триггера B. Выберите действие «Прокрутить к» C. Выберите монтажную область назначения D. Введите значение смещения по оси Y E. Выберите эффекты замедления F. Укажите длительность
Чтобы просмотреть эффект прокрутки на монтажной области, выберите .
Подробнее
«Воспользуйтесь якорными ссылками, чтобы создать красивую целевую страницу для книги о животных с интерактивным контентом». Говард Пинкси (Howard Pinksy), ИТ-евангелист XD в Adobe.
Посмотрите это видео, чтобы узнать больше.
Время просмотра: 3 мин.
Теперь, когда вы знаете, как создавать якорные ссылки, скачайте образец комплекта пользовательского интерфейса, который содержит несколько примеров макетов одиночных веб-страниц.
Что дальше?
Вы научились добавлять навигационные ссылки в ваш проект. Узнайте, как добавить несколько взаимодействий с помощью голосовых команд и воспроизведения речи.
Есть вопрос или идея?
Если вы хотите задать вопрос или поделиться интересной идеей, вступайте в сообщество Adobe XD. Мы будем рады услышать ваши идеи и увидеть ваши работы.
Проектируйте прототипы пользовательских интерфейсов при помощи Adobe XD
Создавайте интерактивные макеты для веб-сайтов и мобильных приложений.
