Creating iOS App Tutorials

Creating an app tutorial is one of the most difficult parts of an app to make. Tutorials guide the user, instructing them on where and how to begin while setting a short list of preferences, if any.

Too often, developers of great apps leave creating their tutorial to the last minute, resulting in poorly thought-out experiences. 

After all, the tutorial is the first thing new users experience in your app. It informs the user on what they can expect in the rest of the app.

I’m in the process of creating the tutorial for Screenshot++, my new screenshot management app for iOS. In its current form, the tutorial gently instructs the user on where to begin, asks enable Photo Library Access, and explains why

If you need the user to enable a system permission like Photo Access or Push Notifications, presenting the permission alert is not enough. First, tell them why the app is requesting it and answer the user’s question, What’s in it for me?

In Screenshot++, the app works by looking through the users’s Photo Library for screenshots. Therefore, the app won’t work without access to their photos. Communicating this point to the user increases the success rate of them pressing “Allow”.

In the first version of the tutorial, I asked the user to decide if they wanted to enable syncing features. Yet, I hadn’t explained what data was going to be synced so I chose to remove it, instead opting to ask them at a more opportune time. Many apps ask the user to enable sync within a tutorial but if it’s not immediately clear why they should, save it for later.

Another common mistake I’ve come across is when a tutorial tries to explain, in detail, every feature of the app. A rule I strive towards is tutorials should never take more than 15 seconds to complete. iOS users lack the attention span for any length of time longer than this. They don’t want to watch a video of your app’s cool features, and they don’t want to scroll through ten pages detailing your exciting new share widget.

Instead, present a short description explaining a feature as the user investigates them. It’s helpful because you’re explaining a feature or screen at a time when the user is wanting to use it. Show this description once but include a way for the user to view the information later either in a settings or about page.

We’ve discussed content but what should a tutorial look like? Tutorials should resemble the rest of your app design-wise. Because it’s the first part of your app that users experience, the rest of the app should be familiar. Button tint, font, layout style should carry into your tutorial from the app. Resist using the default UI from a tutorial project you found on Github, it’s lazy and your users will notice.

While the content of your tutorial will change app to app, a few things are clear. As yourself, Is this preference switch necessary?  Is the tutorial too wordy? Can the user complete the tutorial in under 15 seconds? Does the tutorial feel at home with the rest of the app?

Is the tutorial necessary at all?

Consider these questions throughout your app’s development. They’re tough to answer when app development is complete and impossible when trying to rush a tutorial out the door.