Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Animate With SwiftUI: iOS, watchOS and visionOS

Name: Animate With SwiftUI: iOS, watchOS and visionOS
Rating: 4.4 (82 reviews)

Humanity's First School of SwiftUI Animations

Created byAmos Gyamfi

Last updated 8/2026

English

English [Auto],

What you'll learn

The Basics of Animation Timing in SwiftUI
How to Make iOS App Animations Look Better
Understanding Basic Animation
Designing Spring Animations
How Anchor Points Affect Animation
Understanding Animation and Motion in SwiftUI
How to Create Meditation and Relaxation Animations
SwiftUI Animation Techniques
How to Build Animations for iOS Applications
Animating in 3D
Motion on a Circular Path
How to Build Animations in SwiftUI to Tell Stories
Principles of animation in iOS
How to create ovet and subtle iOS animations
How to make iOS animations feel analog, familiar and more comprehensive

Course content

39 sections • 235 lectures • 18h 48m total length

Getting default animation instance using withAnimation3:22
Use withAnimation to get a default animation instance in SwiftUI. Get the source code ?‍? https://gist.github.com/amosgyamfi/e48227688a0d46dc7bbd3d780fe62e18#file-defaultanimationwithanimation-swift
Getting default animation instance with .animation3:58
This video shows you how to get a default animation instance when using the animation modifier in SwiftUI.

Get the source code ?: https://gist.github.com/amosgyamfi/8828f99b3d2ad1fb854efb8e64840c55
Three ways to add SwiftUI animations6:25
Explore three fundamental ways to animate SwiftUI views: wrap state changes with withAnimation, apply the animation modifier, and bind values to create smooth transitions for elements like circles and sliders.
How to preview animations with the SF Symbols app8:11
Preview and copy animation configurations in the SF Symbols app, using presets like scale and variable color to drive SwiftUI symbol animations.
Get started with Phase Animator in iOS 176:24
Using the new Phase Animator in SwiftUI, you can build complex and multi-step animations. Rather than animating between 2 states, you can define multiple steps that happen in sequence. In this video, you will learn the basics of how it works.
Create a handwritten SwiftUI animation7:03
Create a pulsating animation using Phase Animator and Symbol Effect7:11
Animate three pulsing circles with face animator and symbol effect in SwiftUI, using ellipses with SF Symbols, delays, and custom easing to create a looping, layered animation.
How to animate hue rotation3:39
learn to apply the hue rotation modifier to SwiftUI views, animate color shifts with a timer and random angles, and create per-rectangle gradient animations using face animator.
Create a 3D rotation animation in visionOS7:35
How to customize a spring animation with duration and extra bounce2:56
Learn to tailor SwiftUI spring animations by adjusting duration and extra bounce, using with animation to create snappy or bouncy effects.
Create the Mickey Mouse-style animation using Phase Animator6:07
Create a Mickey Mouse–style animation in SwiftUI using the Phase Animator and Face Animator modifiers, animating the upper body, skirt, shoes, eyes, and tongue with offsets, rotations, and timing curves.
Using Phase Animator, Dispatch Queue, Old and New Springs10:50
Explore two SwiftUI animation approaches for a thumbs-up button: dispatch queue-based spring on older iOS versions and the face animator on iOS 17, with customizable scale, rotation, and anchor.
What is an animation completion criteria?2:16
Learn how to use animation completion criteria in SwiftUI to return an icon to its state, with animation, completion closure, and a bouncy spring (extra bounce 0.4) in iOS 17.
How to prevent accidental animation in SwiftUI1:40
Prevent unintended animations in SwiftUI by avoiding the animation modifier on a group and instead applying animation to views, or wrapping state changes with withAnimation to control the animation.
Using hue rotation and variable color: Create a seamless highlighting effect5:19
Create beautiful color effects with Hue Rotation and Phase Animator3:31
Create a color rotation effect in SwiftUI by applying the face animator modifier with hue rotation and a two-step trailing-closure animation.
Animate dashes to move along/around a shape8:37
Linear and eased animations5:02
Discover the various standard easing types in SwiftUI and how to use the correctly.
Xcode Playground for iPad: Create a two-step animation4:03
Create a two-step animation in SwiftUI on Xcode Playground for iPad, using a button to move up with a bouncy spring and return to zero via animation completion criteria.
How to Animate the Start and End Points of a Stroked Path5:50
Using Scale and opacity: Create pulsating hearts effect5:47
SwiftUI Christmas Tree Animation6:42
Discover a seamless SwiftUI Christmas tree animation using concentric circles with emojis, offset above rotation, and 3D rotation. Control timing with linear easing and delays for a looping effect.
SwiftUI New Year's Eve Animation2:03
Turn the Christmas tree SwiftUI animation into a New Year's Eve version by rotating a behind-the-tree image and animating hue rotation with linear or other easing in the Xcode project.
Create a circular movement/animation in SwiftUI3:05
Create a circular motion in SwiftUI by combining rotation effect and offset to move the safari symbol along a circle, using a ZStack and a 200px circle.
How to use cubic-bezier curves for SwiftUI animations2:17
Learn to apply cubic Bezier curves to SwiftUI animations by replacing linear easing with a timing function from easings.net. Copy the values, paste, and set a duration.

Create typewriting, erasing & cursor-blinking-style SwiftUI animation in Codex5:06
Create a typewriting, erasing, and cursor-blinking SwiftUI animation in Codex for a text view. Start from Xcode project and use prompts to customize with a face animator and keyframe animator.
Fluid morphing animation with Liquid Glass and PhaseAnimator4:32
Understanding SwiftUI animation movement types9:40
Explore SwiftUI animation movement types, including linear, ease in, ease out, default, spring, and custom cubic bezier timing curves for animating shapes and paths.

Build a shimmer animation playground in SwiftUI5:44
Source code: https://github.com/amosgyamfi/open-swiftui-apps
Animate with GPT-5 and Claude Sonnet 4 models in Xcode4:06
Build a SwiftUI animation with 6 SOTA LLMs12:39
Explore building a SwiftUI animation with six state-of-the-art models, using a common prompt to recreate a spinning sparkle, rotating circle stroke, and music icon motion in Xcode.
A simple loading animation with the OpenAI o3 model3:44
Learn to build a simple loading animation in SwiftUI with a sparkle, a stroked circle (animated stroke start and end), and a music symbol in ZStack using ease in out.
Building SwiftUI animations with the Claude 3.5 Sonnet AI model12:16
Learn to build SwiftUI animations with the Alex tool and cloud 3.5 sonnet, generating spring animations with face animator from a to b drag gesture, and integrating code into Xcode.
Prepare your views for a better AI-assisted animation5:24
Prepare your SwiftUI views, check mark and two circles in a zstack, to guide AI-generated animations, then prompt the model to animate with the trim modifier and spring effects.
Heart animation with Grok 3 and Claude 3.5 Sonnet3:34
Demonstrate creating a heart animation in SwiftUI using Grok 3 and Claude 3.5 Sonnet, leveraging deep search to assemble, debug, and finalize the code.
Create a hue rotation animation with Grok 33:56

Display and animate 3D models from a remote URL5:55
Source code: https://gist.github.com/amosgyamfi#:~:text=amosgyamfi%20/-,LoadFromRemoteURL.swift,-Last%20active%2017
visionOS: Create the AirPodsMax 3D rotation animation8:32
In this tutorial, we will use the Model3D view in SwiftUI to load 3D content and animate its rotation for visionOS.

NOTE: In the introduction, I mistakenly mentioned iOS. That should be visionOS.
Add particle effects to visionOS projects with Reality Composer Pro6:51
Learn to add particle effects with Reality Composer Pro for vision OS and SwiftUI, including rain, confetti, fire, and fireworks, via usdz export or embedded in a vision OS project.
Create the Apple Hello Lettering animation7:20
Build the Apple hello lettering animation in SwiftUI by tracing letters in Figma, converting the SVG path to a SwiftUI path, then animating with trim and a face animator.
Create the Siri animation with SwiftUI4:53
Let's create the Siri animation in visionOS using SwiftUI's 2D, 3D, and hue rotation animations.

How to animate text characters to create a sliding effect10:29
Create a sliding text animation in SwiftUI by treating text as a character array, staggering letters with delays and applying offset, rotation, hue rotation, and 3D rotation for right-to-left slide.
Create text animation using Phase Animator in iOS 174:20
Create dynamic text animations in iOS 17 using the face animator to cycle through faces with phase values, applying opacity and scale effects, and customizing with animation closures.
How to animate a numeric text with crossfade and content transition2:03

Welcome1:15
Master SwiftUI animation fundamentals, starting with state-driven changes, then spring animations, and 3D rotation and transformation effects, with weekly project updates.
What is SwiftUI?9:39
Explore SwiftUI, Apple's framework for building interfaces, and learn to create a from-scratch iOS app with animations using a state variable, onAppear, opacity, and spring timing that repeats.
A tour of the SwiftUI animations4:14
Explore a tour of SwiftUI animations and see examples you will create in the SwiftUI animation foundations course, which will be updated to include more SwiftUI animations.
Create a blank SwiftUI project2:53
Launch Xcode and create a new SwiftUI app named blankSwiftUI, selecting the platform and language, then use the navigator, properties inspector, and preview for design and testing.
Understanding how to animate10:21
Discover how to animate SwiftUI views by creating a state variable, triggering with onAppear, and applying rotation, scale, or opacity using an animation modifier.
Animate scale, width, rotation and spacing6:41
In this video, you will learn how to transition a hamburger icon into a back icon by animating scale, rotation, spacing, width, and offset.
Animate opacity, scale and rotation3:18
Learn how to combine rotation, scale transform, and opacity to transition a hamburger icon into a close icon.
Create an audio visualization animation6:38
Create an audio visualization in SwiftUI by generating six rectangles with random heights, animating their height via a state-driven transition, and looping with on appear and repeat forever.
Create a countdown timer2:24
How to create a count up timer3:34
Build Twitter Like animation clone7:01
Discover how to build a clone of the Twitter Like animation with SwiftUI. Note: There is another section where you can find this animation. That explains animating specific properties.

How does the placement of the delay modifier affect animation?2:15
When animating in SwiftUI, you can put .delay() before or after (repeatCount or repeatForever). Each approach gives you different results. Let's look at that in this video.
Different ways you can delay an animation3:37
Using SwiftUI, you can delay animations using the dispatch queue, the delay modifier, or the standard easing equations. Learn how to do that in this video.
How to animate stacks alignment5:23
In SwiftUI, we can use the alignment parameter to arrange views to the right, left, top and bottom depending on the stack container. This alignment parameter is also animatable. In this video, we look at how to use alignment to create movement.
How to make a smooth dashed border rotation animation like 'marching ants'6:12
In this video, we will learn how to make a smooth dashed border rotation animation like 'marching ants' in SwiftUI. This will be done using the dash phase parameter of a shape view.
Creating sun and moon animation12:17
In this video, we will build the sun and moon animation. You will learn how to
move objects on a circular path
change anchor point position
animate scale parameters such as X and Y.
mask a view using clip shape

Requirements

Students need Xcode installed on their Mac computer
Students will also need to install MacOS Catalina or Mojave on their Mac computer
The assets for this course are designed in Sketch and most of the icons used in the projects are SF Symbol. Students can still learn the course without installing Sketch or the SF Symbols application.

Description

Hi, my name is Amos Gyamfi. I have been using SwiftUI to create animations since its first release in 2019. I am so excited to teach you how to get started and build your next iOS, iPadOS, macOS, visionOS, and watchOS app animations using SwiftUI.

Welcome to Animate With SwiftUI: iOS, macOS, watchOS, and visionOS. This course gives you a solid foundation and the basic principles for animating anything you can imagine with SwiftUI. We will first go through how things change over time, so that you know, for example, how objects move. We will then look at creating basic animation and Spring Animation, using Phase Animator, Keyframe Animator, and more. You will learn how to make your app animations look better, delightful, and valuable using nothing but SwiftUI. So, let’s get started with Animate With SwiftUI: iOS, macOS, watchOS, and visionOS.

Learning Objectives

Understanding animation and motion in SwiftUI
Working with anchor points (center of mass)
Understanding basic animation
Creating phase-based, keyframe, and spring animations in SwiftUI
When and how to use easings
How to make iOS app animations look better
The basics of animation timing
Animating in 3D
Accessible animations and Reduce Motion on iOS

Creating Basic Animation

Create your first SwiftUI animation
How to create rotational animation: Yahoo Weather, Sun, and Wind
How to animate scale transforms (x, y, and xy)
How to animate movement using offset (x and y)
How to animate movement using alignment
Create your first Apple Watch animation
How to animate Hue Rotation

Implicit and Explicit Animation

What is an implicit animation?
What is an explicit animation?

Understanding and Animating Masks

How to animate the corner radius of a view
Animating Touch ID using mask offset

Animating SF Symbols and Visual Effects

How to animate color
How to animate gradients
Using SF Symbol animation types
Understanding Variable Color animations

Mastering Animation Timing and Pacing

What is animation timing?
What is animation pacing?
How to change an animation's begin time using delay
What is a repeat count?
How to repeat an animation forever
How to adjust an animation speed

Easing: Understanding How Things Move

Default
Linear
EaseIn
EaseOut
EaseInOut
Animating with Match Geometry Effect

Using Custom Timing Curves

Sinusoidal
Circular
Exponential
Special Effects

Using Phase Animator

Create your first animation with Phase Animator
Customizing your phase animation
Create human-inited animations with Phase Animator

Learning Spring Animations

Understanding Spring Animation parameters
What is stiffness?
What is damping and damping fraction?
What is mass?
What is a spring response?
What is initial velocity?
Understanding duration and extra bounce
Modeling and using custom springs

Drawing and Animating Path in SwiftUI

How to bring a compound path from Sketch
How to make an animated matching ants
Using animation trimming to draw and erase paths
Understanding and animating with dash phase

How to Add Animations to Standard Controls

How to animate a toggle switch

Animating in 3D

How to replicate the FaceID confirmation animation
3D parallax animation on Apple TV

Building Clones of iOS App Animations

Measuring heart rate on Apple Watch
Breathe animation on Apple Watch
Tide app's breathe animation
StepApp's step-counting animation

Using Transitions

Creating page-to-page transitions
Creating view-to-view transitions

How to make SwiftUI Animations Accessible and Inclusive

How to combine animating children into one element
How to tell voice-overs that an animating element is a button
How to label animating elements

How to Implement Reduce Motion For SwiftUI Animation

How to disable animations when Reduce Motion is on
How to present subtle/less excessive animations when Reduce Motion is on

Who this course is for:

iOS developers who want to learn app animations using SwiftUI
App designers who want to learn how to animate with SwiftUI
Anyone who wants to learn SwiftUI animations
Designers, app developers, and app engineers who do not have time to create beautiful app animations
Anyone who wants to learn native iOS animations building
Anyone who want to design and prototype animations for iOS, macOS, tvOS and watchOS
iOS App designers and prototypers
Anyone who wants to learn SwiftUI animation best practices
Designers and developers who want to make iOS animations as part of their app building process
Designers and developers who want to learn the skills to animate the lifeless
Students who want to have mastery in SwiftUI animations

Animate With SwiftUI: iOS, watchOS and visionOS

What you'll learn

Explore related topics

Course content

SwiftUI Animation Concepts & Techniques25 lectures • 2hr 10min

iOS 27 Animations3 lectures • 19min

SwiftUI Spring Animation1 lecture • 4min

AI-Assisted SwiftUI Animations8 lectures • 51min

Symbol Animations1 lecture • 7min

visionOS Animations5 lectures • 34min

iOS/SwiftUI Animation With Cursor AI Code Editor1 lecture • 13min

Creating Text Animations3 lectures • 17min

iOS 16, Xcode 14 and below11 lectures • 58min

iOS 16, Xcode 14 and below5 lectures • 30min

Requirements

Description

Who this course is for: