22nd May 2018

Building AR Portal : A door to fascinating AR experience

Augmented Reality

Written By, Sumeet Rukeja


Ever wanted to visit an imaginary, fairy world? 😀
It’s now possible. Thanks to Augmented Reality Development. 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? 😀


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:


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.


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:


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 !! 😀



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


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.

Written By,

Android Developer at Yudiz Solutions Pvt. Ltd