Тенденции мобильного дизайна в 2016 году

Тенденции мобильного дизайна в 2016 году

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

Если бы вы нашли человека, который был активным пользователем сети времён диалапа, и с тех пор не заходил в интернет, и показали современные веб-ресурсы, он бы очень удивился увиденному.

В наше время очень много внимания уделяется конкретно мобильным интерфейсам. Это не удивительно, учитывая статистику. Если раньше значительная часть пользователей сидела в интернете со стационарных ПК и ноутбуков, то сегодня половина населения носит в кармане смартфон с 3G-интернетом.

Особенности мобильных интерфейсов

Если говорить о том, чем отличается мобильный гаджет, то ключевой фактор, это размер экрана. Компактность требует жертв, и главной является именно дисплей. Большинство имеет диагональ не более 6”. Следовательно, требуется, чтобы вся ключевая информация легко помещалась в такой формат. Если у вас что-то не помещается на экран, сделайте этот пункт доступным из меню. Он напоминает книжное оглавление.

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

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

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

Ключевые элементы должны стать частью фиксированного меню. Это те пункты, доступ к которым должен быть непосредственно с самой страницы. Если сайт продающий, кнопка «добавить в корзину» обязательно должна быть под рукой. При этом помните о том, что интерфейс должен быть предельно простым и интуитивным. Если пользователь задаёт вопрос «где?», считайте, что потеряли клиента.

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

Модальные окна применяются для регистрации, подписки на рассылку, или размещения привлекательного предложения для клиента. Они всегда располагаются над другими окнами.

Блочный интерфейс

Среди главных популяризаторов «кирпичиков» – корпорация Microsoft. Ярчайший пример такого решения, это свежий продукт – операционная система Windows 10. Если вы зайдете в «Пуск», то увидите, что здесь всё поделено на прямоугольные сегменты с картинками. Разобраться, где что находится, сможет практически любой человек. Простота и удобство доступа из меню к любому разделу и приложению, установленному в системе – вот залог успеха.

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

Анимация, как элемент интерактивного дизайна

Многие веб-дизайнеры избегают использования анимаций, считая, что они перегружают сайт, замедляют его загрузку. Однако, при грамотном использовании, такие элементы вам не только не навредят, но и позволят добавить дизайну изюминку. Пробуйте, проверяйте скорость, редактируйте результат. Анимация должна быть красивой, удобной и привлекательной для пользователя.

Размещение элементов

Расположение основных элементов меню должно быть таким, чтобы человек легко дотягивался до них большим пальцем на любом смартфоне. На iPhone 6 plus верхняя часть экрана находится слишком далеко, чтобы работать можно было одной рукой. Поэтому многие мобильные версии сайтов делают из расчёта, что ключевые пункты, ссылки должны располагаться именно под пальцем.

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

Нужно ли управление жестами?

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

Управлять жестами хотят не все. Большинство пользователей действует автоматически, выполняя привычные действия. Если при переходе на новый ресурс у них вдруг изменится управление, не факт, что они захотят там остаться. Это можно сравнить с автомобилем. Люди, привыкшие к ручной коробке передач, не всегда рады автоматике, или «роботу». Жесты уместны только в тех случаях, когда они упрощают использование сайта.

Виды навигации

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

Модульная прокрутка позволяет работать с содержимым конкретного блока, не затрагивая соседние. Он тоже подойдет для новостей.

Скрытой называют прокрутку, которая не отображается на дисплее смартфона, а значит, не мешает обзору.

Параллакс – вид скроллинга, реализуемый посредством Java Script. На странице всегда есть несколько элементов, каждый из которых – отдельный слой, двигающийся с разной скоростью.

Хотите заказать мобильный дизайн?

Наш практический опыт в digital-маркетинге гарантирует Вашему проекту высокие, стабильные результаты в оптимальный срок.

Полезная информация