Как Трамп покупал Tesla
Jaguar Type 00 в Париже

9 головокружительных трендов в веб-дизайне в 2021 году

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

9 головокружительных трендов в веб-дизайне в 2021 году

Мы в дизайн-студии Магвай всегда внимательно следим за любыми изменениями в дизайне и часто обращаемся к опыту зарубежных коллег. А наличие представительства в Берлине дает возможность впитывать любые новшества, рождающиеся в it-столице Европы.

Поэтому мы взяли на себя смелость и подготовили перевод статьи, вобравшей в себя мнения профессионалов из "99designs" (99designs - компания, основанная в 2008 году в Австралии, но имеющая на данный момент офисы по всему миру. Она управляет онлайн-платформой, соединяющей экспертов в области дизайна и потенциальных клиентов).

Итак, каким будет веб-дизайн в 2021?

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

9 трендов в веб-дизайне, которые «выстрелят» в 2021 году:

1. Параллакс-скроллинг

2. Неоморфизм

3. Абстрактные графические композиции

4. Спокойная цветовая гамма

5. Прецедентный веб-дизайн

6. Трансформация скроллинга

7. Цифровая интерпретация реальных продуктов

8. Опросники, которые увлекают пользователя

9. Трехмерные цвета

1. Параллакс-скроллинг (эффект параллакса)

От минимального взаимодействия до распадающегося на частицы бэкграунда – каждый год мы видим, как растёт популярность веб-анимации. В 2021 году она становится более сложной: разделяются блоки страницы на передний и задний планы, создавая тот самый параллакс-эффект.

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

Глубина, которая создаётся за счёт использования переднего и заднего планов, также даёт дополнительное преимущество погружения, превращая экран компьютера в нечто похожее на театральную сцену. Когда пользователи перемещаются по веб-странице, их магическим образом увлекает это взаимодействие. Но, в конце концов, разве интернет – не волшебство?

By Minh Pham via Dribbble

2. Неоморфизм

В прошлом году неоморфизм набирал невероятную популярность, а в 2021 году обещает ввести нас в парадоксальную эпоху минималистичного реализма. Этот стиль является преемником скевоморфизма – подхода, при котором визуализируются знакомые пользователю, но устаревшие элементы из реальной жизни. Расцвет скевоморфизма в значках приложений пришёлся на начало 2010-х годов. Эту тенденцию значительно потеснил flat-дизайн, который упростил значки и цвета, сделал их менее реалистичными, но более единообразными и узнаваемыми.

Мы определяем неоморфизм как разновидность нового скевоморфизма, обращающего flat-дизайн в реалистичные 3D-объекты

Клэр Тейлор,

Неоморфизм представляет собой слияние обеих тенденций, в этом случае имитируется объём предмета за счёт выборочно падающих теней, при этом используются полуплоские цвета. Чаще всего эффект напоминает цифровое тиснение или дебоссинг. Такой подход позволяет дизайнерам восстановить тактильные ощущения, которые были утеряны в эпоху плоского дизайна, и это, в свою очередь, усиливает связь пользователя с объектом. Вероятно, в 2021 году мы увидим этот стилизованный реализм в кнопках, формах поиска и текстовых формах.

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2FSaraSalehi&postId=195831" rel="nofollow noreferrer noopener" target="_blank">Sara Salehi</a> via Dribbble
By Sara Salehi via Dribbble
By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2Fgeorgetangwl&postId=195831" rel="nofollow noreferrer noopener" target="_blank">George Tang</a> via Dribbble
By George Tang via Dribbble

3. Абстрактные графические композиции

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

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

Тристан Ле Бретон,

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

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fen.99designs.de%2Fblog%2Ftrends%2Fweb-design-trends%2FBy%2520kreat%25C4%25B1va%2520via%2520Dribbble&postId=195831" rel="nofollow noreferrer noopener" target="_blank">kreatıva</a> via Dribbble
By kreatıva via Dribbble

4. Спокойная цветовая гамма (цвета, комфортные для глаз пользователей)

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

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2Fstudiovoila&postId=195831" rel="nofollow noreferrer noopener" target="_blank">Viola</a> via Dribbble
By Viola via Dribbble

Наши миры шумные, усталость от Zoom’a – та ещё вещь. В 2021 году веб-дизайн сократится до «одного дела за раз», чтобы не отвлекаться и сделать взаимодействие более комфортным

Клэр Тейлор,

Это отчасти объясняет популярность тенденции прошлого года – тёмные цветовые схемы, противопоставленные чересчур яркому белому, который преобладает на дисплеях.

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

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2Fdavinaspriggs&postId=195831" rel="nofollow noreferrer noopener" target="_blank">Davina Spriggs</a> via Dribbble
By Davina Spriggs via Dribbble

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

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

Рави,

5. Прецедентный дизайн

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

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

Тристан Ле Бретон,

В 2021 году мы увидим веб-дизайнеров, которые продолжают ценить свою роль, помогая миру пережить сложные времена.

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

By Arthur Mineev via Dribbble

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

6. Трансформация скроллинга

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

By JP via Dribbble
By Vilius Vaicius via Dribbble

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

7. Цифровая интерпретация реальных продуктов

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

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

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

8. Опросники (Quiz), которые увлекают пользователя

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

By Christian Werther via Dribbble

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

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

By Florian Pollet via Dribbble

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

9. Трехмерные цвета

Цветовые схемы в веб-дизайне уже некоторое время имеют тенденцию к градиенту, и тренд этого года кажется следующей эволюцией, когда цветовые переходы становятся более реалистичными, чем когда-либо. Следуя примеру Apple Big Sur OS, мы ожидаем, что цвета будут насыщенными и трёхмерными, почти как фрукты, которые вы можете сорвать прямо с экрана.

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2Funfold&postId=195831" rel="nofollow noreferrer noopener" target="_blank">unfold</a> via Dribbble
By unfold via Dribbble
By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2Fmerts&postId=195831" rel="nofollow noreferrer noopener" target="_blank">Mert Arslan</a> via Dribbble
By Mert Arslan via Dribbble

Эта тенденция достигается за счёт затемнения, которое придаёт округлость плоским иконкам прошлых лет. Хотя мы ожидаем, что это будет чаще всего появляться на значках приложений, веб-дизайнеры также отказываются от аккуратных переходов градиентов для смешанных цветов фона, которые кажутся более несовершенными и естественными. Два цвета, расположенные рядом, могут внезапно слиться друг с другом или могут сохранять тени и глубину окрашенных объектов. В целом, эта тенденция предполагает, что цвета веб-дизайна 2021 года стремятся к более высоким уровням реализма.

By <a href="https://api.vc.ru/v2.8/redirect?to=https%3A%2F%2Fdribbble.com%2FAntonShakirov&postId=195831" rel="nofollow noreferrer noopener" target="_blank">Anton Shakirov</a> via Dribbble
By Anton Shakirov via Dribbble

В 2021 году мы увидим множество дизайнов, таких как Big Sur от Apple: сочная графика, градиенты, множество теней.

А вы готовы к ошеломительным изменениям в веб-дизайне 2021 года?

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

По материалам статьи https://en.99designs.de/blog/trends/web-design-trends/

4848
реклама
разместить
23 комментария

Комментарий недоступен

18

Ммм...прямо классика жанра) Переход на личности с долькой "мое мнение самое правильное" и никаких компромиссов - ништяк)

Читайте статью, это переводной материал людей, которые точно имеют больше опыта, чем у вас, при всем уважении.
А если без прикрас, то Вы - обычный тролль)

1

Если добавить визуальные примеры описывающих суть, будет совсем отлично😁

9

Добавила визуальные примеры 

3

Настолько головокружительные тренды, что лучше не смотреть их

7

Ура! Еще один топчик за 2020й но нет это 2021й. Хотя, "3D-цвета"... Надеюсь статья просто рофл 

6

а я сначала подумал, что это топчик за 19 год, а на 90% даже 18))))) 3д цвета мне тоже очень нравятся, кстати)))) 

1
Раскрывать всегда
ИТ-компании попросили у правительства поддержки на случай возвращения иностранных игроков — РБК

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

5757
88
11
11
О, дотационные додики заскулили… ничего не могут сделать в конкурентной среде.
реклама
разместить
OpenAI предложила разрешить обучать нейросети на защищённом авторским правом контенте

Иначе США «проиграет ИИ-гонку».

33
11
11
11
11
Как привести 1148 лидов и заключить 292 договора на 7 миллионов в нише натяжных потолков: кейс клиента Vitamin.tools

Расскажем, как клиент рекламной экосистемы Vitamin.tools, возвращающий до 18% от пополнения рекламы, интернет-маркетолог Надежда Горских добилась такого результата, продвигая заказчика через Яндекс Директ и VK.

Как привести 1148 лидов и заключить 292 договора на 7 миллионов в нише натяжных потолков: кейс клиента Vitamin.tools
2121
22
У наушников Apple AirPods появится функция синхронного перевода — Bloomberg

Устройство будет распознавать речь на иностранном языке и переводить её пользователю на нужный.

Источник фото: The Verge
100
1414
55
11
Наконец-то можно будет подслушивать о чем говорят цыгане в маршрутке!
«Алмаз-Антей» выделил производство гражданского транспорта в отдельное направление — туда перешла команда проекта электрокара E-Neva

Они работают над производством грузовиков БАЗ.

Прототип E-Neva. Источник фото: Александр Демьянчук / ТАСС
2020
11
Перевожу с чиновичьего: Путин деньги выделил после того, как прочитал заметку на VC
Досье на телефонных мошенников: Forbes узнал детали концепции государственной антифрод-системы

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

Фото «Интерфакс» 
66
44
Расширенные возможности криптовалютной биржи от TON
Расширенные возможности криптовалютной биржи от TON

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

ЦБ определил условия для получения статуса квалифицированного инвестора

Пока это проект. Регулятор планирует, что документ вступит в силу с 23 мая 2025 года.

100
3030
1010
66
33
11
П@дорасы
Видео: китайская UBTech показала своих роботов на заводе по производству электромобилей

Компания уже поставляет их на предприятия Volkswagen и Audi в Китае.

1111
55
Промышленные роботы давно используются на производствах, в том числе автопроизводители. Главный вопрос, зачем делать гуманоидообразными? Другие формы намного эффективнее сейчас работают.
реклама
разместить
Блогер Влад Бумага решил обанкротить свою компанию по продаже снеков в России

Её долги перед кредиторами составляют около 40 млн рублей.

Влад Бумага на прямой линии с Владимиро Путиным
1313
22
11
Бизнес горит, а аналитика нет? Считаем, сколько денег вы теряете, пока ищете дата-специалиста

Компания развивается, маркетинг работает, продукт набирает популярность, клиентов становится больше. Все это генерирует колоссальные объемы данных. Но вот проблема: дата-команды либо нет вовсе, либо она не справляется с текущим потоком.

Бизнес горит, а аналитика нет? Считаем, сколько денег вы теряете, пока ищете дата-специалиста
1515
33
День 1115: объём рынка e-commerce в России в 2025 году составит 16 трлн рублей

Собираем новости, события и мнения о рынках, банках и реакциях компаний.

День 1115: объём рынка e-commerce в России в 2025 году составит 16 трлн рублей
55
22
[]