Asset Creation Approaches

Palette Texturing

Palette texturing is a technique that allows you to add color to an entire asset with an extremely small texture by applying the UVs into the small texture. The texture being used in the example below is a 16x16 pixel image which comes up to a whole 1Kb of filesize.

Depending on the asset in question, you can increase the polycount (within reason) to add more color definition. It uses polygons in order to create the ink lines, rather than relying on textures to do so. That said, a VRM has a little more room to move on poly count than a simple asset in a space.

In the case of extremely small textures like this one, you may need to make sure the texture turns the filtering off in the target platform (the Imported Unity texture for example) otherwise the platform may add a blend between colors automatically (unless you want that of course!).

Gradient Texturing

The evolution of this is creating a texture of number of gradients that you can use to texture your asset. This allows some extra detail in the color, but keeps the filesize quite low.

The following comes in at 12.6Kb in total. If you made all your assets with this one material, your total experience would have a significant file size decrease.

It is surprising the results you can get with this when using the gradients and UVs in interesting ways. As you are using significantly less resources in filesize/materials, you can push the polycount a little further in order to apply the texture creatively.

The following example takes a very simple gradient like texture and applies it to three different assets. The Rectangular door is the top, Arch the middle, and Oval the bottom UV example.

As you can see in the oval example, it uses only flat UVs. Only the corner gradients (on the Rectangular and bottom of the Arch) require the full texture, most of it could be done with a single pixel gradient. That said, the corners could also be done the same way with a little more creative use of UVs.

PBR Functionality

The next version would be to have the same colors, but different finishes such as matte, polished or metallic. Allowing one model to have a large number of colors and finishes but using one texture. All assets in the room below, and the room itself, use the same single material. This includes the metallic sink assets through to the matte bed spread.

You could of course add Emissive elements as well in order to have all the possible features in your space.

Decal Texturing

Decal texturing (not an official label, just the best we could come up with!) is a mix of Palette texturing and trim sheets in a way. Part of the texture is the Palette, Gradient, or PBR texture approach, and part of the texture includes art are that can be placed on the asset like a decal.

This approach would allow for a lot of colors and finishes, but also allow for key art, logos or data in the asset as well.

Summary

Palette Texturing is a fantastic approach to asset creation, especially if you are creating a lot of assets to use in a Mona Space as Unity can combine all your resources together if they are using the same material, reducing draw calls, and therefore running the space better. As they are all using a texture that is very small, the filesize is also quite small in comparison.

For more information on Unwrapping UVs, check out the Applying Materials & Unwrapping UVs doc.

In a Mona space, reducing materials is a very important approach to improving how a space works in a browser as this reduces drawcalls.

A drawcall is the number of things that the computer has to call on the computer to draw something. This includes things like models and materials. So trying to create assets with as few materials as possible is a great technique for optimisation.

Most AAA games use this technique a lot on environment assets in order to have fantastic quality, save time on development, keep assets together with a set theme, and many other reasons.

The Trim Sheet Texture

As an example, lets look at a simple texture that was made in less than an hour using Blender for the base shapes, then Substance Painter for the textures, as a quick example of how to use it in interesting ways. This texture has diffuse (2048x2048), metallic/smoothness(1024x1024), and normal maps (2048x2048).

Of course how you create your Trim Sheet is up to you. Some people use ZBrush, others use the 3D Creation tool such as Blender, Maya etc. entirely. Whatever creates the assets that you want to add to your 3D asset.

The main thing to consider is that if you are tiling in any direction such as vertically or horizontally, the edge will tile smoothly. This will allow you to extend your 3D asset polygons across that border without issue. Assets do not need to be in the 0-1 area (the square that most 3D applications use when unwrapping objects) of a UV map, so by positioning / rotating / scaling the UVs in interesting ways you can create fantastic assets with a lot less information. That said, a texture could tile vertically, or not at all, depending on your needs as a trim sheet.

Applying the trim sheet

Once you have one or more trim sheets to apply to your asset we can unwrap the asset UVs to assign the texture to the polygons on the object. By doing this we can use the one texture to create entire assets without too much hassle.

If you look at the unwrapped UVs of the asset it does not look like it makes much sense, but in this approach the result is more important. And each section of the asset needs to be considered separately.

This is of course a very different process than that used for 'hero' assets that have all of the asset within the 0-1 area of the model. This approach allows for more unique assets, but requires a lot more time in creating those assets from both the modelling, unwrapping, baking etc.

Every asset requires consideration on what is the best technique for that asset. Things like buildings and simple props in a space are fantastic use cases of using Trim Sheets. Things like characters, statues, and unique assets with custom details are usually created with their own textures as Hero assets.

Examples

For an example of professional use of trim sheets you can look at the following example by Tor Frick. This takes trim sheets to the next level using very few textures to make whole environments!

Resources

GrabDoc

A useful tool that allows you to bake trim sheets within Blender is GrabDoc which you can find here. For more information, including how to sculpt the trim sheet details, check out the YouTube video here.

Sculpting

Digital Sculpting is possible in applications like ZBrush and Blender. It can create amazing assets much like traditional sculpting, the catch is it is done with millions of polygons therefore the final result would need to be optimised for use in target Platforms like WebGL, Mobile and standalone VR/XR.

Optimisation approaches for sculpted asset usually include tracing the asset as a low poly model (also known as retopology) and then baking the high polygon detail into the Normal Map texture. More information on this approach can be found at Optimizing your Mesh.

Subdivision

Subdivision is an extension of Sub-D modelling in that you model an asset but then add subdivision to make it super smooth. Along with sculpting, this will usually end up with millions of polygons and therefore require optimisation approaches. As the original model is already made, there is a reasonable change that you could utilise the unsubdivided model and bake the high polygon details into the low polygon Normal texture. The result looks the same, but has significantly smaller polycount for a larger filesize (due to the included normal map texture).

One thing to note is that the layout of polygons plays a significant role in the result of the higher subdivision and can be a whole skill in itself.

It is possible to create 3D assets with AI such as Stability.ai, or Luma AI. At the moment the assets may not be that optimised for a WebGL space, so this doc will go over some considerations when using AI based 3D assets.

Stability AI has the advantage of utilising images to create assets. So with a good reference images, either created yourself or using 2D image generation you can get better results.

If you want a tutorial on how to set up Stability.ai 3D Assets, you can go here for more information. Do note that you will install it on your own computer, and a 24Gb VRam graphics card is recommended (but not required).

AI Assets

As you can see in the examples below the assets look great from a distance, but once you get up close the quality starts to break down. The following examples use Luma AI, but similar considerations should be looked at with any AI generation tool.

The texture is also less optimised with wasted space on the texture, wasting valuable filesize.

The polycount and edgeloops are not really considered in the creation of the assets, and can therefore be significantly optimised in order to reduce the filesize and improve how they work in a space.

That said these assets can be fantastic reference, and depending on the quality of the original asset, there are a number of approaches you could use to create the optimised version.

Reference

The first approach that will usually create better results but over a longer time frame, is use the AI generated 3D asset purely as reference. You can use the asset to help guide the creation of a better high polygon asset, or a refined version of a low polygon asset. Basically, this would speed up the creative process so you have to spend less time figuring out what you want to do, and get to the doing part.

A benefit of this approach is that you can then take the time to improve on the design of the asset as you go, focusing less on the general details and really refine the details.

This also means that the end result is more yours rather than just the AI's (or the original artists in the database more the point).

Optimising the mesh

If the AI Generated asset is exactly what you want, but you still need to optimise it, the approach would be to create an optimised asset and projecting the original asset data onto the optimised mesh. The approaches to this are covered in the next tutorial category, and cover Decimation, Remeshing, Retopology, and Baking.

This asset example used retopology and baking the diffuse and normal map to get the polygon count from 9089 down to 52 (in the lowest example). the lowest polygon asset would look fine from a distance, but you could use the higher polygon assets with Level of Detail tools in Unity. If you save the assets like the following :

Temple1_LOD1
Temple1_LOD2
Temple1_LOD3

When you import all three fbx files as one model into Unity it will automatically create a Level of Detail asset, and switch between them at different distances from the camera. So at the cost of filesize for the extra meshes, the asset will be significantly more performant at distance.