Building AR Portal : A door to fascinating AR experience

Overview

Ever wanted to visit an imaginary, fairy world? 😀
It’s now possible. Thanks to Augmented Reality. You just need to pick up your mobile, point it at an open space, plot an AR portal and dive into the magical world of your choice.

And what if I say, all this is possible with just 10 lines of code? Wouldn’t it be just a cherry on top?

Coding in AR is a little tricky, if we do not have any support of abstract SDKs. Here, we will use ViroCore, a scene kit for Android ARCore. It provides extreme level of abstraction. Coding with ViroCore is more fun and easier than ever, thanks to those wonderful people at ViroMedia (https://viromedia.com). And, most amazing part of ViroCore is: It’s free !!

Isn’t it jaw-dropping news? 😀

ar-portal-image1

Practical

Let’s dive into some practical scenarios. But before it, you’ll need an API key which can be grabbed by registering yourselves at https://viromedia.com/signup and it is to be added in manifest file as shown below:

ar-portal-image2

We have to add two libraries: ARCore and ViroCore SDK. As it is based on ARCore, it will only run on AR supported devices.

We’ll use the assets provided by ViroCore – sample code. In this, we will have a window of a ship and through that window, we can pass into a beach world, for that we’ll need a 360 degree image of a beach world and a model of ship window and its textures. Place them in assets folder.

ar-portal-image3

Here, .VRX format for model is ViroCore’s own extension. Here, it is basically a .FBX model.

Final output will be something similar to the below image:

ar-portal-image4

In Activity’s onCreate( ) method, we need to set ViroView as content view. ViroView is basically a FrameLayout which initializes the camera for AR.

As seen, we have a function-call in onSuccess( ) of ViroView’s initialization.

This will add an ARScene in VieroView.
Initially, we have set light position and color.

Then, we have created and loaded ship window model.

Now, comes the main part. We have created a portal and have added a background to it.

setPassable(true) will allow us to create a portal in which we can enter. We have to set ship model as the entrance of PortalScene.

That’s it. Now, it’s beach time !! 😀

Video

Future

We, here at Yudiz, are targeting to achieve nested portal scenarios (Portal inside another Portal).

Conclusion:

We are just a ‘portal’ away from AR-dominating world. Adapting to such amazing technologies as soon as possible will serve us and our businesses with a great benefits.

mm

Sumeet Rukeja Android Developer

I am an Android Developer at Yudiz Solutions Pvt. Ltd. - a leading Mobile App Development Company. I am passionate about developing android apps and to learn more and more about the deep sea of Android.

Comments are closed.

Top