CLEAR

Materials and Shaders in Spark AR Studio

A material is a combination of textures and properties that determine how the surface of an object looks. Only one material can be applied to an object - but you can apply more than one texture to a material.

You can create materials in Spark AR Studio. Once you've created a material, you'll choose from a range of built-in shaders. The best shader to use depends on the effect you're creating.

Because the opacity of a material affects the underlying layers, if you're creating a face effect you should test it on a variety of skin tones. Spark AR Studio contains several videos so to help you test this. To change the video, click Video in the middle of the toolbar and select a different video.

Creating a material

Click + in the Assets panel, then Create New Material.

The material will be listed in the Assets panel. You'll be able to make changes to it in the Inspector panel.

Choosing a Shader

The shader calculates the color of every pixel rendered in the scene. Once you've created a material, you'll need to decide which shader to use. You'll be able to adjust different properties, depending on the shader.

There are 6 to choose from:

Standard

The shader for most materials will be set to Standard by default. This shader incorporates a lighting system called the Phong model, that's good for applying realistic lighting to 3D objects.

Flat

This shader doesn't respond to lighting and displays color and texture values absolutely. It's more performant than the Standard shader.

You might use this shader if there's lighting and shadow present in your texture file already, or if you're creating a material for a 2D object.

Face Paint

Face Paint is designed to work best with effects that show human faces. For example, if you're adding a texture that looks like make up, or painting stripes on someone's face for a football effect.

Blended

This shader includes a blending mode to mix textures and colors.

Retouching

Use this shader to add retouching effects to faces and scenes.

Physically-Based

Use this shader to apply a combination of Albedo, ORM and Normal textures to a material. You can also add image-based lighting to physically-based materials. This shader works best on modern mobile devices. Spark AR studio won't show this effect in older devices.

Changing the Shader

Most materials are set to the Standard shader by default. To change the shader:

  1. Select the material in the Assets panel.
  2. Select an option from the dropdown next to Shader Type in the Inspector panel.

Shader Properties - Standard

Diffuse

Use this texture map to define the base color and pattern of an object. You can use Color and Texture together to create variations in the texture map, or you can use one or the other.

Specular

Use this texture map to define the shininess and highlight color of a surface.

Normal

Adjusting Normal lets you create real world textures like bumps, grooves and rivets without having to add extra geometry to your object. Representing these details as a texture, instead of geometry, in the model will increase the performance of your effect.

Emission

Allow your material to illuminate from itself. It doesn't cast rays, so the illumination won't affect other objects in the scene.

Tiling Options

Tile

Scale the textures you've applied to your material.

Offset

Shift the origin of your textures.

Render Options

Blend Mode

Sets the blend mode of the material.

  • Add
  • Alpha
  • Subtract
  • Multiply
  • Replace
  • Screen

Cull Mode

Back - Discard pieces of the mesh that are facing away from the viewer. Most effects use this mode to improve performance.

Front - Discard pieces of the mesh that are facing the viewer.

Opacity

Sets the transparency of the material on an individual map level.

Double Sided

Displays both sides of a face normal.

Advanced Render Options

Color Encoding

Choose the output color encoding of the material.

RGB will apply the expected gamma correction after shading. Linear will not apply any conversion after shading computation.

Used By

Check which object this material is applied to.

Shader Properties - Flat

Diffuse

Use this texture map to define the base color and pattern of an object.

  • Color - Add a color from the palette to the diffuse map.
  • Texture - Choose the texture file you want to add from the menu or import a new one.

Render Options

Blend Mode

Sets the blend mode of the material.

  • Add
  • Alpha
  • Subtract
  • Multiply
  • Replace
  • Screen

Cull Mode

Back - Discard pieces of the mesh that are facing away from the viewer. Most effects use this mode to improve performance.

Front - Discard pieces of the mesh that are facing the viewer.

Opacity

Sets the transparency of the material on an individual map level.

Double-sided

Displays both sides of a face normal.

Used By

Check which object this material is applied to.

Shader Properties - Face Paint

Type

  • Texture - Choose the texture file you want to add from the menu or import a new one.
  • Color- Add a color from the palette.

Render Options

Cull Mode

Back - Discard pieces of the mesh that are facing away from the viewer. Most effects use this mode to improve performance.

Front - Discard pieces of the mesh that are facing the viewer.

Opacity

Set the transparency of the material on an individual map level.

BG Influence

Multiplies a color or texture against a grey-scale version of the video feed.

Brightness

Sets the brightness of a color.

Double-sided

Displays both sides of a face normal.

Used By

Check which object this material is applied to.

Shader Properties - Blended

Type

  • Texture- Choose the texture file you want to add from the menu or import a new one.
  • Color- Add a color from the palette.

Render Options

Blend Mode

Sets the blend mode of the material.

  • Normal
  • Add
  • Multiple

Cull Mode

Back - Discard pieces of the mesh that are facing away from the viewer. Most effects use this mode to improve performance.

Front - Discard pieces of the mesh that are facing the viewer.

Opacity

Set the transparency of the material on an individual map level.

Double-sided

Displays both sides of a face normal.

Used By

Check which object this material is applied to.

Shader Properties - Retouching

Fullscreen

Apply a smoothing effect to the whole scene.

Skin Smoothing

Blur and blend the appearance of skin.

Eye Whitening

Brighten the appearance of eyes.

Teeth Whitening

Brighten the appearance of teeth.

Learn more about retouching.

Shader Properties - Physically-Based

Albedo

Albedo is the base color of your material.

Color

Choose the base color of your material.

Texture

Apply a base texture. The texture is modulated by the color.

Surface Parameters

Metallic

Slide the scale to adjust how metallic your material appears.

Roughness

Slide the scale to adjust how rough or glossy your material appears.

Occlusion Strength

If your texture has an occlusion map you can slide this scale to adjust the strength. The higher the occlusion strength, the darker the occluded areas will be.

ORM Texture

Apply an ORM texture. ORM stands for Occlusion, Roughness and Metallic. When you've applied an ORM texture to your material, you can use the sliders to adjust the appearance of these surface parameters. For example, how metallic or rough your material appears.

AR studio packs ORM values into the RGB channels in that order.

Normal

This a type of bump map, that lets you create real world textures like bumps, grooves and rivets without having to add extra geometry to your object. Representing these details as a texture instead of geometry will increase the performance of your effect.

Texture

Apply a normal texture

Emission

Allow your material to illuminate from itself. Light emitted will only affect your material, not other materials in your scene - like a standard light source.

Color

Select an emission color.

Texture

Apply a texture. The emission texture and color will modulate.

Environment

Apply either a preset environment texture, or import your own.

Environment textures use images to provide lighting that mimics lighting in a real world setting. For example, the lighting in an office or outside on the beach. Find out more.

Tiling Options

Tile

Scale the textures you've applied to your material.

Offset

Shift the origin of your textures.

Render Options

Blend mode

Sets the blend mode of the material:

  1. Alpha.
  2. Subtract.
  3. Multiply.
  4. Replace.
  5. Screen.

Cull mode

Back - Discard pieces of the mesh that are facing away from the viewer. Most effects use this mode to improve performance.

Front - Discard pieces of the mesh that are facing the viewer.

Opacity

Adjust the slider to set transparency.

Alpha Cutoff

Use the slider to make semi transparent areas, below a certain threshold, transparent.

Double Sided

Check this box to render both sides of the mesh.

Advanced Render Options

Color Encoding

Choose the output color encoding of the material.

sRGB will apply the expected gamma correction after shading. Linear will not apply any conversion after shading computation.