Learn SwiftUI Animations: Fundamentals & Advanced Techniques
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.
Hi, My name is Amos Gyamfi. I have been using SwiftUI to create animations and prototypes since its first release in 2019. I am so excited to teach you how to get started, and, build your next iOS, tvOS, iPadOS, and watchOS App animations using SwiftUI.
Welcome to SwiftUI Animation Foundations: Fundamentals. This course gives you the good foundations and the basic principles of animating anything you could imagine using SwiftUI. We will first go through how things change over time so that you know for example, how things move. We will then look at creating Basic Animation as well as Spring Animation. You will learn how to make your app animations look better, delightful, and valuable using nothing but SwiftUI. So, let’s get started with SwiftUI Animation Foundations: Fundamentals.
NOTE: As of 11/09/2022, I will keep on deleting the 2020 and 2021 animation videos from this course. The reason is that I am updating this weekly with new animations to replace the old content.
- Understanding animation and motion in SwiftUI
- Working with Anchor Points (Center of mass)
- Understanding Basic Animation
- Creating Spring Animations on iOS
- When and How to Use Easings
- How to make iOS App Animations look better
- The basics of Animation Timing
- Animating in 3D
- Building Clones of Dynamic Island Animations
- Accessible animations and Reduce Motion on iOS
Main Sections (updated weekly)
Creating Basic Animation
- Create your first SwiftUI animation
- How to create rotational animation: Yahoo Weather Sun and Wind
- How to animate scale transform (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 corner radius
- Animating Touch ID using mask offset
Animating Visual Effects
- How to animate color
- How to animate gradients
Mastering Animation Timing and Pacing
- What is animation timing?
- What is animation pacing?
- How to change an animation 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
Using Custom Timing Curves
- Special Effects
Learning Spring Animations
- Understanding Spring Animation Parameters
- What is stiffness?
- What is Damping and Damping Fraction?
- What is Mass?
- What is Response
- What is Initial Velocity?
Cloning Dynamic Island Animations with SwiftUI: First Class Citizen Apple Apps
- Call Coming In
- Message Coming In
- Approving FaceID
- Music: Now Playing
- FaceTime Bubbling
- Throw Timer into the Island
- Airpods Pro Charging
- Airpods Max Charging
- Battery Charging
- Apple Maps Directions
Cloning Dynamic Island Animations with SwiftUI: Third-party Apps
- Uber Arriving
- Lyft Arriving
- Flighty: Airplane Landing
- StepsApp: Steps Counting
Drawing and Animating Path in SwiftUI
- How to bring a compound path from Sketch
- How to make an animated matching ants
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 steps counting animation
- 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 voiceovers 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