Getting Started with Spark AR Studio
In this blog, you’ll learn about Spark AR, the things required to create an effect on Spark AR Studio, the interface of Spark AR Studio and to create your first face filter with Spark AR Studio.
Spark AR is a camera effects platform from Facebook. It allows you to create interactive augmented reality experiences with or without code and share it with your friends through Facebook or Instagram. With which you and your business can reach more people and potential customers. Imagine if you’re running a media contest, All the users have to find their nearest photo-booth to take a picture and upload it to win prizes. With Spark AR Studio you can build a simple photo-booth, anyone can simply take a photo and upload it to participate in the contest. This is easy and allows us to reduce costs and at the same time reach more audiences.
To learn more about Spark AR, visit Spark AR’s official website. You can find all the documents and instructions created by Facebook on this website.
Spark AR allows the users to not only view the effects passively but they can also interact with the effect. They can touch, rotate, track movement, change effects, transform their surroundings and even play games. Isn’t that great? For example, if you’re an owner of a cosmetics brand. You can create a filter with which users can test some lip colours. When they love the colour it will allow them to make a stronger purchasing decision.
Install Spark AR Studio
Visit Spark AR’s official website and download Spark AR Studio. After downloading install the application and log in with your Facebook account.
Then, In your smartphone download the Spark AR Player App.
Using Spark AR Player you can simply connect your smartphone to your computer and view/test your effect & filters on the go.
Spark AR Studio Walk Through
When you open Spark AR for the first time you will see the Samples tab with a set of simple filters and effects created by Facebook’s team to help us understand the basics of Spark AR Studio. You can simply click each effect and start exploring. You can start creating your own filters and effects. Simply click “Create Project”.
A new project is opened in Spark AR Studio. Now let’s view some of the important sections of the interface.
The Middle Part of the interface is called the ViewPort. This is where you will view and work with the effect that you’re creating.
In the top left corner of the ViewPort is an option called View. This Dropdown option allows you to change the view of the viewport. By default, the view is set to Bird’s eye.
The simulator represents a mobile phone. You can use this to preview your effect like real.
Adding objects to the Scene panel will add them to the effect.
Click the “Add Object” button to add an object to the scene. You will be shown a list of all the objects that can be added. Simply select the one you want and click “Insert”.
You can add a Plane, Face Mask, 3D object, etc..,.
The Assets panel is where you will add your own assets to the project or create assets in Spark AR Studio.
Click “Add Assets” to create assets or to add your own.
You can add textures, materials, 3D models, animations, audio files, etc.
Use the Inspector Panel is used to make all kind of changes to assets and objects.
The Tool Bar is along the left side of the interface.
Click the icons to:
Configure your own space,
Change the video playing in the simulator,
Pause or Restart the video,
Preview your effect,
Export your effect and
Report a bug.
Now that you’re familiar with the interface. Let’s create a small effect and try it out.
Creating your first Face Filter On Spark AR Studio
Download a Face Mask Texture or Create your own Face Texture using a designing tool like photoshop.
In Spark AR Studio, Import the downloaded Face Mask Texture. To import Click Add Asset in the Assets Panel and select the downloaded Face Mask Texture. Create a new material, Click Add Asset and select Material. This will create a new material. Now select the newly created material and In the inspector under shader properties select the option texture. Select the imported texture.
In the Scene panel, Click Add Object, select Face Mask and Click Insert. This will add a new Face Mask to the scene. Now Select the Face Mask in the scene panel and In the inspector Click + icon in the Materials Tab and select the material we created. Click Play in the Tool Bar if your videos in not playing in the simulator.
That’s it! You have created your First Face Filter using Spark AR Studio.