What is a splash screen?
A splash screen is a screen that appears when an app is loading. It typically displays your brand's logo and provides users with a visual cue that the app or website is loading.
What is the importance of designing your splash screen?
A splash screen can improve user experience by providing a visual indication that the app is loading, which can help reduce user frustration and improve perceived loading times.
Also, it improves branding by providing users with a consistent visual representation of your app.
How to design your splash screen?
You can choose a static logo or an animated logo as your splash screen based on your audience research.
| 
|
Example Static splash screen mobile | Example animated splash screen on mobile |
Pros of a static splash screen:
Simpler and easier to design.
Less likely to cause performance issues or slow down the app while loading.
Pros of an animated splash screen:
More visually engaging and memorable than a static splash screen by providing users with something interesting to look at.
Cons of an animated splash screen:
May cause performance issues or slow down the app loading time if not optimized properly.
Note: Apple restricts animated splash screens in order to prevent apps from causing performance issues or slowing down device performance. Android allows animated splash screens, but ensure that you have optimized the animated asset to avoid more loading time.
Guidelines for Splash Screen Assets
For a static splash screen, make sure you share your image in the below format
Asset | Width | Height | Format | Aspect Ratio |
Splash Screen Image(CTV) | 1920 | 1080 | png | 16:9 |
Splash Screen Image(Mobile) | 1080 | 1920 | png | 9:16 |
For an animated splash screen, make sure you share your image in the below format
Asset | Width | Height | Format | File size | Duration | Aspect Ratio |
Splash video (CTV) | 1920 | 1080 | mp4 | less than 10 MB | 6-15 seconds | 16:9 |
Splash video (Mobile) | 1080 | 1920 | mp4 | less than 10 MB | 6-15 seconds | 9:16 |