slides · nextlevelbuilder — скилл для Claude Code: что делает и как установить
Создаёт адаптивные HTML-презентации с графиками Chart.js и дизайн-токенами. Помогает собирать питч-деки и маркетинговые слайды прямо из терминала.
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a claude-codeЧто делает slides
Скилл генерирует интерактивные презентации в формате HTML. Для визуализации данных используется библиотека Chart.js, а внешний вид настраивается через дизайн-токены и адаптивную верстку. Контент формируется с учетом готовых формул копирайтинга и шаблонов расположения элементов.
Внутри находится подкоманда create и база знаний в каталоге references/. Скрипты читают файлы проекта: руководство по стилю docs/brand-guidelines.md и параметры assets/design-tokens.json. Рабочая директория остается в корне репозитория.
Ставить этот скилл стоит тем, кто хочет верстать слайды кодом без PowerPoint. Если вам нужен обычный файл PPTX без интерактивных графиков, лучше собирать презентацию привычными офисными программами.
Какие задачи решает
- Сверстать интерактивный питч-дек в формате HTML
- Добавить графики Chart.js на слайды с данными
- Оформить маркетинговую презентацию по готовым формулам копирайтинга
- Применить токены из
assets/design-tokens.jsonк верстке слайдов
Примеры запросов агенту
- Сделай презентацию о новом продукте для питч-дека
- create pitch deck
- Собери маркетинговые слайды с графиками Chart.js
Как установить slides
1Через Skills CLI (Vercel)
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a claude-code2Вручную: положить файлы
~/.claude/skills/slides/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/slides/
1Через Skills CLI (Vercel)
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a codex2Вручную: положить файлы
.agents/skills/slides/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a cursor2Вручную: положить файлы
.cursor/skills/slides/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install nextlevelbuilder/ui-ux-pro-max-skill slides2Вручную: положить файлы
.github/skills/slides/SKILL.md1Через Skills CLI (Vercel)
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a gemini-cli2Командой платформы
gemini skills install https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --path cli/assets/skills/slidesВручную: положить файлы
.devin/skills/slides/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
Из того же набора7
Весь набор →Другие версии slides
Похожие
Вопросы о slides
Как установить slides в Claude Code?
Выполните команду npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -a claude-code в терминале.
Что делает скилл slides?
Он генерирует презентации в виде HTML-файлов. Слайды включают графики Chart.js, адаптивную верстку и стилизацию на основе дизайн-токенов.
Какие файлы проекта читает скилл slides?
Скрипты обращаются к руководству docs/brand-guidelines.md и токенам assets/design-tokens.json в корне вашего проекта.
Исходный текст
SKILL.md · MIT
---
name: slides
description: Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
argument-hint: "[topic] [slide-count]"
metadata:
author: claudekit
version: "1.0.0"
---
# Slides
Strategic HTML presentation design with data visualization.
## When to Use
- Marketing presentations and pitch decks
- Data-driven slides with Chart.js
- Strategic slide design with layout patterns
- Copywriting-optimized presentation content
## Subcommands
| Subcommand | Description | Reference |
|------------|-------------|-----------|
| `create` | Create strategic presentation slides | `references/create.md` |
## Script Paths
Script paths in this skill and its `references/` are relative to the directory that contains this SKILL.md, not to the project: `scripts/<file>` is this skill's own `scripts/` folder, and `../<skill>/scripts/<file>` is a sibling sub-skill installed alongside it. Build the full path from that directory (Claude Code reports it as the skill's base directory when the skill loads) and keep the working directory at the project root — the scripts read and write project files such as `docs/brand-guidelines.md`, `assets/design-tokens.json` or `src/` relative to it.
## References (Knowledge Base)
| Topic | File |
|-------|------|
| Layout Patterns | `references/layout-patterns.md` |
| HTML Template | `references/html-template.md` |
| Copywriting Formulas | `references/copywriting-formulas.md` |
| Slide Strategies | `references/slide-strategies.md` |
## Routing
1. Parse subcommand from `$ARGUMENTS` (first word)
2. Load corresponding `references/{subcommand}.md`
3. Execute with remaining arguments
© claudekit · MIT · nextlevelbuilder/ui-ux-pro-max-skill