How to Set Up Emission/Emissive Materials in Roblox

Posted on by

In Roblox, Emission is a surface effect rather than a literal light emitting entity like a point light. As a surface effect its fundamentally a product of the games broader material system that relies on objects, models and surfaces being assigned or mapped using appropriately configured materials. For Blender, this typically means additional mesh prep to use the Emission material property of Principled BSDF before export to Roblox.

Emission Basics

Emission in Roblox is a surface effect that works by converting the tonal values of a greyscale image, an emissive mask or emissive map, into a surface brightness or intensity equivalence, it essentially makes surfaces appear as though they’re emitting light, or acting as a light source. Because the effect is defined by greyscale values, in practice this means;

• black = no emission
  – Grey 0%
  – RGB 0,0,0
• grey = variable emission
  – Grey 1%/1 <-> 99%/254
  – RGB 1,1,1 <-> 254,254,254
• white = full emission
  – Grey 100%/255
  – RGB 255,255,255

Important: emission does not ’emit’ light… [more]
Emission has the appearance of illumination because the game engine treats ’emissive’ materials as being ‘flat lit‘ or ‘full bright‘ – emission does not ‘emit‘ light, surfaces are instead, unaffected by lights entities, shading, shadows or general scene illumination.

Emission image for Roblox
Emission is defined by black <-> grey <-> white images, where black equals no emission and while is full emission (see “Emission Settings” below).

UVs & Emission

3D models that include emission need to be properly UV unwrapped as a general rule, especially as models only use a single image or texture atlas – everything is mapped to a single ‘texture space’ that can optionally include other texture maps; normal, roughness, etc.

For example, using a 256 x 256 atlas UV mapped to a simple lantern model, a small area of the diffuse (albedo) image might be painted to define;

• where on the model emission appears.
• the colour of the effect.

Whereas the emissive image will specifically defines;

• intensity or brightness.
• (optionally) colour and intensity values.

In Roblox, UV mapping ensures correct image placement on the model, with colour or tone providing the colour tint or intensity value in either/or the diffuse and emissive image maps (see Roblox Import note below).

UV mapping and emission
A simple lamp model with an area representing lamp glass painted for effect. The corresponding emission image is similarly painted, and can include colour as well as tonal ‘intensity’ values – everything not meant to emit is black regardless.

Blender Material Setup

To ensure Roblox reads emissive material data correctly, preference is to use an image rather than the Emissive property of Principled BSDF (or connecting an Emissive node instance). This means an Image Texture node needs to be added to the material that’s linked to the Color input of the Emissive property (Image Texture Color output » Color input of Principled BSDFs Emissive property). During import Roblox Studio recognises the node relationship and looks for the corresponding emission image/map that’s then processed for use.

Design note: exporting models from Blender… [more]
For more information on properly exporting models from Blender to Roblox see “How to Prep Roblox Models/Meshes in Blender“.
Important: Color not Strength… [more]
When linking the emissive Image Texture node to Principled BSDF use the Color/Color output/input path between nodes rather than Color/Strength as this is generally ignored by Roblox.

Emissive material in Blender
An Image Texture carrying the emissive image is mapped to the Principled BSDF through the Color property of the Emissive channel. This connection forces Roblox to look for the asset to enable the effect in-editor/game.

Roblox Import

In Roblox Studio use the Import tool to bring the Blender exported model into the editor. In the Import Preview window the process opens, expand the Scene information lower left, and check the emissive effect is functional on the material – an alert icon should be visible that, when clicked, displays text outlining what Roblox does when it finds an emission map;

“Roblox transforms emissive map textures into a grayscale mask texture and modifies the imported colour map to include the colour information from the emissive map texture.“

This message confirms Roblox Studio has found the emissive image and has properly converted it for use in-game. Completing the Import process will drop the assets into the scene ready for use.

Design note: Roblox doesn’t use the actual emissive image as is… [more]
What Roblox is doing when it finds an emissive image during import, is to convert it into a greyscale mask (non-RGB, single channelled ‘map’) that defines where the emissive effect appears. Then, using this same image data the “colour map”, the diffuse (albedo) image visible to the user, is modified making the ’emissive’ areas appear brighter than they might have been originally painted – aged yellow glass for example, might be made tonally lighter to emphasise the effect. Similarly, if the incoming emissive image has RGB colour information, Roblox will blend both colour and tone with the diffuse in the same way, for the same affect, converting those same colours into pure non-RGB tonal values for the emissive mask.

Colour vs. greyscale emissive
Preference should be to use a fully greyscale image (right) vs. including any colour information (left), which should be reserved for the diffuse (albedo) image.

Emission import and conversion
During import a warning will be shown in the Import Preview window indicating an emissive texture was found and converted ready for use.

Emissive Lighting

As the emissive effect doesn’t actually emit light, surrounding objects won’t be illuminated. To create this impression, that the effect is lighting the scene, an actual light emitting entity has to be added that’s positioned relative to the model and the effect. Exactly how this is done depends on the object, and what the effect represents, a ‘lamp’ for example, might have a PointLight added to the same entity as the 3D lantern model, positioned so the emissive effect appears to emit light and illuminate the scene from the lantern.

Design note: lights as child objects… [more]
In this context, emissive surfaces on models, lights are not added as scene illumination. Instead they are included as part of a specific game object, a ‘lantern’ for example. This means that, while it appears in the scene when added, it is technically a child of another object, the ‘lantern’, so it can be moved and manipulated as part of that game entity (a Model).

To add a light, in Explorer mouse over the model listing (MeshPart) and click the + (Insert Object) icon to the right of the label. Search for “light” and click one of the available options (PointLight, SpotLight, SurfaceLight). This drops the entity into the scene relative to, and positioned in the Explorer as a child of, the mesh object parent, making it a (sub)component of the Model game object that now means if the group is moved, the light moves with it.

Design note: managing lights… [more]
It’s best to avoid adding lights to the scene in their ‘raw’ state, that is as stand alone objects in Worldspace. Instead, preference should be to drop them into a proxy, an entity container like the Model object, for example, the lantern model used as a light source can include a light as a child object. In doing this however, the light entity itself is difficult to manipulate as the Move, Scale and Rotate widgets are not always available.

To work around this a MeshPart, the aforementioned proxy object, can be added as a child of the lantern, which itself becomes the parent of the light. This can then be made invisible and non-collide-able, and as its a physical object, the manipulation widgets will be available allowing for precise manipulation of the light entity.

Model (game entity)
» lantern (MeshPart)
» » proxy (MeshPart)
» » » light (entity)

Attach lights to proxy objects
To make it easier to position light entities make them children of proxy objects (parents) as this (re)enables the manipulation handles otherwise not available when lights themselves are selected.

Emission and lighting
To give the impression emission is actually illuminating the scene, add a light to the same entity.

Emission Settings

Due to the way Roblox Studio sets up emissive textures during import, it accommodates material colour and intensity being adjusted after the fact. This is done by adjusting the SurfaceAppearance component that’s automatically added to the imported 3D model. Highlighting this in Explorer lists two particular properties associated with the emissive effect, EmissiveStrength and EmissiveTint. Here, both can be changed additively, that is, they change colour and intensity relative to the original baseline colour and intensity established during import from the source images, for example the emissive effects appearance can be changed from green to red, from dull to very bright, by altering the numerical values and colour selection of the two properties.

Design note: original vs. in-editor adjusted colour… [more]
As a general rule of thumb the emissive image configured in Blender should be a greyscale image. Typically this will be an RGB greyscale image, but it can also be a ‘true’ greyscale image (8 bit greyscale vs. 24 bit RGB greyscale – when exporting from an image editor as PNG, optionally enable Palettised and set the Palette to Greyscale to ensure an 8 bit greyscale image). One of the reasons for this is to accommodate ‘after-the-fact’ adjustments that modify the initial colour and brightness attributes of the effect; if the emission map is baseline ‘grey’ it means adjustments to colour and intensity in Studio will be ‘flat’ and ‘universal’ – adjusting colour to be ‘green’ might mean using slightly different colour values if the original emissive colour was red.

Saving an 8 bit greyscale image
Depending on the image editor, during export as a PNG, set the ‘palette’ to ‘greyscale’ to ensure a proper 8 bit greyscale image – this is entirely optional as Roblox Studio converts what it finds during import as a matter of course.

Emission tint and strength settings
Adjusting the emission effect after importing the model by changing the EmissiveStrength and EmissiveTint properties of the SurfaceAppearance component added to the game entity (Model).