От автора: 2017 год уже задал движение по некоторым очень интересным направлениям, вследствие чего начинают появляться новые тенденции в веб-дизайне. В этом году нас ждет множество визуальных трендов, которые изменят лицо веб-дизайна и тонко повлияют на пользовательский опыт. Пользовательский опыт, несомненно, важен, однако в дизайне сайта нельзя отводить визуальным эффектам второе место, та как эмоциональная привлекательность дизайна также влияет на то, останется ли пользователь на сайте или нет. В сегодняшней статье я кратко опишу вам 5 визуальных тенденций, которые помогут освежить ваш дизайн в 2017.
1. Шрифты с засечками
Какое-то время в мире веб-типографики доминировали шрифты без засечек. На наших экранах красовались такие красивые шрифты, как Maven Pro, Futura и Helvetica Neue, они стали «must have» для обычного дизайнера. Однако сейчас в моду снова входят шрифты с засечками (не только в своей стандартной форме, но и в более забавных, модернизированных версиях).
На наших глазах в 2016 шрифты с засечками набрали популярность, все больше и больше дизайнеров шрифтов стали разрабатывать модернизированные версии шрифтов с засечками. Шрифты Slab Tall X, Justus и Novello изменили сам подход применения шрифтов с засечками в веб-дизайне.
Большая часть трендов возникает в совершенно других средах, после чего они распространяются на другие среды. Ниже представлен пример того, как шрифт с засечками еще до перехода в веб-дизайн оказал довольно сильное влияние на телевидение.
2016 подарил нам мега хит, сериал очень странные дела: короткое открытие сериала Netflix – это визуальное наслаждение, а шрифт с засечками, анимированный красно-неоновыми огнями, чертовски привлекателен. Интересный факт: шрифт в названии сериала был позаимствован из нескольких романов Стивена Кинга. В сериале используется модифицированная версия ITC Benguiat, созданная Ed Benguiat. Как и множество других трендов в дизайне, шрифты с засечками могут входить в моду спустя годы или даже десятилетия.
Не слышали про очень странные дела? Шрифты с засечками применялись в паре оскароносных фильмов, таких как медвежья история, комната и омерзительная восьмерка!
2. Естественные цветовые палитры
Недавно сайт Pantone объявил «greenery» цветом 2017 года. Цвет символизирует новое начало, что уместно, учитывая текущие события в мире. Leatrice Eisemen, исполнительный директор Pantone Color Institute заявила: «Зелень врывается в 2017 и дарит нам надежду, которой так не хватает обществу на фоне сложной социальной и политической обстановки».
Естественные и нейтральные тона, безусловно, заменят яркие и игристые цвета 2016 года. Это не говорит о том, что яркие цвета использоваться не будут, однако они точно не станут центром притяжения в веб-дизайне.
Естественные цвета впервые стали выходить на свет в 2016 году, мы с вами наблюдали это, особенно в телевизионных шоу. Сразу вспоминаются ходячие мертвецы и мир дикого запада. В ходячих мертвецах палитра использовалась для передачи темной атмосферы, в то время как в мире дикого запада применялись естественные цвета, но с насыщенными тонами, которые подпитывали атмосферу фэнтези. Вы удивитесь, узнав, насколько сильно телевидение влияет на нашу жизнь, как оно влияет на то, на какие типы визуальных эффектов мы будем реагировать.
Естественный не значит «коричневый» или «Greenery» с сайта Pantone, цвета можно смешивать и подбирать. Тренды домашнего декора в 2016 были в значительной степени прикованы к естественным цветовым схемам и отлично продемонстрировали, как можно создавать привлекательные макеты без ярких цветов.
3. Мега меню
Медленно, но верно мы наблюдали смерть или, как минимум, минимизацию иконки-гамбургера. Эта иконка помогает освободить место, однако она также может создать преграду между пользователем и тем, куда он хочет перейти. Сохранится ли этот тренд или выйдет из моды, остается загадкой. В 2017 году десктопные меню будут менять не только макеты, но также будут увеличиваться в размерах. Как говорится, «играй по-крупному или иди домой», и в настоящее время у мега меню есть большие шансы стать трендом.
На сайте Huffington Post уже довольно давно реализована своя версия мега меню.
Из названия мега меню следует, что это большие навигационные меню, раскрывающиеся на весь экран, которые полностью погружают пользователя и держат его в нужном направлении, одновременно повышая конверсию и улучшая пользовательский опыт. Однако этим мега меню не ограничено, оно умеет показывать страницы второго уровня вложенности, вложенный контент, а в некоторых случаях реклама мега меню – это больше, чем визуальный тренд, оно может полностью изменить структуру и контентную стратегию веб-сайта.
4. Перекрывающий контент
Перекрывающий контент хорошо работает на художественных сайтах с большим количеством изображений. Такой контент придает дизайну динамики и обладает способностью объединять несколько трендов, придавая глубины и погружения.
Перекрывающий контент – это не просто поместить один элемент поверх другого, речь идет о художественной перестановке макета, чтобы каждый элемент засиял. Например, если вы выкладываете домашнюю еду в инстаграм, вы никогда не свалите все в одну тарелку, надеясь на много лайков, вы будете тщательно расставлять ингредиенты так, чтобы каждый из них был четко виден, а цвета сочетались. Перекрывающий контент следует той же философии дизайна.
Размещение текста поверх текстур и геометрических фигур становится все более популярным, это привлекает внимание к самому контенту, а тени помогают выделить эти элементы на фоне текстур и фигур (читаемость и контраст всегда должны быть на первом месте).
Перекрывающие элементы могут не только выделить контент, они могут указать пользователю, куда нужно смотреть сейчас, а куда потом. С помощью перекрывающего контента можно создавать бесшовные переходы по веб-странице. Эта тенденция сильно завлекает пользователей, особенно если добавить анимацию.
5. Градиенты (опять?)
Градиенты то входят, то выходят из моды. Помните, как инстаграм поменял свой логотип в 2016? Как только его показали, его тут же раскритиковали. Несмотря на холодный прием, переход от скиоморфизма к многоцветному градиенту, безусловно, впечатлил пользователей.
В прошлом году Pantone решили, что нам мало одного цвета, нужно два. И нам подарили прекрасный дуэт Rose Quartz и Serenity, изящно перетекающие друг в друга. Градиент этих двух цветов был определенно оценен, и хотя в этом году мы не получили два цвета, но можно ожидать, что градиенты сыграют огромную роль в визуальном дизайне в 2017.
Градиенты в веб-дизайне – фантастический способ удивить пользователей. Градиенты можно применять не только на фоны, они подходят также для логотипов, выделяя их на веб-странице. Прекрасный пример – логотип Олимпийских игр 2016 в Рио.
Заключение
Как видите, тренды в дизайне интерьеров, графическом дизайне, дизайне заголовков и т.д. могут влиять на тренды веб-дизайна (и наоборот!). Вот почему очень важно черпать вдохновение в вещах вокруг нас. Вы даже можете ввести свой собственный тренд!
Не бойтесь адаптировать и смешивать тренды. Пользовательский опыт должен быть важнее визуальной красоты, однако нужно найти способ, как это все компенсировать. Все это приводит к уникальным решениям, и ваша способность сочетать творческие идеи с эффективным интерфейсом – вот что отличает вас от других дизайнеров. 2017 принесет еще много новых визуальных трендов, но если вы воспользуетесь и поэкспериментируете с этой пятеркой, вы почти наверняка обновите свой дизайн!
Автор: Gabrielle Gosha
Источник: //www.sitepoint.com/
Редакция: Команда webformyself.
