Was ist page-transitions?
Verwenden Sie diese Option, wenn Sie Routenänderungen, Ansichtsübergänge, modales Öffnen/Schließen oder Navigationsanimationen in Web- und Mobilanwendungen implementieren. Quelle: dylantarre/animation-principles.
·page-transitions
*
page-transitions
✓dylantarre/animation-principlesGitHub: dylantarre/animation-principlesQuelle: dylantarre/animation-principles
Verwenden Sie diese Option, wenn Sie Routenänderungen, Ansichtsübergänge, modales Öffnen/Schließen oder Navigationsanimationen in Web- und Mobilanwendungen implementieren.
Installation
So installieren Sie page-transitions
Installieren Sie den KI-Skill page-transitions schnell in Ihrer Entwicklungsumgebung über die Kommandozeile
- Terminal öffnen: Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.)
- Installationsbefehl ausführen: Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/dylantarre/animation-principles --skill page-transitions
- Installation überprüfen: Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code, Cursor oder OpenClaw
Quelle: dylantarre/animation-principles.
SKILL.md
Original anzeigenApply Disney's 12 animation principles to route changes, view transitions, and navigation patterns.
| Squash & Stretch | Entering page elastic effect | | Anticipation | Exit animation before enter | | Staging | Hero elements bridge views | | Straight Ahead / Pose to Pose | Shared element vs crossfade | | Follow Through / Overlapping | Content settles after nav | | Slow In / Slow Out | Asymmetric enter/exit easing | | Arc | Slide transitions with curve |
| Secondary Action | Background, nav state changes | | Timing | 200-500ms total transition | | Exaggeration | Reserved for emphasis moments | | Solid Drawing | Consistent spatial model | | Appeal | Smooth, oriented navigation |
Fakten (zitierbereit)
Stabile Felder und Befehle für KI/Such-Zitate.
- Installationsbefehl
npx skills add https://github.com/dylantarre/animation-principles --skill page-transitions- Kategorie
- *Kreativität
- Verifiziert
- ✓
- Erstes Auftreten
- 2026-03-03
- Aktualisiert
- 2026-03-10
Schnelle Antworten
Wie installiere ich page-transitions?
Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/dylantarre/animation-principles --skill page-transitions Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code, Cursor oder OpenClaw
Wo ist das Quell-Repository?
https://github.com/dylantarre/animation-principles
Details
- Kategorie
- *Kreativität
- Quelle
- skills.sh
- Erstes Auftreten
- 2026-03-03