Брутализм в дизайне сайтов: особенности модного направления и крутые примеры

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

Брутализм в дизайне сайтов: особенности модного направления и крутые примеры
AliExpress WW

Брутализм (лат. «brutus» – грубый, тяжёлый) — это направление в архитектуре, которое возникло после войны в 1950—1970 годах в Великобритании. У истоков этого стиля стоял архитектор Ле Корбюзье. Брутализм характеризуется выставлением напоказ грубой простоты.

Если вы родились в России вам не придется долго объяснять, как это выглядит – это те самые большие здания из бетона, которые мы привыкли видеть на просторах бывшего СССР (не путать с панельками).

Здание музыкального театра в Иркутске, спроектированного архитектором Владимиром Павловым, – яркий пример брутализма.

Музыкальный театр имени Загурского в Иркутске

К брутализму можно относиться по-разному – его называют и холодным, и чудовищным, но он всегда вызывает эмоции. Если ваша цель вызывать эмоции – это то, что вам нужно.

А теперь давайте перейдем от архитектуры к графическому и веб-дизайну.

Брутализм в веб-дизайне: в чем его особенность?

Направление брутализма перекочевало из архитектуры в графический и далее в веб-дизайн. Считается, что брутализм проник в веб-дизайн в 2014 году. В это же время директор креативного агентства Паскаль Девиль запустил портал, на котором до сих пор размещает «брутальные» сайты. Мы считаем, что не все работы, размещенные на сайте, можно отнести к брутализму, там немало проектов в стиле антидизайн, о котором пойдет речь дальше, но заглянуть на сайт стоит.

«В своей шероховатости и нежелании выглядеть комфортно или легко, брутализм можно рассматривать, как реакцию молодого поколения на легкость, оптимизм и легкомыслие современного веб-дизайна». – Паскаль Девилль

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

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

А делая дизайн в стиле брутализм, в ход идет самое максимальное упрощение вплоть до шрифтов Times New Roman и стандартных веб-элементов.

Считается, что проникновение брутализма в веб-дизайн началось с сайта объявлений Craiglist – аналога нашего Avito. Сайт максимально придерживается эстетики 90-х годов намеренно отказавшись от оформления.

Сайт объявлений Craiglist

Характеристики веб-брутализма

  • Акцент на контенте и функционале сайта без декоративных элементов.
  • Монохроматическая цветовая гамма – черно-белые или серые цвета, отсутствие цвета.
  • Минимальное использование анимации – увеличение по клику или параллакс
  • Нестилизованные посредством CSS сайты – голый HTML, полный хардкор
  • Модульные повторяющиеся блоки сайта – дизайн скорее напоминает таблицу в Ворде
  • Необработанные, зачастую черно-белые изображения или полное их отсутствие
  • Намеренное использование крупной типографики и элементов интерфейса

Плюсы и минусы веб-брутализма

Преимущества:

  • Дешевле в разработке
  • Высокая скорость загрузки страниц
  • Экономия времени на создание дизайна

Недостатки:

  • Целевая аудитория может не понять этот стиль
  • Подходит не для всех ниш

Когда стоит использовать брутализм в веб-дизайне?

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

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

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

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

Брутализм и антидизайн: а есть ли разница?

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

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

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

брутализм в веб-дизайне

антидизайн в веб-дизайне

Примеры сайтов в стиле брутализм

А теперь самое вкусное – давайте с вами посмотрим на работы в стиле брутализм.

Сайт московского театра «Современник»

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

Дизайн сайта театра Современник

Сайт проекта МТС «Знаем лично»

Лендинг удивляет с первого экрана – яркие корпоративные цвета в сочетании с крупной типографикой и черно-белой гаммой.

Сайт Знаем лично от МТС

Сайт мастерской «Стамеска»

К месту применен брутализм: стиль сайта отсылает к чертежным листам, таблицам и тем самым раскрывает суть мастерской — производство мебели. Глядя на такой сайт, складывается ощущение, что мебель у них аккуратная и стильная.

Сайт мастерской Стамеска

Музей современного искусства «Гараж»

Разработчики оформили хронику в стиле брутализм. Смотрится очень интересно и максимально подходит к концепции самого музея.

Сайт музея современного искусства Гараж

Журнал «Свои»

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

Сайт журнала Свои

Портал «Верблюд в огне»

Еще одно региональное СМИ использует «брутальные» черты в своём дизайне. Выглядит довольно смело и свежо.

Сайт издания Верблюд в огне

Модный дом Balenciaga

Ну и на закуску: в стремлении выделиться среди модных домов «Баленсиага» тоже применяет брутализм в своём дизайне.

Дизайн сайта Баленсиага

Вы только гляньте, как сделано выпадающее меню:

Дизайн выпадающее меню

Вместо вывода

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

Поэтому только вам решать, создавать «брутальный» сайт или отдать предпочтение другим стилям. А если вы определились с концепцией, но не нашли классного дизайнера, то обращайтесь к нам. Создадим все, начиная от рекламных баннеров и заканчивая редизайном сайта.