Одна система для трёх носителей
Фирменный стиль становится виден по тому, как сотрудники оформляют обычную работу. Это набор правил для логотипа, цвета, шрифтов и изображений, по которым компания оформляет сайт, документы и рекламу. Для приёмки возьмите одну услугу и проследите, как она выглядит в мобильной версии сайта, коммерческом предложении и объявлении. Тогда станет ясно, можно ли пользоваться стилем, когда дизайнер отошёл от компьютера. Материал для такого испытания лучше брать из ближайшей рекламной кампании, чтобы в документе стояли действующие условия, а на сайте можно было открыть тот блок, к которому ведёт объявление.
Название, ассортимент и обещание покупателю относятся к бренду в целом. Айдентикой в задании удобно называть визуальную часть: знак, сочетания цветов, типографику и принципы работы с фотографиями. Разбор Яндекса для рекламодателей помогает сверить, какие элементы могут входить в систему. Границу работ лучше прописать своими словами. Тогда заказчик и дизайнер заранее понимают, идёт ли речь о создании знака, о выпуске шаблонов или о пересмотре того, как компания представляет услугу.
Критерий простой: стиль повторяется. Когда каждую рекламную картинку снова обсуждают с дизайнером, запишите, в какой момент требуется его решение, и попросите добавить ответ на этот вопрос в руководство.
В задании названы носители и владельцы
Мобильный экран, документ и объявление решают разные задачи. На сайте человек ищет состав услуги, в коммерческом предложении сравнивает условия, а в рекламе выбирает, стоит ли переходить по ссылке. Поэтому я бы начинал с форматов, которые команда выпускает регулярно, и только после первых проб добавлял праздничные обложки и выставочные материалы. Старайтесь включить в приёмку реальный по длине текст: короткий подставной заголовок скрывает проблемы, которые вылезут на второй строке.
У носителей разные владельцы. Маркетолог отвечает за объявление, редактор сайта — за шаблон страницы, сотрудник продаж — за предложение. Если документ правит менеджер, он получает файл, который открывается в привычной программе, и знает, где менять цену и название пакета. В задаче на сайт полезно ссылаться на бриф с требованиями к дизайну и содержанию.
Оформление влияет и на запас шаблонов. Перед переработкой текущего оформления соберите страницы, файлы и рекламные заготовки, которыми ещё пользуются. Если заказ касается только визуальных правил, вопросы о новой аудитории и названии вынесите в отдельную задачу, иначе дизайнер будет утверждать форму ещё до того, как руководитель примет решение о содержании. На старом сайте тем временем отметьте компоненты, которые стоит сохранить: изменение всех карточек и форм увеличит объём приёмки. Если меняется само предложение, заранее определите, какой объём работ нужен для ребрендинга.
Что должно совпадать на разных носителях
Сайт
Читаемый текст и одна понятная кнопка рядом с описанием.
Документ
Та же последовательность названий и заметные условия предложения.
Объявление
Короткий повод открыть страницу и знакомая версия знака.
Логотип выдерживает реальный размер
Логотипу задают несколько режимов работы. Для широкой шапки подходит основная версия с названием, а маленький квадрат под значок требует отдельной композиции, иначе мелкие буквы пропадут при уменьшении и человек увидит бесформенное пятно. Спросите, при каком размере и на каком фоне дизайнер предлагает переключаться между версиями. Попросите показать ответ в готовом макете, где рядом стоит реальный заголовок. Если заголовок прижимается к знаку, в задании понадобится точное расстояние, а на сайте — правило его сохранения при переносе строки.
Хороший ориентир даёт открытое руководство по бренду Яндекс Директа. В нём есть полная и короткая версии знака, отдельная иконка, а вокруг логотипа оставляют охранное поле — свободную зону до соседнего текста или границы макета. Компания может выбрать собственные размеры этой зоны и правила для фона. Если знак ещё предстоит разработать, включите эти условия в задание на логотип компании.
Не заставляйте менеджера перекрашивать знак. В руководстве Yandex Cloud монохромный вариант выделен отдельно для фотографий и цветных фонов. Аналогичный набор файлов стоит подготовить заранее для собственных носителей, если логотип приходится ставить и на светлую страницу, и на тёмное изображение, где обычный вариант начинает терять детали.
Цвет и шрифт выдерживают чтение
Палитра распределяет роли. Цвет действия должен быть заметен рядом с текстом и сохранять смысл в обычном, наведённом и недоступном состоянии, если кнопку можно выключать. Для каждой роли подберите пару из текста и фона. Тогда дизайнер сможет проверить читаемость кнопки на всех разрешённых фонах. В руководстве дизайнер указывает, какие пары годятся для мелкой подписи и основного текста, а какой оттенок оставляют для рамок или декоративного рисунка.
Для сайта есть измеримый ориентир. В WCAG 2.2, критерий 1.4.3 уровня AA, минимальный контраст обычного текста составляет 4,5:1, а крупного — 3:1. Исключения включают текст логотипа и недоступного элемента управления. Даже когда кнопка выключена, подпись полезно сохранить читаемой, чтобы человек понял, какое действие станет доступно после заполнения формы.
Текст открывают на разных устройствах. Если в файле с коммерческим предложением шрифт заменяется и длинная строка с суммой расползается на две страницы, сотруднику отдела продаж понадобится запасное начертание и правило, где уменьшать объём текста, а где переносить блок целиком. Для сайта проверьте кириллицу, цифры, знак рубля и читаемость обычного текста на узком экране. Для документа откройте редактируемую копию на том компьютере, где будут готовить предложения. Подробности о связи размеров текста и компонентов есть в разборе дизайна сайта.
Объявление собирается из тех же частей
Макет проверяют на выбранной площадке. Требования к отдельному логотипу могут отличаться от требований ко всей картинке, поэтому сохраните в папке выдачи готовый файл для конкретного места и запишите, где его используют. Тогда сотруднику не придётся растягивать широкий знак до квадрата прямо перед публикацией. Если объявление ведёт на страницу услуги, проверьте, совпадает ли название предложения после перехода.
В медийных видеообъявлениях Яндекс Директа логотип добавляют в отдельном блоке «Логотип». По справке об этом формате, подходит квадратное изображение от 80 пикселей по стороне и файл до 10 МБ. Сервис принимает JPG, PNG и GIF. У GIF отображается только первый кадр, поэтому проверьте, различим ли на нём знак. Другие рекламные места задают собственные условия. Подпишите файл по назначению и держите его рядом с макетом, чтобы квадратная версия из видеообъявления случайно не отправилась в шапку коммерческого предложения.
Рекламе нужен короткий вариант. Сначала откройте предпросмотр с обычным по длине названием услуги, чтобы понять, остаётся ли на экране сам повод перейти, когда часть текста и изображения занимают значок и служебные элементы площадки. Если фирменный узор мешает разобрать текст, упростите фон. Сохранить узнаваемый цвет проще, чем освободить место в переполненной картинке, когда её уже разбили на десятки размеров.
Папка передачи открывается у сотрудника
В папке два вида файлов. Исходник нужен для следующей правки, а экспорт — для текущей публикации или печати. Если договорились о передаче исходных файлов, в них должны оставаться доступными текстовые блоки, варианты знака и ссылки на изображения, иначе сотрудник откроет картинку и сможет разве что обрезать её. Доступ к общей папке проверьте с учётной записи компании, чтобы материалы оставались у команды после завершения договора.
В комплекте нужны версии знака и правила для них. Для масштабируемых изображений на сайте обычно готовят SVG, а для мест, где принимаются растровые файлы, — PNG или другой поддерживаемый формат. Для печати отдельно спросите у типографии, что она ждёт. На двух мониторах один оттенок может выглядеть по-разному, поэтому цвет печатного предложения лучше принять на пробном отпечатке, сделанном на той бумаге, которую закупают для тиража. В инструкции укажите, где взять шрифты, какие права на их использование согласованы и какое начертание выбрать при замене. PDF с красивыми разворотами полезен как справочник, если рядом лежат рабочие файлы.
Готовый файл назван по назначению. Запишите в задании, что сотрудник должен открыть шаблон предложения, заменить реквизиты услуги, сохранить файл и получить документ с прежней компоновкой, а при экспорте страницы или объявления — найти в папке нужную версию знака по понятному имени.
Как принять папку с исходниками
Открыть шаблон
Сотрудник заходит с корпоративной учётной записи.
Поменять содержание
Название, цена и контакты редактируются в отведённых местах.
Получить готовый файл
Документ читается, а объявление открывается в предпросмотре.
Самостоятельный выпуск по новым правилам
Проверку ведёт будущий пользователь. Если он впервые готовит предложение по шаблону, полезно попросить его заменить название пакета на длинное, обновить стоимость и выгрузить PDF, чтобы понять, сохраняется ли читаемость, когда в макет приходит материал из реальной работы. Редактор сайта повторяет тот же путь со страницей услуги, маркетолог — с объявлением. Запишите затруднения по порядку возникновения: поиск файла, выбор варианта, правка, просмотр результата.
Разберите первую точку остановки. Если менеджер выбрал тёмный знак для тёмного фона, откройте руководство. Точная подпись и пример помогут быстрее найти подходящую версию. Если узнаваемость пропала при уменьшении, добавьте подходящую версию и повторите тест на нужном размере. Команда принимает стиль, когда выпускает эти три материала по одним правилам и может объяснить, почему взяла именно такие варианты.
Для следующей задачи оставьте ссылку на принятую папку и имя того, кто обновит шаблон после изменений. Если позже появится новая услуга или поменяются условия, сотрудник сначала возьмёт последнюю версию шаблона и увидит, какие поля можно менять.
Источники и полезные ссылки
- Яндекс Реклама — из чего состоит фирменный стиль ↗
- Яндекс Директ — правила использования бренда ↗
- Yandex Cloud — логотип, иконки и бейджи ↗
- W3C — WCAG 2.2, критерий минимального контраста ↗
- Яндекс Директ — логотип в видеообъявлении ↗
Интерфейсы и возможности сервисов могут меняться. Перед настройкой сверяйтесь с актуальной документацией.
