что такое style guide
Создание стайлгайда для проекта
Создание сайтов становится всё более комплексной работой, которая нередко выполняется не одним человеком. Важно убедиться, что дизайн оптимизирован для достижения бизнес-целей и способен создать хороший опыт для пользователей.
Люк Клам затронул тему использования стайлгайдов в качестве первого шага в веб-дизайне (прим. переводчика: на английском) в прошлом году, а я хочу подробнее рассказать о создании удобного руководства по стилю для ваших проектов.
Что такое руководство по стилю?
Почему это важно?
Когда много дизайнеров работают над большим сайтом или веб-приложением, чрезвычайно важно убедиться, что их работа выглядит целостно, и каждый интерпретирует стиль бренда по-своему. Это также важно, когда разговор заходит о разработчиках: наличие готовых элементов сильно облегчит разработчикам задачу, если они захотят использовать их повторно.
Чтобы сделать жизнь разработчиков ещё проще, дизайны должны включать в дизайн-макет вид всевозможных элементов в разных состояниях: например, как кнопка будет выглядеть, когда на неё наведут курсор, кликнут; какого цвета будет ссылка при наведении и так далее.
Создание стайлгайда
1. Изучите бренд
Если вы дизайнер, который не умеет писать код, просто откройте Photoshop и дайте документу название и небольшое описание. В него вы будете помещать элементы.
Если вы можете кодить, будет лучше создать html-документ с уже готовыми элементами, чтобы их было проще использовать.
2. Определитесь с типографикой
Вы должны правильно выбрать шрифты, потому что это один из важнейших способов коммуникации между посетителями и сайтом.
Задайте иерархию. Вот типы заголовков: h1, h2, h3, h4, h5, h6. Затем выберите, как будет выглядеть основной текст, его bold- и italic-варианты. Не забудьте указывать название шрифта, толщину и цвет.
3. Цветовая палитра
То, как люди воспринимают цвета и ассоциируют оттенки с брендами, просто невероятно. Подумайте о Coca-Cola. Я думаю, вы сейчас видите красный цвет.
Начните с задания главных цветов, которые будут доминировать в дизайне сайта. Этих цветов не должно быть больше, чем три. Однако, в некоторых случаях, вам будут нужны главный, второстепенный и третьестепенный цвета. Убедитесь, что вы определили их. Также включите в стайлгайд нейтральные цвета, вроде белого, серого и чёрного.
4. Голос
Пример: вы изучили бренд, прежде чем создавать стайлгайд, и обнаружили, что он молодой и современный. Тогда можно дать бренду «голос». Например, вместо «Ошибка 404» можно написать «Ох, чувак, ты всё сломал. 404 ошибка». Если бренд более официально себя преподносит, не стоит так делать.
Помните, что красота содержится в деталях.
5. Иконки
Иконки существовали тысячи лет. Они старше, чем текст и слова. Используйте иконки в своих проектах, потому что они помогают пользователям понять, что будет, если нажать на какой-то элемент.
Выбор правильных иконок поможет им больше, чем цветовая палитра или графика. Используя иконки, убедитесь, что вы подумали о целевой аудитории, религии и истории (как бы забавно это ни звучало), чтобы избежать недопониманий и недоразумений.
Есть ещё кое-что, что нужно упомянуть: подумайте о бренде и его ценностях. На сайте большого банка не стоит использовать нарисованные от руки иконки.
NounProject создаёт визуальный язык иконок, который может понять любой
6. Картинки
Одна картинка лучше, чем тысяча слов. Убедитесь, что в стайлгайде вы определяете стиль и направление картинок, которые сайт будет использовать. Снова подумайте о ценностях компании и её миссии.
Немного хороших сайтов с отличными картинками: 16 Places to Find the Best Free Stock Photos.
7. Формы
8. Кнопки
9. Расстояние
Что расстояние делает в стайлгайде? На самом деле, очень важно упомянуть в руководстве по стилю расстояние. Оно может быть выражено в форме сетки, использованной при создании макета; это может быть расстояние между заголовками, кнопками, картинками, формами и прочими элементами.
10. Делайте/не делайте
Последний, но очень важный пункт: не забудьте раздел «делайте/не делайте» (DOs/DON’Ts). Он чем-то похож на FAQ. В нём нужно описать подводные камни использования стиля и описать, как можно и как нельзя им пользоваться.
Примеры
Ниже приведены лучшие примеры руководства по стилю, которые можно использовать в качестве вдохновения при создании собственного стайлгайда. Помните, что на эти руководства оказали огромное влияние организация компании, их видение мира, миссия и ценности, и многие вещи, которые подходят другой компании, будут выглядеть нелогично в отношении того, что делаете вы, поэтому не стоит слепо копировать вид понравившихся элементов.
Dropbox Branding and Logos
Kickstarter Style Guide
Lonely Planet Design Guide
Заключение
Вы поняли, зачем нужно создавать стайлгайд, различные части дизайна правильно и целостно выглядят. Также вы убедились, что предугадали все возможные сценарии превращения вашего дизайна в реально работающий продукт.
Примечания переводчика
Я хочу добавить от себя не такой подробный, как описано в статье, но хороший шаблон для создания стайлгайда от CodyHouse.
Зачем нужен стайлгайд?
Представьте, что ваша компания планирует расширяться на зарубежные рынки. Вам нужно перевести массу документации, маркетинговых материалов и сайт. Завести блог для продвижения тоже было бы неплохо. Эти задачи вы поручаете нескольким надежным профессионалам, но в последний момент решаете всё проверить у независимого специалиста. И вдруг выясняется, что тексты, формально соответствуя оригиналу, вызывают тем не менее совсем иные эмоции и ассоциации. А еще — что переводы разных текстов противоречат друг другу: в каталогах цены указаны в местной валюте, а на сайте — в долларах; в печатных буклетах название вашей компании переведено, а в онлайн-магазине, которым занимались другие подрядчики, осталось на языке оригинала. В результате на исправление всего этого уходит масса времени и денег.
Такие проблемы могут возникнуть не только из-за несогласованных действий нескольких подрядчиков. Даже если весь проект берет на себя одна компания-локализатор, но объемы и сроки вынуждают ее делить работу между несколькими сотрудниками, — расхождения весьма вероятны.
Впрочем, задача сохранить единый стиль и согласованность переводов не нова. И решение давно найдено: стайлгайд (от англ. style guide), или руководство по стилю.
Оговоримся сразу: речь пойдет не об избавлении от «шедевров» наполовину машинного, наполовину выполненного недоучками перевода типа «усиленного гидрой колесного руля» или «современных материалов хлопчатой кожи» (что бы это ни значило). Никакой уважающий себя переводчик такого не допустит независимо от того, есть у него руководство или нет. Мы поговорим о том, как вместо среднего перевода получить высококлассный.
Что такое руководство по стилю?
Стайлгайд — это документ, где собраны пожелания заказчика относительно стиля (что понятно из названия), тона изложения, особенностей оформления и другие вопросы, для которых в целевом языке перевода нет строгих правил. Какой должна быть интонация: сдержанно формальной или непринужденно разговорной? Можно ли использовать сленг? Что делать с ценами? Придерживаться метрической или имперской системы мер? Важно ли везде одинаково оформлять даты? Переводить ли названия организаций и инициатив?
Четкие инструкции помогут переводчику выбрать стиль подачи информации, создать или поддержать узнаваемый образ вашей компании на новом рынке и при этом учесть интересы целевой аудитории и культурную специфику страны, для которой предназначен перевод. Команда специалистов будет работать слаженно, не обращаясь к вам с вопросами по любому мелкому поводу, а в переведенных документах противоречий будет гораздо меньше.
Какие преимущества дает стайлгайд?
Руководство по стилю поможет добиться:
Итак, прежде всего руководство по стилю помогает выдерживать в переводах единое профессиональное оформление. Вы когда-нибудь делали презентации по работе? Тогда вы знаете, как легко испортить самый хороший доклад, просто покрасив слайды в плохо сочетающиеся цвета. То же происходит, если в буклетах, пресс-релизах и интерфейсе сайта неожиданно меняют форму кавычки, названия продуктов в одном месте переведены, а в другом нет, а цены прыгают из валюты в валюту. Такая небрежность создает впечатление работы, сделанной наспех, а это не прибавит ни уважения к компании, ни доверия к ее продукции.
Во-вторых, когда вы пишете для своих клиентов, будь то электронные рассылки или бумажные каталоги, вы наверняка выдерживаете общий стиль, тон обращения. Он может быть дружественным, даже почти фамильярным, а может — торжественным и в высшей степени уважительным. Вы можете допускать вольности и шутки или писать только строго по делу. Всё это и есть голос вашего бренда. Он позволяет читателям подсознательно отличать вас от конкурентов. Поэтому очень важно выдерживать единый стиль в переводных текстах. Здесь тоже поможет стайлгайд.
В идеале, конечно, хотелось бы закрепить за одним заказчиком одного переводчика и одного редактора, которые будут знать о компании все. Но тогда важная и срочная новость для публикации в другой стране может оказаться готова только через пару дней, а каталог весенней одежды поспеет как раз к июлю. Поэтому обычно переводы распределяют на несколько человек. Но без стайлгайда это приведет к рассогласованности переводов, которая может подпортить вашу репутацию. Конечно, совсем уйти от исправлений к готовым текстам не получится даже с руководством по стилю. Но если у всех переводчиков будет единое представление о том, что вам нужно, экономия времени и денег на финальную правку может оказаться весьма существенной.
В каких случаях необходим стайлгайд?
На самом деле стайлгайд требуется не всегда. Если вам нужно перевести один договор или, скажем, локализовать несколько небольших и несрочных описаний продуктов, достаточно перед началом работы устно или в переписке оговорить свои основные требования и пожелания.
Однако без руководства по стилю вам никак не обойтись, если на рынке в другой стране вы присутствуете постоянно. Скажем, у вас регулярно обновляется коллекция или вы публикуете новейшие достижения в своей области. В таких случаях переводы вам будут нужны регулярно. Чтобы не излагать каждый раз заново свои пожелания, стоит составить руководство по стилю.
Стайлгайд необходим и тогда, когда вам предстоит работа над крупным или долговременным проектом. Локализация большого каталога или всего вашего сайта требует структурированных письменных инструкций.
При локализации компьютерной игры руководство по стилю и вовсе становится предметом первой необходимости, так как позволяет заранее учесть многие (хотя и далеко не все) важные нюансы. Например, как переводить имена и географические названия? Как быть с говорящими прозвищами и наименованиями? Есть ли ограничения по числу символов в переводе? Каковы требования к аудиофайлам? На эти и многие другие вопросы отвечает правильно составленный стайлгайд.
Что стоит включить в руководство по стилю?
Объем стайлгайда может быть разным. У компаний с большим опытом перевода он больше: например, в руководстве у Facebook 30 с лишним страниц, а у другого IT-гиганта — более сотни. Если же компания только начинает работать с новыми рынками, достаточно самой важной информации на 6–8 страницах. Краткое руководство проще освоить тем, кто будет участвовать в локализации. Позже вы сможете добавить то, что окажется важным в ходе работы.
Обычно руководства по стилю делятся на две части. В первую входит то, что касается голоса вашего бренда, во вторую — технические требования и правила оформления.
Первая часть должна давать ясное представление о том, какой стиль вы предпочитаете. Обычно это не так просто сформулировать, поэтому можно пойти немного иным путем. Расскажите о ценностях вашей компании, ее миссии и целевой аудитории: о возрасте и образовании, о роде занятий и уровне знакомства с темой тех, кто будет читать перевод. Именно это в первую очередь определяет ваш «голос» — и это же поможет лингвистам подсказать вам, какие особенности стоит сохранить в переводных текстах, а что изменить, чтобы не вызвать негативную реакцию целевой аудитории.
Здесь же стоит обозначить, с чем должен ассоциироваться ваш бренд. Верность традициям или суперсовременные технологии, динамичность или основательность, доступность или элитарность. Если вы знаете своих конкурентов, можно перечислить их и указать, важно ли вам выдерживать тексты в похожей тональности или, наоборот, следует максимально от них отличаться.
Если вы переводите документы разных жанров или создаете линейки продукции, ориентированные на разных людей, возможно, вы захотите, чтобы они звучали по-разному. Например, если вы хотите, чтобы маркетинговые материалы были покреативнее, а юридические — строгими и сухими; в описаниях продуктов для детей к читателю обращались на «ты», а для пожилых людей — на «вы» или даже «Вы», обо всем этом тоже стоит упомянуть в первой части стайлгайда.
В техническую часть включают рекомендации по формальным вопросам.
Кто составляет стайлгайд?
Хороший стайлгайд может получиться лишь в одном случае: если над ним работают и представители заказчика, и лингвисты из страны, на язык которой вы переводите тексты.
Как правило, техническую часть руководства лучше оставить переводческому агентству. Там им займутся квалифицированные и опытные лингвисты — носители языка, которые смогут выделить спорные вопросы и принять по ним профессиональное решение.
Первую же, общую, часть разумнее составлять вам самим. Лучше всего, если с вашей стороны в этой работе примет участие человек, специализирующийся на текстовом контенте и ясно представляющий вашу маркетинговую стратегию.
Что дальше?
Когда по всем вопросам удалось принять решение и ваш стайлгайд готов, разошлите его поставщикам-локализаторам. И не забывайте позже отправлять копию тем, кого решите дополнительно привлечь к работе.
Однако не стоит считать стайлгайд истиной, выбитой на камне. Руководства лучше всего работают, если их периодически пересматривать и адаптировать к переменам. При интенсивных переводах это полезно делать каждые полгода или год. Если вы локализуете материалы редко, документ может прожить 3–5 лет.
Если вы работаете с постоянным поставщиком, попросите его предлагать изменения и дополнения к вашему руководству. У него наверняка будут появляться вопросы и пожелания, которые стоит отразить в стайлгайде.
Четкие инструкции и слаженная работа — это высокое качество ваших текстов. А это — в наших общих интересах!
Текст: Полина Скурихина, Анна Марковская
Что такое Style Guide? Как создать руководство по стилю?
Что такое Style Guide – алгоритм создания
StyleGuide – это адаптированная система, содержащая элементы и правила, подходящие под стилистику определенного сайта. Основное назначение – создание единого стилистического направления и целостности дизайна. Это необходимо не только разработчикам, но и дизайнерам, которые участвуют в процессе создания сайта. Для реализации проекта важно заручиться поддержкой специалистов. Создание определенного гайда направлено на разработку единого стиля. Важно продумать каждый этап, учитывать особенности сайта и на основании этого подбирать формы, оттенки и т.д. Правильно реализованная задача – залог качественного конечного 🔥 результата.
Основное назначение руководства по стилю
Руководство по стилю – это сопроводительный документ, который предоставляется к дизайн-макетам страниц сайта. Наличие такой инструкции направлено на легкость считывания и верстку страниц с соблюдением «индивидуальных» правил. Руководство содержит информацию о стандартах оформления интерфейса системы. Здесь есть все, от внешнего вида интерактивных элементов, до шрифтов, изображений и даже логической разметки страницы.
Стайлгайд – это справка с набором стандартов и требований, обязательных к соблюдению. Их необходимо использовать в процессе оформления сайта. Ключевое назначение – создание единого стилистического и оформительского однообразия. Наличие инструкции поможет при развитии 💡 продукта, а также в случае доработки существующей функциональности.
Как создать руководство по стилю?
Создать Style Guide можно по определенному алгоритму. В процессе разработки инструкции, необходимо учитывать следующие параметры:
Цветовая гамма
Подбор оттенков осуществляется в индивидуальном порядке. Палитра должна иметь ряд цветов, с учетом особенностей самого сайта. Все оттенки условно разбиваются на нейтральные, основные и вспомогательные. На данном этапе необходимо определиться и с цветовыми решениями для кнопок.
Каждый оттенок имеет свой персональный код. И это очень удобно при верстке ⌨️ страниц и создании дизайна. В инструкции важно указать не только коды оттенков, но и их общее процентное соотношение.
Важно! Не забывайте выделять ключевые области и расставлять акценты. Это способствует концентрации внимания потенциальных клиентов.
Типографика
Типографика – это качество, которое сразу видит посетитель, посещающий сайт. От выбора шрифта зависит успех сайта. И это вовсе не шутка! Приятный шрифт располагает, а яркие и несуразные буквы вызывают желание скорее покинуть ресурс. В типографике важно продумать каждую деталь и описать 📝 правила применения определенных шрифтов. Это касается заголовков, основного текста и общих размеров.
Важно! Правильно оформленный сайт требует логической завершенности. Если типографика применена неграмотно, у посетителей это вызовет ряд негативных эмоций. Оформление всегда должно быть понятным и четким.
Компоненты
Данный раздел должен содержать типы кнопок, которые будут использоваться в процессе создания сайта. Дополнительно указываются ссылки, чекбоксы, чекбаттоны и другие инструменты, которые способствуют ведению конструктивного диалога с пользователем.
Компоненты нужны для создания привычного и стандартного элемента дизайна сайт. Это очень и очень важно! От правильности подбора компонентов зависит коммуникация пользователями с сайтом.
Важно! Кнопки и ключевые элементы должны подталкивать пользователя к определенному действию.
Текстовые поля
В разделе с текстовыми полями должны отображаться все возможные состояния полей ввода, выпадающие 📃 списки и т.д. Указанный блок содержит и равномерность. Оформление в едином стиле должно подталкивать пользователя к определенному действию.
Важно! На сайте должны быть только значимые поля. Таким образом возрастает вероятность заполнения клиентом нужной формы. Не забывайте о четком выделении ошибок.
Иконки
В разделе с иконками содержатся мини-изображения со всего сайта. В инструкции указывается стиль их изображения, а также сам значок сайта. Иконки позволяют извлечь максимум со всего дизайна сайта и при этом они несут максимальную пользу. Главная задача иконок – предоставление подсказок 💬 пользователю и облегчение навигации по сайту. Согласно показателям информативности, это самый полезный инструмент.
Важно! При выборе дизайна иконок необходимо ориентироваться на целевую аудиторию. В учет берется менталитет, увлечение и даже культурно-историческое развитие. Использование указанных факторов позволит избежать фатальных ошибок.
Логотип
В разделе «Логотип» содержаться правила его использования. В обязательном порядке отображаются цветовые сочетания, а также соотношение отступов и строк. В разделе «Логотип» указывается расположение, методы работы с фоном, а также список разрешенных и запрещенных оттенков. Обязательно учитывается межбуквенное расстояние и т.д.
Важно! Задать параметры логотипа очень важно. Ведь именно он отвечает за формирование персонального стилистического направления сайта. Логотип отвечает за тон всего сайта и действительно задает настроение
Главные «НЕ» для логотипа:
Сетка и отступы
В хорошем проекте используется бутстрап-сетка. Она позволяет выровнять все составляющие ресурсы. Это очень важно! Особенно в процессе создания общей концепции стайлгайда. Более того, использование сетки и отступов позволяет ⚙️ адаптировать ресурс для мобильных устройств, планшетов и других гаджетов.
Использование сетки – это соблюдение всех пропорций, без постоянного вычисления параметров и расстояний. С этой целью необходимо заложить базовые закономерности и построить сетку. При создании общей концепции, необходимо просто придерживаться установленной сетки.
Важно! Дизайнерские макеты содержат 12-колоночную сетку. В некоторых случаях возможны исключения.
Модальные окна
В этом разделе содержаться все модальные окна, применимые для конкретного портала. Дополнительно указывается стилистика, а также удачные и ошибочные состояния.
Важно! Информации, которая отвечает за целевое действие (заказ, покупку, регистрацию) необходимо уделить особое внимание. Благодаря им происходит взаимодействие клиента с сайтом.
Анимация
Для загрузки страниц затрачивается определенное время. Для того, чтобы этот период прошел с максимальной пользой для клиента, создается отдельный экран с загрузчиком. Его основная задача – отображение текущего состояния ⏲ процесса загрузки. Подавайте анимацию интересно и оригинально. От этого также зависит, останется пользователь на сайте или покинет его.
Важно! Не стоит пренебрегать загрузчиком.
Правильно составленный Style Guide – это удобство использования для дизайнеров и разработчиков в процессе создания единого стилистического направления и верстки сайта. Несколько примеров готовых Style Guide которые мы разрабатывали:
В этом видео подробно рассказываем на пальцах что такое Style Guide и для чего он нужен:
Мы специализируемся на создании фирменного стиля, с учетом особенностей сайта и его специфики. Узнать подробную информацию об услуге создания Style Guide и оформить заказ, можно по указанным контактам или на странице данной услуги — узнать подробнее.
Вам понравился ❤️ материал? Поблагодарить легко! Будем весьма признательны, если поделитесь этой статьей в социальных сетях.
О пользе брендбука, или зачем компании нужен стайл-гайд
Данный материал будет полезен всем веб-дизайнерам, которые ценят собственное время и стремятся оптимизировать рабочий процесс. Очаровательная Кэмерон Чепмен открыла несколько ценных секретов, которые могут очень помочь и фрилансерам, и офисным работникам.
У многих дизайнеров рано или поздно появляется потребность в создании справочника по фирменному стилю компании-клиента. Брендбук, или стайл-гайд (англ. brand book, style guide) как раздел Библии бренда – это специальный набор правил, которые должны соблюдаться при работе с элементами дизайна фирмы. Похожее описание этого термина есть на Википедии:
Стилисти́ческий спра́вочник или руково́дство по сти́лю — справочное издание с набором стандартов и обязательных для соблюдения требований при написании и оформлении статей в конкретном издании или при составлении документов в той или иной организации. Служит для поддержания стилистического и оформительского однообразия как для отдельного текстового документа, так и для множества документов.
В нашем случае такой справочник может содержать рекомендации по работе с символикой фирмы, информацию об особенностях шрифтов и используемых цветах, а также многое другое.
Подобное руководство помогает избежать ошибок и сэкономить уйму времени и средств; оно является своего рода инструкцией, в которой все разложено по полочкам. И если вы считаете, что брендбук нужен далеко не каждой компании или пока не имеете представления, как он создается – данная статья вам пригодится.
Для чего необходим брендбук
Казалось бы, зачем маленькой компании нужен стилистический справочник, когда ее дизайном занимается всего лишь один человек – ведь он и так все помнит? Давайте рассмотрим на примере.
Представьте себе, что вы – единственный дизайнер, который работает над проектом. Разработка фирменного стиля, логотипа, создание дизайна для сайта, визитных карточек и остальных маркетинговых материалов полностью возложено на ваши плечи, а все нюансы и секреты этих разработок вы держите у себя голове.
Год спустя компания перешла на новый уровень и расширилась. Ей понадобилось нанять второго дизайнера, чтобы поручить ему часть вашей работы. Теперь, чтобы обучить новичка всему, что вы знаете, вам придется напрячь память, ведь о некоторых вещах вы не вспоминали уже длительное время. И, конечно, в случае любого промаха винить будут именно вас за неправильное обучение сотрудника.
Эта проблема могла бы разрешиться намного проще, если бы у вас был грамотно составленный брендбук, в котором содержится все, что нужно знать: коды цветов, размеры логотипов, названия шрифтов, различные стандарты, требования и прочее.
Вот еще один пример. Предположим, вы – фрилансер, работающий с несколькими клиентами. Имея при себе брендбук для каждого из них, вы сможете легко переключаться с одной задачи на другую, а также возвращаться к работе, которую делали давным-давно. У вас не будет необходимости разыскивать старые файлы, чтобы выяснить тип шрифта или шестнадцатеричный код цвета. Всю эту информацию вы сможете получить в считанные секунды.
Кроме того, у стилевого справочника есть еще один важный плюс. Вы же не хотели бы, чтобы ваши разработки были испорчены кем-то менее осведомленным? Другой дизайнер может не знать всех особенностей проекта, и будет очень обидно, если тщательно продуманный логотип будет использован без соблюдения определенных стандартов, что в итоге полностью разрушит задумку и исказит общий вид.
Если после прочтения вышеперечисленных примеров вас заинтересовала данная тема и вы желаете узнать, что же главным образом должно быть учтено в руководстве по стилю, предлагаем ознакомиться с рекомендациями ниже.
Основные элементы брендбука
Безусловно, каждый стайл-гайд по-своему особенный, он всегда будет чем-то отличаться от другого. И тем не менее у всех инструкций такого плана есть ряд общих пунктов.
В гайдлайне (этот раздел брендбука иногда называют паспортом стандартов), содержится описание констант бренда – его логотип, фирменные цвета, допустимые и недопустимые варианты преобразования и использования элементов, правила оформления документации, рекламной продукции и так далее.
Шрифты
У компании должен быть свой список фирменных шрифтов. И в маркетинговых материалах любого типа должны использоваться только эти шрифты, и никакие другие. Крайне важно сохранить этот перечень, дополнив его образцами написания.
Если существуют особые правила оформления заголовков и подписей, рекомендации по использованию шрифтов в определенных размерах и прочие характеристики, их также необходимо записать.
Цвета
Информацию об используемых цветах стоит расписать как можно подробнее. Это значит, что в гайдлайне необходимо не только указать шестнадцатеричные варианты представления каждого цвета, но и не забыть упомянуть об эквивалентных значениях в цветовых моделях CMYK и Pantone для печати. Далеко не каждый цвет выглядит одинаково на компьютере и на бумаге, поэтому лучше заранее продумать все детали, чтобы потом не столкнуться с несоответствиями в дизайне.
Многие оттенки могут сильно искажаться при переходе из цветового пространства RGB в CMYK (бывает так, что насыщенный синий цвет становится более темным и приглушенным, а красный превращается в оранжевый или розовый). Выделите время на проработку нюансов, играйте с цветами, пока не достигнете наилучшего результата. И, конечно же, не забудьте проверить, как ваша работа выглядит в печатном виде.
Логотип
Практически у любого логотипа теряется вид, если его слишком сильно уменьшить. Можно разработать упрощенный вариант лого для тех случаев, когда его необходимо использовать в маленьком размере, а можно просто обозначить допустимый предел уменьшения логотипа.
Также нужно указать:
Графика
Если фирменный стиль предполагает использование графической информации, необходимо внести это в гайдлайн. Укажите также особенности ее использования. К примеру, все фотографии должны быть черно-белыми или обрабатываться определенным фильтром.
Текст
Далеко не всегда есть потребность вносить информацию о стилевых чертах, которые должны фигурировать в текстовых материалах компании. Но если она придерживается определенного тона при письменной коммуникации, это необходимо учесть в брендбуке.
Например, там могут быть обозначены определенные слова либо фразы, которые используются чаще остальных, а также термины, применение которых нежелательно. Подчеркните, если в текстах нужно соблюдать определенный стиль речи – официально-деловой, научный, художественный и т. д.
Все особенности фирменных элементов компании, которые используются в электронном виде и интернет-пространстве, обязательно должны быть перечислены в вашем стайл-гайде. Сюда входит все – от дизайна кнопок до визуальных эффектов на сайте. Учитывая то, что эти вещи могут применяться на огромном количестве страниц (а иногда и на нескольких сайтах), без подробной и четкой инструкции здесь не обойтись.
Другое
Вот список того, что еще может быть добавлено в брендбук:
Размеры брендбука
Длина справочника может варьироваться от одной страницы до десятков – все зависит от сложности фирменного стиля и количества производимых маркетинговых материалов.
Величина инструкции для небольшого сайта с одним логотипом, парой вариантов шрифтов и набором фирменных цветов вряд ли будет превышать несколько страниц. А вот у большой многонациональной корпорации с большим количеством подразделений, которая использует чуть ли не все основные средства распространения рекламы, длина стайл-гайда будет немного побольше – его размеры скорее будут напоминать полноценную книгу, чем обычное руководство.
В любом случае брендбук не должен быть длиннее, чем требуется, но тем не менее в него нужно вместить все полезные сведения о фирменном стиле компании вашего клиента.
Живой документ
Жизнь идет, бренды развиваются, создаются новые логотипы, редизайнятся сайты. Важно следить за тем, чтобы данные в вашем брендбуке оперативно обновлялись. Представьте, что вы ведете дневник, в котором отмечаете все изменения, касающиеся фирменного стиля. Сохраняйте информацию даже о незначительных модификациях, чтобы при необходимости иметь возможность вернуться назад.
В связи с тем, что в справочник постоянно вносятся поправки, следует предоставить доступ к последней версии гайда всем, кто в этом нуждается.
Интеграция
Определенную информацию можно добавить даже в начало CSS-файла на сайте, используя комментарии. Это поможет разработчикам соблюдать правила и сверять свою работу.
Полная версия брендбука должна быть открыта тем, кто использует элементы фирменного стиля для работы. Можно разместить документ на сервере компании или воспользоваться облачным хранилищем.
Скрытый или публичный документ
Сегодня многие компании предоставляют свободный доступ к своему брендбуку. Это имеет смысл, поскольку:
Если вы приняли решение сделать руководство по стилю публичным документом, вы наверняка пожелаете, чтобы оно выглядело не хуже, чем ваши рекламные и маркетинговые материалы. Но учтите, что для такой работы потребуется выделить больше средств и времени.
Обратной стороной медали в этом случае является то, что все сведения по бренду становятся открытыми не только для доброжелателей, но и для недругов, которые могут воспользоваться вашей щедростью.
Недоступный для посторонних глаз стайл-гайд всегда проще обновлять и править. Также не нужно стараться сделать его максимально удобным и презентабельным – это большой плюс, особенно когда дизайнер и без того завален работой.
Суть любого брендбука – облегчить и ускорить рабочий процесс. Убедитесь, что он выполняет свою функцию, невзирая на уровень доступа.