The final step is to enable the augmented instruction graphic in the scene. These are the same steps we did previously for Vuforia, but assuming this is a new project we should make changes here. For a more detailed explanation, please read through the integrating augmented content section in this chapter.

To InstructionStep.cs, add a new variable:

    public string ARPrefabName; 
    private const int ARColumn = 5; 

Then add this to the InstructionStep constructor function:

            if (values.IndexOf(item) == ARColumn) { 
                ARPrefabName = item; 
            } 

Create an ARGraphic.cs script to handle the UIElement events. In your Scripts/UIElements/ folder, create a C# script named ARGraphic and write it as follows:

File: ARGraphic.cs 
using UnityEngine; 
 
public class ARGraphic : InstructionElement { 
    private GameObject currentGraphic; 
 
    protected override void InstructionUpdate(InstructionStep step) { 
        Debug.Log("ARGraphic:" + step.ARPrefabName); 
 
        // clear current graphic 
        if (currentGraphic != null) { 
            Destroy(currentGraphic); 
            currentGraphic = null; 
        } 
 
        // load step's graphic 
        if (!string.IsNullOrEmpty(step.ARPrefabName)) { 
            Object data = Resources.Load(step.ARPrefabName, typeof(GameObject)); 
            currentGraphic = Instantiate(data, transform ) as GameObject; 
        } 
    } 
} 

We need to make sure the instantiated prefab is a child of this (Augmented Instruction) object.

Save your files.

The final step in integrating the AR graphic is to show it in the augmented view:

1. In Hierarchy, Create Empty object as a child of Root, and name it Augmented Instructions.
2. Reset its Transform.
3. Add the ARGraphic script as a component.

We need to make some Transform adjustments:

1. Scale: 0.1, 0.1, 0.1.
2. Rotation: -90, 0, 0.

Save the scene.

Now when you Play, try the following:

• Navigate to an instruction step that contains 3D graphics
• Press the AR Mode button to toggle into AR Mode
• Press Set Position to give the device a chance to scan your room
• Point the camera at the object you want to anchor the graphics to (your flat tire)
• The AR graphics will be displayed on the flat tire
• You can toggle back and forth between the 2D content and the 3D AR content
• As you navigate to other instruction steps, those AR graphics will be positioned at the same anchor points in the real world

There it is!

In the next section, we will adapt the project to work with wearable AR devices such as the Microsoft HoloLens.