genjutsu skill
Creative coding skills for Claude Code: motion, micro-interactions and visual systems for web, Android and Apple
- 791 ★ on the repository
- Last commit
Minimal access
Why this level
- The skill is references and patterns; you write and run the project code yourself
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/genjutsuDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skill is references and patterns; you write and run the project code yourself
This is third-party code. Review the repository files before installing.
What it does
The skill installs a set of animation and UI design skills plus a shared router. Before writing code it proposes an interaction thesis for you to approve. Then it applies patterns for motion, micro-interactions and visual systems across several platforms: web with GSAP, Motion, Three.js and native CSS, Android with Jetpack Compose and Compose Multiplatform, Apple with SwiftUI. Baseline references like motion principles and a design audit load on every invocation, with stack-specific skills added on top. API version data is kept separate and dated so it does not rely on stale facts.
Who it is for. For frontend, Android and Apple developers who want taste in motion and interface detail.
Good fit when
- The interface works but feels flat and needs considered motion
- You need micro-interactions and animations for GSAP, Three.js, Compose or SwiftUI
- You want to approve the interaction idea before code is written
Not a fit when
- You need only logic or backend without motion and visual work
- Your stack is not web, Android or Apple, which the skill covers
Example request
Make the pricing cards feel physical on hoverLimitations
The skill provides knowledge and patterns but does not replace building and testing the project. Some skills depend on SDK and browser versions; the data is dated and needs rechecking over time. In claude.ai it needs a plan with code execution enabled to load sub-skills. It requires no keys or paid external services.
How to disable. Remove the genjutsu plugin via /plugin, or if you installed it on claude.ai, disable the uploaded skill.
FAQ
How do cast and paint differ?
They are the skill's two commands: one handles motion and interaction, the other the visual side. Both go through the shared router and baseline references.
How do I install on claude.ai?
Download genjutsu.zip from the latest release and upload it under Skills; loading sub-skills needs a plan with code execution.
How is genjutsu different from other interface animation skills?
The skill installs a set of animation and interface design skills and a shared router into the agent. Before code it proposes an interaction thesis for you to approve. Coverage is web, Android and Apple.
How do I install genjutsu and work with it?
In Claude Code: /plugin marketplace add AThevon/genjutsu, then /plugin install genjutsu. It also works in Claude Desktop. Describe the screen or transition, the agent proposes a thesis and writes code after you confirm.
Discussion
No questions or reviews yet.
Related
SkillsA Claude Code plugin and skill marketplace for 3D, animation and modern web: Three.js, GSAP, React Three Fiber, Babylon.js
A skill for Claude Code and other agents that builds websites directed like films: art direction before code, local CLI asset generation and an anti-slop linter
A skill for building premium scroll-driven websites on a real design standard: typography, rhythm, depth, motion and in-browser verification
A skill that builds Framer components with Three.js, WebGL and GSAP: 3D, shaders and scroll animation in a single TSX file.
A skill for Claude Code and Codex that turns AI video and frames into web animation driven by scroll, cursor, touch or device tilt
A UI, presentation and graphics design skill for coding agents: canvas drafts driven through the superdesign CLI
README in short
The README describes genjutsu as a creative coding skill set for Claude Code, claude.ai and Cowork that turns a functional interface into an expressive one through motion, interaction patterns and visual systems. It covers web with React, Vue, Svelte, plain CSS, Three.js and Canvas, Android with Jetpack Compose and Compose Multiplatform, Apple with SwiftUI. Before writing code the skill proposes an interaction thesis to approve. The project was formerly creative-excellence, with commands renamed to cast and paint. It installs as a Claude Code plugin or by uploading a zip on claude.ai. MIT licensed.
README badge
Original 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.