AIKraft/Skills/overdrive

overdrive

Создаёт впечатляющие интерфейсы с продвинутыми анимациями, шейдерами и 60fps-эффектами. Используйте, когда нужно «wow-эффект» или экстремальная реализация. Требует предварительного контекста через frontend-design.

pbakaus official Разработка ★ 76.2k

Что делает навык

Наделяет интерфейс «wow-эффектом» за счёт использования полного потенциала браузера: продвинутых анимаций, шейдеров, 60fps-эффектов и кинематографичных переходов. Решает задачу создания экстремально впечатляющих и технологичных пользовательских интерфейсов.

Когда применять

  • Создание кинематографичных переходов между страницами (View Transitions API, spring physics).
  • Реализация таблиц, способных обрабатывать миллионы строк без потери производительности.
  • Разработка диалоговых окон, морфирующих из элемента-триггера.
  • Формы с мгновенной оптимистичной валидацией и потоковой обратной связью в реальном времени.
  • Использование GPU-рендеринга (WebGL, WebGPU, Canvas) для сложных визуальных эффектов.

Как работает

  1. Вызвать /impeccable для получения принципов дизайна, антипаттернов и протокола сбора контекста (Context Gathering Protocol); если контекста нет, сначала выполнить /impeccable teach.
  2. Проанализировать контекст проекта (персональность и цели), чтобы определить, что именно будет «extraordinary» в данном случае, избегая неуместных эффектов.
  3. Предложить 2–3 направления реализации с анализом компромиссов, не переходя сразу к написанию кода.
  4. Обеспечить прогрессивное улучшение (progressive enhancement), соблюдение prefers-reduced-motion и целевую производительность 60fps.
  5. Провести итеративную визуальную проверку через браузерное автоматизированное тестирование для полировки и уточнения деталей.

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

Сделай страницу настроек с мгновенной оптимистичной валидацией и анимированными переходами состояний.
Реализуй кинематографичный переход между страницами с использованием View Transitions API и spring physics.
Создай таблицу, которая плавно обрабатывает миллион строк, используя GPU-рендеринг.

Что понадобится

  • frontend-design (для предварительного сбора контекста)
  • /impeccable (принципы дизайна и протокол сбора контекста)
  • Браузерное автоматизированное тестирование (для визуальной проверки)

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «overdrive» из репозитория: # https://github.com/pbakaus/impeccable
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r overdrive/ ~/.claude/skills/overdrive/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.