Глава 1: Проектируем системы (часть 5)
← Назад | Глава 1: Проектируем системы (часть 4)
Перед вами перевод книги Atomic Design Брэда Фроста, разработчика интерфейсов, поклонника мобильного интернета и создателя методики “Атомарный дизайн”. Если вы здесь впервые, то лучше начните сначала)
Системы дизайна спасут мир
На что похожи эффективные системы проектирования? Какую форму они принимают? Как вы их создаете, поддерживаете и применяете?
Ищите системное погружение в тему? Загляните в блог для дизайнеров.
Краеугольный камень хороших систем проектирования — это руководства по стилю. В них задокументированы и систематизированы материалы по дизайну, описаны рекомендации, принципы использования и ограничения.
Существует огромное количество разновидностей руководств по стилю. В них входят документация по торговой марке, тексты, редполитика, программный код основных элементов, принципы дизайна, шаблоны пользовательского интерфейса. В этой книге я не буду углубляться в мелкие детали компонентов руководства по стилю, но расскажу о каждом из них. Так вы сможете лучше понять, как эти компоненты связаны, и как руководства по каждому из них вписываются в более крупную экосистему.
# Идентичность бренда
Руководство по идентичности бренда, или брендбук, определяет уникальное смысловое содержание бренда. В нем собраны и описаны логотипы, типографика, цветовые палитры, ключевые сообщения (например, миссия компании и слоган), оформление сопутствующих материалов (визитных карточек, шаблонов PowerPoint) и многое другое.
Для бренда исключительно важно однозначно и последовательно позиционировать себя для аудитории через все растущее число медиа-каналов и точек контакта. Как добиться того, чтобы все сотрудники организации говорили в унисон и чувствовали себя частью единого целого? Как сторонние организации узнают, о ваших фирменных оттенках палитры Pantone и о том, как правильно использовать ваш логотип? Брендбук содержит ответы на все эти вопросы.
Традиционно брендбук выглядел как книга с твердой обложкой (помните, эти штуковины с бумажными страницами?). Но, как и все остальное, руководства по стилю брендов постепенно перемещаются в интернет.
# Визуальный язык
Хотя руководство по идентичности бренда в целом содержит конкретные инструкции, описать визуальный язык бывает сложнее: он определяет общее направление проектирования, философию и подход к конкретным проектам или продуктам.
С учетом растущего числа продуктов и средств массовой информации Google разработал визуальный язык дизайна — материальный дизайн, — чтобы представлять себя повсюду в едином визуальном ключе. Руководство по материальному дизайну определяет его философию, цели, общие принципы и описывает конкретные способы применения.
Руководства по визуальному языку часто включают аспекты других компонентов руководства по идентичности бренда, чтобы сделать сложные концепции более понятными.
При этом руководство по визуальному языку, в отличии от руководства по идентичности бренда, может меняться. Возможно, в один прекрасный день Google заменит материальный дизайн новым визуальным языком. Бренд Google останется неизменным, но оформление его продуктов обновится.
# Голос и интонация
Люди взаимодействуют с брендами через множество каналов и медиа. Кроме цифровых медиа, о которых мы говорили до сих пор, бренды представлены в печатной и наружной рекламе, розничной торговле, на радио, телевидении и других каналах. Когда бренд должен нести сообщение через столько разнообразных точек контакта, единообразие и последовательность становятся критическим фактором успеха бренда.
Голос бренда остается неизменным изо дня в день, но его тон должен меняться в зависимости от ситуации и эмоций читателя. ~Кейт Кифер Ли
Голос — это один из аспектов идентичности бренда, поэтому, как правило, в брендбуках содержатся некоторые упоминания о нем. Очень часто эти рекомендации не очень-то подробные, поэтому так важно наличие отдельного руководства по голосу и интонациям.
Хорошее руководство в мельчайших деталях описывает то, как должен звучать голос компании в разных ситуациях. В блестящих рекомендациях MailChimp описано, как их тон меняется в зависимости от типа контента. Например, когда кредитная карта пользователя отклонена, сервис меняет свою обычно дерзкую и игривую манеру общения на более серьезную.
# Редполитика
Благодаря растущему числу сайтов с удобными системами управления контентом, все больше людей без труда могут публиковать свои материалы. Это палка о двух концах. Ведь для организаций, где работают несколько авторов, сохранение единообразного стиля письма может стать сложной задачей. Руководство по написанию текста, или редполитика, содержит правила, рекомендации и ограничения для авторов контента.
Редполитики могут быть чрезвычайно подробными и даже затрагивать особенности пунктуации и грамматики, но это не обязательно. Руководство по написанию текста Университета Далхаузи состоит лишь из краткого перечня принципов и рекомендаций для авторов.
# Программный код
Для работы в команде важно писать чистый, масштабируемый, поддерживаемый код. Но без способа обеспечения согласованности кода разработчики окажутся брошенными на произвол судьбы, и все затрещит по швам.
Руководства по написанию кода содержат принципы, паттерны, примеры и подходы к созданию кода. Эти рекомендации и ограничения задают правила игры, чтобы команды сосредоточились на эффективной совместной работе, а не занимались рефакторингом неряшливого и непоследовательного кода.
Над переводом работают Ольга Кокоулина и Ринат Шайхутдинов.
Если вам понравился перевод, дайте нам знать — нажмите кнопку Recommend.
Видеокурсы и практика по дизайну интерактивных систем: ux/ui, веб-дизайн и бренд-дизайн
Вас ждет плотная проектная практика по анимации интерфейсов, дизайну сайтов, а также мобильных и веб-приложений. Под руководством наставников в стиле «смотри и повторяй»!
Breezzly — это среда для тренировки digital-навыков. Здесь вы встретите комплекты видеокурсов в актуальных инструментах интерактивного дизайна, среди них Figma, Principle и Invision Studio. А каждый проект — это живой кейс с историей, собранной по горячим следам!
