Стать гуру: критерии качества в дизайне.

Konstantin Kapustin
Дизайн-кабак
8 min readMay 11, 2021

--

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

https://dribbble.com/kkapustin

Призма искусства

Часто многие начинающие, а порой и опытные дизайнеры достаточно поверхностно относятся к качеству своего продукта. И речь идет не только о композиции, контрасте и «воздухе» в макете. Чтобы выработать правильное отношение к результату, важно иметь четкое представление полного пути: от создания идеи до её воплощения в жизнь.

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

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

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

«Между музыкой и математикой существует безусловный паралеллизм. И та и другая представляют собой действие в воображении, освобождающее нас от случайностей практической жизни»,

— говорил выдающийся дирижер Эрнест Ансерме.

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

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

  • Идея
  • Образ
  • Исполнение
https://dribbble.com/kkapustin

С чего начать?

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

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

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

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

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

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

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

В качестве примера, вспомним картину «Патерсон» культового режиссера Джима Джармуша. Создатель фильма красиво и удачно показал поэзию в кинематографическом жанре, а точнее метафору на нее. На протяжении всего фильма транслируются повторения, вплетаясь в жизнь героев и превращая её в цепь повторяющихся ритуалов. Главного персонажа, который по сюжету работает водителем автобуса (bus driver), играет Адам Драйвер. В фильме его зовут Патерсон, а живет он (как вы уже могли догадаться) в одноименном городе Патерсон. Его прекрасная жена Лаура рисует паттерны — повторяющиеся узоры. Все эти образы — язык, который выбрал Джармуш для общения со зрителями. Метафора словно нить прошивает все киноленту и используются Джармушем как основополагающий принцип построения и передачи авторского замысла.

Таким образом, концепция накладывает определенные условия на следующий уровень — образ. Она определяет характер, стилистику, tone of voice.

https://dribbble.com/kkapustin

Как донести смысл?

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

На севере диком стоит одиноко
На голой вершине сосна
И дремлет, качаясь, и снегом сыпучим
Одета, как ризой, она.

И снится ей всё, что в пустыне далекой,
В том крае, где солнца восход,
Одна и грустна, на утесе горючем
Прекрасная пальма растет.

— М. Лермонтов

Существует более 40 переводов на русский язык известного стихотворения немецкого поэта Гейне про два одиноких дерева в двух разных частях света: на севере и юге. Лермонтов раскрыл тему этого поэтического произведения по-своему. Читая русского классика, мы понимаем, что речь идет о далекой стране и огромном расстоянии между сосной и пальмой. На первом плане показан контраст между зимой и летом.

В версии Фета мы видим немного иную картину:

На севере кедр одинокий
Стоит на пригорке крутом;
Он дремлет, сурово покрытый
И снежным и льдяным ковром.

Во сне ему видится пальма,
В далёкой, восточной стране,
В безмолвной, глубокой печали,
Одна на горячей скале…

— А. Фет

Перед нами кедр, а не сосна, и теперь это стихотворение о любви и одиночестве. Тем самым Фет перевел этот стих более правильно, ведь на оригинальном языке он выглядит так:

Ein Fichtenbaum steht einsam
Im Norden auf kahler Höh’.
Ihn schläfert; mit weißer Decke
Umhüllen ihn Eis und Schnee.

Er träumt von einer Palme,
Die fern im Morgenland
Einsam und schweigend trauert
Auf brennender Felsenwand.

– Heinrich Heine

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

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

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

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

Промо-видео. Монтаж будет спокойным со сведенной к минимуму динамикой (чем меньше, тем лучше), битрейт сдержанным, голос за кадром приятным, как будто с вами говорит ваш друг.

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

https://dribbble.com/kkapustin

Как довести до конца?

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

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

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

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

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

Еще один ключ к успеху — делать «как в последний раз». Всегда видно, когда не хватило времени или где-то на чем-то сэкономили. Все чувствуется на каком-то подсознательном уровне, ведь себя не обманешь. Сначала вы работаете на проект, потом он работает на вас и довольные клиенты могут не только вернуться, но и привести новых. Да и новые охотнее приходят, видя качество и уровень готовых работ. А что может быть лучше, чем делать что-то топовое на топовом уровне?

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

  • Чем выше насмотренность — тем лучше дизайнер ориентируется в трендах, деталях и качестве.
  • Чем выше скорость — тем быстрее проверяются гипотезы на раннем этапе и тем проще выбрать подходящую.
  • Чем больше ориентированность в технологиях и инструментах (брендинг, иллюстрация, моушн, CGI, VFX, SFX, UI, AR, Game Dev и т.д.), тем лучше чувствуется техническая сторона, и заранее можно определить, какие могут быть ограничения и какие технологии, наоборот, помогут сделать продукт лучше, привлекательнее и функциональнее.

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

--

--