

Needless to say, you have to keep in mind all the supported device orientations. Optimize your Swift Launch Screen for all device orientations Twitter is also doing a nice spinner animation, which certainly delights users opening the app for the first time and it makes the waiting time better spent. Well, in most of the cases, for the logged-in users. For example, take a look at Snapchat’s iOS launch screen above – it shows the camera screen for a split second, which is the first main screen Snapchat app lands on.

With this trick, users will feel the app is loading much faster. Here’s a pro-tip on how: Make your splash screen look exactly like your first main screen (that’s the first view controller your app is showing). The time it takes for your app to start is extremely important, since you don’t want to frustrate users in the first 2 seconds they open your application.īy leveraging the splash screen, you can improve the user’s perception of app performance. Cold start optimization is a widely known problem in the iOS development community. Make sure it’s beautiful and it represents the heart of your app.īoost the perceived performance by optimizing your Launch Screen
#Xcode tutorial making a splash screen code
You can’t run any code before and while the splash screen is displayed, so by definition you can’t complicate it too much. Take a look at the examples above – try to only show your logo. Displaying only a few visual elements, such as a logo, band name, and a value proposition copy is highly recommended. While this should definitely have a great design, you need to keep in mind that its functionality should be basic. The launch screen is literally the first screen a user sees in your app. iOS Launch Screen Best Practices Design your iOS Splash Screen to be simple and clean Note that you can use any image that you’ve previously added to a. The general guidance from Apple is to keep the iOS Launch Screen as simple as possible, so I don’t recommend using more than your brand logo, some text, and background color. In this storyboard, you can use all the Interface Builder elements that you like. Just change the value of this key, and make sure you don’t include the. The property list description for that key is “ Launch screen interface file base name“, in case you open the file as a property list.

To use a custom storyboard for your Launch Screen in Swift, you can simply open ist file and change the value of the UILaunchStoryboardName field. Here’s an example of how the splash screen of our Dating App Template looks like: This means you can use Interface Builder to customize it as much as you want, by drag and drop. By default, it’s named “LaunchScreen.storyboard” and it is indeed a storyboard. Xcode automatically adds a splash screen to any new Swift project. You only need to make a few configuration changes in Xcode, which we are listing below. Apple made it extremely easy to add a launch screen in Xcode and there’s no coding required to achieve that.
#Xcode tutorial making a splash screen how to
How to Add A Splash Screen in Your iOS App?Īny Xcode project comes with a default iOS Launch Screen, so if you’ve created your Swift app using one of Xcode’s default template project, you already have a splash screen. This process is also known in the iOS development industry as “ cold start“. From a technical perspective, the operating system launches the app and because it takes a while until everything is ready, the splash screen is shown first, to provide a great user experience. The primary goal of the launch screen is to inform the users that the app is loading and it will be available soon. Let’s take a look a few well-known apps and what their iOS Launch screen looks like. It’s usually displayed for a couple of seconds, and it disappears right when the main screen is loaded. The launch screen is the first screen a user sees when they open an application on their iPhone/iPad. What is an iOS Launch Screen and Why It’s Important?įor developers and entrepreneurs who are new to mobile development and haven’t heard of the term “Splash Screen”, here’s a brief description about what it is.

Apple prefers “Launch Screen”, which is what we’re going to use in this article. Note: If you come from an Android/React Native background, you might have used “splash screen” to describe this app starting screen. The task itself is not difficult, and I’ll assume you are writing your iOS app in Swift, using Xcode. In this detailed tutorial, we are taking a look at how you can add and customize an iOS launch screen in your iOS app and why it’s important to take your launch screen design seriously.
