Breaking News

Tooltips in Virtual Reality

So I did the play tests of Out Or Dead and my friends were all enthusiastic. Then I asked them how they liked the slow motion feature. And everybody was like: what? Which one?

In the picture above you see the situation they were faced with. There is simply no indication at all what an object is good for.

As you can see, there are three objects which the player can grab. The left one looks like a can and everybody thought it’s a grenade you have to throw. Nothing happend and people just ignored it. Without mentioning it.

The thing is, it’s not a grenade. It’s a TIME DEVICE. Sure, the prop is the wrong one. But people didn’t even try. I then decided to do a little trick. Good old tooltips. I first wanted to employ what VRTK has in store, as shown nicely in a Ray Wenderlich tutorial.

(c) Ray Wenderlich

It turns out, these tooltips are rather statically pinned to somewhere in the world. Not really what I was after. Next I tried with VRTK contextual menus. I could not get them to open automatically and they also crashed Unity reproducible (not their fault of course).

And then I thought: How hard can it be, to create some generic prefab that opens and closes nicely automatically and displays some predefined text at a predefined location relative to the object? And it turns out: 10 minutes. Here’s the approach and coding:

  • A world-space canvas with some UI Text on it (title and long text)
  • A script with a public Trigger() method
  • Two tweeners for fading in and out again
  • A hook onto the “grab” event that calls the Trigger()
  • Save as prefab and reuse wherever needed
  • Done
using DG.Tweening;
using UnityEngine;

namespace OutOrDead
{
    public class ItemTooltip : MonoBehaviour
    {
        public float duration = 4f;

        private Transform actor;
        private Vector3 originalScale;

        void Start()
        {
            actor = transform.GetChild(0);
            originalScale = actor.localScale;
            actor.localScale = Vector3.zero;
            actor.gameObject.SetActive(false);
        }

        public void Trigger()
        {
            if (actor == null) Start();
            actor.gameObject.SetActive(true);

            Sequence seq = DOTween.Sequence();
            seq.Append(actor.DOScale(originalScale, duration / 8f));
            seq.Append(actor.DOScale(0, duration / 8f).SetDelay((duration / 8f) * 6f));
            seq.OnComplete(() => actor.gameObject.SetActive(false));
        }

    }
}

Here’s the result and I am really happy about it right now, feels very comfy in VR:

The effect? Everybody immediately got it, despite the strange prop. I heard people call it the time cylinder now. I like the sound of that… 😀

2 thoughts on “Tooltips in Virtual Reality

  1. I love your blog and game man! I’m also a programmer and I’m absolutely surprised by how you write such an amazing feature in such a short timespan. Stay awesome! 🙂

Leave a Reply to Simon Cancel reply

Your email address will not be published. Required fields are marked *