Almost every app developer wants to have an app that is well-branded and well-functioning. In the exciting process of finishing up the app that has been in the works for weeks, months, or even years, designing a splash screen may be one of the last things to take in to consideration. However, there are a few and simple things to consider when designing a splash screen.
By design, Apple includes the option to have a static splash screen during app launch as a way of making the launch experience feel quick. Instead of seeing a black empty screen during app launch, developers have the option to add an image that resembles the first screen of the app UI itself. That way users are supposed to get a quicker launch experience. Apple recommends in their Human Interface Guidelines that developers create splash screens this way.
Many times before however, developers have turned away from Apple’s guidelines to create experiences suited for their particular needs. The same is true for designing splash screens. Popular apps such as Twitter, YouTube and Gmail use the launch screen to promote their company branding. What should you do then?
There are some clear benefits to following Apple’s guidelines. It induces the feeling that your app is quick, lightweight and responsive. Therefore, many apps will benefit from using a static launch image that simply resembles a non-populated version of the first screen in your UI. For example, the native iOS Notes app does this.
Why do some apps have a branded splash screen then, if Apple suggests against it? As always, and depending on the situation at hand, there are some situations where creating a branded splash screen image is completely fine. Therefore, you need to consider what kind of app you are developing. Are you developing a productivity app for people that are in a hurry and maybe use the app in work-related situations? Then you will not always want to force your brand in on people’s busy mind, when all they actually want is to get going with what they need to accomplish with your app. It might create negative connotations with your app, because it can make the app feel heavy – even though an app with a branded splash screen is no slower than an app without a branded splash screen. It is all about the experience.
If your app is a game, social media platform or similar, people will be in a different mindset when using it. They have more time, and can more easily tolerate waiting for their experience to load. The splash screen provides an excellent space to create brand awareness right before a (hopefully) positive experience. At the same time it can help keep your logo from eating up screen real estate throughout the rest of the app or game.
In short, create a launch screen image that matches the type of app you are developing.
So, are there any best practices if I want to create a branded splash screen? Yes.
- Stay clear of text. Remember that splash screens are static images that cannot be localized. Therefore, it can be a good idea to stay away from any text, if your app is available worldwide.
- Keep it simple. Simply slapping a white logo on a background with your identity’s main color works fine. Alternatively use a colored version of your logo on a light background.
- Don’t reuse your app icon in the splash screen. If you need to display some kind of brand identity, use your logo without the squircle shape around it. For more info about what separates a logo from an icon, read my article on why Icons and Logos are Not the Same.
There are also a few best practices, if you want to create a non-branded that simply resembles a non-populated version of your apps main UI.
- Exclude any text from the splash screen. Navigation bar titles should be removed, as well as any other text. Remember, these splash screens are not localisable.
- Exclude buttons. Splash screens are static images, and the buttons won’t be tapable, which will annoy the users, if they try to interact with your app, before it has actually loaded.
- Make it look 100 % like the actual UI (but without buttons and text). If you don’t, there will be this annoying flicker, when the app switches from the splash screen to the actual UI. It will make the app feel less solid.
In the Splash Screen Template on Apply Pixels you can easily create and preview your splash screen on realistic device mock-ups. Photoshop export actions are attached for quickly exporting all required sizes. Download it here.
Have fun with these final touches to your app!
