Два любопытных тренда оказывают сильное влияние на современный веб-дизайн. С одной стороны — унификация и минимализация интерфейсов, и, с другой — wow-дизайн с эффектными визуальными составляющими. При кажущемся противоречии, эти две тенденции не спорят между собой, а дополняют друг друга. Умный дизайн помогает пользователю решать его задачи и правильно транслирует суть и концепцию бизнеса. И, надо признать, веб-дизайн сегодня демонстрирует лучшее, что было с момента его зарождения и становления.
Минимализм и функциональность
Минимализм и функциональность — главные составляющие качественного современного интерфейса. Максимально ограниченные в пространстве проектировщики вынуждены все больше внимания уделять расположению элементов и организации структуры. И интерфейс “умнеет”, предлагая пользователю только тот контент, который ему нужен именно сейчас, не распыляя его внимание.
С повсеместным проникновением интернета устройства начинают восприниматься не всегда как помощники на пути к решению задачи, но и, как ни парадоксально, как помеха. Так, например, навигатор на автомобильном стекле заставляет нас отвлекаться от дороги, и так будет до тех пор, пока интерфейс полностью не “встроится” в наше поле зрения и не будет самостоятельно меняться, угадывая наши задачи.
Кроме того, унифицированный минималистичный интерфейс экономит время на разработку, позволяя создателю быстрее запустить готовый продукт, начать тестировать его в реальном времени и зарабатывать деньги, итерационно дорабатывая и доводя до совершенства.
Блочная структура
С началом эры Интернета пространство страницы было структурировано по подобию печатных документов. Тексты чередовались с иллюстрациями к ним. Модульные конструкции в вебе, вошедшие в тренд еще в 2012 году, больше подходят для организации контента на мобильном устройстве. Блок как базовая “единица смысла” на экране сочетает в себе и контент, и визуализацию.
Тренд эволюционирует. Блоки становятся подвижными: они могут меняться местами, увеличиваться и уменьшаться, в общем, вести себя “умно”, подстраиваясь под пользователя и предугадывая его желания. Дальше будет еще интереснее.
Прозрачные кнопки
В моде “кнопки-призраки”, которые гармонично вписываются в любой дизайн сайта, не нарушая стилистики, и оставаясь при этом заметными.
Минимум лишних движений
Прошли времена длинных запутанных регистрационных форм, которые невозможно было заполнить с первого раза. Сегодня сайты робко предлагают к заполнению всего пару полей, все чаще давая альтернативную возможность идентификации через социальные сети. Сбывается давняя мечта юзабилистов об «едином окне входа» в интернет.
Незаметная навигация
Структура и функциональные элементы десктопных интерфейсов «подражают» реализации на мобильных платформах: «выскакивающее» по клику боковое меню, крупные кнопки со сглаженными углами, имитирующие сенсорные. Все это делает десктопный интерфейс похожим на экран огромного айфона.
Неподвижное меню и выпадающие “по клику” информационные блоки позволяют не делать лишних движений и не перегружают экран.
Функциональные элементы и навигация
“Навигация по скроллингу” — это когда по мере прокрутки страницы интерфейс акцентирует внимание пользователя на определенных деталях, выделяя их цветом, анимацией или иными изменениями. Разработчику прием позволяет “вести” посетителя по ресурсу туда, куда он считает правильным. А пользователю проще воспринять предложенную информацию.
WOW-дизайн и «Эффект залипания
Такого внимания к визуалам сайты не видели с конца 2000-х, тех самых пор, когда наступила «эра юзабилити».
С 2008 года тренд в визуальном оформлении интерфейсов задавали принципы удобства и простоты. Кризис с его потребностью в функциональном и простом дизайне, отсутствие устоявшихся паттернов, тяжелые сайты на flash надолго сделали непопулярными визуально эффектные сайты.
Сегодня рынок веб-разработки и стандарты проектирования сформированы. Конкуренция в интернете растет, и технологии развиваются. HTML5, CSS3 позволяют создавать очень яркие, эффектные, оригинальные веб-продукты. В которых на первое место выходит код, за счет которого и создается весь “праздник”. При этом, графика остается простой.
Сторителлинг
Дизайн-концепция, основанная на интриге, мотивирует посетителя сайта прокрутить страницу до конца, чтобы узнать, в чем кроется развязка.
Так, на карьерном сайте Альфа-Банка, новый сотрудник меняется по мере прокрутки страницы, а нам интересно следить, чем же закончится его путешествие.
Атмосферный бэкграунд
Имиджевые широкоформатные фотографии в фоне эффектны, задают общее настроение сайту, при этом не мешая контенту, который накладывается «сверху».
Дизайнеры идут дальше и делают фотографию фона подвижной, реагирующей на движения мыши или скроллинг. Или используют видео в качестве бэкграунда.
Длинные тени в дизайне
Длинные тени — эволюция плоского дизайна. Однако объектам тени не добавляют реалистичности, настолько они схематичны.
Анимация и интерактив
Визуализировать объемный объем информации с помощью инфографики стало модно еще два года назад. Сейчас информация становится анимированной. Это еще облегает восприятие и порой создает wow-эффект.
Нестандартная геометрия
Диагональное расположение блоков приходит на смену традиционной горизонтальной ориентации.
Полигональная графика — нестандартные многоугольники — используются и в деталях.
Параллакс
Параллакс — прием, который создает у пользователя ощущение объема на сайте за счет того, что фон и объект при прокручивании страницы двигаются с разной скоростью — не теряет популярности. И решения становятся все более креативными.
Креатив и чувство юмора
В стремлении запомниться и дольше удержать посетителей на своем сайте, все большую популярность у разработчиков приобретают детали, “ловушки” для пользователя.
Например, можно “покатать” сотрудника на стуле на карьерном сайте Альфа-банка.
Сайт ближайшего будущего — очень удобный, стильный, умный и минималистичный, но при этом — яркий, эффектный, запоминающийся и индивидуальный. Разработчикам главное, как и во всем, не переусердствовать и всегдя помнить конечную цель и задачи, которые должен решить интерактивный продукт. Думайте о бизнесе и пользователях и создавайте сайты, с которых не захочется уходить.
Источник — therunet.com