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

Личный опыт. Если я когда-нибудь сделаю приложение для себя любимого, все интерфейсы будут «неоморфичными». Эта тенденция дизайна не подходит для потребления широкими массами «обычных» пользователей. Почему? Я могу только догадываться.
Откройте Dribbble и введите в поиске «neumorphism». Вы увидите много красивых скриншотов. И ни один из них не будет являться живым проектом. Как максимум, это могут быть «герои» веб-сайтов изображающие экраны гипотетических приложений.
Почему же никто не берет неоморфизм в продакшен? Пожалуй, выскажу одну догадку. Людям не нравится «многоуровневая ложь»:
Уровень 1. Это не настоящая кнопка. У всех в руках одиночные плоские экраны.
Уровень 2. Это не настоящий рельеф. Только тени на фальшивой кнопке... Пугает, не так ли?))

Узнать по-больше на английском языке про неоморфизм можно тут: Neumorphis
Примеры:

• Tesla Smart App by Gavrisov Dmitri
• Fitness Device App by Sergi Mi
• Neumorphism U

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

Тренд стал трендом только потому, что его можно применить практически ко всему.
Он может быть не только излишеством в виде «стеклянного дополнения к композиции», но и выступать в качестве главноего героя.
Кредитные карты. Мобильные телефоны. Мониторы. Иконки. Просто попробуйте сделать любой элемент вашего сайта полупрозрачным с эффектом матового стекла, и вы увидите, насколько он уникален и свеж!
PS
Сегодня матовое стекло легко сделать любым популярным дизайнерским инструментом:
Figma,
Sketch,
XD.

Примеры

• Mooney Finance App Dashboard
• Personal center interface
• Wallet
• Task Manager
• Food mobile app

Наконец-то веб-дизайнеры научились маскировать свою криворукость призывом «за всё натуральное против всего ненатурального».
А всего-то нужно было избегать двух крайностей: слишком темного и слишком светлого. Золотая середина — это мягкие цветовые палитры: здоровый зеленый, пастельный синий, теплый коричневый, да и просто светло-розовый. Всё это делает цвета веб-сайтов менее резкими, но и естественными, как сама природа-мать.
Тренд подходит для всего, что употребляется внутрь (вино, суши, фуд-дизайн) и подо всё, чем мы мажемся, чтобы стать краше: косметика, лечебная грязь (только если розовая).
Кстати, индустрия фитнеса почему-то еще не обратилась к этому тренду. Хватит уже изображать качков и секси-йожек. Внешний вид в 90% случаев — вещь недостижимая. Это для медиков дофамин, эндорфин, серотонин и окситоцин, а для простых смертных это ощущение счастья и свободы от посещения каждого занятия. Вот и покажите на странице своего йога-клуба какие классные брускетты с нутом и ростками гороха можно скушать в вашем фит-кафе.

Примеры веб-сайтов использующих комфортные, натуральные цвета:

• Deeponde
• Mysa Skincare
• Swiggy
• 46parallel Wine
• Savage Sparkles

Все превращается в 3D: фильмы, картинки и даже цвета!
Что ж, градиентные цветовые схемы в веб-дизайне уже некоторое время находятся в тренде, и в 2021 году тенденция выглядит как следующая эволюция, когда цветовые переходы становятся более реалистичными, чем когда-либо.
Следуя за идеями операционной системы Apple Big Sur, мы можем ожидать, что цвета будут насыщенными и трехмерными, как свежий фрукт, сорванный прямо с экрана.
Два цвета, расположенные рядом, могут либо резко слиться друг с другом либо сохранять глубину и тени от окрашенных объектов. В конце концов, эта тенденция тоже предполагает, что веб-дизайн в 2021 году будет стремиться к реализму.

Лично я обожаю разнообразить дизайны. Людям это тоже нравится. Возьмем, к примеру, цвета. Для каждого цвета есть сотни оттенков. Градиенты просто сочетают их уникальным образом. И почему же всё это завораживает? Ну, во-первых, градиент — это практически безграничный простор для творчества. Во-вторых, да, все мы любим минимализм. Но если мы — заказчик, то дизайн «всего из двух цветов» кажется порой надувательством. Градиенты спасают любой минимализм от презрения и шкуру дизайнера от освежевания)))

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

• Sleepiest
• Rested
• Delibroom

3D — определенно «горячая штучка» в веб-дизайне. Это необычно, впечатляет с первых же секунд и говорит о дизайнере… только хвалебные эпитеты. Есть пока что проблемка с этим трендом: поскольку 3d используется преимущественно в игровых, то есть не серьезных, целях, употреблять его на сайтах b2b, то есть в серьезной среде, достаточно сложно. Но мы все равно пытаемся и делаем вот такие, например, сайты:

Хорошие примеры:

• Food Delivery
• Website 3d illustrations
• Landing Page Design

И еще немного великолепных примеров использования 3d-контента:

• Zenly
• Sapiens
• GetUniq

Материальный дизайн был представлен в 2014 году компанией Google. В большинстве случаев традиционный веб-дизайн выглядит плоским. Теперь, как вы можете видеть на картинке выше, материальный дизайн позволяет использовать цвет и тени для имитации физического мира и его текстур.

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

В статье использовались материалы:
Coolest 25+ Web Design Trends In 2021, that'll rock the world (Medium link)