Новое и хорошо забытое старое: тренды веб-дизайна в 2023 году

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

В этой статье вы узнаете, какое оформление сайта будет актуально в 2023 году.

Что, помимо сферы деятельности, объединяет Тинькофф и Сбербанк? 3D-графика. Ворвавшись в веб-дизайн в 2020 году, она и сегодня не теряет популярности. Этот тренд помогает пользователям легче концентрироваться и воспринимать информацию, что особенно важно, например, клиентам банков. 3D-графика — полезное направление дизайна, регулярно выходят новые паки и даже инструменты для редактирования glTF 3D: producthunt, iconscout. Поэтому можно сделать вывод, что в будущем тенденция будет только набирать популярность. Познать силу 3D-графики можно по ссылкам:

Тренд будет актуален не только на сайтах, но и офлайн: например, в рекламе и иллюстрациях.

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

Lottie-анимация украсит ваш сайт и поможет передать его суть. Например, любители йоги оценят анимацию выше, ведь она точно выражает ощущение свободы. Такой эффект легко создать с помощью библиотеки Lottie. Анимация After Effects в ней показана в реальном времени и легко добавляется на сайт. Для этого просто скачайте GIF с сервиса Lottiefiles или скопируйте код нужного файла.

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

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

На фото выше текст будто написан карандашом, буква «о» превратилась в солнце. Гусь и курица стали важными птицами благодаря обводке. Такой дизайн выглядит интересно, пользователю так и хочется нажать кнопку. Рисованный стиль можно использовать как дополнительный шрифт на сайте с классическим дизайном. Как на примере ниже:

Держите ещё 2 ссылки для вдохновения:

Долгоиграющий тренд родом из 80-х и 90-х, который актуален и сейчас. В 2023 году мы ещё встретим градиенты на сайтах. Однако их вид будет несколько сложнее привычного. Например, потрясающие сетчатые градиенты (от англ. Gradient Mesh) со сложной структурой. Они сочетают в себе минимализм и иллюзию движения, вызывая восторг пользователей. А дизайнерам дают простор для творчества.

Проникнуться красотой градиентов можно на сайтах:

А если вы хотите сами создать сетчатый градиент, поможет сервис Meshgradient. Для наилучшего результата советуем подбирать палитру на сайте Adobe и выбирать натуральные цвета, которые есть в природе — жёлтый, зелёный, синий и т.п.

Глиноморфизм — совсем молодой тренд веб-дизайна, однако его ждёт большое будущее. На сайтах дружелюбные люди в моде (в отличие от метро).

Узнать глиняных жизнелюбов можно по этим приметам:

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

Оценить и купить наборы человечков можно здесь: humans.wannathis.onehumans.wannathis.one.

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

Вот несколько сайтов в стиле мемфис:

Ещё одна долгоиграющая тенденция, которая не потеряет актуальности в наступившем году, — параллаксная прокрутка. Пока пользователь изучает ваш сайт, интерактивные элементы взаимодействуют с ним. Например, запускается анимация, плавно раскрываются картинки и текст. Это фишка параллакс-скроллинга.

Примеры для вдохновения:

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

Обратите внимание на сайты:

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

Пример: анимация ниже. При наведении текст меняет свою жирность, а надпись становится легче читать.

Желание следовать трендам имеет смысл: без регулярного обновления сайт постепенно теряет свою актуальность. Примеры из статьи можно использовать как по отдельности, так и вместе. Например, комбинировать 3D-графику с анимацией или дополнять интерактивную типографику градиентами.

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