Тренды веб-дизайна 2018

Тренды веб-дизайна 2018
21.01.2018 КОММЕНТАРИИ: 1

По традиции в январе отраслевые СМИ публикуют прогнозы по ключевым тенденциям разработки и дизайна сайтов на год предстоящий. Представляем вашему вниманию микс из подборок Onextrapixel и WebFlow.

Тренд №1: Ассиметричные макеты

Геометрически выверенные, симметричные модульные сетки наскучили дизайнерам, которые всегда находятся в погоне за более интересными и креативными раскладками. Как только SCC позволил, новаторы бросились экспериментировать с ломаными макетами. Но не стоит воспринимать это как стремление к хаосу… Напротив, это стремление к гармонии и естественному положению вещей. Один элемент наслаивается и частично перекрывает другой, никаких сдерживающих рамок и искусственных границ — всё как в жизни.

Ассиметричные макеты - тренд веб-дизайна 2018

Ломаные макетные сетки - тренд дизайна сайтов 2018

Тренд №2: Брутализм

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

Брутальный дизайн сайта - тренд 2018

Ещё один пример брутализма в веб-дизайне

Ещё один пример брутального дизайна сайтов

Тренд №3: Анимация как средство навигации

Интерактивность — одна из самых важных тенденций веб-дизайна в 2018 году. Анимация и микровзаимодействия (спецэффекты при наведении курсора) присутствуют на каждом новом сайте. И в большинстве случаев они служат практически полезным целям: 

  • Показывают, как работает процесс.
  • Подсказывают пользователям, как использовать предлагаемый продукт.
  • Повышают качество взаимодействия с информацией, привлекая внимание пользователей к наиболее значимым фрагментам контента в подходящее время.
  • Оптимизируют маршрут перемещения посетителя по сайту: подсказывают, куда и когда перейти, на что нажать.

Анимационная навигация - тенденция веб-дизайна 2018

Анимированные инструкции - тренд веб-дизайнв 2018

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

Тренд №4: Плавающее горизонтальное меню

Фиксируя положение меню на экране, а не на странице, вы заботитесь о том, чтобы оно всегда оставалось перед глазами пользователей. Это старый добрый приём. Отличие современного плавающего меню в том, что оно располагается заметно ниже верхней кромки окна браузера. Непонятно, зачем дизайнерам понадобилось делать такой зазор, но смотрится очень эффектно.

Плавающее горизонтальное меню - актуальная тенденция веб-дизайна в 2018 году

Ещё один пример плавающего меню сайта

Тренд №5: Иллюстрации вместо фото

Подбор изображений всегда был головной болью для дизайнеров и маркетологов. К 2018 году нашлось решение извечной проблемы. Теперь вместо многочасового поиска подходящего стокового фото маркетолог ставит задачу по подготовке нужной картинки художнику. Иллюстрации эффективно справляются с любыми изобразительными задачами и поддерживают визуальное единство сайта. Плюс, за счёт абстрактности рисунков пользователи легче олицетворяют себя с героями сюжетов. Ведь не зря же на открытках всегда картинки, а не фото.

Иллюстрации вместо фото - тенденция дизайна сайтов 2018

Ещё один тренд дизайна сайтов 2018 — это пояснительные иллюстрации. Как известно, люди любят изучать инструкции по картинкам. Позвольте им делать это и в цифровой среде. Учитесь на примере Slack.

Пояснительные иллюстрации - тренд дизайна сайтов 2018

Тренд №6: Переменные шрифты

Совместный проект крупнейших технологических компаний: Apple, Google, Microsoft, Adobe — нацелен на создание пластичных шрифтов. Так называемые переменные шрифты позволят дизайнерам-типографам устанавливать оптимальные для каждого конкретного сайта параметры буквенных начертаний. Штрихи (глифы) можно будет интерполировать по 64 000 различных осей (вес, ширина, и т. д.). Для каждого стиля («Полужирный», «Конденсированный» и т. д.) можно будет настроить конкретные позиции в пространстве.  Один файл переменного шрифта будет вести себя как несколько разных шрифтов, переходя от тонкого начертания Light к жирному Black. Технически дизайн упростится, так как отпадёт необходимость вызывать 16 различных шрифтов в CSS.

Переменные шрифты - самый ожидаемый типографический проект 2018 года

Тренд №7: Огромные шрифты

Годы идут, а крупная типографика не собирается покидать топ трендов веб-дизайна. Более того — она укрепляет свои позиции. Ведь смелые громадные надписи жирным шрифтом прекрасно сочетаются с другими модными тенденциями: асимметричными макетами, интенсивной цветовой палитрой. Кроме того, они помогают бренду запомниться. На сайте Paradiso огромная типографика применяется для привлечения внимания не только к заголовкам, но и к логотипу. 

Огрромная типографика - тренд веб-дизайна 2018

Тренд №8: Ставка на визуализацию данных

Чистые факты (без текста) не только экономят время пользователя на поиск необходимой информации, но и повышают её доступность на мелких дисплеях мобильных телефонов. Пример успешного использования визуализации данных демонстрирует сайт производителя электровелосипедов Neematic. Вместо того чтобы писать длинный текст о преимуществах выпускаемой продукции, компания приводит 4 голых факта, представляющих наибольший интерес для потенциальных покупателей.

Фокус на чистых данных - тенденция веб-дизайна 2018

Тренд №9: Интерактивные фоны

Полноэкранные видеофоны оказались тяжеловатыми для веба, и хотя они по-прежнему популярны, параллельно силу набирают ресурсосберегающие альтернативы — интерактивные и «частичные» видеофоны. Так называемый «частичный» вариант видеофона построен на JavaScript, благодаря чему быстро загружается придаёт странице динамизм и сохраняет её лёгкой.  Интерактивные фоны позволяют пользователям взаимодействовать с сайтом. К примеру, на Creative Wallonia можно рисовать каракули в фоновом режиме или создавать настоящие произведения искусства. Сайт и посетителей к творчеству мотивирует (соответственно своему названию), и себе рейтинги повышает.

Пример интерактивного фона сайта

Тренд №10: Органические формы (Blobs)

Поговаривают: «Острые углы пошли по пути динозавров»… Сплетни, конечно, но о процветании органических форм в современном веб-дизайне спорить не приходится. Природа не терпит прямых линий. Вторя ей, художественные оформители интерфейсов всё чаще прибегают к плавным округлым и сферическим формам: кляксам, каплям, волнам, пузырям. Приверженцы тренда уверены, что использование обтекаемых фигур сглаживает острые углы перехода между различными типами контента.

Органические формы (Blobs) в дизайне сайта

Источники:

 

Комментарии

profile 01.11.2018 07:09
Need cheap hosting? Try webhosting1st, just $10 for an year.

Ответить Ответить с цитатой Цитировать

Добавить комментарий


Защитный код
Обновить