Excitement Energy
When you need buttons that pop, reveals that punch, or interactions that feel like they have actual momentum, this gives you the timing curves and animation patterns to pull it off. Built around Disney's principles adapted for high energy interfaces, with specific durations (100-300ms range), aggressive easing functions, and keyframe patterns for bursts, shakes, and pulses. The guidance on squash and stretch percentages (20-35%) and exaggeration levels (25-40%) is genuinely useful if you're tired of animations that feel wimpy. Best for apps where subdued would be wrong: fitness trackers, music players, gaming UIs, anything promoting events or sales. The timing table and pre-built CSS easings mean you can skip the guesswork phase.
- skills.sh installs
- 570
- GitHub stars
- 146
- last updated
- Aug 21, 2026
Install
$ npx -y skills add dylantarre/animation-principles --skill excitement-energy --agent claude-codeInstalls into .claude/skills of the current project.
Files
Excitement & Energy Animation
Create animations that energize, excite, and create dynamic, high-impact experiences.
Emotional Goal
Excitement builds through dynamic, escalating motion. Energy comes from fast, varied animations that create momentum and keep users engaged.
Disney Principles for Excitement
Squash & Stretch
Dynamic and impactful (20-35%). High-energy compression and extension. Objects feel springy and responsive.
Anticipation
Quick, building tension (100-150ms). Like a coiled spring. The anticipation itself creates excitement.
Staging
Dynamic compositions. Diagonal lines, asymmetric layouts. Nothing static—energy in every arrangement.
Straight Ahead Action
Embrace for particle effects, explosions, and dynamic backgrounds. Energetic spontaneity.
Follow Through & Overlapping Action
Bouncy, energetic overshoot. Elements don't just stop—they rebound with vitality.
Slow In & Slow Out
Aggressive acceleration curves. Fast starts, snappy stops. cubic-bezier(0.0, 0, 0.2, 1) for punch.
Arc
Dramatic, sweeping paths. High trajectories, dynamic curves. Motion that commands attention.
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/dylantarre/animation-principles
- Categories
- DevOps & CI/CD, Design & UI/UX
- First seen
- Jun 3, 2026
More from dylantarre/animation-principles
All 144- Anticipation Payoff568
- Calm Relaxation566
- Joy Delight566
- Attention Grabbers565
- Brand Consistency565
- Timing Principle Mastery565
- Micro 100 200ms564
- Exaggeration Mastery562
- Performance Optimization562
- React Spring562
- Enterprise B2b558
- Cards Containers557
- Orchestrated Sequences557
- Universal Emotion556
- Loaders Spinners554
- Forms Inputs553
- Secondary Action Mastery551
- Social Media551
- Attention Management550
- Brand Strategist548
- Exit Animations547
- Exaggerated Clarity546
- Accordions Dropdowns545
- Straight Ahead Pose Mastery543
Recommended
More DevOps & CI/CD
google-adsopenclaudia/openclaudia-skillsWrite Google Ads copy and build campaign structures. Use when the user asks to create Google Ads, write ad copy for search or display, set up PPC campaigns, opt570skills.sh installs
stardustadobe/skillsGuided multi-page redesign of an existing website through a four-phase pipeline — extract (crawl and capture the current site), direct (set a visual direction),569skills.sh installs
macro-liquiditystar23/day1global-skillsMacro liquidity monitoring and risk early-warning system. By tracking 4 core indicators (Fed Net Liquidity, SOFR Overnight Financing Rate, MOVE Treasury Volatil569skills.sh installs
rustc-basicsmohitmishra786/low-level-dev-skillsRust compiler skill for systems programming. Use when selecting RUSTFLAGS, configuring Cargo profiles, tuning release builds, reading assembly or MIR output, un567skills.sh installs
alphaear-signal-trackerrkiding/awesome-finance-skillsTrack finance investment signal evolution and update logic based on new finance market information. Use when monitoring finance signals and determining if they 563skills.sh installs
formula-derivationwanshuiyin/auto-claude-code-research-in-sleepStructures and derives research formulas when the user wants to 推导公式, build a theory line, organize assumptions, turn scattered equations into a coherent deriva563skills.sh installs