Koru Materials
Materials in Koru are made of layers. Exactly as in your favorite graphics editor, Koru lets you specify some layers and then renders them one on top of another to display the shape on screen.
Main Parameters
Besides layers each material also has Main parameters block that contains material–wide parameters:
The Double–sided option controls if the material is visible from both sides of the shape, or just from its front. Here are two similar shapes, where the left one has double-sided material, while the right one has a single side:
Note that the shapes are the same, but you don’t see the inner part of the right one. That’s because it has single–sided material that is visible only from its front.
Layers
Each material in Koru may have several layers:
Here you see a material with 3 layers named “Top Layer”, “Middle Layer” and “Bottom Layer”. The top one is currently selected and you see its properties at the right. As you may see, layers have Mask and Bump parameters that work layer–wide, and also three optional blocks: diffuse, emissive and specular. You can read more about these blocks using the links at the left.
When Koru needs to render a shape it gets its material and renders the shape with each of layer from the bottom to top. For the material on the picture above, Koru first renders the shape using “Bottom Layer” parameters, then renders it again with “Middle Layer” parameters and finally renders it with “Top Layer” parameters. As the top layer is opaque green, you don’t see any lower layers on the shape, but if it was transparent or had a mask, you would see the underlying layers on the shape.
Here we have the same material, but the checkers mask is loaded into the top layer’s mask slot:
Koru uses the mask to reveal the middle (gray) layer where the mask is black and keep the top (green) layer where the mask is white.
Rendering a single layer
When you enable both diffuse, emissive and specular blocks in the same layer, Koru has to define which goes first. Here’s what it does:
- First of all it renders diffuse block, of course if it is enabled;
- Then it renders emissive block, again if it is there;
- The last comes specular block, also if it is there.
This means that if you have a highly–reflective specular block enabled, you may not see diffuse and emissive blocks behind it even if they are enabled. Consider using multiple layers or layer masks to display something on top of the reflective areas, or to reveal the lower layers.
Do I need multiple layers?
In most cases one layer is enough. You can define the base color with diffuse block, add some reflections with the specular one and get a nice–looking material.
However, some materials need more layers. For instance, lacquered aluminium needs two reflections: one for the aluminium itself and another for the lacquered layer. Another case is a complex material having some base texture and another one on top of that applied with a mask: partially rusted surface, for instance.
In such cases you need to create several layers and provide masks or control their transparency to make sure that all underlying layers are visible.
Diffuse Layers
Diffuse layers in Koru have two properties: color and opacity. You can load a texture into color slot, or just use the color:
If you load a texture to Color slot, the image will be multiplied by the tint color:
The screenshot above displays the default built–in “ipad–screen” texture loaded to Color slot and tinted with the orange color.
Opacity
The Opacity control lets you make diffuse layer semi–transparent. The lower its value, the more you see through the layer. Let’s remove the texture from the color slot and set opacity to 90:
Now let’s change it further to 30:
As you see, the lower numbers you use, the more transparent becomes the layer.
This is the simplest transparency in Koru and it works fine for thin objects like paper, where you don’t need to simulate refraction.
Emissive Layers
Emissive layer block is pretty simple, as the diffuse one:
It lets you specify the light color and its intensity. Koru use these parameters when it computes the scene glow effect. Any reflected highlight or emissive layer block adds to the glow effect.
Below is a scene of three balls. The left one has simple diffuse gray material, the middle one has emissive block enabled and the right one has emissive block with checkers texture to control the emissive areas.
You see the left ball doesn’t glow at all, the middle one has even glow, while the right one has more glow on its bright areas.
Specular Layers
Specular layers are all about reflections. If you need a material to reflect something, you need to enable the specular block in its layers. There are two common usage cases for specular layers: add reflection to something opaque, or make glass–like materials. Both are explained below, as well as the thin–film interference effect which is also supported.
Reflective Opaque Materials
This works for paints, plastics, metals and other types of materials where you have a base color or texture and some reflection on top of that. Here’s how it is done in Koru:
You see that the layer has both diffuse and specular blocks enabled. Diffuse block defines the base orange color of the material, while the specular block controls the reflection. The most important parameter here is N — the index of refraction, that controls how much light will be reflected (and refracted) by that layer. Set it to 1 to avoid reflection and refraction, use higher values to get reflection.
Here is the same material with N = 3:
You see that our material becomes much more reflective. To make a metallic reflection, you need to switch IOR selector to “Complex” and increase the value of K parameters which controls the metallic reflection:
It now looks like a painted metal. Further increasing of both N and K values gives you a very reflective metallic material:
You can add another layer to make another reflective layer on top of this one. Add a layer and enable specular block there. Make sure the layer is added above the current one:
Here we set that new layer to have specular block only, then we configured it to be orange and to have N of 1.5, so only edges are reflective. This second layer adds another orange reflection on top of the main metallic one. Have a look at lacquered alluminium materials in Koru materials library to see more examples of this effect.
Reflective Translucent Materials
Another common usage of specular block is making glass materials. In that case you usually don’t need the diffuse block enabled, just the specular one. Here is a simple example:
Note that the shape is barely visible. The reason is that all you see at the moment is reflections, and as the N is 1.5 (like plastic or water), you don’t really see a thing. It looks like a soap bubble without those color effects (see below). In order to make it more realistic, we need to tell Koru to simulate refraction, so the material refracts the scene behind. You can do so by increasing the Refraction Level parameter. Let’s set it to 10:
Now that’s glass. You can tint it up using Transmission parameter, that controls the light going through the layer:
That’s how you make colored glass in Koru. You can make a “frosted glass” effect by increasing the roughness level:
Exactly as with opaque materials, you can have several specular layers to make a more complex material. Use mask and transmission parameters to control the light coming through the layers.
Thin–film Interference
That’s that rainbow–like effect you may see on soap bubbles, oil spots or metals. Koru simulates it pretty well, but you need to specify some wavelengths… No worries, it is not that difficult. Let’s start with a metallic material that we made above:
Now check the Thin–film Interference box below the specular block and see the difference:
Koru added a thin (200 micro–meters) film with the index of refraction of 1.5 and simulated light interference there. Adjust the width to see different colors, here we set it to 250 micro–meters:
Best of all, you can load a texture controlling the thickness in different areas. Here we loaded a built–in noise texture:
Play with the thickness levels, controlling texture and N/K values in this block to get the effect you need. It may take time to master that, but it is worth it.
That’s All!
Have a look at other Koru tutorials we have:
- Decals — how to place images on objects as decals;
- Lightmaps — how to compute scene lightmaps and configure them;
- Floor reflection — how to add and configure floor reflection;
- Watermarks — adding 2D image overlays;
- Taking Screenshots — how to add "Take Screenshot" button to your Koru exports;
- Loading Images — how to upload your own images to exported Koru scenes;
- Automatic Rotation — how to make your scene automatically rotates when idle;
- Customizing Snapshot Buttons — how to customize snapshot buttons with CSS;
- Creating Snapshot Buttons — when CSS is not enough you can create snapshot buttons yourself;
- Drop–Down Snapshots Menus — convert snapshots to configurable options;
- Manual Snapshots Control — how to activate a specific snapshot;
- Customizing Background — replace that gray gradient for scenes with transparent background;
- Non-Interactive Scenes — can exported scenes ignore mouse clicks?
- Fullscreen Button — how to change the fullscreen button look?
- Materials — Koru materials explained;
- Partial Snapshots — making snapshots that affect just some scene elements;
- Using Metadata — add extra information to nodes and use it in browser.