Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
← Back to list

SwiftUI Animation Match

Maps vague interaction wishes to proven SwiftUI animation patterns — or to a deliberate decision to use what the system already provides.

Dev & CodingIntermediate★ 130⑂ 19AI score 9/10Last updated: Jul 19, 2026

What it does

  • Translates fuzzy requests ("saving should feel more satisfying", "this list is boring while it loads") into a named interaction moment, then matches it to a proven SwiftUI animation pattern.
  • Enforces a system-first check: if .symbolEffect, springs, .contentTransition, zoom navigation transitions, .sensoryFeedback, or Liquid Glass chrome already cover the moment, it stops there.
  • Searches curated catalogs by interaction pattern — wait states, real percentage progress, tap/confirmation feedback, toggles, card decks and gesture browsing, hero text, input chrome, reveals, and Metal shader effects — with exact source paths and lift notes.
  • Guides modernizing borrowed code: timer state machines → .phaseAnimator / .keyframeAnimator / Task.sleep, UIKit haptics → .sensoryFeedback, hardcoded bounds → GeometryReader, demo assets → your design tokens.
  • Applies restraint rules: one signature motion per screen, frequency caps intensity, respect Reduce Motion, keep a single motion vocabulary per app.

Who it's for

  • SwiftUI developers building iOS/macOS apps who want interactions to feel alive
  • Indie devs and small teams with animation ideas but no clear way to pick a pattern
  • iOS engineers translating designer intent into concrete SwiftUI implementations
  • Teams standardizing spring feel and duration scale across an app

Examples

  1. "The checkout button should feel celebratory" → pull candidates from the action-feedback group, but first evaluate whether .symbolEffect plus .sensoryFeedback is enough.
  2. "Loading this list feels dull" → recommend an indeterminate wait-state loader, deliberately choosing a short, subtle variant because the screen appears often.
  3. "Make the onboarding headline land" → select a text/hero pattern, then swap demo colors, fonts, and assets for the app's design tokens using the lift checklist.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/RayFernando1337/rayfernando-skills/HEAD/plugins/swiftui-animation-match/skills/swiftui-animation-match/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the plugins/swiftui-animation-match/skills/swiftui-animation-match folder from the GitHub repo RayFernando1337/rayfernando-skills into my ~/.claude/skills/swiftui-animation-match/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/RayFernando1337/rayfernando-skills.git && mkdir -p ~/.claude/skills && cp -r rayfernando-skills/plugins/swiftui-animation-match/skills/swiftui-animation-match ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open Terminal on your Mac.
  2. Clone the repository: git clone https://github.com/RayFernando1337/rayfernando-skills.git
  3. Create your personal skills folder: mkdir -p ~/.claude/skills
  4. Copy the skill in: cp -r rayfernando-skills/plugins/swiftui-animation-match/skills/swiftui-animation-match ~/.claude/skills/
  5. Confirm the references/ folder came along (matching-playbook.md, catalog files, sources.md) — that content is the heart of the skill.
  6. Restart Claude Code, open an iOS/macOS project, and ask something like "Which SwiftUI animation fits this loading screen?" to trigger it.
  7. Keep Xcode handy: the skill insists you verify motion in Previews or the Simulator before shipping.
View source on GitHub ↗License: Apache-2.0