Обсудить задачу

Как приводить лидов и растить конверсии с помощью контент-маркетинга
Рассказываем в Телеграм-канале
Рассказываем без булщита и воды!

Обновили шаблон презентации Пиархаба: разработка коммерческого предложения ускорилась в 1,5 раза

Оптимизировали шаблон презентации для коммерческих предложений в Пиархабе: сделали его более современным, читаемым и удобным.
/
/
Шаблон презентации для Пиархаба
PR-агентство Пиархаб создаёт спецпроекты для клиентов из сфер онлайн-ретейла, финтеха, фудтеха и страхования. Компания помогает крупным корпорациям и небольшим стартапам заявить о себе: публикует регулярные статьи и вирусные PR-кейсы, налаживает работу с блогерами и СМИ.

О клиенте:

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

Задачи:

Что сделали:

Что мы сделали:
Усовершенствовали шаблон презентации на основе фирменного стиля. Старый шаблон морально устарел, в нём были проблемы с вёрсткой, и сотрудникам приходилось звать дизайнера, чтобы поменять текст и иллюстрации. Такая презентация создавалась долго — из-за этого компания рисковала потерять клиента до того, как он им станет.
Новый шаблон помогает собирать презентации быстрее и делать их нагляднее. Коммерческое предложение имеет привлекательный и понятный дизайн, который не отвлекает от важной информации. Клиент может оценить качество услуг Пиархаба уже на этом этапе.
Шаг 1. Работа над старыми ошибками
Шаблон презентации — это прежде всего система, из которой может получиться хороший рабочий инструмент для команды. Он должен быть таким, чтобы любой сотрудник мог не просто заменить картинки, а создать документ, который не стыдно показать клиенту.
В старом шаблоне было несколько проблем:
Шрифты — использовали базовые шрифты, которые не вписывались в фирменный стиль компании и не имели иерархии, то есть чёткого разделения на обычный текст и заголовки. Из-за этого читателю было сложно выделить важную информацию.
А ещё элементы выходили за границы слайда, не было ощущения цельности
Вёрстка — ссылки и подписи делали в разных форматах, использовали обводку разной толщины, в оформлении не было цельности, например, слова слипались, а пункты списка стояли отдельно от строчек.
Здесь видно, что буллиты стоят отдельно от строк, да и пунктов больше, чем стрелок. Чтобы всё выровнять, приходилось звать на помощь дизайнера
Иллюстрации — в старом шаблоне использовались скриншоты, иллюстрации и фотографии, но из-за них слайд выглядел пёстрым и непонятным.
Ещё в презентации было мало элементов — только цветные и чёрные стрелки, а также баблы, которые не вписывались в слайд
В старой презентации было много технических неровностей, но это даже не проблема дизайнера, а проблема программы, в которой был сделан старый шаблон. Об этом расскажем дальше.
Шаг 2. Техническое решение
Старый вариант шаблона был оформлен в Keynote — эппловской программе для подготовки презентаций. Новую версию клиент планировал делать в этой же программе, но в КОМРЕДЕ объяснили, что тогда работать с шаблоном будет сложно:
  1. В Keynote нельзя скопировать код цвета и вставить его на другом слайде.
  2. Нельзя загружать свои шрифты, а те, что есть, часто недоступны для пользователей Windows.
  3. Есть сложности с экспортом форматов, например, нельзя перенести презентацию из Keynote в Гугл-слайды, потому что не сработает масштабирование и потеряются картинки.
  4. Проблема с выравниванием. Типичный приём дизайнеров — зажать Shift, чтобы выровнять всё по намеченным линиям. В эппловской программе этого так просто не сделать: любые изменения текста и изображений ломали вёрстку.
В КОМРЕДЕ убедили клиента, что новый шаблон лучше сделать в Фигме. Это графический онлайн-редактор, в котором можно делать прототипы интерфейсов, презентации и картинки, например, для соцсетей. Фигма удобна для взаимодействия команды: каждый сотрудник может зайти в шаблон, изменить его, добавить или удалить слайды, поменять текст и картинки, добавить гифки, анимации и ссылки. При этом сам шаблон не сломается, а с дизайном и вёрсткой ничего не случится.
В Фигме можно выгружать презентацию целиком или скачивать и менять отдельные элементы. Для этого доступны четыре формата: png, jpg, svg, pdf. А самое важное — дизайнер программирует систему и делает всё так, что потом любой сотрудник с базовым навыком «копировать — вставить» может с этим работать. От неловкого движения неопытного коллеги не сломается система вёрстки и не исчезнут слайды, а если дизайнер будет в отпуске, клиент всё равно получит красивое и понятное КП.
Шаг 3. Дизайн
Клиент пришел в КОМРЕДУ уже с готовым текстом, который нужно было разместить на слайдах, сохранив фирменный стиль. КП должно было пересекаться с ним стилистически, поэтому дизайнер КОМРЕДЫ изучила старую презентацию и сайт компании, а потом принялась за работу.

Цвет

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

Шрифты

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

Логотип

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

Вёрстка

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

Иллюстрации

В старом шаблоне была проблема с иллюстрациями, потому что использовали фотографии и скриншоты. Результат становился непредсказуемым: у картинок было разное освещение, экспозиция и цветовая гамма. Дело в том, что если в презентации много фотографий, без участия дизайнера не обойтись — только он может расставить акценты и снизить визуальный шум.
В новом шаблоне другая система иллюстраций: использование фотографий сведено к минимуму, и для их использования есть правила: нужно скруглить края, использовать черно-белый фильтр, сделать обводку.
В новом шаблоне иллюстрации с помощью набора приёмов стилизуются в едином стиле
Специально для этого шаблона в КОМРЕДЕ сделали пак с иллюстрациями — готовый набор типовых объектов, которые можно вставлять в слайды. Для пака выбрали узнаваемые образы: офисный спатифиллум, радио, телевизор, карандаш. А ещё химические колбочки, потому что пиар — это немного химии, и ракету, чтобы улететь в космос. Всё это помогает снизить градус напряжённости в серьёзной презентации.
Пак разборный и векторный, так что картинки можно использовать как вместе, так и по одной. Получается динамический стиль — и каждая презентация выглядит по-новому.
Для пака картинок сделали инструкцию. Так каждый член команды сможет пользоваться шаблоном без дизайнера, а презентация останется красивой, цельной и в фирменном стиле

Универсальность

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

Результаты:

Результаты:
В итоге получился универсальный шаблон, которым удобно пользоваться всей команде
  1. Можно менять толщину строк, линий, шрифты, элементы.
  2. Можно привязывать гиперссылки к определённым словам.
  3. Удобнее работать с презентацией — нужно только заменить картинку из пака и вставить нужный текст.
  4. К любому элементу можно оставить комментарий, как в гугл-доке. Больше не нужно писать в чат: «В заголовке в левой части исправить бабл».
Благодаря улучшенной структуре и дизайну сотрудники могут быстрее и эффективнее создавать коммерческие предложения. В новом шаблоне дизайн и структура помогают выделить ключевую информацию — это делает презентацию более понятной и убедительной.
КП стало более ёмким, но его легче дочитывать. В новом дизайне оно создаёт бóльшее ощущение ценности решения, которое Пиархаб предлагает клиенту. Структурированная и оформленная информация говорит о том, что компания уделяет внимание деталям, понимает потребности лида и знает, как ему помочь.
Даня Дымшиц
Вышло оч симпотно
СЕО Пиархаба

Обсудить задачу