The Right Way to Design a Launch/Splash/Boot Screen

3 min readApr 2, 2020

The splash screen is the very first screen that the user encounters while using any app. It generally consists of just the company’s logo with some animation. The use of a splash screen is not to decorate the app or make a grand entrance but to give the user a nice view experience while doing some essential initial onboarding tasks (like user authentication, or loading primary data). Also as the main screen’s view creation takes time so it can act as a facade there.

The Wrong Way

If we create the splash screen in a similar way in which we create the main activities then its own view creation will take time. This will increase the waiting time of the user and will not serve the purpose it is created for. So if the splash screen is created by creating its own layout and then adding a time delay of 2–3 seconds (as shown below) then it is of no use as when the app proceeds it will further take time to load the view of the next screen. That is the wrong way to create a splash screen.

class BootActivity : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.boot_activity)val intent = Intent(this, MainActivity::class.java)
        Thread {
            try {
                sleep(1500)
            } catch (e: InterruptedException) {
                e.printStackTrace()
            } finally {
                startActivity(intent)
                finish()
            }
        }.start()
    }
}

The Right Way

The right way to create a splash screen involves 3 steps:

1. Create an activity without layout (XML) file:

This will help us avoid the view creation time for the splash activity and it will be shown only as long as the next screen's view is getting ready.

class SplashScreen : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        startActivity(Intent(this, MainActivity::class.java))
        finish()
    }
}

2. Create a background drawable for the screen’s background:

This will contain your UI (the logo and color).

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    
<item android:drawable="@color/colorPrimary" /><item
    android:drawable="@drawable/logo"
    android:gravity="center" /></layer-list>

3. Create a theme for SplashScreen using splash_background.xml:

Now create a theme with the background as the drawable created in the previous step.

<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:windowBackground">@drawable/splash_background</item>
    </style>

4. Apply SplashTheme to SplashScreen Activity | Make SplashScreen launcher activity:

Now in manifest apply the created theme to the splash activity and make it the launcher activity.

<activity
      android:name=".SplashScreen"
      android:theme="@style/SplashTheme">
      <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
</activity>

5. Run the app and test it.

Sometimes we want to make complex splash screens that contain animations and error message displays. For that, we have to create a separate layout for the splash activity and use kotlin coroutines to run it for some fixed duration. I will try to cover that in a separate blog.

You can have a look at this project for reference.

Comment below if you feel something needs to be corrected.