Create AR 360 Portal without Code — Reality Composer + After Effects Tutorial for Photographers

Image for post
Image for post
AR for 360 photographers

Augmented Reality experiences are trending right now. In this tutorial, I will teach you how to create AR experiences without having to code, using your 360 photos and consumer cameras like Insta360 One X, One R, GoPro MAX or Qoocam 8K. We will introduce a new AR workflow in Adobe After Effects and Mettle Mantra V2 to turn any 360 photos or 2D logo into AR objects. Then we will create real-world animations using the free Apple Reality Composer and learn how to export it to your friends and clients. We will bring Augmented Reality into Virtual Tours to help your business make more money:

AR is hot right now, thanks to Apple and their new iPads and iPhones. Most smartphones nowadays have AR features. And you can impress your friends if you show them your 360 photos on their phones in AR. During quarantine, you can send your friends your latest 360 photos as an AR object. They can place it in their house and be teleported into your world without VR glasses. It is a really nice gift, and you should do it now before more people learn this trick.
Before I show you how, the easiest way to create AR experience is actually using Snapchat filter as I explained it in detail in this tutorial. Snapchat is free as well. So def go check that tutorial out first:

The only problem of the Snapchat AR object is the resolution. Your 360 photo has to be very compressed.
So in order to create higher resolution AR objects, you do need Adobe After Effects and a third-party plugin called Mantra V2.

If you want to create impressive Visual Effects and 3D objects inside 360VR videos — like what you see here with the logo fly tho, music reacts tiny planet within 360VR, and cool VR music video effects like my upcoming release on Oculus TV, you def need to check out this plugin. This is the only solution I know to generate correct stereo disparity for your 3D object insert without using other expensive 3D software.

How to do AR in After Effects as a photographer or videographer

Drag your photo in the create new composition icon right here. I am going to create a night to day 360 portal. I think it looks cool when people go inside the sphere and have that initial dramatic impact of lighting. It is all about wow your clients or your friends.
So drop in my day time 360 photo as well but turn off the visibility icon right here.
After you install Mantra V2, go to your effects & presets and search for Mantra Spherify effect and drop it onto your night time photo. Under Wrap Layer, choose the night time photo and Backside Layer choose the day time photo.
If you play with the Progress, you see the photo turn into a 3D tiny planet — which is a really cool effect already. In here, we set the progress to 100% so it is a perfect sphere.
Turn off your background so we can see the sphere better.
Toggle open Light and Material. Make sure turn off Enable Point Light and turn the Specular all the way down to Zero. So we will not have a shiny planet. We are trying to keep the original lighting in the 360 photos and use actual light later in Apple Reality Composer.
You can even make the sphere 3D by adding Displacement Mapping. There is some 3D 360 camera can capture displacement map for 3D application. This is where you can add those. If not, you can use Luma and the original layer as a displacement map. If you turn up the displacement amplitude, you can see the 3D. We are trying to keep it subtle here, so I am only going to use 5.
Now we are done. For Apple, go ahead use Export to USDZ. For Adobe Aero, or PC AR, export to gITF.

If you are creating this AR experience for clients, it will be nice to place their logo into the scene as well. And even better, use the 360 photo as a material to texture their logos. So let’s create that for your Virtual Tour business. AR 360 in Virtual Tours, yes, you learn it here first on CreatorUp.

I have a PNG logo right here. Drop it into the scene. Now create a new solid. Go ahead and add Mantra Graphix — a different Mantra Effects to turn any Logo graphic or text into 3D objects without using expensive 3D software. This is why Mantra is so powerful. It is like Element 3D but for VR and AR.
In frame layout, choose Retilinear Flat. Projected Layer, choose our logo. Now go ahead and add some Extrusion Depth and Bevel Depth to your taste. Choose Wrap on the Edge UV Mapping.
Now. bring in our daytime 360 photos and hide it.
Under light, make sure the Enable Point Light is turned off. Under Material, Texture, we choose the daytime photo. Turn up the Specular and Metal to 100% and turn down the Roughness to 0 — so we give the logo a chrome metal look — which is really cool in AR.
Now take a step further, we are going to light the logo using the lighting in your 360 photos. In the Environment Map, choose the day time 360 photo again. Turn off Draw Background and turn on Enable IBL — image-based lighting.

That is it. Let’s export this also as USDZ. Transfer both USDZ files onto your iPhone and iPad using iCloud or Google drive.

Apple Reality Composer animation tutorial

Here we are on my old iPhone. Apple AR works better with the new iPad Pro, but it works as long as you have an iPhone with the latest iOS installed. If you have an Android phone, download, and use Torch instead, it is very similar to Apple Reality Composer.
If you have not already, download the Reality Composer App on Apple Store. It is 100% free. Thank you, Apple.
Open it up, create a new project by click the PLUS icon. Select Horizontal Anchor. Tap and hold the cube to delete it. Now bring in our AR objects using the PLUS icon. Position each AR object as you want. This is not a Apple Reality Composer tutorial. I will put the Apple official Tutorial link down in the description. But it is very easy, so just follow along. Go ahead and tap the dot dot do and choose Behaviors. Add whatever behaviors you want. I choose this one which gives me a scene start trigger. Hold the other actions and delete all of them. Not choose Orbit Action. Choose the Affected Objects as the logo. And the Center object as the sphere. If you tap play, you see how the animation is going to look. Adjust the settings to create the effects you are going for. There are lots of animation in here, very powerful, so play around and be creative. Send me your creations in the comment session down below. I can’t wait to see what you come up with this new technology. Now tap the dot dot dot again and from here, you can export and share this AR experience to your friends or clients using iMessage, Dropbox, Google drive or anything you want. You can also record your experience and share it on Instagram — which is lots of fun.

Please watch the YouTube tutorial for the step by step guide.

Follow me on Social Media:
YouTube: https://www.youtube.com/creatorup
Facebook: https://facebook.com/360creator
Instagram: https://instagram.com/hugh.hou

Image for post
Image for post

Written by

YouTuber at CreatorUp (https://www.youtube.com/creatorup)

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store