The GoodBarber Blog
GoodBarber
blog-goodbarber

3 tips to create a great splash screen for your mobile app


Written by on Monday, November 25th 2013 15:00


3 tips to create a great splash screen for your mobile app
When you create your app for iPhone, Android, or any other platform, you must add a killer splash screen if you want to ensure a good launch experience for your users. After all, the splash screen is the first image that is seen when your app is opened. So, let's review some tips that will help make your app a success, shall we?

1 - Use the right size

From one smartphone to another, the screen resolution can vary a lot. Let's imagine you have crafted the perfect splash screen for the latest iPhone. But what about older versions of the device and their screens' resolutions? Given that your splash screen is the first image users will see, you definitely don't want it to look distorted.
 
How to make the right first impression? You should create as many splash screens as there are screen resolutions. If you are creating an iPhone app, it's not a big deal since there are few devices. But, if you build an Android app, it's far more complicated. There are lots of manufacturers, a lot of devices ... implying a lot of screen resolutions. It would be nerve-racking to embed in your Android app dozens of splash screens to handle all the existing resolutions on Android devices.
 
The best way to deal with this problem is to create 3 splash screens.  A small, a medium and a high res, and pull the one that is the closest to the screen resolution of the phone that opens the app. To quickly make those 3 images, read on to the next tip.

2 - Keep it simple

The splash screen doesn't last very long. So no need to put a long text on your splash screen. Your users won't have the time to read it. And moreover, that's not the purpose of the splash screen. 
 
Use your brand name, your logo, your motto, or whatever describes you and your app the best. Make a clear composition using those elements, and create one single image, in portrait mode.
 
If you want to create several sizes for your splash screen, I recommend you focus on the center of the image to put your composition. Leaving the edges of the splash screen free will enable you to crop your image to the different desired sizes.

3 - Tell your users it's loading

The splash screen is a still image. When you see it, it looks like your phone is frozen. Nothing happens. You can't interact with the app. You're stuck. You can only wait for the app to finish loading. A lot of things can happen in the background when your app is being launched. Your app may need to upload or download data before being ready to be used. Your app launches some processes to boot correctly a new session or restore an old one...

Depending on the user's phone processor and/or the bandwidth the phone has access to, the time to boot your app can vary a lot. Therefore, to reassure your users, you should mention in your splash screen that your app is loading, and that within a few seconds of patience, your user will be able to use and enjoy your app.

That's it! 

PS: if you are using GoodBarber, we've got you covered. Under the splash screen (launching screen) tab, within your back office, all the required sizes are specified, for iPhone, Android and Tablet, and a progress bar towards the top part of the screen indicates in a discreet yet efficient way that the app is launching.

More design guidelines:





1.Posted by umapathy on 11/21/2015 3:51 PM
Well detailed steps to create great splash screen

New comment:


In the same section
< >

Wednesday, March 29th 2017 - 17:53 PWAs - Technology Fundamentals and Powerful Use Cases

Monday, March 20th 2017 - 08:00 PWAs - Progressive Web Apps explained



Define your App Concept Ebook

Sign up for our newsletter

Be the first to know about our new features, discount coupons, DIY tips and more!






Scan the QRcode to download the GoodBarber News App!

Available for iOS & Android