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

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

Запомните, сегодня у вас есть всего лишь 8 секунд, чтобы привлечь внимание потенциального клиента.

Стойте, совсем недавно ведь было 15!

Вот именно, что было! С появлением сторис в инстаграме, фокус внимания уменьшился практически вдвое.В 2020 году 15 секунд будут казаться целой вечностью. Так какие же дизайнерские приемы будут самыми эффективными?

Яркие элементы в оформлении

Ещё год назад мягкие и приглушенные оттенки были на пике моды. Всем казалось, что так они сделают сайт более концептуальным и современным.

Забудьте об этом! Сегодня серые и пудровые оттенки настолько приелись, что бренды, породившие этот тренд, стараются убежать от него, делая свой сайт более ярким и «живым».

пример того как Apple делает сайт более ярким и живым

пример того как Samsung "оживляет" свой сайт внося яркие элементы

Этой тенденции оказались подвластны даже автопроизводители! Посмотрите, как Toyota сочетает негативное пространство и минималистичные яркие иконки.

Toyota сочетает негативное пространство и минималистичные яркие иконки на сайте

Темные темы

В 2019 году темные темы стали настоящим трендом: в неравном бою цветовых схем пал даже Instagram, который был верен белому дизайну всю свою историю. Сегодня даже он получил свою ночную версию!

Пример темной темы в приложении Instagram

В 2020 году эта тенденция будет только расти, и у вас есть все шансы воспользоваться ею себе в пользу.

Грамотно составленные темные темы, как у автора иллюстрации ниже, будут смотреться одновременно как дерзкими, так и элегантными, что привлечет внимание потенциальных покупателей. А это именно то, что нужно!

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

Градиенты

Свежий тренд, который только набирает обороты. Аудитории начинают надоедать одинаковые однотонные сайты: они хотят чего-то нового.Сегодня этим свежим дыханием стал градиент.

Impossible Bureau как пример сайта с градиентом (главная)
Impossible Bureau как пример сайта с градиентом (меню)
Сайт агентства Impossible Bureau собрал в себе основные тренды 2020: градиент, минимализм, темные темы и шрифты с засечками.

Так как эта тенденция только зарождается, то у дизайнеров есть много пространства для фантазии.

Используйте необычные цветовые схемы, переходы и сочетания. Нужно поспешить, так как к концу 2020 года все самые смелые идеи будут испробованы.Аудитория не любит плагиат!

Минимализм

https://youtu.be/2au2aMIRqOQ

Тренд, который держит пальму первенства уже несколько лет, и даже не думает сдавать позиции. Мы уже объясняли принципы такого дизайна:

в 2020 году основной акцент будет на работе с негативным пространством и точечной расстановкой ярких акцентов. Не бойтесь рисковать — мы входим в новую эпоху!

Более того, сегодня становится все популярней подвид «минимализма на максималках» под названием «Аптекарь». Это особый стиль аскетичных иллюстраций, которые чем-то напоминают упаковки лекарственных препаратов в США.

Пример упаковки лекарственных препаратов в США

Если в начале 2019 года его применяли исключительно в косметологии и парфюмерии, то сегодня такой стиль используется как в производстве продуктов питания, так и в типографии. Вполне возможно, что постепенно он войдет и в веб-дизайн. Тем более, что все предпосылки для этого есть.

Футуризм

Если мы уже заговорили о старте новой эпохи, то не вспомнить о футуризме будет греховно! Эта тенденция знаменует собой переход между целыми вехами развития человечества. Футуристы прошлого подарили нам арт-деко, «космический» дизайн 60-х и даже трилогию «Матрицы». Возможно, именно ваши работы станут символом новых «Ревущих двадцатых».

Пример оформления сайта в стиле футуризм
Пример работы в стиле футуризм.

Экспериментируйте с формой и цветом, создавая уникальные композиции. Среди самых очевидных примеров для подражания можно вспомнить сериалы Star Trek и Doctor Who: они насквозь пропитаны идеей футуризма.

Есть свои идеи? Не бойтесь воплощать их, даже если они кажутся безумными. Никто ведь не знает, каким будет будущее: грубым и дерзким как в сериале «Years&Years» или же ярким и эпатажным как коллекции Джеффри Стара.

Пример эпатажа - сайт с коллекцией Джефри Стара

Визуальная деформация

Человеческий мозг привык работать с шаблонами. Что же сделать, чтобы привлечь внимание? Играйте с геометрией, деформируйте текст, нарушайте физику! Такая реклама привлечет внимание и впишет ваше коммерческое предложение в подсознание потребителя.

Отличный пример:

новый киевский ТЦ River Mall, который в своем дизайне объединил визуальную деформацию и анимацию.Именно благодаря этому они стали известными по всему СНГ.

Киевский River

киевский River Mall как пример визуальной деформации

Также ярким примером нового тренда может служить экспериментальный сайт от didgital-агентства Booreiland.

Изометрия

Рисование трехмерных объектов в двухмерном измерении – еще один необычный тренд 2020 года. С помощью такого приема можно познакомить пользователей с целой вселенной, не перегружая их при этом лишней информацией.

пример изометрического дизайна от криптоплатформы CryptoGoal
Изометрический дизайн криптоплатформы CryptoGoal.io от KisaDesign

Главная фишка изометрии в том, что она одновременно плоская и глубокая. Это и не полноценный 3D, но и точно не флет-дизайн. Это что-то совершенно новое и цепляющее!

Лучше всего она подойдет для создания иконок, лого, посадочных страниц, инфографик и карт проезда.

3D композиции

Все уже устали от флет-дизайна. Сегодня люди хотят видеть объем!

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

Смело сочетайте 3D и минимализм — так изображение не будет выглядеть перегруженным. А если туда ещё добавить визуальной деформации, то вы станете настоящим трендсеттером, как Maxim Gedrovitch.

.

Хотите ещё сильнее выделиться? Сочетайте 3D и интерактивность, как Бруно Саймон на своём сайте-визитке. Главное, чтобы сервер был готов к огромным нагрузкам, так как сайт быстро станет очень популярным.

Интерактивность

Girls just want to have fun! И boys вместе с ними 😊

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

Создавайте целые мини-вселенные! Да, сегодня сторителлинг перешел даже в дизайн. Посмотрите, как IT-компания AKITA смогла рассказать, как передается информация через интернет. Благодаря такому интерактивному разделу даже ребенок поймет суть их работы.

IT-компания AKITA визуально показывает как передается информация через интернет

Также мы не могли пройти мимо украинского проекта Garbage31. Он рассказывает, как бороться с загрязнением, где можно сдать мусор на переработку и почему это так важно.

пример интерактивности сайта украинский проект Garbage31

Анимация

Не желаете заморачиваться с 3D-дизайном или интерактивами? Тогда обратите внимание на анимацию: этот прием вдохнет жизнь в статичный дизайн, сделав его более живым и современным. Анимация передает любые сложные идеи за несколько секунд. Сегодня такой формат передачи информации может быть эффективнее чем просто картинка или даже текст.

Зачем расписывать что-то на 2-3 страницы, если эту информацию можно передать 5-секундной GIF-кой?

Делайте неожиданные переходы, интегрируйте веселые gif-ки. Главное, вызвать сильные эмоции! Если этого не делать — о вас забудут через несколько минут.

Только знайте меру: слишком большое количество анимации превратит ваш сайт в личный блог Гомера Симпсона. Кстати, а он то существует в реальности!

Креативные засечки на шрифте

У всех дизайнерских трендов 2020 года есть общий знаменатель — они созданы для привлечения внимания. Сегодня эти тенденции дошли и до шрифтов: Times New Roman настолько всем примелькался, что все компании с ним будут просто на одно лицо. И это несмотря на то, что это шрифт с засечками!

Но если вы рискнете и выберете что-то новое, то вас точно запомнят. Иногда будет достаточно даже одной буквы! Почему же так происходит?

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

Посмотрите на сайт дизайнерской студии Neuebel: 9 ноября Awwwards признали его «Сайтом дня» именно из-за уникальной типографии и «висящих» изображений.

пример Креативных засечек на шрифте сайт neuebel

Изображения в пространстве

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

Такой стиль уже зарекомендовал себя в наружной рекламе, и в 2020 перейдет в веб-дизайн. Посмотрите, как дизайнерская студия MakeReign уже применила этот тренд в реальности.

Mobile first

Это уже нечто больше, чем просто тренд. Сегодня мобильная версия сайта жизненно необходима для его существования.

Доля смартфонов в интернет-трафике непреклонно растет: если 5-7 лет назад основные силы были сосредоточены на веб-версии, то теперь нужно бросать все силы на мобильную. Если вы только будете создавать сайт, настоятельно советуем сконцентрироваться на ней, и только потом адаптировать её под десктоп.

О чем нужно забыть?

Большинство современных антитрендов выходят из самых главных тенденций 2019 года. Люди настолько перенасытились определенными видами дизайна, что просто не хотят их видеть.

Сложные композиции

Каждый элемент сайта должен нести смысловую нагрузку. Эта красивая завитушка висит без дела? Так удалите её!

В 2020 году основным трендом будет функциональный минимализм — всё, что не приносит пользы должно быть удалено.

Чрезмерное разнообразие

Не нужно наполнять сайт десятками разных фактур и шрифтов. В большинстве случаев это будет выглядеть, как будто вы перенеслись на машине времени из нулевых.

Выберите 2-3 основных шрифта и используйте только их.

Упростите доступ к нужной информации — сегодня у людей нет время рассматривать ненужные картинки.

Параллельная прокрутка

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

Пудровые и приглушенные цвета

Эпоха мягких оттенков уходит в прошлое. Сегодня люди хотят чего-то яркого и необычного. Как же это будет сочетаться с приглушенными цветами? Вот именно, что никак!

Если вы всё-таки хотите оставить свою любимую мягкую палитру, то советуем хотя бы немного покрутить ползунки яркости, выделив ключевые элементы интерфейса.


А какой тренд больше всего понравился вам? Что бы вы использовали в своем сайте в 2020 году?

Оставите комментарий?