14 компетенций дизайнера интерфейсов

Который не просто сделает красиво, а поможет достигнуть бизнес-целей

Дизайнер в студии разработки — это не тот, кто наводит красоту и делает трендовые кнопочки.

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

За 10 лет мы в студии разработки DNA Team поработали, наверное, с тремя десятками дизайнеров и выделили набор компетенций, который помогает не просто делать красивые приложения или сайты, а достигать целей заказчиков. Например, на 30% увеличить продажи экскурсий в Эрмитаж с помощью мобильного приложения аудио-гида.

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

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

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

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

Итак, вот что мы относим к хардам хорошего специалиста.

Знание основ дизайна, включая композицию, цветовую гармонию, типографику, а также макетирование и прототипирование. Звучит скучно, ведь это профессиональная база, гигиенический минимум. Но на деле часто оказывается так, что дизайнер вроде бы все сделал по методичке, а получились «Жигули». Хотя заказывали как минимум Hyundai. Вы спросите: а как проверить скилы дизайнера на этапе собеседования? Об этом в следующем разделе, а пока — продолжаем перечень компетенций.

Умение работать с популярными инструментами и нейросетями. Сегодня главный инструмент дизайнера — Figma, она простая и удобная. А нейросети помогают придумывать небанальные иллюстрации.

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

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

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

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

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

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

Понимание, как работают разработчики. Распространенная проблема: дизайнер дал разработчику плохое ТЗ и получил сами знаете что. Такого не случается, если дизайнер представляет, как мыслит разработчик.

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

А теперь расскажем о софт-скилах дизайнера интерфейсов, которого мы в DNA Team считаем идеальным.

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

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

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

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

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

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

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

Мы разрабатывали приложение для внутреннего пользования в компании Japan Tobacco International: менеджерам и их руководителям нужен был удобный интерфейс для сбора заявок на доставку вейпов, сохранения адресов заказчиков, фиксирования статуса задач и итогов сделки. Чтобы понять, из каких элементов должен состоять этот интерфейс и как их расположить, дизайнеру нужно было «прожить жизнь» сотрудников компании — представить себя на месте менеджера и его руководителя. И без структурного мышления, даже зная все это, не получилось бы создать логичный пользовательский сценарий.

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

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

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

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

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

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

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

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

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

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

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

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

Специалистов с такими компетенциями найти на рынке вполне реально — они правда существуют. Мы отбираем их по портфолио и собеседованию.

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

Иногда мы просим не только портфолио, но и ссылки на проекты дизайнера в Figma, чтобы посмотреть, как организована его работа в ней, сколько там проектов, на какой они стадии, насколько детально проработаны.

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

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

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

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

Вот еще вопросы с возможными ответами соискателей и нашей трактовкой.

Вопрос. Предположим, что работа над проектом распланирована на неделю. Неожиданно в середине недели клиент просит вас ускориться, потому что в пятницу к нему приезжает инвестор, которому нужно показать продукт. Как вы будете действовать, чтобы все остались довольны?

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

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

«Поработаю сверхурочно, чтобы сделать за пару дней то, что должен был подготовить за неделю».

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

«Скажу клиенту, что это невозможно и напомню о наших договоренностях»

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

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

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

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

А вы когда-то факапились с выбором дизайнера? Пожаловаться можно в комментариях, а прийти за качественным ИТ-решением --- по кнопке ниже.

#разработка #дизайн #карьера