Тенденции графического дизайна в 2023 году

Какие тренды в сфере графического дизайна будут актуальны в 2023 году? Предлагаем краткий обзор от специалистов digital-агентства Site Elite Studio.

Ключевое

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

Эксперименты с комбинациями стилей и направлений, использование динамических элементов с добавлением «ностальгических» ноток — вот что сейчас в тренде. Как же это проявляется на деле?

Дизайнеры @siteelite выделяют 10 базовых трендов, которым точно стоит следовать в наступающем году.

Топ-10 графических решений — 2023

1 Яркие цвета

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

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

Источник: tubik / <a href="https://dribbble.com/shots/6697630-Ecommerce-Website-on-Mobile#" rel="nofollow noreferrer noopener" target="_blank">Dribbble</a>
Источник: tubik / Dribbble
Источник: Kenzo Hamazaki
Магниты Site Elite
Магниты Site Elite

2 Нестандартные шрифты

Под нестандартными мы понимаем шрифты со скрытыми посланиями. Такие, где одна буква перевернута, убрана, увеличена, мерцает, изображена в виде мини-иллюстрации и пр. Либо же одно слово (а то и вся строка) скачет, вращается, движется по экрану. Варианты бесконечны.

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

Источник: Anton Aheichanka
Источник: <a href="https://www.positiveimpact.studio/" rel="nofollow noreferrer noopener" target="_blank">positiveimpact.studio</a>
Источник: positiveimpact.studio

3 Коллажи

Трансформируйте элементы разных стилей и форм, комбинируйте их буквально «как ляжет душа». Это сделает дизайн как минимум запоминающимся, а как максимум — самобытным, по-винтажному уютным. Особенно если рисовка выглядит сделанной от руки (как в детских альбомчиках).

В анимации и брендировании отдельно приветствуется эффект вырезания из бумаги — когда все детали изображения (неважно, 2D или 3D) выглядят как аппликации.

Источник: <a href="https://dribbble.com/shots/9805608-This-is-not-surreal" rel="nofollow noreferrer noopener" target="_blank">Camille Piot</a>
Источник: Camille Piot
Источник: Tommy Perez

4 Ностальгическая «олдовость»

Отличный способ донести новую идею — использовать «ностальгические» элементы дизайна из любого стиля, который сегодня стал классикой. Это и ар-деко, и ретро, и психоделика, и прочие течения, популярные в ХХ веке. Массивные шрифты, кричащие абстракции, изысканная четкость линий — для подлинного креатива подходит все.

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

Источник: <a href="https://madebychapter.com/" rel="nofollow noreferrer noopener" target="_blank">Made by Chapter</a>
Источник: Made by Chapter
Источник: Alfonso Pereira
Источник: satheesh sankaran

5 Брутализм + необрутализм

Чтобы «достучаться» до своей ЦА, можно продемонстрировать отказ от привычных или навязанных стандартов. Для этого подходит брутализм: упрощенные фоны и асимметричные макеты, неаккуратные «рукописные» шрифты и преднамеренные искажения форм. Цель достигнута, когда пользователь с ходу понимает: ваше кредо — естественность в самовыражении.

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

Источник Luka Marr / Dribbble
Источник: Pier-Luc Cossette / Dribbble

6 Игровые элементы

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

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

Источник: innotech.pt
Источник: drinkmine.com

7 3D

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

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

Источник <a href="https://dribbble.com/shots/14510815-Web-site-3D-illustration" rel="nofollow noreferrer noopener" target="_blank">Mike | Creative Mints</a>
Источник Mike | Creative Mints
Источник: <a href="https://www.privios.com/index.html" rel="nofollow noreferrer noopener" target="_blank">privios.com</a>
Источник: privios.com

8 Эксперименты с навигацией

Один из способов улучшить взаимодействие с сайтом, одновременно сделав его привлекательнее — разнести навигацию по блокам (слева, справа, снизу на панели вкладок). Но креативность дизайнера должна при этом сочетаться с комфортом пользователя.

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

Источник: <a href="https://www.awwwards.com/" rel="nofollow noreferrer noopener" target="_blank">awwwards.com</a>
Источник: awwwards.com
Источник: findmy.vitra.com

9 Вовлекающие интерактивы

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

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

Источник: Spotify
Источник: chiaraluzzana.com

10 Расстановка видимых границ

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

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

Источник: <a href="https://en.99designs.de/profiles/designsystem" rel="nofollow noreferrer noopener" target="_blank">logogram</a>
Источник: logogram
Источник: <a href="https://dribbble.com/uiashik" rel="nofollow noreferrer noopener" target="_blank">Ashik</a> / Dribbble
Источник: Ashik / Dribbble

На заметку (вместо вывода)

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

45
9 комментариев

Каждый год очередной пользователь пишет статью о будущих трендах и каждый год одни и те же тренды.

8
Ответить

это уже старая добрая традиция))

2
Ответить

Очень понравилось. Эта статья сделала мой день ярче и теплее) Сразу вспомнилось лето

2
Ответить

Особенно ярких цветов так не хватает нашей серой зимой)) Рады, что согрели.

Ответить

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

2
Ответить

Согласны. Во всем нужен баланс.

Ответить

Только не пишите про лого тренды 🤦‍♂️

Ответить