3D-графика
3D-графика в веб-дизайне начала развиваться в 2020 году и с тех пор с каждым годом не теряет актуальности.
К инструментам 3D-графики прибегают Сбербанк, Тинькофф и другие крупные компании. В новом году элементы 3D-графики можно будет встретить в рекламе, иллюстрациях и многом другом.
Lottie-анимация
Количество анимированных элементов на сайтах будет сокращаться. При этом недостатка интерактивности и привлекательности сайты испытывать не будут — на смену старым трендам приходит Lottie-анимация.
Для ее использования достаточно воспользоваться библиотекой Lottie, которая отображает анимацию After Effects в режиме реального времени, загрузить с сервиса понравившийся GIF-файл и разместить его на сайте.
Помните, что при использовании анимации важно соблюдать баланс и расставлять с помощью нее акценты, а не добавлять повсеместно — на заголовки, текст, картинки и прочие элементы.
Рисованный стиль
Еще один тренд, который появился сравнительно недавно, но уже часто встречается на страницах интернет-сайтов. Суть его состоит в использовании росчерков, подчеркиваний и других «рукописных элементов» в текстах для привлечения внимания. Легкая небрежность цепляет взгляд пользователя и он, с большой долей вероятности, выполнит целевое действие, например оставят заявку.
Такой стиль не обязательно использовать в качестве основного, он может применяться только для оформления сайта
Примеры:
- www.sweetmagnoliagelato.com
- waltersophia.com
- www.danieldiggle.com
- themanyfacesof.com/leonardo-dicaprio
Сложные градиенты
Градиенты и раньше использовались в оформлении сайтов, но теперь они будут представлены в более сложном варианте — сетчатые градиенты (на основе двухмерной сетки, также он называется mesh-градиентом). Его фишка в том, что он создает иллюзию движения, при этом не перегружая изображение. Чтобы придать реалистичность изображению рекомендуется использовать естественные цвета (для их подбора можно воспользоваться онлайн-сервисом от Adobe).
А на сервисе Meshgradient можно создать свой собственный сетчатый градиент всего в несколько кликов.
Примеры:
- www.winamp.com
- sarahguo.com
- vitaarchitecture.com
- www.richardsancho.com
Глиноморфизм
Новый вид вид 3D-графики, который может придать интерактивности Вашему сайту. Он предполагаетиспользование «дружественных» 3D-изображенй рук/лиц/людей и любых других иллюстраций. Тренд хорошо сочетается с минималистичным дизайном и в основном строится на смешивании четырех стилей:
- пастельные тона;
- закругленные углы;
- двойная внутренняя тень;
- внешняя тень.
Примеры:
- christmas.wannathis.one
- tolia.ge
- matterapp.com
Мемфис — тренд из 80-х
Фишка, которая раньше использовалась архитекторами и дизайнерами, перекочевала в веб-дизайн. Основной принцип Мемфис — свобода и нарушение правил — звучит как идеальное решение для креативного и смелого проекта. Свежесть и уникальность дизайна только приветствуются. При этом удобство и доступность сайта не пострадают, но вот выделяться на фоне конкурентов он будет однозначно.
Примеры:
- upperquad.com
- shapefarm.net
- www.cartoonnetworkstudios.com
- www.orchestredeparis.com/resonance
Параллакс-скроллинг
Еще один интерактивный тренд, суть которого заключается во взаимодействии сайта с пользователем по мере прокрутки интернет-страницы: запуск анимации, постепенное раскрытие картинок и текста — только малая часть элементов, которые могут быть задействованы в параллакс-скроллинге. Таким образом сам процесс прокрутки становится привлекательным для посетителя сайта.
Примеры:
- admireamaze.debijenkorf.nl
- waltersophia.com
Четкие границы
Тренд на видимые границы сможет придать сайту больше реалистичности и привлекательности, пользволит пользователю взглянуть на него под другим углом. Четкие границы помогут разделить страницу, изменить ее конфигурацию, наполнить сайт большим количеством информации, представленным в более удобном для восприятия виде, при этом не перегружая страницу. Такой стиль дополнитлюбой минималистичный проект.
Примеры:
- www.devrandogaroglu.com
- shopify.supply
Интерактивные шрифты
Шрифт становится не просто одним из элементов дизайна, с его помощью можно повлиять на потребителя, а следовательно и на производительность сайта.
Суть тренда — изменение шрифта, например, при наведении на него курсора, или прокрутке изображения. Это сразу цепляет взгляд и позволяет обратить внимание на важную информацию. Применяя интерактивность к шрифтам, важно помнить одну вещь: некоторых людей отвлекают движущиеся символы. Так что не следует злоупотреблять ей.
Примеры:
- www.jomor.design
- dearworldleaders.org
В 2023 году у дизайнеров появляется множество новых инструментов, чтобы сделать сайт более интерактивным, интересным и привлекательным для пользователя. Не следует пренебрегать новыми трендами, но также стоит помнить, что в погоне за уникальностью важно сохранить баланс и сделать сайт понятным и доступным для аудитории. Так ваш проект будет всегда оставаться актуальным.
Источник: https://craftum.com/blog/trendy-web-dizajna-2023/