SkillFoxx
Telegram

genjutsu — скилл

Скиллы креативного кода для Claude Code: движение, микровзаимодействия и визуальные системы для веба, Android и Apple

  • 785 ★ репозитория
  • Последний коммит
Скилл

Минимальный доступ

Почему такой уровень

  • Скилл состоит из справочников и паттернов, код проекта пишете и запускаете вы сами
Все причины и проверки

athevon/genjutsuАвтор:AThevon

Установка

В терминале, через SkillFoxx CLI

npx skillfoxx add skills/genjutsu

Определит агенты на машине, покажет уровень доступа и зафиксирует версию.

Другие способы установки

Доступ и проверки

Как мы проверяем

Минимальный доступИнструмент ничего не запускает и не ходит в сеть.

  • Скилл состоит из справочников и паттернов, код проекта пишете и запускаете вы сами

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

Скилл ставит в агента набор скиллов по анимации и дизайну интерфейсов и общий маршрутизатор. Перед тем как писать код, он предлагает тезис взаимодействия, который вы утверждаете. Дальше он применяет паттерны движения, микровзаимодействий и визуальных систем и умеет работать с несколькими платформами: веб на GSAP, Motion, Three.js и нативном CSS, Android на Jetpack Compose и Compose Multiplatform, Apple на SwiftUI. Базовые справочники вроде принципов движения и аудита дизайна подключаются к каждому вызову, а под конкретный стек добавляются нужные скиллы. Данные о версиях API вынесены отдельно и датированы, чтобы не опираться на устаревшие сведения.

Для кого. Для фронтенд, Android и Apple разработчиков, которым нужен вкус в движении и деталях интерфейса.

Подходит, если

  • Интерфейс работает, но кажется плоским и нужно осмысленное движение
  • Нужны микровзаимодействия и анимации под GSAP, Three.js, Compose или SwiftUI
  • Хочется сначала утвердить идею взаимодействия, а потом получить код

Не подходит, если

  • Нужна только логика или бэкенд без работы над анимацией и визуалом
  • Ваш стек не относится к вебу, Android или Apple, которые покрывает скилл

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

Сделай, чтобы карточки тарифов ощущались физично при наведении

Ограничения

Скилл дает знания и паттерны, но не заменяет сборку и тесты проекта. Часть скиллов зависит от версий SDK и браузеров, данные датированы и со временем требуют перепроверки. В Claude.ai для загрузки подскиллов нужен план с включенным выполнением кода. Ключей и платных внешних сервисов не требует.

Как отключить. Удалите плагин genjutsu через /plugin или, если ставили на claude.ai, отключите загруженный скилл.

Частые вопросы

Чем отличаются cast и paint?

Это две команды скилла: одна отвечает за движение и взаимодействия, другая за визуальную сторону. Обе идут через общий маршрутизатор и базовые справочники.

Как поставить на claude.ai?

Скачайте genjutsu.zip из последнего релиза и загрузите его в разделе Skills; для загрузки подскиллов нужен план с выполнением кода.

Чем genjutsu отличается от других скиллов по анимации интерфейсов?

Скилл ставит в агента набор скиллов по анимации и дизайну и общий маршрутизатор. Перед кодом он предлагает тезис взаимодействия, который вы утверждаете. Охват: веб, Android и Apple.

Как поставить genjutsu и работать с ним?

В Claude Code: /plugin marketplace add AThevon/genjutsu, затем /plugin install genjutsu. Работает также в Claude Desktop. Опишите нужный экран или переход, агент предложит тезис, после вашего подтверждения напишет код.

Обсуждение

Вопросов и отзывов пока нет.

Скиллы

Маркетплейс плагинов и скиллов Claude Code для 3D, анимации и современного веба: Three.js, GSAP, React Three Fiber, Babylon.js

ПлагинРасширенный доступ1,3 тыс.

Скилл Claude Code и других агентов для сборки сайтов, где режиссура задается до кода: арт-дирекшн, генерация ассетов локальными CLI и проверка анти-слоп линтеро

СкиллРасширенный доступ1 тыс.

Скилл для сборки премиальных скролл-сайтов с реальным дизайн-стандартом: типографика, ритм, глубина, движение и проверка в браузере

СкиллРасширенный доступ4,9 тыс.

Скилл собирает компоненты Framer на Three.js, WebGL и GSAP: 3D, шейдеры и анимация по прокрутке в одном TSX-файле.

СкиллМинимальный доступ65

Скилл для Claude Code и Codex: делает из AI-видео и кадров веб-анимацию, которая следует за прокруткой, курсором, касанием или наклоном устройства

СкиллШирокий доступ2,9 тыс.

Скилл дизайна интерфейсов, презентаций и графики для кодинг-агентов: черновики на холсте через CLI superdesign

СкиллРасширенный доступ982

Коротко о README

README описывает genjutsu как набор скиллов креативного кода для Claude Code, claude.ai и Cowork, который превращает функциональный интерфейс в выразительный через движение, паттерны взаимодействия и визуальные системы. Покрыты веб на React, Vue, Svelte, чистом CSS, Three.js и Canvas, Android на Jetpack Compose и Compose Multiplatform, Apple на SwiftUI. Перед написанием кода скилл предлагает тезис взаимодействия для утверждения. Раньше проект назывался creative-excellence, команды переименованы в cast и paint. Ставится как плагин Claude Code или загрузкой zip на claude.ai. Лицензия MIT.

Бейдж для README

Исходный SKILL.md

---
name: motion-principles
description: "Motion design foundation - timing, easing, enter/exit patterns, accessibility, performance."
---

# Motion Principles

> The foundation. Loaded by every creative skill invocation.
> Concise rules here. Deep-dive in `references/`.

## Timing Rules

| Context | Duration | Why |
|---|---|---|
| Micro-interaction (toggle, hover, focus) | 100-150ms | Instant feedback, no perceived delay |
| UI transition (modal, drawer, tab switch) | 200-300ms | Smooth but never sluggish |
| Page/route transition | 300-500ms | Establishes spatial narrative |
| Scroll-driven / 3D | Free (progress-based) | Tied to user input, no fixed duration |

**Frequency rule:** The more often an animation plays, the shorter and subtler it must be.

Сообщить о проблеме