How to use custom materials in OKO
Before beginning this tutorial, you may find it useful to first read Introduction to Physically Based Rendering.
Creating a Material
To create a new material, open the Materials tab at the bottom of the screen.
From here, press the plus button and choose the shader type of material you want to create. Every kind of shader has different properties for specific use cases. In this case, we’re going to create a glTF PBR material.
Now you’ll see the material edit screen on the right.
From here, you can set all of the properties you need. See the previous page, “Intro to Physically Based Rendering,” for more information on what their properties do.
Using Textures
There are two types of texture assignments, Components and Assets.
Assigning an image texture asset to a texture slot is done by selecting the correct type from the first drop-down. You can drag an asset onto the texture slot or select it from the drop-down menu. You must upload your texture into the space first.
For videos or cinematic cameras, select the component type. This allows for dynamic textures to be used. For a video, you must first create a video component and add it to the space – this is where the controls (e.g., play/pause) will exist. You can assign the same video component to multiple materials or textures. The same goes for cinematic cameras: add the component to the space and use camera mode to position it as needed. It will then be available as an option.
Texture UVs
UVs define which parts of the texture map onto which parts of the surface. Each texture slot has its own set of UVs that can be overridden.
Offset - translates the texture in the specified direction, with U being horizontal and V being vertical.
Scale - allows the texture to be tiled.
Rotation - rotates the texture.
The two actions below can be performed to help manage UVs across the material.
Reset UV Settings sets the default values.
Duplicate To Other Texture Slots copies the current UV settings to all other texture slots, overwriting their existing settings to ensure consistency
Managing Materials
The Materials panel will list all the materials in the space. From here, you can select either to delete or edit them.
Upon selection, you can see the details of the material itself. To edit, click the edit button at the top right.
When editing a material, changes will update in the space immediately, showing you how the material will look for easy editing.
Warning - changes are not saved or shared with other users in the space until they are saved.
Discard will revert the material to its previously saved state.
Assigning Materials
Having created some materials, you now need to apply them to a model in the space, overriding its existing material. This is not a permanent change to the asset and can be edited freely.
To apply a material, simply drag the material onto the mesh.
Depending on how the model was set up, the material may apply to individual mesh parts, rather than the entire object.
Having applied the material to the mesh, you can view, edit, or delete the assignments by selecting the entity, then selecting the animated or static model component you just changed.
Removing the material override will return the mesh to its original material.
Creating a Video Material
Let's use an example to create a material that displays a video across its surface. We will need an emissive texture material assigned to a video component.
Step 1 - Upload the Video
On the assets tab, click Upload and choose an .mp4 video file.
Step 2 - Create the Video Component
Right-click anywhere in the scene to bring up the create component menu. Search for a video and create it. Next, click on the asset drop-down, select your video, and press the eye button to hide the built-in video plane.
Hiding the video component still allows the audio to be heard as it is still enabled, just not visible.
You can also set the video to the Playing state to play the video.
Step 3 - Create the Material
Click on Create Material and select Default PBR.
Set the base color to black.
Set the emissive color to white
Go to the Emissive Texture slot and select the type as component.
Select your newly created component as the texture
Click save.
The new material should now be saved and available for use.
Step 4 - Apply the Material
Now, open the materials section on the bottom panel.
Drag the new material we just created and drop it onto the model you want to apply it to.
The material is now in use.
You can see any custom materials that are applied by selecting the model component.
Here you can delete or change the applied material.
Removing the material from a mesh restores it to its original state.