React Native Animated Splash Screen | Transform Your App's First Impression Tutorial 2023

Your splash screen is the first thing every user sees, and a static image wastes it. With a free Lottie animation and a fade transition you can make those first two seconds feel premium, on both iOS and Android. I build the full setup in the video, including the iOS build fixes that usually trip people up.

What's inside

• Finding free JSON animations on LottieFiles
• Installing lottie-react-native and react-native-reanimated
• The Babel plugin config Reanimated needs to work
• Wiring LottieView with autoPlay, loop, and resizeMode
• Fading into your app when onAnimationFinish fires
• Fixing the CocoaPods errors that break iOS builds

Resources

CourseReact Native course

Go deeper in Animations & Gestures: 62 minutes on Reanimated, gestures, and swipeable components.