Back to list
dylantarre

fitness-wellness

by dylantarre

Disney's 12 Animation Principles - Claude Code Skill Marketplace

1🍴 1📅 Jan 24, 2026

SKILL.md


name: fitness-wellness description: Use when designing animations for fitness apps, wellness platforms, workout trackers, or meditation experiences

Fitness & Wellness Animation Principles

Apply Disney's 12 principles to create motivating, energizing experiences that celebrate achievement and support healthy habits.

The 12 Principles Applied

1. Squash & Stretch

  • Workout Buttons: Energetic squash on tap
  • Progress Rings: Pulse with achievement
  • Activity Icons: Bounce with completion

2. Anticipation

  • Workout Start: Countdown builds energy
  • Timer Begin: Ready-set-go sequence
  • Goal Completion: Suspenseful approach

3. Staging

  • Current Exercise: Full focus on active movement
  • Stats Display: Supporting role during workout
  • Rest Periods: Recovery metrics highlighted

4. Straight Ahead & Pose to Pose

  • Live Workouts: Continuous timer flow (straight ahead)
  • Exercise Sequence: Move-by-move progression (pose to pose)
  • Meditation Guides: Defined breathing phases

5. Follow Through & Overlapping Action

  • Workout Complete: Badge lands, then stats appear
  • Calorie Counter: Numbers settle with follow-through
  • Activity Rings: Animate sequentially with overlap

6. Slow In & Slow Out

  • High Energy Moments: Quick, punchy timing
  • Recovery/Meditation: Slow, calming easing
  • Transitions: Match current activity intensity

7. Arc

  • Progress Circles: Smooth arc completion
  • Running Routes: Curved path visualization
  • Gesture Controls: Natural arced movements

8. Secondary Action

  • Goal Hit: Fireworks while achievement saves
  • Personal Record: Crown appears with celebration
  • Streak Maintained: Fire burns while counter updates

9. Timing

  • Intense Moments: Fast 100-150ms for energy
  • Mindfulness: Slow 500-700ms for calm
  • Standard UI: Moderate 200-300ms

10. Exaggeration

  • Celebrate Big: Fitness thrives on motivation
  • Personal Records: Dramatic achievement reveals
  • Streak Milestones: Memorable celebrations

11. Solid Drawing

  • Body Mechanics: Accurate movement demonstrations
  • Data Visualization: Clear, readable metrics
  • Exercise Illustrations: Proper form representation

12. Appeal

  • Motivational Energy: Uplifting, encouraging motion
  • Dual Modes: Intensity for workouts, calm for wellness
  • Achievement Focus: Every win feels significant

Industry Timing Standards

ActionDurationEasing
Button Press150msease-out
Ring Complete600msspring
Workout Transition250msease-in-out
Meditation Fade500msease-in-out
Achievement Pop800mscustom-bounce

Key Principle

Match animation energy to activity intensity. Workouts demand energetic, motivating motion while meditation requires calm, breathing-synced animations. Always celebrate progress.

Score

Total Score

60/100

Based on repository quality metrics

SKILL.md

SKILL.mdファイルが含まれている

+20
LICENSE

ライセンスが設定されている

+10
説明文

100文字以上の説明がある

0/10
人気

GitHub Stars 100以上

0/15
最近の活動

1ヶ月以内に更新

+10
フォーク

10回以上フォークされている

0/5
Issue管理

オープンIssueが50未満

+5
言語

プログラミング言語が設定されている

0/5
タグ

1つ以上のタグが設定されている

+5

Reviews

💬

Reviews coming soon