Agent skill · design visual · dpearson2699

swiftui-animation

Implement, diagnose, or review SwiftUI motion using explicit and scoped implicit animations, springs, transitions, PhaseAnimator, KeyframeAnimator, matched geometry or navigation zoom, SF Symbol effects, and custom Animation types. Use when views should animate on state changes, insertion, removal, navigation, or multi-step choreography, or when motion must respect Reduce Motion and Swift concurrency.

Why this skill is useful

Provides detailed guidance on modern SwiftUI animation techniques and APIs that the AI may not reliably generate on its own.

What it needs

About 6k tokens when loaded. Last updated 2026-07-31. 973 stars on the source repository.

What this skill does

SwiftUI Animation (iOS 26+) Review, write, and fix SwiftUI animations. Apply modern animation APIs with correct timing, transitions, and accessibility handling using Swift 6.3 patterns. Contents Triage Workflow withAnimation (Explicit Animation) Implicit Animation Spring Type (iOS 17+) PhaseAnimator (iOS 17+) KeyframeAnimator (iOS 17+) @Animatable Macro matchedGeometryEffect (iOS 14+) Navigation Zoom Transition (iOS 18+) Transitions (iOS 17+) ContentTransition (iOS 16+) Symbol Effects (iOS 17+) Symbol Rendering Modes Common Mistakes Review Checklist References Triage Workflow Step 1: Identify the animation category Category API When to use --- --- --- State-driven withAnimation, .animation(:body:), .animation(:value:) Explicit state changes, selective modifier animation, or simple value-bound changes Multi-phase PhaseAnimator Sequenced multi-step animations Keyframe KeyframeAnimator Complex multi-property choreography Shared element matchedGeometryEffect Layout-driven hero transitions Navigation matchedTransitionSource + .navigationTransition(.zoom) NavigationStack push/pop zoom View lifecycle .transition() Insertion and removal Text content .contentTransition() In-place text/number changes Symbol .symbolEffect() SF Symbol animations Custom CustomAnimation protocol Novel timing curves Core Animation bridge CALayer, CAAnimation, CADisplayLink Read references/core-animation-bridge.md before advising Step 2: Choose the animation curve Use the advanced catalog when presets do not express the intended motion. Step 3: Apply and verify Confirm animation triggers on the correct state change. Test with Accessibility > Reduce Motion enabled. Verify no expensive work runs inside animation content closures. For CA bridges, use Coordinators for delegates, invalidate display links, treat frame-rate ranges as hints, and adapt work to the actual refresh rate. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills dpearson2699/swiftui-animation

View the source on GitHub

Browse the @skills marketplace