--- name: carousel description: Создаёт карусель для Instagram (1080×1350, PNG) в фирменном стиле Олеси (тёплый бежевый фон, Libre Baskerville + Inter, коричневые акценты) — HTML-слайды + рендер через headless Chrome. Вызывай, когда Олеся просит карусель. --- # Скилл: Карусель Олеси (1080×1350) ## 0. Перед началом 1. Прочитай `~/.claude/brand/PROFILE.md` и `~/.claude/brand/TOV-SAMPLES.md` — голос, темы, границы. 2. Прочитай `~/.claude/brand/style-guide.md` — палитра и **реальный ник** (в навбаре и футере `@ник`). Пока ника там нет — пиши `olesya` / `@olesya`. 3. Если появился логотип `~/.claude/brand/logo-olesya.png` — скопируй в папку карусели как `logo.png` и используй вместо монограммы (высота 46px). 4. Границы абсолютны: дети, семья, личные детали близких — в карусели не появляются (ни в тексте, ни на фото). 5. Спроси Олесю одним вопросом, если чего-то нет: фото для обложки, скрины, кодовое слово для призыва. Когда Олеся просит сделать карусель — сгенерируй HTML-слайды 1080×1350 в ФИРМЕННОМ стиле (тот же, что гайды/лендинги/презентации) и отрендери в PNG через headless Chrome. Полный шаблон слайда — ниже. ## Дизайн — фирменный стиль, как в гайдах - Фон `#FAF7F3`, текст `#2A211C`, второстепенный `#5E534C`/`#7A6F67` - **Заголовки**: Libre Baskerville 700, 50–58px, курсивные акценты `` коричневым `#7B5A43` - **Текст**: Inter, 29px, line-height 1.72 - Серые блоки `#F1ECE6`, квадратные углы, БЕЗ border-radius - **Навбар на каждом слайде**: монограмма `O` слева (Libre Baskerville italic 34px, цвет акцента) + *ник* справа (DM Sans italic 25px `#9A908A`), линия снизу `#EFE9E2` - **Футер на каждом слайде**: линия сверху `#EFE9E2`, слева `@ник` (DM Sans italic `#9A908A`), справа *листай →* (Libre Baskerville italic, коричневый); на последнем слайде — *жду в комментариях →* - Бейдж на обложке: рамка 1px коричневая, капс, letter-spacing 4px («СПОСОБ», «ГАЙД», «РАЗРЕШЕНИЕ»…) - Декоративные цифры шагов: Libre Baskerville italic, ~230px, коричневый, opacity .15, абсолютно справа сверху - Лейблы («ШАГ 1», «ГЛАВНОЕ»): Inter 600, 19px, капс, letter-spacing 4px, `#9A908A` - Цитаты/промты: серый блок `#F1ECE6` + текст Libre Baskerville italic коричневым - Фото: «полароид» — рамка padding 16px, фон `#FFFDFB`, border `#E4DCD3`, тень, наклон -2°; стикеры PNG поверх с drop-shadow и поворотом - Скрины: карточка border `#E4DCD3` + padding 16px + лёгкая тень; высокий скрин — контейнер `flex:1 1 0; min-height:0; overflow:hidden` (обрезка снизу) - Схемки-вариации из скилла презентаций работают и тут: цитата-акцент (кавычка 150px opacity .3 + LB italic 46px), акцентная полоса слева 3px коричневая, команда в рамке коричневой (`/post` + курсор) - На тёмном фоне (если слайд тёмный `#2A211C`) акцент только `#D9BFA4` - Слова Claude и reels — всегда латиницей - Голос — по разделу 8 PROFILE.md: на «ты», женский род, короткие удары, одна мысль на слайд, финал — одна сильная строка ## Структура типовой карусели 1. Обложка: бейдж + h1 с коричневым `` + подзаголовок + полароид-фото со стикером (для faceless — вместо фото скрин или серый блок с цитатой) 2. Крючок/введение 3–5. Шаги: лейбл «ШАГ N» + гигантская цифра + заголовок + текст; скрины по смыслу 6. Перелом «главное»: акцентная полоса слева 7. Результат (команда/формула) 8. Вывод: схемка-цитата 9. Призыв: плашка с кодовым словом (рамка коричневая, letter-spacing 7px) + скрин ТГ-канала (обрезан снизу) Пример обложки в её теме: бейдж «РАЗРЕШЕНИЕ», h1 «Блог с нуля за 15 минут в день — *и без разрешения мужа, мамы и подруг*», подзаголовок «Система, а не подвиг. Повторишь сегодня вечером». Шаг 1: «Открываешь Claude и пишешь *одну фразу*» + серый блок «Помоги мне понять, о чём мой блог, в трёх предложениях. Я — …». Вывод-цитата: «Первый пост не обязан быть шедевром. *Он обязан существовать.*» ## Шаблон слайда (копировать целиком) ```html
Разрешение

Блог с нуля за 15 минут в день — и без чужого разрешения

Система, а не подвиг. Повторишь сегодня вечером

@olesyaлистай →
``` Варианты `.content` для других слайдов: - Шаг: `
1
Шаг 1

Открываешь Claude и пишешь одну фразу

«Помоги мне понять, о чём мой блог, в трёх предложениях»

Это база — дальше самое интересное

` - Главное: `
Главное

Разрешение — это не аффирмация. Это поведение

…

` - Вывод-цитата: `
“
Первый пост не обязан быть шедевром. Он обязан существовать.

…

` - Призыв: `

Хочешь пошаговую инструкцию со скринами?

Напиши в комментариях слово «БЛОГ» — скину в директ

«БЛОГ»
` + футер *жду в комментариях →* ## Рендер Папка: `~/Desktop/олеся/карусели/карусель-<тема>/`. Материалы (фото, скрины, стикеры, `logo.png`) скопировать в неё с ASCII-именами. ```bash for i in 1 2 3 ...; do "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --headless --disable-gpu \ --hide-scrollbars --force-device-scale-factor=1 --window-size=1080,1350 \ --virtual-time-budget=10000 --screenshot="слайд-$i.png" "file://$(pwd)/slide-$i.html" done ``` ОБЯЗАТЕЛЬНО посмотреть готовые PNG глазами: слайд может отрендериться пустым (перезапустить с sleep 1 между слайдами), футер не должен уезжать за край (`min-height:0` на flex-контейнерах), фон должен быть тёплым бежевым, а не белым (если белый — шрифты/CSS не подгрузились, перезапустить).