swiftui-animation

Implement SwiftUI animations and transitions with correct API selection and Reduce Motion compliance.

Updated May 10, 2026
One-click install
npx skills add https://github.com/FelixRauch/medat-figuren --skill swiftui-animation-felixrauch
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: swiftui-animation
Source: https://github.com/FelixRauch/medat-figuren/tree/main/.agents/skills/swiftui-animation
Command: npx skills add https://github.com/FelixRauch/medat-figuren --skill swiftui-animation-felixrauch

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps you implement and debug SwiftUI animations and transitions so your UI motion feels intentional, performs well, and respects accessibility settings like Reduce Motion.

Core Features & Use Cases

  • Animation strategy by API choice: Pick the right tool for state-driven changes (withAnimation, implicit .animation), multi-phase motion (PhaseAnimator), keyframe choreography (KeyframeAnimator), shared-element transitions (matchedGeometryEffect / navigation zoom), and content transitions (.contentTransition).
  • Modern iOS animation patterns: Use spring presets, phase/keyframe timing, symbol effects, and transition composition to produce polished results.
  • Quality and safety guardrails: Avoid common mistakes like over-scoped implicit animations, expensive work inside animation closures, duplicated matched-geometry sources, and missing Reduce Motion handling.

Quick Start

Use the swiftui-animation skill to review your current animation and rewrite it with the most appropriate SwiftUI animation API while ensuring correct Reduce Motion behavior.

Frequently Asked Questions about swiftui-animation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What's the best way to choose a SwiftUI animation API for different state changes?

To choose a SwiftUI animation API, match the API to the motion type: use withAnimation for state-driven changes, PhaseAnimator for multi-phase motion, KeyframeAnimator for choreography, and matchedGeometryEffect for shared-element transitions.

How do I fix inconsistent SwiftUI animation behavior and poor performance?

Fix inconsistent SwiftUI animation behavior by avoiding over-scoped implicit animations and expensive work inside animation closures. Apply correct API selection alongside proper spring and curve configuration to ensure smooth, intentional motion.

How does matchedGeometryEffect work for shared-element hero transitions in SwiftUI?

matchedGeometryEffect works for shared-element hero transitions by linking two views with the same matched geometry namespace, allowing SwiftUI to animate the position and size changes smoothly during navigation or state updates.

How do I make SwiftUI animations respect Reduce Motion accessibility settings?

Make SwiftUI animations respect Reduce Motion by checking the accessibilityReduceMotion environment value and replacing or disabling spring and keyframe animations with instant transitions or static state changes when the setting is active.

Can I use KeyframeAnimator and PhaseAnimator for multi-phase SwiftUI animations?

You can use PhaseAnimator for multi-phase SwiftUI animations that cycle through states automatically, and KeyframeAnimator for fine-grained, timeline-based keyframe choreography to produce polished, complex motion sequences.

Why do my SwiftUI view insertion and removal transitions look broken?

SwiftUI view insertion and removal transitions look broken when using incorrect transition composition or duplicated matched-geometry sources. Apply withAnimation correctly to state changes and ensure transition modifiers are properly scoped.