Идентичность Region System.
Рабочая выдержка из брендбука: знак, его построение, цветовая система, типографическая шкала, принципы движения и правила, которые всё это удерживают.
Идея бренда
Датум
В геодезии датум — фиксированная точка отсчёта, от которой берутся все остальные измерения. Он никогда не является предметом чертежа, и без него в чертеже ничто не верно. Region System — датум национальной цифровой экономики: невидимый на картинке и причина, по которой картинка держится.
Знак
Четыре прямоугольных уголка, симметричных поворотом вокруг открытого центра. Внешний силуэт — устойчивый квадрат: постоянство. Плечи намеренно неравны: у сети есть направление. Центр пуст: узел определяется тем, что в нём сходится, а не тем, что его заполняет.
Построение
Построен на сетке в 48 единиц. Толщина штриха — 6 единиц, срез угла — 8, длины плеч — 16 и 10, отступ апертуры — 6 единиц от каждого края. Все размеры — целые числа модулей, поэтому знак остаётся чётким при любом растре и может быть воспроизведён любым, у кого есть линейка, — включая станок, режущий его по стали.
Охранное поле равно толщине штриха знака и отмеряется от внешнего силуэта со всех четырёх сторон. Минимальный размер воспроизведения — 16 пикселей на экране и 8 мм в печати. Меньше 24 пикселей знак используется без словесной части.
Охранное поле и минимальный размер
Охранное поле и минимальный размер
Компоновки
Три утверждённые компоновки: горизонтальная — для шапок и документов, вертикальная — для вывесок и транспорта, изолированный знак — для фавиконов, касок, барабанов с кабелем и шильдов оборудования.
Недопустимое использование
Так — никогда
Поворачивать, наклонять или зеркалить знак
Перекрашивать вне утверждённой палитры
Добавлять градиенты, тени, фаски или обводку
Перерисовывать плечи одинаковой длины
Заливать центральную апертуру
Ставить знак на насыщенную фотографию без плотной подложки
Цвет
Графитовая основа, нейтральная бетонная шкала и один акцент. Акцент — Signal, красный на 650 нанометрах: цвет визуального дефектоскопа, единственный свет в волоконной оптике, который человеческий глаз вообще должен видеть. Он обозначает состояние, направление и акцент — и никогда не служит украшением.
Graphite
Void
#08090B
--color-void
Graphite 900
#0C0E11
--color-graphite-900
Graphite 800
#111419
--color-graphite-800
Graphite 700
#171B22
--color-graphite-700
Graphite 600
#1F242D
--color-graphite-600
Concrete
Steel 500
#2C333E
--color-steel-500
Steel 400
#414957
--color-steel-400
Concrete 300
#6B7484
--color-concrete-300
Concrete 200
#98A1AF
--color-concrete-200
Concrete 100
#C3C9D3
--color-concrete-100
Chalk
Chalk 50
#E7EAEF
--color-chalk-50
Chalk 0
#F7F8FA
--color-chalk-0
Signal · 650 nm
Signal
#FF3D2E
--color-signal
Signal Strong
#D42B18
--color-signal-strong
Signal Soft
#FF8B7C
--color-signal-soft
Operational
Nominal
#3FCF8E
--color-nominal
Caution
#F5A524
--color-caution
Типографика
Одна гарнитура, применяемая с дисциплиной. Крупные кегли набираются плотно и оптически корректируются; основной текст — на комфортной строке; технические величины — моноширинным начертанием, чтобы бюджет потерь и длина трассы всегда выглядели как измерения.
Инфраструктура — это обещание с очень долгим сроком действия.
АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ · ӘҒҚҢӨҰҮҺІ · ABCDEFGHIJKLMNOPQRSTUVWXYZ · 0123456789 · ≤ ≥ ± × ÷ ° Ø λ Ω · dB nm km Tbps
Токены дизайна
Дизайн-система выражена пользовательскими CSS-свойствами и подключается к Tailwind через единый слой темы. В приложении нет ни одного жёстко заданного цвета.
:root {
--surface-base: var(--color-void);
--surface-raised: var(--color-graphite-800);
--text-primary: var(--color-chalk-0);
--text-secondary: var(--color-concrete-200);
--line-hairline: color-mix(in oklab,
var(--color-steel-400) 42%, transparent);
--accent: var(--color-signal);
--measure-max: 88rem;
--gutter: clamp(1.25rem, 4vw, 4.5rem);
--section-y: clamp(5.5rem, 11vw, 11rem);
}Сетка
Двенадцатиколоночная сетка с плавающим межколонником, фиксированной максимальной шириной строки и шагом отступов в 8 пикселей. Редакционные разделы ломают сетку намеренно и никогда — случайно.
Движение
Движение сообщает структуру: что появляется, что связано, что измеряется. Длительности короткие, замедление асимметрично, всё подчиняется prefers-reduced-motion. Анимация, которая ничего не объясняет, удаляется.
Out expo
--ease-out-expo
cubic-bezier(0.16, 1, 0.3, 1)
Arrivals. Fast departure, long settle.
In-out quint
--ease-in-out-quint
cubic-bezier(0.83, 0, 0.17, 1)
Overlays and wipes.
Signal
--ease-signal
cubic-bezier(0.2, 0.85, 0.15, 1)
Indicators and pulses.
Тон коммуникации
Утвердительно. Технически. Без спешки. Мы называем числа вместе с единицами, а допуски — вместе с условиями. Мы не пишем «решения», «синергия», «передовой» и «мирового уровня». Фраза, за которую было бы стыдно инженеру, не выходит в свет.
Так
Не так
Потери на сварке ≤ 0,05 дБ, измерено в обе стороны.
Качество сварки на уровне лидеров отрасли.
Два пути, не делящих ни траншею, ни мост, ни ввод питания.
Полностью резервированная отказоустойчивость.
Норматив восстановления — восемь часов на магистральных участках.
Гарантируем быстрое реагирование.
Носители
Идентичность рассчитана на столкновение с реальностью: трафарет на каске, гравировка на щеке кабельного барабана, печать на договоре А4, рельеф на фасаде, 16 пикселей во вкладке браузера.
Защитная каска
Щека кабельного барабана
Ливрея транспорта
Строительное ограждение
Визитная карточка
Иконка приложения
Полный брендбук поддерживается в репозитории, в каталоге docs/brand.
Расскажите, что вам нужно построить.
Трасса, ёмкость, срок, нормативное ограничение. Мы скажем, чего это стоит — сначала в инженерных терминах, потом в коммерческих.