top of page

Designing guided tutorials in VR/AR/MR


Tutorials: an Operating Manual for software

Tutorials or in-app guides have always been necessary to aid the user in navigating the user possibilities of apps or games that they are unfamiliar with, since their experiences are never universally consistent. In the current era where there could literally be an app for any service, universally consistent expectations for app or game behavior becomes increasingly impossible to be upheld (for many obvious reasons).

Conventionally, for any apps and games that are viewed on an external physical flat screen, the principles of navigating the tutorials are fairly straightforward - (A) what you see on the screen is what you get, and (B) you may occasionally change what you see on the screen via the use of physical controls (e.g. keyboard, mouse, controllers, etc.).

Tutorials for software where the user and machine are (almost) one?

However, VR settings totally tears apart whatever the user already knows about navigating apps or games with a computer. This is true when the extremely-common external flat physical screen has now been replaced with your own head and eyes, and the external controls replaced by your own hands. This poses an experiential question to the user - "How do I navigate this virtual world, when I'm now literally a part of the computer?"

The (Psychological) Strategy

Users in virtual reality, obviously, have free will to control their own physical bodies. Therefore, the strategy's principle is straightforward: nudging their minds! How, you might ask? Fret not, in this article, we shall cover some basic, yet essential approaches for achieving this.

Text Instructions

One of the users' pet peeves are ambiguous instructions; this dissatisfaction is further amplified in a VR setting, where the user's range of motions and actions are much more vast than what is permissible on a computer and a flat screen. As such, text instructions must be phrased really precisely, especially if your system requires the user to enact a very specific action or gesture in their virtual world.

For example, if the instruction shown is "Grab this thing with your hand", your user is equally likely to use either hand to grab it. Hypothetically, if your object is intended to only be grabbed with the right hand, you have to explicitly specify this: "Grab this thing with your right hand". Now, if your object should be picked up with a pinching gesture rather than a full-fisted grab, you should additionally specify this as follows: "Grab this thing with your right hand by pinching it". Explore deeper into the pinching gesture and you may identify users who either: (A) pinch with the index finger and thumb, or (B) pinch with the index finger, middle finger, and thumb.

At this stage, you'll probably start screaming at how precise you have to be. But unfortunately, in the user's virtual world, their bodies are their own and you should pretty much not assume they will do what you will instinctively do. Don't turn your tutorial texts into a guessing game - it is not their obligation to guess it right so you're the only loser if you really turn it into a guessing game.

Visual Cues

Typical user expectations with a computer

In a typical computer setting, the user always gazes at a screen so it is simply expected that they cannot see what's on the screen if they are simply not looking at it. However, in VR settings, the user's gaze is now determined purely by their own eyes, and they are at liberty to decide where to gaze at, rather than just staring straight ahead. Therefore, the objective is to psychologically nudge them to look in your intended direction.

In the physical world, one can easily know that a fire is right behind them from the strong amount of heat they feel in person or from smelling something burning. How do you then convey that there is a fire in their virtual world right behind them, since they can only see in virtual reality? Here's where we leverage heavily on visual cues.

What visual cues to use?

  1. Animated Particle Effects

    1. I personally find this a pretty neat trick for nudging users to look at a specific object of interest. Think of it as an attempt to plant "ants" (particles) in their sight that makes them curious to want to locate their "nest" (the source, which is the object of interest to be looked at).

    2. In principle, how this works is that you would spawn particles, which will move towards the intended gaze target, in the user's scene. You will also need to ensure that some of these particles will drift or loiter around the user's immediate gaze proximity as a way to arouse their curiosity to what these particles are for. But don't place too much of them in the user's immediate gaze proximity because they might end up misidentifying the "nest".

  2. Virtual screens/texts that follow the user's gaze

    1. This is a necessary supplement if you need to actively show things to the user that are not self-explanatory in their current context. Unlike using a computer, they will not always be purely staring straight ahead at a target in their virtual world, so you will need to actively position such things in their visible gaze.

    2. In principle, for important displays/texts that the user needs to see actively, you will need to frequently reposition them each time such displays leave their gaze. You do not need to always ensure that these things are always placed right in front of the user's gaze, as they might actually want to focus their attention on something else in their direct view. Simply ensuring that those displays do not leave the user's full field of vision is sufficient.

  3. Visual arrow markers

    1. This is useful for nudging the user to look in a desired direction rather than looking at a specific object; for example, you might ask your friend to look at something to their left, and then you might wince internally when they turn their head slightly to their left and go "What, I don't see it." and then you'd follow up with "Look more to your left".

    2. Introducing arrow markers can resolve the above-mentioned problem: in the above example, you can first show a leftward-pointing arrow positioned in front of his gaze, which will then only disappear when the user's gaze has been sufficiently turned to the left. This sequence will clearly signal to the user that they have turned their gaze in the desired direction.

Audio Cues

This technique is not mandatory, but acts as an interesting signal to the user for 2 things: (A) the general direction of an object of interest, and (B) the proximity of that object from the user's current position. A simple example would be when you have misplaced your phone in your house and you're trying to locate it by having a family member dial your phone while you attempt to listen for your phone's ringtone.

This is easily achieved via introducing useful spatialized audio in the user's virtual world. Sometimes, an object of interest is not in the user's immediate gaze vicinity, therefore spatialized audio could easily nudge the user to turn his gaze or body around as an attempt to orientate themselves (or their own gaze) towards it.


And there you have it! The techniques described here aren't overly complex, and yet it can effectively nudge your users to pay attention to what you require them to focus on. Do give these techniques a try to help ease your users into your virtual reality apps!


bottom of page