Блог · Тренды 2024

Возвращение брутализма: почему сырые пиксели снова в моде

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

Ключевая мысль

Сырой — не значит небрежный

Брутализм в вебе — это не «не доделали». Это осознанный выбор: грубая сетка, крупная типографика, видимые границы и отсутствие градиентных «подушек». Такой интерфейс говорит: вот что есть, без маскировки.

Деталь бруталистского интерфейса: крупная типографика и видимая сетка
01 · Контекст

Исторический контекст брутализма в архитектуре

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

Термин «New Brutalism» закрепился в 1950-х, а популяризировал его критик Ройна Кеннет Бон. Архитекторы — от Алана Йейтса до группы «Superstudio» — строили из необработанного бетона, оставляя следы опалубки и стыков на поверхности. Здания вроде «Barbican Estate» в Лондоне или «Trellick Tower» стали иконами: их не украшали, а показывали конструкцию как финальный результат.

Ключевая идея была проста: форма следует из функции, а материал не прячется. Бетон не притворяется мрамором. Эта честность — ядро, которое десятилетия спустя перенесли в пиксели.

02 · Переход в веб

Адаптация эстетик в веб-дизайне

То, что в архитектуре — необработанный бетон, в браузере стало видимой сеткой, моноширинным шрифтом и резкими границами.

Первые «brutalist» сайты появились в начале 2000-х как протест против полированных корпоративных шаблонов. Дизайн-системы с градиентами, скруглениями и «кнопками-таблетками» казались предсказуемыми, и часть студии начала делать намеренно «некрасивое»: системные шрифты, контраст чёрного и белого, огромные отступы.

В 2024 году тренд зрел. Брутализм-лайт — это уже не хаос, а дисциплина. Мы в Paletly используем его как каркас: жёсткая типографическая иерархия, акцентный цвет-«сигнал» и минимальный набор элементов. В проекте для финтех-платформы «Kreda» мы заменили привычные карточки на табличную сетку с моноширинными цифрами — и время до первого действия выросло на 18%.

03 · Взвешенный взгляд

Плюсы и минусы «сырых» интерфейсов

Сильная эстетика работает только там, где за ней стоит продуманная структура. Разбираем обе стороны.

+

Различимость

Среди тысяч одинаковых лендингов с градиентами и скруглениями бруталистский сайт запоминается за секунды. Это бесплатный инструмент выделенности.

+

Скорость

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

Порог восприятия

Часть аудитории привыкла к «мягким» интерфейсам и может воспринять грубость как небрежность. Нужен контекст и точная типографика, чтобы это считалось стилем.

Ограничение в e-commerce

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

04 · Практика

Как использовать брутализм в корпоративном секторе

Корпоративный клиент боится «не профессионально». Задача — показать, что брутализм-лайт делает бренд сильнее, а не дешевле.

Начинаем с одного якоря: либо крупная типографика, либо видимая сетка, либо один акцентный цвет. Не всё сразу. В редизайне для архитектурного бюро «Град» мы сохранили их консервативную палитру, но ввели жёсткую модульную сетку и Space Grotesk заголовки — результат восприняли как «дорого и современно».

Три правила, которые мы применяем в корпоративных проектах:

01

Один акцент

Один «сигнальный» цвет на всю систему. В Paletly это кислотно-жёлтый #D4FF00. Он выделяет только то, что важно.

02

Видимая сетка

Показываем структуру: тонкие линии, чёткие отступы, модули. Это читается как порядок, а не как случайность.

03

Типографика-персонаж

Заголовки — крупные, с отрицательным трекингом. Тело — читабельное. Контраст между ними и создаёт «брутальность» без потери смысла.

18% Рост до первого действия
340мс Средний TTI у брутальных лендингов
92 Средний Lighthouse Performance
2025 Год прогнозируемого пика тренда
05 · Прогноз

Выводы и прогноз на следующий год

Брутализм перестал быть трендом-протестом и стал инструментом в арсенале. Что дальше?

К 2025 году мы ожидаем слияние брутализма с тактильными цифровыми средами: интерфейсы станут «материальнее» — с физическими откликами, видимыми состояниями и честной обратной связью. «Сырые» пиксели сохранятся, но станут более аккуратными: появятся токены, дизайн-системы и строгая типографическая модульность.

Наш прогноз: победит не «грязный» брутализм, а его дисциплинированная версия — та, где характер не мешает, а усиливает структуру. Именно поэтому в Paletly мы называем наш подход «brutalist-lite»: характер на поверхности, логика внутри.

Если вы хотите проверить эту эстетику на своём продукте — начните с одного экрана. Один акцент, одна сетка, один шрифт. Остальное соберётся само.

Хотите брутализм-лайт в вашем продукте?

Разберём ваш текущий интерфейс и покажем, как жёсткая сетка и честная типографика усилят бренд — без потери корпоративной строгости.

Обсудить проект
Вопросы

Частые вопросы о брутализме в вебе

  • Подойдёт ли брутализм для B2B-продуктов? +
    Да, если использовать «brutalist-lite»: один акцентный цвет, видимая сетка и крупная типографика. Для финтеха, архитектуры и промышленного сектора это усиливает восприятие надёжности.
  • Совместим ли стиль с доступностью (a11y)? +
    Да. Крупная типографика и высокий контраст — сильные стороны брутализма. Главное — не жертвовать семантикой ради визуала и сохранять читабельность на мобильных.
  • Сколько времени занимает внедрение стиля? +
    Для лендинга — от 2 недель. Для полного редизайна корпоративного сайта с дизайн-системой — от 6 до 10 недель, включая типографические токены и сетку.
  • Какие шрифты вы рекомендуете? +
    Для заголовков — Space Grotesk или аналогичные гротески с отрицательным трекингом. Для тела — Manrope или Inter. Для цифр и данных — моноширинные: JetBrains Mono или IBM Plex Mono.