Дизайн мобильных приложений должен включать в себя навигационную схему. Она представляет собой блоки, которые соединены вертикальными и горизонтальными связями. Последние – контент одного уровня. Навигация по ним требует открыть новое окно. Вертикальные блоки дают возможность перейти на другой уровень контента.
Такая иерархическая модель предоставляет информацию пользователям последовательно. Хороший пример такой навигации – новостные приложения. Здесь акцент делают на разделы и главные новости суток. Если вы желаете ознакомиться с событиями прошлых недель, нужно перейти на конкретную вкладку. Хотите прочитать новость? Сделайте еще один переход. В такой иерархии блоки распределяют внутри навигационной схемы.
Установить связь между структурными единицами и блоками – это заключительный этап создания навигационной карты. Нужно добиться, чтобы пользователь одновременно мог искать информацию и параллельно просматривать статьи. Попасть в меню Избранного должно быть реально из меню и новости. Учитывайте все эти связи.
Когда создадите навигационную карту, снова вернитесь к портрету вашей целевой аудитории. Представьте себя на месте пользователя. Ведите себя, как он. И под таким образом попытайтесь воспроизвести работу с приложением. Почитайте статьи, переходите по ссылкам, изучайте контент и графику.
Текст и графику приводят в соответствие с целями на этапе разработки. Функционал же продумывают заранее. Идеально организованный, он выглядит так:
- Есть меню. Добавьте функции, доступные для каждого раздела: «О нас», поиск, добавить в избранное.
- Интегрированный функционал – лучшее решение. Пользоваться контентом здесь можно напрямую. Нет необходимости открывать большой текст, разделы или открывать статью щелчком по кнопкам «Читать далее» или стрелке.
- Перейти к контекстным командам можно только в контексте. Доступ к функционалу идет из раздела.
- Приоритеты. Важные элементы выделяются на фоне остального содержимого. Так разработчик решает задачи пользователя.
Полезную информацию можно найти в гайдлайнах сторов. Следуйте ей обязательно во время проектирования интерфейса мобильного приложения и других работ. Иначе можете вообще не оказаться в магазине. Когда отрисуете и утвердите все макеты, поставьте перелинковку, чтобы понимать логику переходов. Перелинкованные макеты – это первый прототип будущего проекта. Перепроверьте навигационную карту, пройдитесь по разделам. Воспользуйтесь сценарием User Story. Когда макеты будут адаптированы ко всем нужным расширениям дисплеев, материалы передают разработчикам.
Важные правила
- Не нужно показывать пользователю, куда переходить. Дайте ему четкое представление, где он находится. По этой причине самые приоритетные разделы лучше выносить наверх.
- Детализация должна повышаться с переходом на новый уровень иерархии. Но не перестарайтесь с уровнями. Много переходов отпугнут пользователей. Лучшее решение - навигационная карта нижних уровней.
- Читайте гайдлайны сторов внимательно. В них много полезной информации о построении дизайна приложения.
- Информация на экране – это не полный функционал. Одноуровневые данные можно представить на вкладках или параллельных экранах. Доступ к ним осуществится скролом в меню приложениях или нажатием на функциональную кнопку на устройстве.