## Цветовая палитра

Основные цвета

**Фон**

- Цвет: `#f2f2f0`

- Описание: Светлый нейтральный кремовый оттенок, чистый и минималистичный.

- Использование: Все фоновые изображения слайдов без исключения

**Основной текст и строки**

- Цвет: `#2B2B2B` или `#1A1A1A`

- Описание: Очень тёмно-серый, почти чёрный

- Применение: Весь текстовый контент, разделительные линии заголовков, геометрические контуры, контуры символов.

### Акцентные цвета

**Яркий синий**

- Цвет: `#5B7FFF` (альтернативный вариант: `#4D6FE8`)

- Описание: Средне-яркий синий цвет с оттенком энергии.

- Применение: Круговые узлы на геометрических фигурах, одежда/шарфы персонажей, заливка пуговиц, декоративные точки.

**Приглушенное золото**

- Цвет: `#C9B568` (альтернативный вариант: `#D4C17A`)

- Описание: Теплый горчично-золотистый оттенок

- Применение: Круглые узлы на геометрических фигурах (чередующиеся с синим цветом), декоративные акценты.

### Правила нанесения цвета

- Фон ВСЕГДА имеет вид `#E8E6E3`

- Текст ВСЕГДА имеет вид `#2B2B2B`

- Синий и золотой цвета используются ТОЛЬКО для круглых узлов и акцентов символов.

— Никогда не используйте синий или золотой цвет в качестве основных цветов блоков или текста.

- Поддерживайте высокий контраст между текстом и фоном.

## Система типографики

### Семейства шрифтов

**Основной шрифт для заголовков: Roca Two (или аналогичный шрифт с крупными засечками)**

- Характеристики: Смелый, дружелюбный шрифт с засечками и округлыми линиями.

- Вес: Жирный/Толстый

- Использование: Все заголовки слайдов, основные заголовки, заголовки разделов

- Сохраните тот же шрифт

**Дополнительный шрифт для основного текста: Poppins (или Inter)**

Характеристики: Чистый, современный шрифт без засечек с отличной читаемостью.

- Вес: Обычный (400) для тела, Средний (500) для акцента

- Использование: Весь основной текст, подзаголовки, подписи, номера страниц, текст логотипа.

- сохранить тот же шрифт

### Иерархия размеров шрифта

**Крупный шрифт** (титульные слайды, разделители основных разделов)

- Шрифт: **Roca Two**

- Размер: 72-96 пунктов

- Цвет: `#2B2B2B`

- Использование: "Главный заголовок", "Спасибо", "Повестка дня"

**Крупные заголовки** (Заголовки слайдов с содержанием)

- Шрифт: **Roca Two**

- Размер: 48-60 пунктов

- Цвет: `#2B2B2B`

- Использование: «Наше видение», «Позиционирование бренда», «О чем YouMind?»

**Основной текст** (абзацы, описания)

- Шрифт: Poppins Regular

- Размер: 18-24 пт

- Цвет: `#2B2B2B`

- Высота строки: 1,6-1,8

- Использование: Весь контент абзацев, описания

**Мелкий текст** (Номера страниц, нижний колонтитул, подписи)

- Шрифт: Poppins Regular

- Размер: 16-18 пунктов

- Цвет: `#2B2B2B`

- Использование: "Страница X", URL-адреса веб-сайтов, адреса электронной почты

**Текст кнопки/таблетки**

- Шрифт: Poppins Regular или Medium

- Размер: 20-24 пт

- Цвет: `#2B2B2B`

- Применение: Текст внутри закругленных кнопок-таблеток

### Правила типографики

— Никогда не смешивайте шрифты с засечками — используйте только **Roca Two** для отображения.

- Никогда не используйте засечки для основного текста - только шрифт Poppins.

- Для улучшения читаемости поддерживайте постоянную высоту строки (1,6-1,8).

- Весь текст должен быть в формате `#2B2B2B` - без исключений

- Щедрое расстояние между абзацами (24-32 пт)

## Система компоновки

### Глобальная структура заголовка

**Только титульный слайд (страница 1):**

**Элемент левого заголовка:**

- Логотип

- Размер: диаметр 32-40 пунктов

- Цвет: Черный контур `#2B2B2B`

- Положение: 60-80 пикселей от левого края, 60-80 пикселей от верхнего края

- Расстояние между логотипом и текстом: 12-16 пикселей.

**Правый элемент заголовка:**

- Шрифт: Poppins Regular, 16-18pt

- Цвет: `#2B2B2B`

- Положение: 60-80 пикселей от правого края, 60-80 пикселей от верхнего края

— Выравнивание: по правому краю

**Разделитель заголовка:**

- Тонкая горизонтальная линия

- Вес: 1-2 пинты

- Цвет: `#2B2B2B`

- Позиционирование: Под элементами заголовка, занимая всю ширину с полями.

— Отступы от краев: 60-80 пикселей слева и справа.

**Слайды с содержанием (страницы 2-4) и заключительный слайд (страница 5):**

- Логотип YouMind отсутствует

- Только текст "Страница X"

- Расположение: верхний правый угол, нижний центр или другое незаметное место.

- Отсутствует разделительная линия заголовка

— Больше вертикального пространства для размещения контента

### Система маржи

**Стандартные поля:**

- Верхняя граница: 60-80 пикселей (под разделителем заголовка добавьте еще 40-60 пикселей)

- Нижний край: 60-80 пикселей

- Левая сторона: 80-100 пикселей

- Справа: 80-100 пикселей

**Область контента:**

— С учетом заголовка и полей, область контента составляет приблизительно 1200-1280 пикселей в ширину × 600-680 пикселей в высоту (для соотношения сторон 16:9 при разрешении 1920×1080).

## Визуальные элементы

### Геометрические фигуры, нарисованные от руки

**Основной дизайн:**

- Стиль: Несовершенные, нарисованные от руки прямоугольники и квадраты.

- Толщина линии: 2-3 пункта

- Цвет: Черный `#2B2B2B`

- Качество: Органичные, слегка неровные линии (не идеально прямые)

- Соединение: Линии, соединяющие фигуры под разными углами.

**Круговые узлы:**

- Форма: Идеальные круги

- Размер: диаметр 24-40 пунктов

- Заливка: сплошной цвет - либо `#5B7FFF` (синий), либо `#C9B568` (золотой)

- Расположение: В точках соединения и углах геометрических фигур.

- Узор: чередование синего и золотого для разнообразия.

**Правила распределения:**

- Расположение в углах слайдов (верхний левый, верхний правый, нижний левый, нижний правый)

- Никогда не перекрывайте текстовое содержимое.

- Держитесь на расстоянии 40-60 пикселей от областей контента.

— Создайте визуальный баланс: если слева есть фигуры, то и справа они должны быть.

Типичная схема: 2-4 соединенных прямоугольника с 3-6 круглыми узлами.

### Закругленные пуговицы-таблетки

**Технические характеристики:**

- Форма: Закругленный прямоугольник (форма таблетки)

- Граница: 2pt сплошной черный `#2B2B2B`

- Заливка: прозрачная или `#E8E6E3` (аналогично фону)

- Радиус скругления углов: радиус по всей высоте (идеальная форма таблетки)

- Отступы: 16-24 пикселя по горизонтали, 12-16 пикселей по вертикали

- Текст: Poppins Regular, 20-24pt, `#2B2B2B`

**Применение:**

— Элементы навигации на слайдах повестки дня

- Кнопки призыва к действию

- Метки разделов

- Всегда контурный, никогда не закрашенный.

**Состояние при наведении курсора/активное состояние (при взаимодействии):**

- Заливка: `#5B7FFF` (синий)

- Текст: Белый `#FFFFFF`

- Граница: `#5B7FFF`

### Декоративные точечные сетки

**Технические характеристики:**

- Точки: маленькие круги, диаметром 3-4 точки.

- Цвет: `#2B2B2B`

- Шаблон: Обычная сетка, интервал 12-16 пикселей.

- Расположение: сетка 6×6 или 8×8

— Положение: верхний правый угол, на расстоянии 100-150 пикселей от краев.

- Применение: Дополнительный акцент, добавляет визуальный интерес, не перегружая пространство.

### Иконки (минимальное использование)

**Стиль:**

— Только контурный рисунок, без заливки.

- Вес: 2-3 пинты

- Цвет: `#2B2B2B`

- Размер: 48-64 пт

- Примеры: значок глаза (обзор), цель/прицел (миссия)

- Применение: Использовать экономно, только для закрепления конкретных понятий.

## Система иллюстраций персонажей

### Технические характеристики дизайна персонажей

**Базовая структура:**

— Минималистичная, нарисованная от руки иллюстрация простого белого человекоподобного персонажа. У персонажа округлая, вытянутая голова, два маленьких черных глаза и выступающий заостренный нос. У него нет четко выраженных пальцев на руках или ногах. На шее у него толстый, длинный, однотонный синий шарф [опционально: замените на «горчично-золотой шарф»], хвост которого свисает вниз. В стиле рисунка используются толстые, текстурированные контуры черным маркером и плоские цвета без затенения на простом, кремово-белом фоне. Персонаж [что соответствовало контексту]

**Синий акцент (КРИТИЧЕСКИ ВАЖНО):**

- Элемент: шарф, рубашка или предмет одежды

- Цвет: `#5B7FFF` (ярко-синий)

- Стиль: Нарисованные от руки, плавные органические формы.

- Заполнение: 15-25% символов

- Цель: Фирменный стиль, визуальный интерес, движение.

**Стильная согласованность:**

- Всегда качество ручной работы (органичные, несовершенные линии)

— Всегда добавляйте синий акцентный элемент.

- Сохраняйте одинаковую толщину линий для всех символов.

- Сохраняйте одинаковые пропорции во всех позах.

### Руководство по созданию минималистичных иллюстраций

**Простота прежде всего:**

- Все иллюстрации должны быть предельно простыми и минималистичными.

Высота символов НЕ должна превышать 120 пунктов (примерно 10-12% от высоты слайда).

— Геометрические элементы должны быть небольшими и располагаться только в углах.

- Общая площадь, занимаемая иллюстрацией, должна составлять менее 15% от площади слайда.

— Избегайте сложных или детализированных чертежей.

**Пространство и возможность дышать:**

— Сохраняйте достаточное количество свободного пространства на протяжении всего слайда.

- Текст должен занимать не более 50-55% площади контента (обычно слева).

Правая сторона должна оставаться преимущественно пустой для визуального комфорта.

- Большие поля со всех сторон: минимум 100 пикселей, предпочтительно 100-120 пикселей.

- Иллюстрации размещаются только в нижнем правом углу, на расстоянии не менее 100 пикселей от краев.

**Распределение запасов:**

Центральная часть горки должна быть чистой и пустой.

— Избегайте захламления или заполнения всего доступного пространства.

— Стратегически используйте пустое пространство для создания фокуса и ясности.

— Меньше значит больше: удалите ненужные визуальные элементы.

- Приоритет отдается читаемости и простору, а не декору.