Use Cases

Learn how to integrate our SDK with Unity using an example

spaceBlippar Documentation Centre

Introduction

Blippar WebAR SDK provides a robust platform for AR creations and its integration with Unity 3D enables the creators to create a plethora of realistic gaming experiences, 3D design and simulations across multiple industries such as film, automotive, and architecture. The following sections provide a detailed explanation on the practical applications of the integration considering

AR and Unity 3D

Augmented Reality is an interactive experience of a real-world environment where the objects reside in the real world enhanced by computer-generated information. We can define Augmented Reality as a system that inculcates the following three features: a combination of real worlds and virtual worlds, real-time interactions, and 3D enrollment of virtual and real objects. Augmented Reality is popular in the mobile app market, and its popularity is still growing. Various Games and apps like Pokemon GO, created using Unity3D revealed the potential for the commercial success of this technology.

Unity 3D integration with Blippar WebAR SDK

Unity 3D integration with Blippar WebAR SDK has the following advantages:

  • Create more realistic gaming experiences easily by using Blippar license key

  • Include real-time SLAM tracking and limitless image targets.

  • Create once and easily publish on all Android and IOS browsers.

  • Use any device with a camera to test the AR experience built in Unity with Blippar WebAR SDK.

  • No installation on any application is required.

  • No requirement to create applications to launch the gaming experiences created using the integration. Simply launch the experience on Android or IOS browsers by using the URL generated with the experience.

  • Embed advanced computer vision functionality like shaders and particle effects in Blippar WebAR experience using Unity3D

  • Provides the ability to add multiple imager trackers (markers) into a single experience that would trigger the appearance of 3D objects created in Unity3D.

Use Case: AR Course Creation on the 7 wonders of the World

Let us consider the following example of creating a marker tracking experience:

John is currently working as a Professor in an esteemed educational institution named ABC Ltd. They have an urgent need to create an online course content which can easily be accessed by the students without any hassles of installing any third party mobile apps to either create or trigger the content. They also want to make the course very interesting to the students and give them a realistic walkthrough of the 7 wonders of the world. John is very particular with the quality of the AR content and is looking to include certain special effects such as particle effects, smoke screens or shades in the experience. John wants to have the option of simply sharing a link with all the students to access the course. He would like the option to include high quality images/markers for each of the 7 wonders and have the capability to trigger the AR experience with multiple image targets. John also has a deadline to publish the course in a short span of time and has no wiggle room. The institution has facilitated John with a free trial license for Unity 3D.

John needs to follow the below simple steps for creating his course.

  • Launch the Unity HUB.

  • Create a new 3D project in the Unity HUB. Let us name this project ‘Testing’

  • A list of all the projects created would be displayed on the screen

  • Open this project in the Unity editor

  • Download and import the WebAR SDK Unity Package into the Unity Editor

  • Navigate to Assets> Import Package> Custom Package

  • Select the downloaded WebAR SDK Unity Package to import into the Unity Editor

  • Generate a WebAR SDK License Key. SignUp with Blippar, Login to the Blippar Hub and click on ‘Get License’. The License key is one-time generated and free to use. Save the license key information. You will also receive an email notification of the license key generated.

  • Two new assets will be added into the assets section within Unity Editor- WebAR SDK folder and webGL templates folder.

  • In order to include image targets or marker images, you need to create a marker ID. Login to the Blippar HUB and add or autogenerate marker images. Copy the marker ID to embed into the Unity Editor.

  • The marker ID for the 3D models of the 7 wonders can be generated from the Blippar HUB.

  • Navigate to the Blippar tab from the unity editor and enter the license key information.

  • After the import operation is completed, verify if the Blippar Menu is available in the Unity Editor's Menu bar.

  • Navigate to the Blippar Inspector window and select the option ‘Marker Tracking’

  • Consider the below experience where a marker tracking experience that can track 7 images in the sample experience that is being created to refer to the 7 wonders of the world.

  • Under Marker count, enter 7 to track 7 images. You will make two Marker entries to map the marker image id and its corresponding 3D game object that has to be displayed over the image during marker tracking.

  • In the Blippar hub, upload marker images to be tracked and obtain their marker Ids.

In the Blippar inspector tab, add the two marker ids. For example, if the marker IDs are a_bcd-1234-marker-image_ and wxyz-5678-marker-image etc enter these seven IDs.

  • Delete the default "Main Camera" object from SampleScene

  • Under Blippar Menu in the Unity Editor's Menu bar, select webar Marker to create a webarMarker1 game object.

  • Repeat the step to create webarMarker2 object and so on upto webarMarker7

  • In the Hierarchy window, drag and drop the webarMarker1 object under Marker Object field of Marker 1 in order to map the webarMarker1 game object with Marker 1's Marker ID

  • Repeat the above step webarMarker2 object to map it with Marker 2's Marker ID upto webarMarker7 object mapping to Marker 7’s ID to indicate the 7 models of the wonder of the world

  • Create a sample 3D object under webarMarker1, for example, Taj Mahal, which will be displayed on the image having the marker id abcd-1234-marker-image, when running marker-tracking experience.

  • Similarly, create a Colosseum object under webarMarker2, to display it on the image having the marker id wxyz-5678-marker-image and so on for the 7 wonders of the world.

  • Click Build in the Blippar Inspector tab, to build the marker tracking web application.

  • After the build is complete, a pop-up confirming the build is complete will appear on the screen

  • Once the build is complete, you can locate the built application under the unity project folder. Navigate to /My project/Build/SampleScene folder.

  • Host this folder in a HTTPS web server. For local testing, host it in a HTTPS web server having the desktop/laptop's IP address as the domain address.

  • For more details see this link on how to develop locally.

  • Open the URL in the mobile browser(Android Chrome or iOS Safari) to view the Marker Tracking experience.

  • John can share this URL with all his students and the marker images when tracked will trigger the AR experience of the 7 wonders of the world.

Examples

Check out a few example AR experiences created using WebAR SDK Unity Package. Scan the QR code displayed on the screen to trigger the experience: