Tabletop Simulator Guide

Asset Creation for Tabletop Simulator

Asset Creation

Overview

Extensive and comprehensive guide for creating high quality game assets for TTS using 3D Modelling tools, image editors and Unity.

Introduction

This is part one of an ongoing series of guides.
If you have no prior experience with asset creation or Unity this is the place to start, as most of the content here is aimed at beginners.

This guide aims to go over some of the rudimentary principles of asset creation, including modeling, texturing, and building complete assets using Unity. We use Unity for the sake of flexibility, control, and having all the tools available to us. By opting to use Unity you give yourself the freedom to largely expand on how you work with textures/materials, colliders, animations, sub/compound meshes, optimization, and a long list of Unity specific tools and options. In Part One I will go over how to create a basic set of tokens, tiles and game boards and try to cover as much of rudimentary mesh, texturing and Unity basics as possible.

Special thanks to Becca and John Wick for proofreading.

Software and Tools

Since this guide primarily focuses on creating assets rather than manipulating existing ones, you will want to set yourself up with some tools and applications.

Unity


Unity is what you will be using to build and compile your assets.
It is completely free – There is a paid version, but it does not offer anything that is beneficial to strictly creating assets. You will need the build corresponding to the version used by the game.
Currently we are using 5.6.2 which you can download from the archive
[link]

You will also need the TTS Modding Project, which is a save file that contains the editor scripts that you will need to build assets for TTS.
[link]

3D Modeling Software


Some of you may already be working in a program of your choosing and I am not going to tell you what you should or shouldn’t use. My recommendation for beginners would be Blender, which is free and open source, and does just about everything you would want it to. For everything pertaining to Meshes I will be using Blender in my examples.
[link]

Some alternatives are SketchUp, Maya, 3DS MAX, Cinema 4D. They all more or less do the same thing in similar ways, and it is not in my interest to dictate what you should or shouldn’t use.

Image Editing Software


Most of you are probably familiar with an image editor of some kind, and may already have a personal favorite. In my examples I will be largely using Photoshop CC, which I am personally happy to pay a subscription fee for. There are plenty of free alternatives however, GIMP being the most popular alternative which would be my recommendation here if obtaining a Photoshop license is not applicable.

Resources


Making your own things is great, but at some point almost everyone uses external resources to save time, achieve better results, or create something well beyond their own capabilities. Free resources that you are encouraged to use exist in a wide range of places for you to make use of. Textures, materials, sprites and various images are available across websites like [link] and [link].
Sites like [link], [link] and [link] are endless treasure troves of helpful tips, answers to questions, and information. Archives of Print and Play boardgames such as [link] have a ton of royalty-free game components for you to make use of.

I encourage you to utilize everything that is declared free and made for you to make good use of.
I however do not encourage copyright infringement, blatant theft or using tools and assets that you don’t have the rights to use. I understand perfectly that a large portion of content creation here revolves around making paid things accessible for free, but it is not in my interest to condone it.
As such, none of these guides will include the use of anything that is not accesible to the average user or is of questionable legality.

Meshes and Colliders

In the following examples I will be using Blender to create a set of tokens, tiles and a game board. I will largely go over how I am creating them, but it is up to you to learn the rudimentary principles of piloting your software, such as creating primitives, filling, extruding and scaling.
There is a vast ocean of guides, tutorials and information on the basic principles of those skills – make use of what is available to you.

Mesh Basics

I’ll be creating a circular token with hard beveled edges. Make a circle (Create > Circle). The resolution is on you, for very large and heavy games you may want to use a lower-resolution mesh. I’ll be using a 64-sided circle in this example. In edit mode, press F to fill, E to Extrude, and drag the extrusion upwards to form a flat cylinder.

For the hard bevels I’ll be holding down SHIFT+ALT and right-clicking anywhere on the top and bottom seams to select them both. Then I will CTRL+B to bevel and drag to form the size of bevel I want. For a smoother bevel, use the scroll wheel to increase the amount of steps.

To smooth it off I’ll be going in to object mode and setting the shading for this object to Smooth (Tools: Shading [Smooth]). I will also add an edge split modifier and leave the values at default to get the sharp edges I want.

Since our mesh is at 508 tris, we will need a custom collider for it, as the Unity collider resolution limit is 255 tris and we don’t want to be wasteful with collision detection and mesh sizes anyway. I’ll create a new primitive circle in Object Mode, but this time set the resolution to 16 sides. In edit mode, fill it and extrude it to be the size of your token. Because the collider’s geometry is far lower res than our token mesh, some parts of the token will bleed through. You can circumvent this by adjusting the scale of your collider mesh to make sure it covers the entire token, or more if you want a bit of padding on it.

I’ll be making another example to demonstrate how to use multiple meshes for self-contained objects. This is for mapping multiple materials, animations, or in some cases purely for workflow preference. Unity allows you to use many sub-meshes, materials and colliders and merge them all in to one self-contained object. Pictured is a token composed of 3 objects (+ collider), the outer ring and the two top and bottom faces split off in to their individual meshes (hotkey P on a selection to separate).

I’ll be making two squares/rectangles, one to use as a tile and another for a larger scale board with a border around it. Create a plane and extrude it to be as tall as you want it. In Edit Mode I’m going to select the corner edges and bevel them manually to create some rounded corners. I will repeat the steps we took with the circle to create bevels on the top and bottom. Just for the sake of learning, let’s go over what Edge Split does:

Edge Split allows you to mark edges as sharp and control whether they are smooth or flat without adding additional geometry. This is useful here because we want the outer faces to be smooth and rounded but our bevel edges to stay sharp. We could add or remove more bevels here to control how we want our edges to look, but for this tile we will just select the beveled edges and mark them as Sharp (CTRL+E) because low geometry and sharp edges is the desired result.


I’ll make a game board with a wooden border through a combination of extruding and insets. We want the border to wrap around the board surface, but we’ll separate the two in order to have a better time with our materials later. Now would be a good time to import your game board image as an image to overlay it as a guide. If your work revolves around textures with fixed proportions, then it is important to keep your meshes proportionate to your source images. You can always crop and scale later on, but in this case we want the both the border and surface to be proportionate and uniform.

I’ll be applying a bevel modifier to the border and setting the shading to Smooth. This will give it smooth, rounded corners after we’ve adjusted our values (to our personal preference).

Textures and UV Maps

UV maps are what dictates which part of your texture applies to what part of the mesh. How we go about unwrapping always depends on how we intend to texture the thing we are making. Our purpose can vary between repeating parts of an image, controlling seams, or for work with tiling materials (among other reasons.) You can easily wrap your head around how this works by just comparing your UV map to your mesh being flattened out, or like a wrapper around a present.

Pictured is a visual representation of 3 faces of a cube being unwrapped to match a texture with 3 (+1 unused) segments. The blue outlines in the UV editor represent your edges, the dots your vertices and what’s in between them the faces.

If we wanted the number 1 repeated across all faces then we would simply overlap them over the digit – the same part of the texture.

Multiple objects can also share a texture but display a unique part of it by mapping it to its respective area of the texture. This can be useful if you are repeating one part across all objects but need a unique section for another, and also for optimization by minimizing the amount of textures used. It is generally perceived to be better practice to use a single 4k sheet over four individual 1k sheets.

Since we will be using Unity and a sheet with our token sprites (contrary to the most common practice of using individual images per token) we have to unwrap it to work as such. With Unity we can do the reverse of the second example (limiting the faces to a part of the image) by having Unity effectively cut up the image for us instead. This way we only need to load in one mesh and one texture for effectively an unlimited amount of tokens and with a lot less work than manually assigning parts of the texture to faces on loads of objects.

For this to work we need to prepare our “sheet” of tokens. You want to divide your sheet into even segments with each segment containing the texture for our individual tokens.
Though this may look like it only works for even shapes and images, with a bit of math, scaling and cropping you can make tiling sheets for any asymmetrical/non uniform shape (e.g. rectangles or triangles) by scaling your mesh or limiting the UV projection on the face of the token to the aspect ratio of your images..

In this example I will be using a basic 2×2 sheet of fruits for our tokens.
I’ve added a small square in a flat colour in the corner of each segment to map a darker hue of our base colour to use as a unique colour for the border.

I’ve unwrapped the top and bottom face with Project from View.
Select the top/bottom faces, numpad_. [Del] and numpad_7 [Home] to align our camera, U > Project from View (Bounds) to unwrap from how we are currently viewing the mesh.
I’ve also unwrapped the border separately and scaled it down to fit in the small square in the corner. Since this is a flat colour, the resolution, shape and unwrapping technique don’t matter here. I will go over other unwrapping techniques further into the guide.

I’ve extracted a single segment of our texture to line things up for demonstration purposes. This can help if you are dealing with narrow cropping margins, but in this case is more or less just for show.

Let’s take things into Unity. You will need to export your Token mesh and Collider, and have your texture (sheet) available as a flattened image or PSD. To simplify we will be exporting our two meshes separately as OBJs. You can also use FBX, STL and a multitude of other formats, but we’ll get into that later. Select your token and navigate to File > Export > Wavefront (.obj). In the bottom right you will have a set of export options. Since we just want the token, tick Selection Only to only export the object you’ve currently got selected. We also want to Apply Modifiers, Include Edges, Write Normals and Include UVs. Keep everything else turned off – you do not need to triangulate because Unity will take care of that for you. Export it to anywhere that you can easily find and access later. Repeat this for the collider.

You want to open up Unity. You will be prompted to log in if you haven’t already. Log in (or register) and find the TTS Modding Project you downloaded earlier. Extract it to a convenient location and open the project with Unity. The project tab is where you will be managing your things > you can create a separate folder for your tokens here. Drag in your exported tokens and textures.

Drag the token into the 3D view. You’ll see it on your left in the Hierarchy tab, labeled as whatever you named it (extra: this will wrap your mesh in an empty game object; if you expand it you will see your mesh as a child object named “default”. More on game objects and hierarchies later.)

Right click anywhere in your project and navigate to Create > Material. Name it what you want, but I would recommend using a naming scheme that goes “name_number (fruits_1)” because Unity will handle numbering for you when duplicating materials (fruits_1 turns into fruits_2). Select your new material. A bunch of properties will appear in the inspector. You want to drag your material into the Albedo field, which is your Texture/Diffuse.

Now for some very basic math. In our example we are using a 2 x 2 grid. Divide 1 by the amount of horizontal tiles, in this case 1 / 2 = 0.5. This value goes into the Tiling X field. Same goes for Tiling Y, because our sheet is even. We can now add offsets in increments of 0.5 into the X and Y offset fields to choose which part of the texture to project. X: 0 and Y: 0.5 will be our starting image in the top right.

Drag the material onto your token in the 3D view (you can also apply materials to meshes in the hierarchy or with components). Now you can duplicate (CTRL+D) your token in the hierarchy and also duplicate the material we’ve made. Hotkey W to move your object if you want to lay them side by side for a better view. On your second material, change the X offset to 0.5. This moves your texture over one step to the right. Drag your second material on to your second token, and then repeat for the next two (X:0, Y:0 for the third/bottom left, X:0.5, Y:0 for the fourth bottom right).

Multiple meshes and materials

Let’s go back to our token comprised of multiple meshes that we have open in Blender. The top and bottom face are separated in to their own individual objects. For the ease of unwrapping, we can merge the top and bottom by selecting them both and pressing CTRL+J.
In edit mode we want to repeat the steps we took in the basic token to Project from View our faces to fit the tiling material. I want to apply a more intricate material around the edge of this token, so it needs to be unwrapped in a way that works with something like a seamless metal or wood texture.

Alt+Right Click on a set of edges going vertically to select the entire loop and press CTRL+E > Mark Seam to mark it. If you now select it (hotkey A) and hit Unwrap (U > Unwrap) it will unwrap these faces in a straight line. Here I would strongly recoomend a plugin such as UVSquares (if you’re using Blender) to straighten out your UV projection and align it to span the entire UV grid.

Make sure you’ve separated the top and bottom face. If you wanted to you could label your individual objects as to having an easier time distinguishing between them inside of Unity. You can do this by double clicking on the object in the Outliner tab (top right by default) and giving it a new name. Back in Object Mode, hit A to select all objects and export them, but this time as FBX. Tick the “Selected Objects” box and export them, straight in to the Unity project is fine.

For this example I’ve downloaded a seamless “Leather” texture to apply to the border (refer to the resources section in the Index for places to find textures). It’s maybe not a perfect fit for this “Fruits” theme, but it will do for our example purposes. Repeat the previous steps you took to get your token in to the Unity 3D view. We’ve already got four unique materials set up, so we will be re-using these, except this time we will drag one to the top face and the other to the bottom. We also make a new material for the leather and apply it to our edge mesh.


Extra: If this texture is seamless, then you can increase the Tiling X and Y values to repeat it. This is often used to get more detail out of a lower res texture, because it’s seamless it won’t create any seams and you can increase the tiling amount until you’re happy with the result. This is especially useful for large surfaces like floors that would otherwise need extremely large textures to look nice and sharp.

Material Properties

Here I will briefly go over the material properties inside of Unity and what kind of maps they use and need. I will primarily focus on the default Unity shader.

  • Albedo
    This is your diffuse/texture field and also your base colour and alpha. You can overlay a colour over your image texture, though this will be less apparent the closer to black your texture is where as pure white will appear as the colour you’re applying.

    The Alpha channel only applies if the rendering mode is set to transparent or fade and in that case controls the transparency of your material.

    Extra: For transparent materials that can be tinted in-game, set the alpha in your material rather than inside Unity because in game the Alpha channel will be set to 255 and is not adjustable.

  • Metallic (Smoothness)
    This controls metallic and smoothness properties, in short how metallic/reflective your material is.
    You can apply a Metallic/Smoothness map to control it with textures, useful for mixing matte and glossy, or control it using the sliders to apply an overall Metallic/Smoothness.

  • Normal Map
    Normal and Bump maps create depth using a texture rather than mesh geometry and can be useful both for detail as well as for rounding and smoothing meshes without adding heavy geometry. Example cases are inset or extruded text/icons or retopology (baking normals from, for instance, a sculpt onto a low poly mesh to create the detail with a texture). Unity can also generate normal maps from grayscale, which can save a lot of time if you’ve already got textures to work with.

  • Occlusion
    This field is for occlusion maps, which are generally black and white images used to darken areas such as crevices and edges where light would have a hard time getting to. Commonly used to mimic the effects of SSAO without using up much more resources than a texture.

  • Secondary Maps and Detail Mask
    These fields are used to overlay a second set of textures. The detail mask allows you to mask off areas. This is most commonly used for secondary detail that would otherwise be impractical to apply on the main textures.

  • Emission
    Emission controls the amount of light your material should give off, i.e if you want it to be self-illuminated. In TTS the emissive material will not give off light like a light component would, but rather appear to be self-illuminated and bright even in low light environments. Can either be used with colours or controlled with texture maps.

Unity Components

Unity components allow you to add additional properties to your objects. This includes all sorts of things ranging from rudimentary must-haves like colliders and animations to dynamic lights, reflection probes and particle systems. Here I will cover the basic use cases and apply them to our example components.

Colliders

Colliders are used to define the shape of an object for physics and collisions. Sometimes the game/engine will try to automatically generate one for you, but this doesn’t always work and it is rudimentary practice to learn how to make your own.

In this example we will apply the collider mesh we built earlier to our token.
Select your object and in the Inspector tab (top right by default) press the Add Component button. Navigate to Physics and select the Mesh Collider component (you can also search for the component you want). Expand the collider object in your project tab (arrow pointing right) and select the mesh (the mesh will usually stand out by having triangulated edges visible across it). Drag it in to your mesh field of the component as pictured.

Individual mesh colliders are limited to 255 triangles, but if you need more then you can add multiple colliders on child objects. Single concave colliders will tend to not work unless the object is locked in game. This means that you can not make a box that will hold items in it with a single mesh collider (unless it is locked in game). We can however work around this by instead using multiple primitive colliders to form the walls with a gap in the center.

Colliders can, as all game components, be enabled/disabled using the assetbundle scripts and also be animated. You can utilize this to create physics interactions between objects, as pictured a box with a lid that closes and doesn’t allow you to put more objects in unless opened.

Unity offers a set of primitives to use for colliders, though the benefit of using them over making your own are endlessly debatable. For an accurate collider your best bet is always to build your own low poly mesh, but if you’re just making a ball or a cube then the primitives in Unity could be the way to go.

Trails and Lights

These are two fairly niche components that can be used to add some extra visual flair to your objects or scenes. Trails are fairly self explanatory – this component leaves a trail based on it’s assigned material.

The main configuration options are:

  • Materials
    You can assign one or multiple materials to your trail. This works much like assigning a material to any other object except applied to the rendered trail.
  • Time
    The life time of the trail – higher values will have it stick around for longer
  • Width (curve)
    This is where you assign the start, stop and in between size of your trail. You can add more keys to the curve to control it’s size throughout it’s lifetime.

Lights come in four different types.

  • Point lights emit light in a spherical radius from a point.
  • Spotlights project a cone of light in a direction.
  • Directional light can be thought of as global lightsources that emit the entire scene.
    I will not be covering these in this guide as they are best used in more advanced projects with full environments and reflection probes.
  • Area lights emit light uniformly from a rectangle.
    I won’t be covering these either because they also require a fair bit of finessing to prove useful at this point.

The main lights that you would be using for your components would be the two self contained types, point and spotlights. In the editor they project a radius which is as far as the lights extend. This can also be adjusted through inputting set values in to the Range field.
Intensity controls the strength and colour the colour it should emit. For most purposes such as emitting set areas with light of certain colours you would use point lights, as they are flexible and can be attached to objects and moved around. For more thematic lights, maybe for a theater or stage play setting, spotlights could be used for effect.

Particle Systems

Particle systems are a component that spits out a sprite, in a controlled manner or if you’d like, in a controlled chaos. This type of component is very useful in creating moving things such as flames, shooting stars or throwing glowing blobs in all directions. This can be an extremely in depth topic and a component that I believe is best to learn by trial and error. Pictured is a very rudimentary example using a blurry dot as it’s input material.

Building AssetBundles

Combining the things we’ve learned so far, let’s finish up the last few assets we were making.

Our square tiles and our game board will need a set of colliders. Our square tokens are simple, we probably don’t need to worry too much about the rounded corners so we will just export squares proportional to our token. For the board, we can assume that it will be locked down, so having concave geometry on our collider will work. But we did apply a modifier to smooth it out and it is comprised of multiple meshes, so we definitely want to make a custom collider for it. We can mimic the shape of the mesh as it will appear when merged by creating a rectangle, extruding it upwards, making an inset according to the size of our face, and extruding it back down.

Tip: Bevels and Insets will apply based on the scale of the mesh. To apply your new dimensions as the default so as to keep things uniform, go into Object Mode, select your mesh, and press CTRL+A > Apply > Scale.

I will be reusing the materials we used for the tokens and applying them to our square tiles, because the principle behind them is the same. The board is unwrapped with all the pieces facing one direction (the direction of the wood grain) in the UV map. I’ve went ahead and downloaded a wooden texture as well as created an image to use for the surface face. I’ve adjusted the metallic/smoothness properties to my liking and also dragged in the face texture image into the emission field with the value set to 0.25. This will make the wood a bit more shiny and the board face brighter to make it stand out, even in lower light environments. We should also set the scale of our object, preferably as close to the size we want them in the game. We can add adjustments in-game later, but the scale of our objects affects things such as the vector paint and sizes on import, and can also matter for scripting that deals with sizes.

Tip: It is true that in certain material workflows, certain properties such as metallic should always be either this or that, 1 or 0 . This is a very extensive topic on materials and their properties that I will cover in later guides, but for now I will stand by this: For nearly all of your asset creation for tabletop simulator, you do not need to care at all about these rules. Chances are you are not using anywhere near enough tools, maps and settings for which these rules become relevant. This introduction to asset creation is not to teach you the utmost intricacies of asset creation but rather to give you an overview of what you can do to create visually appealing assets. Use any values and properties that you like, so long as they achieve a result you are happy with.

Our assets are done, so we can now assign them to prefabs and build them into assetbundles.
To do this we drag the object out of the hierarchy into the project tab to create prefabs out of our game objects. We want to select our individual prefabs and assign them an assetbundle name in the Asset Labels window (under preview by default). For optimization purposes, we also want to select all of our used materials and assign them to one assetbundle name.

By doing this we avoid duplicating the texture on load and instead only export mesh data in our object assetbundles. The material assetbundle contains our textures and material properties and doesn’t duplicate anything that isn’t unique. If you didn’t build a separate assetbundle for materials, the texture would be duplicated for every unique object, being heavily wasteful in terms of memory usage.

Right click anywhere in the project tab and select “Build Assetbundles” from the dropdown menu to build your bundles. Since your objects now only contain mesh data, on import we need to assign them the material assetbundle as our secondary.

Tip: If you put your components in your caching folder [My GamesTabletop SimulatorModsAssetbundles] you can import them using only their names rather than full paths as pictured.

And that concludes part one of the asset creation guide. We now have a set of high resolution, optimized and custom built game components, and the total size (if we’re to exclude the largely unecessary leather and wood material) comes out to only 206KB.

[ PATREON ][www.patreon.com]
Special thanks to my (current and past) Patreon supporters for supporting my projects:

  • Jeremy. S
  • Platypus
  • Corrodias
  • Ash Black
  • Connor

Official Discord: [link]

SteamSolo.com