В условиях высокой конкуренции за внимание аудитории выросли и требования к разработчикам сайтов. Теперь владельцев онлайн-ресурсов интересует не только посещаемость их площадок, но и то, как ведут себя пользователи. Например, сколько времени они проводят на странице, дочитывают ли материалы до конца и в каких случаях совершают покупку. Как управлять вниманием онлайн-аудитории, в какую сторону меняется web-дизайн и зачем нужны сайты, если есть социальные сети, мы обсуждали на семинаре Huawei Media Hub в Алматы.
UI и UX-дизайн
До 2005–2007 годов в решении бизнес-задач разработчики опирались на интуицию и опыт. Но в условиях конкуренции и растущих запросов пользователей старый подход оказался неэффективным. Потребность анализировать поведение пользователей на сайтах возникла практически одновременно с такой возможностью – онлайн-платформы накопили большие объемы данных, в web-пространстве появились статистика и аналитика. Чтобы создавать более удобные интерфейсы и достигать целей заказчиков, разработчики стали изучать поведение онлайн-аудитории.
Так появились UX (user experience – пользовательский опыт) и UI (user interface – пользовательский интерфейс) – дизайнеры. Первые отвечают за функциональность и адаптивность продукта и то, какие эмоции он вызывает при взаимодействии. Вторые занимаются графической частью интерфейса, будь то анимация, иллюстрации и просто кнопки, разделы и другие элементы на странице.
Функция всегда первична, а эстетика складывается из практичности. К примеру, выравнивание по левому краю помогает пользователю быстрее читать текст. Заголовок чуть-чуть увеличить – казалось бы, вкусовщина, но, если у него будет низкий контраст, текст сольется с анонсом. Должно быть либо одинаково, либо непохоже. Когда возникают пограничные варианты, мозг задает вопросы, и появляется чувство, будто что-то не так.
Поведение пользователей
Для анализа поведения пользователей используются разные инструменты, один из популярных – сервис Google Analytics. Здесь есть инструмент «тепловая карта». Она выводится на отдельный экран, где видно, куда человек заходит, а куда – нет. Если нужно, чтобы люди кликали на конкретное место, мы решаем эту задачу, повышая его приоритет на странице.
В случае рекламных баннеров многое зависит от их местоположения на сайте. Если реклама находится в нижней части страницы, придется отслеживать, как много людей до нее доходят. Также нужно учитывать эффект «баннерной cлепоты», когда посетитель неосознанно игнорирует навязчивые объявления. Более эффективным форматом может стать нативная реклама.
Для создания удобного интерфейса разработчики используют разные подходы, например, Atomic design или дизайн-систему. Так, любую web-страницу можно представить в виде нескольких экранов, допустим, блоков с анонсами и рекламой, заголовками и так далее. Из самых мелких элементов – атомов (кнопки, иконки, поля ввода), потом собираются более крупные. Блоки чуть большего размера, состоящие из нескольких атомов, называются молекулами. К ним относятся навигация и меню сайта, карточки товаров, баннеры с подписями и прочее.
В результате соединения атомов и молекул получается цельная структура будущего сайта. Предварительная версия – это шаблон, а финальная – полноценный макет с реальным контентом. Дизайн-система подходит как для бизнеса, так и для сервисов, медиа и корпоративных ресурсов. Такой подход распространен среди крупных проектов с высокой потребностью в развитии и масштабировании.
Сайты или соцсети?
Для малого бизнеса сайт может быть и не нужен, будет достаточно простого сайта-визитки с поддержкой в Facebook, но если речь идет о крупном бренде или корпорации, вмешивается имиджевая составляющая. Плюс нужно учитывать, что контент в социальных сетях сегодня однотипный, и это повышает конкуренцию за внимание. Другой минус информации в социальных сетях – ее короткий срок жизни. Помимо этого, социальные сети сами понижают рейтинги рекламных записей и уменьшают охват аудитории, даже при условии большого количества подписчиков.
Например, новую модель автомобиля вряд ли получится продать без сайта. Высокая добавочная стоимость будет зависеть не только от характеристик машины, но и от эмоциональной составляющей. С момента, когда человек первый раз увидел понравившуюся модель, и до покупки в среднем приходит около полугода. Человек еще не раз зайдет на сайт посмотреть фотографии и видео с автомобилем и только спустя время пойдет в салон. Ни одна соцсеть с этой задачей на текущий момент, наверное, не справится.
Запрос на индивидуальность
Тренды на рынке web-дизайна формируются не за один день. Это постепенный процесс, и любое новшество должно пройти проверку временем. Если новинку начали внедрять крупные компании, это знак, что нужно начинать думать в этом направлении.
Например, бизнес уже использует и дополненную реальность, и 3D – это может быть машина, которую можно покрутить мышкой, или жилищный комплекс с возможностью посмотреть квартиру со всех ракурсов. Все зависит от задач.
В 2010-е годы в web-дизайне прослеживался тренд на скевоморфизм с уклоном на декор и «вкусные» кнопки. Потом на смену ему пришел минимализм с плоскими изображениями и сдержанным объемом информации. Но стандартизация и переизбыток шаблонов привели к тому, что многие сайты стали однотипными. Думаю, со стороны бизнеса сейчас созрел запрос на индивидуальность. В том числе с помощью технологий, которые пока затратны в плане производства и не очень доступны с точки зрения потребления пользователями на любой платформе.
