FTUE best practices

First-time user experience

So… what is a FTUE anyway? What makes it great?

FTUE is defined as “the first encounter of a user with the product”.
The encounter may last just a few seconds (as happens in mobile apps or landing pages), or can take hours or even days until completed (as in getting to know complicated systems).

In our case, we usually refer to the FTUE as the first launch and first session of a user with your app. Those can be separated in time and context.

  • You may also include in the FTUE your landing page, app’s page in our store (tile, screenshots) etc.

 

Example:

In this example we’ll show you the Legendary Builds app (builds recommendations application for League of Legends players)
There are two possibilities for the user to encounter the app for the first time:

  • Out of game (on desktop) – The user launches the app from the Overwolf dock after it was installed.
  • In-game – The app automatically launches when a LoL match starts.

The app’s UX designer should address all possibilities for first encounters – in game, on desktop, the transition and more. Each scenario can and should be designed to provide the first impression you want. Your revenue depends on it.

Home Screen

We recommend apps to invest time and efforts in designing the app’s “home” screen.
The Home screen is what the user will probably see every time he opens the app, especially on desktop or after first launch.

Example for a “home” screen in the LoLwiz app:

Desktop mode

On desktop mode, the user is more patient and has more time to investigate your app, so you should give him what he wants and needs before he enters a game with it, such as:

  • Show app’s status – working, known issues, down for maintenance etc.
  • User stats, status, record or data as a recap
  • Last match results or history of activity
  • “Beta” version label
  • Allow preparation of the app, if it is required for proper operation (such as mandatory registration) or highly important settings needed to be adjusted
  • Tutorial
  • Links to popular information such as video tutorial, FAQs, documentation
  • Link to Settings screen
  • Show version number (can also be inside Settings)
  • Registration/login, if required

Please keep in mind that each app is different and should consider carefully the desktop value.

Examples:

Some apps can, and should, offer value when opened on desktop while the game is not played yet. Legendary Builds is an example for an app that offers the player to check pro-players’ builds before launching the game. This allows preparations in advance and therefore increases the value of the app, and provides desktop value altogether.

Another example is Killer Voices, an app that allows the user to select different voice packs for different games. In fact, this kind of setting is NOT something a player should do in game, but rather on Desktop.

The following example is from the TeamSpeak EZ app. This app lets you know it is a Beta version, so it coordinates expectations with the player before the usage. It also reminds you that without accepting the EULA agreement of TeamSpeak itself, nothing would work.

Tutorial

A good tutorial will help you understand the main functionalities of the app and how to use it, in the least amount of time and efforts.
A great tutorial would be transparent to the user, and embedded in the flow of usage.

Pointers for a great tutorial for an Overwolf app:

  • Never interfere with the game itself. When game starts – respect it!
  • Focus on how to get the main value at first, and leave the rest for later.
  • Texts and arrows are just “ok”… not more than that. Strive to let the user PERFORM the actions instead of telling him or showing him.
  • Keep it as short as possible.
  • Most apps do (or should do) one good thing. If you can’t explain it in a sentence, you either offer too much without focus or just have to redesign the tutorial.