«Каждый цвет, шрифт и форма — со своим смыслом. Из одного набора правил собираем любой экран продукта.»
Дизайн-
язык.
Пять глав. Палитра, шрифты, формы, движение, иконы — поданы как продолжение «Издания 01».
пролистай вниз— Глава первая
Темнота —
основа.
Чёрный — это бумага для цифр. Не серый, не дымчатый. Глубокий ночной #0A0E14 — даёт максимальный контраст для светлого текста и подчёркивает янтарь.
Ночь
#0A0E14
Витрина
#11161F
Полка
#1A2030
Янтарь
#F59E0B
Янтарь —
там, где действие.
Кнопка «Заказать». Главная цифра экономии за месяц. Срочное напоминание. Появляется один раз на экран — поэтому видна сразу.
Сэкономлено в мае
1 245 234 ₸
Сигналы —
только когда важно.
Срочно
Красный · #EF4444
«Уплотнитель кончится за 1 день»
Внимание
Жёлтый · #EAB308
«Поставщик доставляет дольше обычного»
Норма
Зелёный · #22C55E
«Все товары в наличии · бюджет в порядке»
— Глава вторая
Три голоса —
один характер.
Syne — заявление. DM Sans — объяснение. JetBrains Mono — цифры. Каждый шрифт делает то, что у него получается лучше всего.
Syne
заголовки
Контролируй закупки
откуда угодно.
Геометричный шрифт с характером. Используется только для заголовков и крупных акцентных фраз. Никогда — в параграфах текста.
DM Sans
текст и интерфейс
AI смотрит твой Excel и говорит:
вот эти 12 SKU кончатся за 4 дня —
закажи у этого поставщика прямо сейчас.
Чистый, читаемый шрифт без отвлекающих деталей. Для длинных описаний, лейблов в формах, текстов в интерфейсе.
JetBrains
Mono
цифры и метки
1 245 234 ₸
сэкономлено в мае · +47% против апреля
Моноширинные цифры — для KPI, таблиц, дат и любых данных где важна ровность колонок. Никогда не пляшут по ширине.
— Глава третья
Мягкие углы.
Свободные отступы.
6px
мелкое
поля ввода, маленькие плашки
16px
среднее
карточки, кнопки в формах
28px
крупное
hero-блоки, главные окна
Один масштаб от 6 до 28 пикселей. Острых углов нет — всё имеет лёгкое скругление, даже самые маленькие элементы. Это часть характера AUROI.AI.
— Глава четвёртая
Одно главное
действие на экран.
Главное действие — янтарь. Одна на экран. То, ради чего пользователь сюда пришёл.
Второстепенное — рамка без заливки. Альтернатива главному действию. Не отвлекает.
«Если на экране две янтарные кнопки — одна лишняя. Решение принять сложнее, когда варианты равноценные.»
— Глава пятая
Тонкий контур.
Без украшений.
Главная
дашборд после логина
Закупки
что заказать сегодня
Остатки
товары на складе
Поставщики
кто что и за сколько
Аналитика
ABC, тренды, сезонность
Поиск
товар или поставщик
Уведомления
срочные напоминания
Внимание
дефицит, ошибка, риск
Все иконки одного семейства — Lucide. Тонкие линии, никакой заливки, никакого цвета. Размер от 14 до 32 пикселей в зависимости от контекста.
— Финал
Эти правила —
характер AUROI.AI.
Каждый новый экран продукта собирается из этих элементов. Без импровизации, без «а давайте здесь сделаем по-другому». Один язык — на всём.