Facebook AR Studio

Overview

Thinking about recent, top trending topics in technology, two things come to my mind : Elon Musk’s Mars mission and Snapchat’s Dog Filter. 😀 😀

Snapchat brought it’s AR filters into action a few months back which certainly got too trending to describe. But it has a limitation from developer’s point of view. Snapchat doesn’t provide an open platform for developers to contribute to AR filters.

Facebook too has an AR filter functionality in it’s app. Now, it has opened doors for developers to build their custom filters and to share them publicly via Facebook app. Facebook has a tool which they call AR studio using which we can build interesting, interactive and life-like filters. Building simple effects using face-tracking or hand-tracking is a piece of cake.

Facebook provides a great and an easy-to-catch-up series of video tutorials regarding AR studio. Here is the link : https://developers.facebook.com/docs/ar-studio/tutorials
I’ll demonstrate one of the samples from this link.

Prerequisites

We’ll need following components to start our fun-filled journey:

Here is the initial screen of AR studio.

ar-studio-image1

Creating a new project will output following screen. I have mentioned necessary nomenclature in the image itself.

ar-studio-image2

Practical

We’ll build a demo wherein a beard, eyebrows and a moustache will be placed on the face and it’ll be tracked with the face movements.

Step 1: Insert a face-tracker from the insert button in toolbar. Now, there’ll be axis (x, y and z) on the face, tracking it as it moves.

ar-studio-image3

Step 2: Insert a facemesh from the insert button in toolbar that will cover the entire face.

ar-studio-image4

Step 3: Create a material and apply texture to it.

Select facemesh from Scene tab and add a material to it from inspector menu by clicking + sign.

ar-studio-image5

Now, it’s time to apply texture to material. Texture is an image of beard, moustache and eyebrows as shown below. On an unrelated note, such textures and 3D objects can be built by 3D artist using tools like Maya and Blender. This studio supports models like .fbx, .obj and .dae.

ar-studio-image6

Select the material from assets panel and add the texture to it from inspector panel as shown below

ar-studio-image7

That’s it. You now have an AR effect ready to be previewed.

You can preview in a physical device using Mirror icon of toolbar in top-right of window.
The effect can be exported using Export icon next to Mirror icon.

To make your effects publicly available, you’ll need to submit them to facebook. They’ll review it and will process them further. There are steps and conditions that should be followed and fulfilled respectively in this process. Have a look here : https://developers.facebook.com/docs/ar-studio/docs/submitting/

A lot can be done with AR studio. Hand-tracking, plane-tracking, creating raining effect, detecting gestures are a few of the many capabilities of the studio.

Here is a snap showing few samples.

ar-studio-image8

Facebook AR at Yudiz

We, here at Yudiz, are focusing on building a fantasy world which can be entered through a portal, using Facebook AR studio.

Conclusion :-

There are over 2.23 billion monthly active users on Facebook. Facebook AR studio is a great platform to reach out to billions of users and to display our creativity through Facebook and AR. Apart from statistical point of view, such augmented reality is here to stay for a long time as it increases user interaction with the app which ultimately increases user base.

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