Adding 3D object on the image target in Unity

Sharvari Raut
6 min readAug 5, 2022

Augmented reality is the combination of digital information with the user’s environment in real-time. Unlike virtual reality (VR), which creates a completely different artificial environment, augmented reality uses the present environment and covers new information on top of it.

Photo by UNIBOA on Unsplash

A great example of this scenario would be virtual AR furniture applications. These show 3D furniture like sofa, chair, etc around your room. Before purchasing, you can see where you can place your furniture and where it looks good.

This concept is been implemented for a wide variety of use cases, such as:

  • Games like Pokemon Go
  • Clothing and fashion accessories
  • Indoor and outdoor navigation using AR
  • Social media lenses like Snapchat and Instagram
  • Education, allows teachers to present visual representations of a variety of complex topics and objects
  • Healthcare, where it’s found new uses for patients and professionals as telehealth becomes popular for things like explaining surgeries and procedures

In short, the uses for augmented reality are pervasive and it is a useful skill for developers today.

In this article, we will use a game engine called Unity to demonstrate this concept by Adding a 3D object over a 2D plane.

Let’s get started.

Introduction to Unity

Unity is a cross-platform game engine used to develop scenes, created by Unity Technologies in 2004.

The engine can be used to create scenes, three-dimensional (3D) and two-dimensional (2D) games, some interactive simulations, and other experiences. Unity was created partly with the intention of democratizing game development, and users have access to features which allow real-time graphics development in both 3D and 2D environments.

To use augmented reality on a device, you will need to download and install separate packages for each of the target platforms officially supported by Unity, which are:

Introduction to Vuforia

Vuforia is an augmented reality (AR) software development kit for mobile devices that allows the creation of augmented reality applications.

It uses computer vision technology to recognise and track planar images, which are known as image targets and 3D objects in real-time.

This image registration capability allows developers to position and orient virtual objects, such as 3D models and other media, in relation to real-world objects when they are viewed through any camera of a mobile device.

The virtual object then tracks the position and orientation of the image in the real world so that the user’s perspective on the object corresponds with the perspective of the target. It thus appears that the virtual object present is a part of the real-time present scene.

The Vuforia SDK supports a variety of implementations like 2D and 3D target types, including “markerless” Image Targets, Fiducial Marker (VuMark), and 3D Model Targets.

In addition to this, the SDK contains several other features — six degrees of freedom device localization in space; runtime image target selection; localized occlusion detection using “Virtual Buttons”; and the ability to create and reconfigure target sets programmatically at runtime.

Adding an action character/3D cube on a book

To begin, we need to do some configurations in Unity and Vuforia. Let’s see them step by step.

Installing Unity

First of all, you need to download Unity — the game engine provides everything via Unity Hub.

After installing the hub, you can choose any Unity version you want to install. I recommend either the latest version (e.g. 2019.X.Xf1), or — if you want to be safe — use a long-term-support (LTS) version.

Make sure you add Android/iOS Build support, depending on your target device.

Create a Unity project

After installing Unity, click on New Project>3D (Core)>Create Project. Here, we are creating a new project in Unity with 3D (Core).

Creating a Vuforia account

You need to create a Vuforia developer account and login into your account. Once you have logged in, go to the Downloads tab and download the Vuforia package.

Importing the Vuforia SDK

Double-click on the downloaded Vuforia SDK and import the package into your Unity project. Click on Import. Once it is imported into your project, click on the Packages folder to see the Vuforia contents.

Delete the Main Camera from Hierarchy. Double-click in Hierarchy from Vuforia Engine and select AR Camera.

Getting a Vuforia license key

Go to the Vuforia site. Login to your account, then go to Develop>License Manager>Get Development Key. Give a name to your development key.

Here, I have named it ARONE. Click on the Develop tab and go to License Manager. Copy the license key; we are going to import the license key into our Unity project.

Go to your Unity project and click on AR Camera. An Inspector panel will be open on the right side of the screen. Open Vuforia Configuration, paste the license key and click on Add License.

Creating Vuforia database and uploading image targets

Head over to the Vuforia site. Go to the tab named Develop>Target Manager>Add Database. Give the database a name and select type as Device.

Click on the created database and then go to Add Target. Add an image on which you want your 3D object to be placed. This image target will act as a 2D plane.

Here, I have added the front page of a book. Click on Download Database, while downloading make sure you have selected Unity as the editor.

Go to your Unity project in Assets>Import package and select the database package which you downloaded.

Projecting 3D model over our 2D image target

From Hierarchy, click on the + icon from Vuforia Engine and select Image target.

Right-click in the Hierarchy section, in the 3D object option, and select any object you want. I am selecting cube for this tutorial. Place the cube right over the image target as shown.

You can move the cube in the 3D space by selecting and dragging it. Make the cube as a child of the Image Target by dragging and moving it.

Let’s project a 3D action character on our Image Target. Download and import the Barbarian action character from the Unity asset store and delete the cube.

Now, from the downloaded packages Barbarian>Models, drag the Barbarian.fbx file into Hierarchy. Make Barbarian a child of the Image Target. The Barbarian assets come with animations property. You can change the different animations from Settings.

Exporting it as Android SDK

Make sure you have installed Android SDK and OpenJDK in your project. To export the project as an android application, go to File>Build Settings>Android>Switch Platform>Add Open Scene>Build. Save the application in .apk format.

Install the apk on your smartphone. Voila! Now, your application runs on your smartphone.

You can watch the video output demo of this tutorial here and see our Barbarian AR project in all its glory!

Conclusion

Unity is best suited for creating scenes — we used Vuforia to use it as a database where we store our Image Target.

Any pre-made models can be implemented which can be found on the internet for free or for a fee. Using Unity, we can project any 3D object onto a 2D plane. I hope you found this walkthrough guide useful for creating your own AR projects.

--

--

Sharvari Raut

Technology Geek🤓 | Gamer🎮| AI Enthusiast😎| Coder 👩‍💻 | Avid Reader 📖 | Data Science ❤️ | Open Source Contributor 🌍