К основному содержанию
скилл Claude Code CX Codex Cursor GitHub Copilot

presentation — скилл для Claude Code: веб-дек из спецификации

Превращает каталог технической спецификации в интерактивную веб-презентацию. Нужен, когда спецификацию хотят показать как связный публичный дек.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add iii-hq/iii --skill presentation -a claude-code
Открыть на GitHub

Что делает presentation

Скилл берёт каталог tech-specs/<slug>/ с Markdown-документами и создаёт для него контентный слой веб-дека в базе roadmap. Результат публикуется как статическая страница по пути /roadmap/<slug>/.

Перед работой он читает спецификацию целиком, каталог компонентов и набор правил по дизайну, повествованию, хостингу и проверке качества. Сначала агент должен предложить план слайдов и получить одобрение, затем создаёт структуру деки, интерактивные схемы и страницы с деталями.

Для входа нужен каталог спецификации с README.md и Markdown-документами. Это повод заранее привести материалы в эту структуру: скилл не предназначен для написания самой спецификации, экспорта в PDF или общей работы над интерфейсом.

Какие задачи решает

  • превратить техническую спецификацию в веб-дек
  • показать архитектуру через навигационную схему
  • добавить переключатели и пошаговые диаграммы
  • зарегистрировать спецификацию для страницы roadmap
  • переиспользовать компоненты из реестра проекта

Примеры запросов агенту

  • Собери интерактивную веб-презентацию из `tech-specs/<slug>/`.
  • Обнови существующий дек для спецификации в `tech-specs/<slug>/`.
  • Сначала предложи план слайдов для каталога `tech-specs/<slug>/`.

Как установить presentation

1Через Skills CLI (Vercel)

npx skills add iii-hq/iii --skill presentation -a claude-code

2Вручную: положить файлы

~/.claude/skills/presentation/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/presentation/

Из того же набора5

Весь набор →
iii-engine-config iii-hq Помогает настроить движок iii через worker-compose.yaml или config.yaml. Задаёт порты, параметры RBAC через rbac-proxy, ограничения наблюдателей и хранилище конфигураций. Claude Code CX Codex Cursor +1 4 200установок iii-sdk-reference iii-hq Справка по API iii SDK для Node.js, Python, Rust, Go и браузера. Помогает быстро найти правильный синтаксис регистрации воркеров, функций, триггеров, наблюдателей и каналов на нужном языке. Claude Code CX Codex Cursor +1 4 000установок iii-core-primitives iii-hq Справочник по базовым примитивам движка iii: регистрации функций, привязке триггеров, созданию воркеров и режимам вызова задач. Claude Code CX Codex Cursor +1 4 000установок iii-error-handling iii-hq Скилл учит агента распознавать коды ошибок iii-движка и SDK, различать сетевые сбои от отказов в доступе, определять, когда повторять вызов безопасно. Нужен, если пишешь код на Node, Python, Rust или в браузере с вызовами удалённых функций. Claude Code CX Codex Cursor +1 4 000установок

Похожие

expo-brownfield expo Помогает внедрить React Native и Expo в существующие нативные приложения на iOS и Android. Пригодится для точечной встройки экранов в SwiftUI, UIKit или Kotlin. Claude Code CX Codex Cursor +1 27 700установок 3d-web-experience sickn33 Помогает создавать и отлаживать 3D-сцены, конфигураторы товаров и портфолио для веба. Разбирает выбор стека, загрузку моделей и производительность. Claude Code CX Codex Cursor +1 5 200установок argent-screenshot-diff software-mansion Сравнивает скриншоты до и после изменений в UI: ловит сдвиги в раскладке, отступах, цвете и рендере текста. Claude Code CX Codex Cursor +1 24 900установок popular-web-designs Hermes Agent + Teknium (design systems sourced from VoltAgent/awesome-design-md) 54 готовых дизайн-систем реальных сайтов (Stripe, Linear, Vercel, Claude) с CSS-токенами, типографикой и компонентами для быстрой вёрстки в стиле известных брендов. Claude Code CX Codex Cursor +1 914установок shadcn-ui nexu-io Скилл помогает агенту собирать структурированные и доступные UI-компоненты с shadcn/ui. Пригодится на этапе планирования интерфейса. Claude Code CX Codex Cursor +1 2 900установок swiftui-design nexu-io Скилл помогает проектировать интерфейсы SwiftUI по чётким правилам, избегая типичных ошибок AI-кода. Направляет дизайн-решения, проверяет бренд-активы и оценивает макеты по пяти критериям. Claude Code CX Codex Cursor +1 2 900установок frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. Claude Code Claude.ai 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. Claude Code CX Codex Cursor +1 673 100установок

Вопросы о presentation

Как установить presentation в Claude Code?

Выполните npx skills add iii-hq/iii --skill presentation -a claude-code, затем повторите npx skills add iii-hq/iii --skill presentation -a claude-code. Файл скилла находится в ~/.claude/skills/presentation/SKILL.md.

Что делает presentation?

Скилл преобразует Markdown-спецификацию в интерактивный веб-дек для roadmap. Он строит план повествования, использует реестр компонентов проекта и создаёт контентный слой презентации.

Какие материалы нужны presentation для работы?

Нужен каталог tech-specs/<slug>/ с README.md и Markdown-документами по предметным областям. Имя каталога становится именем деки и сегментом её маршрута.

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой