Содержание
#1. Адаптивный дизайн
#2. Всплывающие уведомления
#3. Motion design
#4. Добавление видео
#5. Чат-боты
#6. Пустое пространство
#7. Интерактивность
#8. Минимализм
#9. Приходящие – уходящие тренды
#10. Уходящие
#11. Приходящие
// Тренды
Тренды Веб Дизайна 2020
Каждая отрасль обусловлена привязкой к определенным тенденциям. Особенно это касается графического дизайна, маркетинга и, конечно же, веб-дизайна. С самого начала «технологической революции» можно отследить массу изменений в разработке веб-сайтов.
Инновации расширяют возможности. А потому влияют на то, какие сайты мы захотим видеть. Так формируются новые тренды. Можно создавать довольно уникальные страницы. Но если хоть немного не следовать тенденциям, человека признают немодным, а сайт неинтересным.
Анализируя рейтинги Awwwards – сообщества, которое определяет лучшие сайты дня по типу этих, месяца и года по разным критериям мне удалось выделить грядущие тренды веб-дизайна.
В первую очередь, упор будет сделан на мобильные телефоны. Очевидно, что они используются для серфинга в Интернете не меньше, чем компьютеры и ноутбуки. Также стоит учитывать оконный режим браузера, который часто используется для одновременного просмотра нескольких веб-страниц.
Из личного опыта могу сказать, что 80% неадаптивных сайтов я покидаю моментально, поскольку с ними неудобно работать. Исключения – наличие необходимой мне информации. В таком случае я вынужден приспособится. Но впереди 2020. Задача разработчиков – избавить пользователей от сложностей.
При добавлении этого элемента необходимо учитывать целевую аудиторию и ее потребности. В дальнейшем стоит обращать внимание на активность и основные интересы. Важно правильно настроить тематику и частоту уведомлений. Этот элемент должен помогать пользователям, а не отпугивать их.
Как это обеспечить? Реализацией «моушн дизайна». Один из самых банальных примеров – добавление GIF-анимаций для ознакомления с основными характеристиками автомобиля. Более сложной может быть анимация HTML5 и Canvas полотно. Это обеспечит гораздо быструю загрузку страницы, анимации и повысит сайт в результатах поиска яндекса и гугла.
GIF-файлы могут передавать самые сложные идеи за короткий промежуток времени. Более того, они точно заинтересуют пользователя, что заставит его задержаться на сайте. Одно из ключевых преимуществ – они работают в любом браузере и смартфоне, потому будут доступными для всех.
Но также стоит учитывать, что анимации, как правило, недолгие. Считайте, что есть не больше 5 секунд. В этот промежуток необходимо вложить весь посыл. Если не получается, лучше заменить ее видео.
Немного статистики:
Информация взята с опроса The State of Video Marketing 2019.
Могу смело утверждать, что сегодня видеоконтент – безусловный лидер среди трендов веб-дизайна. Я не знаю ни об одном успешном проекте, представители которого выступали против добавления видео.
Тем не менее, есть небольшой список правил по добавлению этого элемента на свой сайт:
Чат-боты – программы, предназначенные для имитации разговора, - в настоящее время развиваются и совершенствуются, становясь более похожими на людей. Они собирают базу постоянных вопросов и в дальнейшем моментально отвечают заинтересованным пользователям.
Преимущества чат-ботов в том, что они дешевые (дороже, чем раздел FAQ, но значительно дешевле сотрудника поддержки) отвечают мгновенно и доступны 24/7. Недостатки: не понимают саркастических запросов, не могут правильно ответить на вопрос, заданный впервые.
Эксперименты с чат-ботами начались несколько лет. Но пока они запоминались только как глупая программа, неспособная нормально отреагировать на банальный запрос. Сегодня они «научились». Теперь боты могут полностью оформить заказ, помочь с регистрацией или восстановить аккаунт.
Использование «белого» пространства – один из принципов веб-дизайна и эффективный способ привлечения внимания. Под пустым пространством подразумевается область между элементами дизайна, а также пространство внутри некоторых элементов веб-страницы (включая междустрочный интервал и растяжение шрифта).
Важно также понимать, что вопреки оригинальному названию «white space» пространство не должно быть именно белым. Это может быть любой цвет, текстура или даже картинка заднего фона. Суть пустого пространства в том, что оно не несет никакой смысловой нагрузки.
Что обязательно стоит знать при разработке веб-дизайна – виды пустого пространства: активное и пассивное. Первый тип – это специально созданные пробелы между элементами веб-дизайна, которые определенным образом ведут пользователя по странице. Второй направлен на улучшение эстетического вида страницы. Сюда входит междустрочный интервал, отступы между абзацами и прочие подобные элементы.
Развитие технологий привело к тому, что качественный веб-дизайн по умолчанию предполагает создание более сложных и динамичных элементов. Таким образом, сегодня мы можем видеть множество интегрированных видео, микровзаимодействий, анимированной прокрутки и много другого.
Одной иллюстрацией я не смогу передать всю суть интерактивности, потому предлагаю Вам ознакомиться с Garbage31. Это сайт от украинской команды действительно вывел понятие «взаимодействия с пользователем» на новый уровень. Эту и более сложную анимацию вы можете увидеть в работах агентства Merehead.
Однако, второй вариант значительно уступает в этом плане по следующим причинам:
Сегодня минимализм движется к максимальному упрощению с отображением как можно меньшего количества элементов на одной странице. Хорошим примером использования минимализма является сайт Apple.
Напоследок хочу выделить несколько трендов, которые теряют свою актуальность, а также те, которые точно обретут популярность в ближайшие годы.
Параллельная прокрутка. Несколько лет многие сайты использовали этот прием. Суть в том, что задний фон также листался вместе с передним, но с большей или меньшей скоростью. Она делает сайт более привлекательным, однако сильно увеличивает скорость загрузки веб-страницы, что неприемлемо для современных тенденций.
Сложный дизайн. Уход этого тренда вытекает из минимализма. Ранее было популярно уделять внимание любой мелочи (разнообразие шрифтов, множество изображений, пышность и прочие подобные элементы). Сегодня пользователю нужен быстрый доступ к информации. Рассматривать картинки просто нет времени.
3D. Не скажу, что это прям грядущий тренд. Однако, лет через 5 он наберет ход. Сегодня для его полноценной реализации не хватает доступных 3D мониторов. Когда их стоимость упадет, частью веб-дизайна станет представление информации в объемном виде.
VR. Новый уровень интерактивности. Сегодня он, опять-таки, недоступен по финансовым соображениям. Через несколько лет воплотить такую идею будет намного проще. Вполне вероятно, что пользователям не нужна будет мышка для ознакомления сайтом. Достаточно будет лишь моргнуть глазом или кивнуть головой для перехода между страницами.
Веб Дизайн Галерея
наши работы
С 2015 года помогаем клиентам реализовывать идеи!