A Storytelling Tool
The TV is an important element for the environment’s story. It’s communicating the reason why there’s a safe in this garage/shed - it’s being broken into. And it also communicates that the safecracker is scrappy and perhaps low-budget, because the tools seem improvised.
Geometry
There’s nothing extraordinary about this model in the start. I did decide to create a high-poly model to bake details to a lower polygon ‘in-game’ model. This isn’t always needed, but I felt this model would benefit from the extra work, especially with the backing material, which is a bit organic, and any small ridges and seams that I did not want to manually paint in Substance Painter.
The numbers and graphics for the dials in the upper right are separate floating decal geometry.
UVs and Material IDs
This model has multiple material IDs assigned to it. There’s a few reasons for this, the main one to keep texture quality high. Even if you create textures for a model like this at 4k resolution, you’ll still have challenges keeping the quality high, especially for areas that have text. Instead of creating UVs with varying texel densities and difficult organization, I used more than one material ID to assign appropriate pixel resolution to areas of the mesh.
In the animated image above, the polygon groups for each material ID is illustrated. There’s one additional material ID polygon group in the back of the mesh for the TV backing and antenna.
These material IDs are assigned to keep texel density / texture quality high for some areas of the material while still being able to keep texture resolution low and organize the mesh’s materials.
Texturing
This model is pretty simple when it comes to actual texture data. The material adheres to the common Metal-Rough PBR principled shader.
Substance Tools, Painter & Designer
In the past, 3D assets were textured in Photoshop. Even as ZBrush appeared and brought a few new texturing tools, Photoshop still continued to dominate as the go-to tool for texturing 3D assets. This wasn’t because Photoshop was ideal for texturing 3D models, but because there weren’t any better options available. Then the Substance suite of tools appeared.
What was different about Substance and Painter? Its advantage wasn’t painting directly onto a 3D model, there were already good tools out there that allowed that. Substance brought a large library of procedural texturing tools. Combined with baking and masking, the procedural tools in Painter and Designer brings creative artists to work much faster and easier than they used to. This means artists can create re-usable texturing tools rather than always hand-painting details.
Procedural Texturing Techniques
Easy to adjust, takes just a few minutes to initially setup endless effects using the procedural tools in Substance Painter.
Download the Finished Model
The GLB below was exported from Foundry’s Modo, and is downloadable for free below. The model is downloadable at Sketchfab by clicking here. You can download in GLB, glTF, or USDZ.
The In-Engine Assets
The Weak Signal Effect
The animated material on the TV screen isn’t a video or sequence of images. It’s two textures that are animated in the shader with texture coordinates and shader nodes that manipulate values over time in the game engine.
Before creating the shader, a few textures need to be prepared.
Display Image
The image on the screen is supposed to be the internal locking mechanism for the safe. To generate this visual, I created a mock scene in Modo and rendered a single image. I spent maybe 30-40 minutes creating this scene; it does not need to be perfectly photo-realistic or high resolution, because it’s going to be a small image on the TV screen; I’ll also be intentionally distorting it. The most important thing about the image is that it communicates that someone is trying to crack open this safe.
Using the red and green channels, I blend two black and white images into a single texture to save performance and make setup easier.
The Static Texture
I generated the static texture in Substance Designer procedurally. Designer has some built-in nodes that just about work right out of the box for this effect. I created the two distorted bars with a couple of simple shape nodes in Designer.
A specific thing done for this texture asset was to blend the two effects, each of which are black and white, into a single texture using the red and green channels. This makes it easier to setup and also saves performance for the renderer.
Though it’s only a simple Substance file, I also made it available to download here for free.
The Unity Shader
A baseline start
Because this is just a normal model with animated elements, the shader starts off based on the normal shader. Basic Metal-Roughness textures make up this material. The only difference is that portions of this material will have animated UV coordinates.
Animated Nodes and Textures
Using a couple of different engine timing nodes, combined with multiplication and step nodes, this data was used in a number of places across the shader graph for masking texture and animating UV coordinates.
The plugin I’m using to create these shaders, the Amplify Shader Editor, has a very useful couple of nodes for organization called the ‘Register Local Var’ and ‘Get Local Var’.
Using Amplify’s ‘Get Local Variable’ node, I’m able to retrieve timed mask data from across the shader graph. And with these timed masks, I’m able to create ‘switches’ using these values as alphas for a LERP node and multiplying over images, trading visibility with non-animated textures or the static.
It all adds up.
It may have been one small asset in the overall scene, but it contributed to the greater narrative.
