Стиль «Русский Behance»

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

Привет, случайный читатель. Меня зовут Олег Лупиков, я сооснователь ИТ-компаний Hook Production и Postilla. В первой компании мы разрабатываем стартапы, продаем продуктовые команды (аутстаффим джунов по ценам сеньоров, как и все вы тут), занимаемся цифровой трансформацией и импортозамещением (разрабатываем всякое, чем никто не будет пользоваться за деньги налогоплательщиков). Среди наших клиентов Intergaz, Победа, ГПН, Петшоп, Кинопоиск, Jiffy, прочие корпорации и стартапы в России и Европе. Второй бизнес – это фудтех софт – CRM и мобильные приложения для dark kitchen, кафе и ресторанов, который на момент написания этой статьи получил оценку в $1 миллион и массово сейчас подключает horeca в России на iiko за 10 000 рублей в месяц.

В диджитале я с 2008 года (это когда половина читателей VC только родились) и когда-то, как и все, занимался разного рода сайтами. Я видел расцвет, пик и закат техдизайна и скевоморфизма в интерфейсе и в вебе. Видел, как веб-студии проходили путь от бомжацких сайтов-визиток на конструкторах (uCoz, Народ), до корпортивных порталов на 1С-Битрикс и Drupal, сложных кастомных сайтов с параллаксами на jQuery, Backbone, и React, и снова возврат к конструкторам – Tilda, Readymag. И снова возврат к техдизайну и скевоморфизму. Только у современных дезигнеров понятный нашему олдовому поколению техдизайн обрел новое дыхание и новое название. Имя ему – «русский беханс». Несмотря на то, что мы давно не занимаемся сайтами и заказываем их у других, мне не дает покоя этот странный тренд, которого не должно существовать. Об этом необычном явлении я и решил написать, но сначала…

Ранние 2010-е. Студия Лебедева на пике популярности. Все ссылки на сайтах принято подчеркивать. Скевоморфизм и техдизайн идут рука об руку, а весь дизайн производился силами Adobe Photoshop CS6 (чаще всего nulled версия). Ключевыми ресурсами для вдохновления были сайт Студии Лебедева, форумы техдизайнер. ру, revision и Demiart. Самыми крутыми считались кейсы Лебедева с уклоном в максимальный реализм. В этом же стиле были интерфейсы iOS. Назывался этот стиль – скевоморфизм.

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

Такой вот способ обойти несуществующий в UI эффект зловещей долины.

Отсюда вытекает популярный тогда, но не очень встречающийся сейчас термин «технический дизайн». Его смысл заключался в том, чтобы взять исходное изображение или группу изображений (дерево, скала, водопад) и объединить их силами иллюстратора в единую композицию.

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

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

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

Скевоморфизм был популярен в веб-дизайне в первой половине 2010-х годов, но постепенно стал устаревать. Одной из причин этого является то, что многие дизайнеры использовали скевоморфизм без соблюдения основных принципов дизайна, что приводило к неконсистентности и хаотичности сайтов. В результате этого скевоморфизм стал считаться непрофессиональным и неэффективным способом оформления сайтов. Вместо этого дизайнеры начали использовать более современные и профессиональные подходы к веб-дизайну, такие как использование более четких и структурированных макетов и…

Apple выпустили революционную iOS 7, где вместо реалистичных текстур и шейпов ушел уклон в блюры, градиенты, радуги. Иконки стали более плоскими, цвета более яркими а анимации более сложными. Низкий поклон сэру Джони Айву!

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

Минимализм основывался на следующих ключевых принципах:

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

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

В принципе, что было дальше, мы все знаем. Разные итерации минимализма, попытки реинкарнации скевоморфизма в виде неоморфизма (безуспешные, на мой взгляд) и разные итерации экспериментальных и не очень стилей для визиток, презентационных сайтов, корпоративных порталов и e-commerce. Популярные в РФ и СНГ студии и агентства соревновались в наяривании друг другу на локальных и федеральных конкурсах по голландскому штурвализму (Теглайны, Руварды и прочие кружки по интересам для диджитал-псевдоэлиты).

Параллельно с этой тусовкой существовала еще одна, которая создавала сайты не с целью рассказать о том, как они параллакс ускорили до 25 кадров в секунду, а с целью продажи продуктов и заработка денег Кабан Кабанычу, который отвалил 60к за страничку про фуры из Владика. Эта тусовка экспериментировала с конверсиями (чаще неосознанно, интуитивно). Старалась попасть в ожидания заказчиков, управляла дофамином посетителей и искала всякие ключики, которые помогут условному Аязу Цыгановичу лучше продать его инфопродукт.

И так родился на свет…

Рашен Биханс. Russian Behance. Рубех. Это как евроремонт. Как цыганское барокко.

В не очень бородатые годы, когда нынешние senior human interface engineers только учились дизайну, на Behance начало формироваться такое синтетическое явление – веб-дизайнеры рисовали несуществующие сайты и соревновались, кто больше наберет лайков.

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

«Если бизнеса нет в интернете, значит нет бизнеса» – говорили они, то же было верно для дизайнеров на Behance. Множество известных сейчас дизайнеров начинали, повторяя полумифический путь Артемия Лебедева – нарисовать с два десятка сайтов для несуществующих компаний и разместить их в портфолио. С годами коммьюнити обрастало новичками, которые не сильно знали историю дизайна и, тем более, термины техдизайн и скевоморфизм.

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

Типичный рубех конца 2015х выглядел так:

Сайт за сайтом, ученик за учеником это чудо начало заполонять русский сегмент Беханса сперва в виде искусственных кейсов, потом в виде сайтов для каких-то неизвестных компаний, а потом случилась Бизнес Молодость.

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

А тут дизайнер_ка гордится, что спроектировала этот высококлассный интерфейс взаимодействия человек-машина за 1 час. Уровень!

И так, какие основные, ключевые особенности стиля «русский behance»?

• Птица. Желательно, чайка.
• Кусты.
• Летающие элементы. Листья, или лучше деньги. Заблюренные.
• Объемная кнопка. Желательно, желтая.
• На кнопке должна быть иконка. А лучше фотография объекта.
• Кнопка play. Не важно зачем, главное сделай.
• Облака или туман. Много облаков. Они должны двигаться.
• Светящийся объект. С желтым свечением.
• Рукописный шрифт в заголовке.

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

Ходят слухи, что новое поколение дизайнеров даже и радо бы развиваться в других направлениях, но вот незадача. Этот стиль просят клиенты. Я знаю с несколько десятков больших предпринимателей с прибылью в 1+ миллиард рублей в год, которые считают такой стиль очень дорогим и продающим! Но как правило сами сайты в стиле «русский беханс» обычно стоят в районе 50-150 тысяч рублей.

Ладно, дело пятое, все дошло до того что я пошел на поводу у тренда и тоже попросил нашего директора по дизайну нарисовать нам такой сайт! Дима очень ругался и не хотел, но вот что получилось:

Знаю, о чем ты, мой случайный читатель из индустрии, думаешь. И так же знаю, о чем ты, мой случайный читатель НЕ из индустрии, думаешь. Такой парадокс, на этот стиль есть спрос у бизнеса, дизайнерам-новичкам приходится его учить, потому что за него готовы платить. Но платить мало. И ты, мой маленький дизайнер, зашкваришь себе портфолио этим дерьмом так, что потом ни в одну приличную контору не возьмут. Сеньор хуман интерфейс инженеры покрутят пальцем у виска и закроют, начинающие предприниматели скажут «Зашибись! Хочу такой сайт!». CEO ИП Дрищухин посмеется, ведь это не возьмут на Рейтинг Рунета.

Все вышеизложенное является моим личным мнением и не претендует на 100% правду, конечно же.

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

И напоследок, из чувства прекрасного оставляю One Time Offer: первым трем оставившим заявку на hookprod. com владельцам лендосов в стиле «русский behance» бесплатно нарисуем нормальный дизайн!