(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(49180180, "init", { defer: true, clickmap:true, trackLinks:true, accurateTrackBounce:true }); ym(49180180, 'hit', window.location.href);

Как презентовать дизайн-концепцию, чтобы не обосраться перед заказчиком. Готовый скрипт + чек-лист

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

Будем исходить из того, что вы знаете, как создавать концепцию и в курсе про такие понятия, как:

— метод прогрессивного джипега;

— бриф;

— аналитика;

— мудборд;

— скетч/прототип;

— внутренняя приемка.

Если нет — ныряйте в середину этой статьи, там подробнее.

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

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

Тут важное пояснение — все дизайн-концепции в студиях можно поделить на 2 вида:

1) которые разрабатываются для публичных сайтов, веб-сервисов и мобильных приложений;

2) для внутренних сервисов: ERP-, CRM- систем и прочих.

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

Из-за чего можно зафакапить презентацию концепта

Причин завалить демо полно, но самые явные:

  • Проект на стороне клиента ведет один человек, но на контрольные точки подключается совет директоров. Не все в курсе всего. У всех разное видение, вкус, темперамент, настроение. Почитайте, чем это может обернуться, здесь мы подробнее рассказывали про важность присутствия ЛПР в разработке.
  • У клиента много задач. Некоторые договоренности он не помнит, обстоятельства поменялись, требования стали другими.
  • Технические проблемы. Плохой интернет, наушники, микрофон, неумение все это настроить.
  • Неудачное время, плохое настроение.
  • Скомканное повествование, невнятная речь, несогласованность демонстрации.
  • Плохой результат, сделали не то, что просили.

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

Готовимся к демонстрации концепта – собираем презентацию и репетируем речь

Представим, что творческие муки, правки от арт-дира и пожелания менеджера позади. У вас в Figma красуется добротный макет главной, а на послезавтра в календаре стоит созвон с клиентом.

Кстати, вы ведь оставили люфт до дедлайна?

Советую менеджерам озвучивать дату дедлайна на день-два раньше реальной. Поверьте, это сбережет ваши нервы

Начинайте собирать презентацию. Из каких блоков она должна состоять:

  • Обложка;
  • Целевая аудитория и конкурентный анализ;
  • Скетч/прототип;
  • Мудборд;
  • Логотип (если разрабатывался в рамках концепции);
  • Сама концепция;
  • Альтернативная версия;
  • Видео;
  • Минигайд;
  • Закрывающий слайд.
У вас может быть больше или меньше слайдов, у нас примерно столько

Дальше подробнее.

Собираем презентацию

Целевая аудитория и конкурентный анализ

Если вы проводили аналитику, то на слайде устно акцентируйте внимание только на те моменты, которые повлияли на финальный результат.

Клиент уже изучал эти таблицы, поэтому разбирать в презентации мелочи ни к чему

Скетч/прототип

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

Только убедитесь, что все работает и вы знаете куда кликать

Мудборд

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

Устно подсвечивайте нужное, приглушайте второстепенное
Визуально тоже можете подсветить основное, как здесь

Логотип (даже если о нем не шло речи)

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

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

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

Кстати, вставки с мерчем смотрятся бомбически, можете использовать это как одну из фишек, если еще не делаете ;)

Концепция

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

Можно добавить ссылки на видео и дизайн

Кстати, имеет смысл показывать и промежуточные варианты.

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

Альтернативная версия

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

Концепция одна, но варианты исполнения разные

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

Именно так было на одном из наших проектов

Видео

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

2 музыкальных примера из наших закромов:

Мини-гайд

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

Только шрифт и цвет — ничего лишнего!

Обложка и заключительный слайд

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

Кстати, вот здесь я создал дополнительные вкладки в Figma, что бы вы увидели презентации этих проектов вживую.

Готовим речь

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

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

Проводим внутреннюю приемку

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

— потренироваться отвечать на вопросы;

— убедиться, что макет соответствует или превосходит уровень макетов студии;

— получить конструктивную критику и доработать макет, презентацию и саму ее подачу;

— отсмотреть презентацию незамыленным взглядом на предмет опечаток, ошибок или лишних элементов;

— проверить, что учли все по чек-листу и ничего не забыли.

Созваниваемся с заказчиком — что делать и не делать

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

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

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

Точно портят впечатление долгие паузы, покашливания, «Эээээ» и «Нууу». Избегайте этого. Больше репетируйте и прогоняйте в голове варианты ответов на разные вопросы.

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

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

Не забывайте и про часовые пояса. Однажды мы целый месяц созванивались с Нью-Йорком в 22:00 по нашему времени, потому что клиенту было удобно подключиться в 10:00 утра. Естественно, мы уже все были дома, в окружении детей и питомцев. Хотя после ковидных времен этим уже никого не удивить.

Отрабатываем типичные возражения заранее

Например, если клиент спрашивает:

— «Почему так долго рисовали?», можно ответить так:

— Геннадий, создание концепции — работа, в которой участвует много специалистов. Она проходит в несколько этапов, в том числе и через внутреннюю приемку, где экспертная группа (дизайнер, аналитик, арт-директор, менеджер) обсуждает детали и принимает решение о доработках. До вас доходит не сырой вариант, а проработанный концепт, в котором мы уверенны на 100%. Все для того, чтобы сайт/приложение понравился и нам, и вам, и конечным потребителям.

— «Слишком мало анимаций»

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

— «Меня что-то смущает»

— Что конкретно смущает, из-за чего появились сомнения?

Поздравляю, у вас страйк. Прямо здесь и сейчас надо добиться подробных объяснений. Говорите мягко, но уверенно. Напомните, что вместе с клиентом утверждали все этапы, в том числе и мудборд. Скорее всего, клиенту реально не хватает какой-то мелочи — например, не нравится фото или какой-то цвет. Часто Zoom или Skype засвечивают макет и из-за этого не видно светлых подложек. Предложите посмотреть в Figma. Небольшие изменения можно сделать онлайн.

— «Хотелось бы, чтобы дизайн был сочнее. Все должно быть ярким, большим и анимированным»

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

Категорическое «нет» — не совсем правильно, старайтесь находить компромисс.

— «Мне все нравится, но сделайте логотип в 2 раза больше»

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

— «Хочу, чтобы вместо фото к новостям были 3D сцены»

— Это не типичное пожелание. Возможно, оно действительно оправдано, но вы должны понимать, что поддерживать такой формат будет сложно. Насколько целесообразно для обычной новости создавать 3D-сцену с трудозатратами в 20 часов?

Кстати, если вам есть что добавить или есть спорные моменты, на которые вы не знаете, как ответить, можете написать в комментах! Я отвечу)

Итак, возражения отработали, идем дальше. Это еще не все.

Что еще нужно учесть, чтобы все прошло круто

Менеджеру:

  • Грамотно распланировать время. Оставить запас на форс-мажор;
  • Оценить риски. Понятно, что лучше, когда на проекте все бывалые, но так бывает не всегда. Усиливать слабую команду проекта нужно сильным спецом, он может компенсировать недостаток компетенций у других. Начинающего менеджера подстрахует опытный дизайнер/арт-директор и наоборот. Но если на сложном проекте все джуны — «успех» Мише гарантирован…
  • Не забыть включить запись созвона, предупредив всех!
  • Поддерживать фокус на цели звонка. Иногда клиента уносит не туда;
  • Важно добиться фидбэка: «Как видите, мы проделали большую работу, результат и правда отличный. Какое у вас впечатление?»
  • Зафиксировать результаты созвона в митинг-репорте и отправить его в течение часа. Обязательно получить подтверждение от клиента, что все ОК.

Дизайнеру и арт-директору:

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

Всем:

  • Согласовать структуру демонстрации;
  • Провести внутреннюю приемку и проработать кривые моменты.

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

Ну и напоследок, делимся готовым скриптом-шпаргалкой, который поможет начинающим и дизайнерам не растеряться на демке. Удачи.

Чтобы не пропустить интересное, следите за нами:

В телеграм-канале

Во ВКонтакте

На нашем сайте

Если у вас есть задача разработать сайт или мобильное приложение, то напишите в Телеграм, мы это обсудим: https://t.me/sashadzen

Заказать разработку сайта, веб-сервиса или мобильного приложения на нашем сайте: https://vk.cc/cuglQZ

Партнерская программа, где мы платим от 10 000 до 200 000 рублей за контакты тех, кому нужен дизайн или разработка: https://vk.cc/cuglXT

Телеграм-канал Саши Комбарова про управление агентством, проектами, людьми: https://t.me/sasha_kombarov

Телеграм-бот, который бесплатно выдает чек-листы, памятки и регламенты по управлению, маркетингу, аналитике, дизайну и разработке: https://t.me/regulations_pyro_bot

0
24 комментария
Написать комментарий...
Oleg Ritter

Где же вы раньше были с этой статьей?!(( Только вчера факап с дизайн-концепцией с заказчиком случился, думаю статья бы помогла))
Но все равно спасибоа

Ответить
Развернуть ветку
Пиробайт
Автор

Спасибо за коммент. Набивали шишки сами))

Ответить
Развернуть ветку
Саша Комбаров из Pyrobyte.ru

Пиробайт, всё переписываем, у вас скучное лицо, вам никто денег не даст

Ответить
Развернуть ветку
Пиробайт
Автор

😢

Ответить
Развернуть ветку
Анна Цкриалашвили

Насчет ЛПР: допустим мнение генерального и собственника мы спросить обязаны, но будут ли они тратить время на презентацию? Нет. Для этого у них есть специально обученный человек, который принесет 2-3 варианта и скажет выбирать из них. На что ему, скорее всего ответят: "Ну а тебе какой нравится? Берем его".

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

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

Ответить
Развернуть ветку
Саша Комбаров из Pyrobyte.ru

А зачем делать то, что хочет заказчик, если это не то, что нужно пользователю?

Если просто собственник развлекается, тогда вопросов нет)

Ответить
Развернуть ветку
Анна Цкриалашвили

Если счет оплачивает пользователь, то ок)))

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

Ответить
Развернуть ветку
Саша Комбаров из Pyrobyte.ru

Если мы говорим о каком-то корпоративном сайте или простом приложении, то такой подход никому не навредит. Максимум, пользователям не зайдет дизайн)

А если идет речь о сложной ERP системе, веб-сервисе, то такой подход приведет к краху продукта. Мы знаем, как решать задачу, что именно нужно пользователю. Наша задача не сделать так, чтобы «понравилось заказчику», а чтобы решить задачу бизнеса и в конце концов принести прибыль.

Большинство заказчиков идут именно за этим, а не по вносить правки, чтобы им нравилось)

Ну и ниже небольшой мем по этому поводу :)

Ответить
Развернуть ветку
Антон Лисицкий

"2-3 варианта и скажет выбирать из них"
Бездумный перебор вариантов говорит о том, что процесс не отлажен и исполнитель не знает как получить отличный результат с первого захода.

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

"адекватная отработка возражений"
Жаль, что у вас есть только такой опыт) Именно по этому стоит отрабатывать возражения, тренироваться внутри команды. Коллеги подскажут где фальш)

Ответить
Развернуть ветку
Анна Цкриалашвили

1. Если вы работаете с одним "отлаженным" вариантом, то вряд ли вы когда-либо сталкивались как с подбором подрядчика, так и с проработкой идеи. Ну принесете вы одинокий вариант и скажут в ответ: "А что другого не было?". Люди на руководящих постах хотят иметь возможность выбрать. Не факт, что они ей воспользуются, но сам факт.

2. Если клиент принимает активное участие во всех этапах, то смысл большой презентации в конце? Ты и так в курсе, что уже получилось. Акт приемки подписал и пошли дальше работать.

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

Ответить
Развернуть ветку
Пиробайт
Автор

Ну не скажите, ЛПРы разные бывают) Мы, например, недавно описывали кейс по аренде яхт в Сочи, так там директор сам активно принимал участие во всех процессах, редкость)

Ответить
Развернуть ветку
Пиробайт
Автор

«‎‎Если возражения уже есть, то вы налажали со своим концептом‎»‎ — не обязательно с концептом. Можно налажать и с демо, и тогда уже общее впечатления от всего попортится.

Ответить
Развернуть ветку
Вячеслав Зыкин

"митинг-репорт"! записал в книжечку. а то всё протокол да протокол )))

Ответить
Развернуть ветку
Пиробайт
Автор

Обращайтесь))

Ответить
Развернуть ветку
Константин

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

Ответить
Развернуть ветку
Пиробайт
Автор

Да, дьявол кроется в мелочах)

Ответить
Развернуть ветку
Лёша из Аспирити

Кликнул на слово "обосраться", а в статье ни одного крепкого словца. Ожидания обмануты, осадочек остался. :D

На самом деле, классная статья, спасибо 💙

Ответить
Развернуть ветку
Пиробайт
Автор

Значит, гипотеза сработала, вы попались :D
На самом деле, спасибо за коммент! 💙 Стараемся

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Алексей Самарин

Сразу видно честный комментарий

Ответить
Развернуть ветку
Пиробайт
Автор

Ботов что-то развелось)

Ответить
Развернуть ветку
Abnatop Sky
Потому что разработка концепции — объемная работа, занимающая от 8 до 40 часов. И до принимающей стороны важно донести, что картинки на экране — не прихоть одного дизайнера, а итог работы целой команды, решения и предложения которых основаны на знаниях и опыте.

.

Ответить
Развернуть ветку
Пиробайт
Автор

😁

Ответить
Развернуть ветку
Пиробайт
Автор

Но это ж не концепция)

Ответить
Развернуть ветку
Jakob K

А мне у Сервико и начальный логотип вполне заходит - понятно что написано. Название компании читается. В том что получилось ничего не понятно и не запоминается.

Ответить
Развернуть ветку
21 комментарий
Раскрывать всегда