Брендбук: знак и правила применения

Знак

Знак «Виктон РТИ» — сечение уплотнения: зелёная манжета внутри стальной обоймы. Зелёное кольцо в нём читается как деталь изделия, а не как краска, — поэтому перекрашивать знак нельзя даже «в наши же цвета».

Скачать все файлы 17 файлов в архиве zip, вместе с памяткой по применению

Файлы: какой брать

У каждой версии своя работа. Если сомневаетесь — берите logotip-s-podpisyu.svg: он годится для бланка, коммерческого предложения и презентации. Для одноцветной печати, гравировки и штампа существует отдельный файл — уменьшать основной не нужно.

• 
  Знак без надписи Аватар, иконка, клеймо.

  znak.svg вектор, 22 КБ

• 
  Знак в один цвет Печатная ветка.

  znak-mono.svg вектор, 3 КБ

• 
  Знак на тёмном Выворотка.

  znak-invers.svg вектор, 17 КБ

• 
  Микроверсия Тиснение, гравировка, мелкий штамп: от 4.8 мм.

  znak-mikro.svg вектор, 3 КБ

• 
  Иконка вкладки Точная копия знака, та же геометрия сечения.

  favicon.svg вектор, 21 КБ

• 
  Горизонтальный логотип Редактируемый источник с живым текстом.

  logotip.svg вектор, 3 КБ

• 
  Плоский двухцветный Две краски, для мелких размеров и простой печати.

  logotip-kontury.svg вектор, 13 КБ

• 
  Только слово Шапка сайта ставит его рядом со знаком.

  logotip-imya.svg вектор, 13 КБ

• 
  Основной знак с подписью «завод уплотнений» Бланки, КП, презентации.

  logotip-s-podpisyu.svg вектор, 37 КБ

• 
  Логотип для тёмной подложки Выворотка названия.

  logotip-invers.svg вектор, 24 КБ

• 
  Логотип без градиентов Печать и документы.

  logotip-ploskiy.svg вектор, 9 КБ

• 
  Логотип в один цвет Гравировка, штамп, факс.

  logotip-mono.svg вектор, 9 КБ

• 
  Экранная версия с металлом и глянцем Шапка сайта и крупные показы.

  logotip-metall.svg вектор, 26 КБ

• 
  Превью ссылки для соцсетей 1200×630, растр.

  og-vikton.png растр, 68 КБ

• 
  Иконка для iOS Экран «Домой» на iPhone и iPad.

  favicon-180.png растр, 36 КБ

• 
  Иконка вкладки, растр Для браузеров без поддержки SVG.

  favicon-32.png растр, 3 КБ

• 
  Охранное поле Сколько воздуха вокруг знака.

  ohrannoe-pole.svg вектор, 3 КБ

Охранное поле

Вокруг знака остаётся пустое поле — 0,25 его высоты с каждой стороны. Внутрь не заходит ничего: ни текст, ни другие знаки, ни край листа, ни логотипы заказчиков.

Минимальный размер

Ниже этих значений внутренние детали знака заплывают. Числа выведены не на глаз: самый тонкий элемент знака — обводка вала — занимает 1,33 % его высоты, и размер посчитан так, чтобы этот элемент пережил способ печати. На экране знак ставится не мельче 16 px; мельче — берётся микроверсия, а не уменьшенный основной знак.

На каком фоне ставить

Фон годится, если контраст знака с ним не ниже 3:1. На тёмном ставится инверсная версия, на светлом — основная. У фотографии одного значения яркости нет, поэтому под знак кладётся плашка или равномерное затемнение — и считается уже она.

Цвета

Фирменный зелёный — цвет манжеты в знаке, а не декоративный акцент. Для мелкого текста у него есть отдельное, более тёмное значение: светлый зелёный на светлом фоне читается плохо, и это не вкус, а контраст.

• графитовый петроль #1A2930 основной тёмный цвет бренда: знак, логотип, заголовки, навигация и фирменные поверхности; не подменяет технический синий в чертежах и информационных ссылках
• технический синий #14304A чертежи, размеры, информационные ссылки и кольцо фокуса; отделён от основного тёмного цвета бренда
• фирменный зелёный, светлый из пары #34854A корпус знака, кнопки сайта, служебная полоса шапки; светлый из двух фирменных — им красится ДЕЙСТВИЕ; белый текст 4.57:1
• фирменный зелёный для текста #1F7A44 ссылки и подписи фирменным цветом; на фоне страницы 5.90:1
• технический голубой #4A98C5 вторичная графика схем: заливки и подложки, не тонкие линии
• основной текст #16191B длинный текст и таблицы
• приглушённый фирменный зелёный для мелкой графики #43774F стрелки-указатели в карточках секций подбора. ⚠ Значение снято замером с эталона владельца: штрих стрелки (67,119,79), надзаголовок (60…69, 109…118, 55…82). Наш основной текстовый зелёный #1F7A44 при тех же размерах читается «сочнее» — владелец 09.09: «цвет иконок стрелок не такой сочный зелёный». Действие (кнопки, ссылки) этим цветом НЕ красится: у стрелки в карточке роль указателя, а не призыва. Контраст на зеленоватой поверхности 4.8:1 — выше и графического порога 3:1, и текстового 4.5:1
• ссылка #14304A информационные ссылки в тексте и таблицах: технический синий, отделённый от графитового цвета бренда; в прозе — пунктирное подчёркивание, в таблицах — сплошное
• синий чертежа #1F4FB8 вход в изготовление по образцу (x-vikton.po-obrazcu): текст и значок кнопки на заливке этого же цвета 10 %; тот же синий, что у линий чертежа на снимках пути
• фирменный зелёный, тёмный из пары #1F5130 кант служебной полосы, наведение на кнопку, метка текущего пункта меню; тёмный из двух фирменных — им красится ОПОРА и состояние; белый текст 9.22:1
• фирменный зелёный, глубокий — темнее тёмного из пары #173B23 витрина каталога в мегаменю: панель занимает четверть ширины меню, и на такой площади #1F5130 читается не опорой, а большим зелёным пятном. Тон и насыщенность те же (140°, 45 %), светлота 22 → 16 %; белый текст 12.45:1 против 9.22
• акцент на тёмном полотне — число, иконки, ссылка-итог #4DCB70 витрина каталога в мегаменю и будущие тёмные полосы. ⚠ Фирменный #34854A на глубоком фоне #173B23 даёт контраст 2.73 и не читается вовсе — именно поэтому на тёмном нужен свой зелёный, а не тот же. Тон сохранён (136°), светлота 36 → 55 %, насыщенность поднята с 44 до 55 %: на тёмном цвет глохнет. Контраст на глубоком фоне 5.98. ⚠ Поле poverhnost ссылается на КЛЮЧ ФОНА (fon.vitrina_menyu), а не на имя контракта поверхности: витрина собирает пары из группы fon, и «temnaya» там не резолвится — контраст считался к светлому фону страницы. ⚠ Сам токен лежит в cvet, а НЕ в poverhnosti.temnaya: сборщик разрешает только cvet.* и fon.*, и вложенный путь он молча пропустил — в css уехал сам шаблон вместо значения
• изделие: самая тёмная зелёная масса #0F2E1C заливка резины на рендерах каталога; светлота 12 — вдвое темнее кнопки, глаз их не сравнивает
• изделие: тёмная зелёная масса #14361F заливка резины на рендерах каталога; светлота 15
• сочный зелёный — ТОЛЬКО линией, риской, кантом #25B164 опознавательная риска на изделии, кант; заливкой НЕЛЬЗЯ — светлота 42 при 36 у кнопки, тон 11° от неё: заливка отняла бы у кнопки её единственное отличие
• светлый сочный зелёный — ТОЛЬКО линией #5FBF7F тонкая риска на тёмном изделии, подсветка кромки; заливкой нельзя по той же причине
• оранжевый печати — второй фирменный цвет ЗАВОДА, не сайта #BC552F печатные материалы завода. ⚠ Как фирменный цвет САЙТА отменён 23.08 (Р-51 → Р-52), в вёрстке не применять. На изделиях каталога допустим как цвет материала: тон 16°, это 120° от кнопки — триада, кнопке не конкурент

Шрифт

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

'Golos Text', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif

Чего со знаком не делают

Первые четыре запрета следуют из чисел выше: нарушение видно замером, а не спором о вкусе. Остальные — из устройства самого знака.

1. 1. Непропорциональное масштабирование растяжение по одной оси меняет толщину зазора между ободом и кольцом, а из неё выведены все миллиметры минимального размера. Признак нарушения: ширина и высота знака в макете различаются.
2. 2. Размер ниже минимального для носителя внутренние детали заплывают; ниже порога ставится микроверсия, а не уменьшенный основной знак. Признак нарушения: знак меньше строки таблицы для своего способа печати.
3. 3. Фон вне таблицы допустимых в том числе мягкий синий блок и любая фотография без плашки: у снимка нет одного значения яркости, поэтому под знак кладётся плашка или равномерное затемнение — и считается уже она. Признак нарушения: контраст худшего цвета знака с фоном ниже порога — считается, а не оценивается на глаз.
4. 4. Нарушение охранного поля внутрь охранного поля не заходят ни текст, ни другие знаки, ни край носителя, ни логотипы заказчиков. Признак нарушения: что-либо чужое ближе к знаку, чем доля его высоты из правил.
5. 5. Замена цветов знак существует в трёх версиях — основной, инверсный, одноцветный. Нужен один цвет — берётся znak-mono.svg, а не основной знак, залитый чем попало.
6. 6. Поворот шестерня не вращается: наклон читается как ошибка вёрстки.
7. 7. Тень, обводка, объём, градиент, скос знак плоский по построению — иначе он перестаёт воспроизводиться в тиснении и резке.
8. 8. Пересборка локапа расстояние между знаком и строкой, кегль и межбуквенные отбивки заданы в файле логотипа; собирать своё сочетание «знак плюс название» нельзя — берётся готовый файл.
9. 9. Строка без знака как логотип название, набранное просто шрифтом, — это текст, а не логотип; для печати существует мастер в контурах.

Права и вопросы