Video Tutorials
Intro v1.0: https://youtu.be/ZZqfEP5MJJ8
Tutorial v1.0: https://youtu.be/U2GQvL8_dJ8
Getting Started
This pack is the result of a study into how World Of Warcraft renders their customizable characters and npcs. Complete character textures are only generated at runtime and exist on the GPU. The images which are saved to disk are smaller images, such as ArmLower or Hand.
Here is an example of an _ArmLower.png file which is 512×256 pixels:
And a _HandGloves.png file which is 512×128 pixels:
These smaller images are then “Layered” on top of the base texture which is 1024×1024 and put into Slot #1 and Slot #2 and the pixel data is copied using a Graphics.Blit shader.
The complete character textures are not typically saved to disk but exist on the GPU as a RenderTexture at runtime. This is the best approach as there’s no need to create a new image file every time the player changes a clothing item.
Change your character’s skin colors, scars, tattoos, hair, facial hair, eye color, jewelry, clothes, or anything that could be drawn to a texture. Your characters will start off naked/underwear as a base texture and then have all the various options layered onto that base texture. You might apply tattoos first, then clothes, then jewelry, and finally items like boots, gloves, belt, and cape can be drawn last.
Textures are layered similar to how Photoshop layers work but by using a special shader the GPU can perform the operation to merge these layers into a single texture on the fly. The final RenderTexture is only re-computed when a change is made to the outfit, so performance is synonymous or better than using a regular Texture2D.
Create randomized outfits & characters, procedurally generate a population of people all with unique clothes, skin tones, and accessories!
| *** Skin Tone changes are typically achieved by changing the full Base Texture. *** |
Terminology
Texture Stack
A “stack of textures” that covers an area of the Base Texture. Texture Stacks define the position, width, and height of an area. In World of Warcraft’s example above, there are 10 Texture Stacks named Arm Lower, Arm Upper, Hand, etc.
| *** The shader has a limit of 10 Texture Stacks, if you need more than 10 contact support. *** |
Texture Layer
A Texture Stack can contain as many Texture Layers as you want. A Texture Layer contains the actual Texture2D image which will be applied to the Stack’s width and height. Texture Layers would typically be Tattoos, Clothes, Jewelry, etc.
Texture Builder Window
- Select Window > Character Texture Builder:
- Texture Builder Window:
- Main Settings
Base Texture: Set your Base Texture / skin tone image.
Pixel Snap: When moving Stacks with the mouse, snap position to a pixel grid.
- Create Texture Stack: Create a new Texture Stack of size: width and height.
- Texture Stack Settings: Settings for the currently selected Texture Stack.
- Live Preview: See the final texture generated based on current settings.
- Texture Stacks: A list of all the current Texture Stacks.
- Texture Layers: A list of each Stack’s Layers and corresponding Texture2D field.
- Editing Zone: Here you can click and drag to move Texture Stacks into position.
- Click the Live Preview button the preview what the finalized texture will look like:
- To apply the texture to a character, call TextureBuilder.Instance.BakeTexture();
This function returns a RenderTexture so you can set a Material’s MainTexture to this function:
| characterMaterial.mainTexture = TextureBuilder.Instance.BakeTexture(); |
* An example of this can be seen in the Demo Scene and TextureBuilderTester.cs
- All of the Texture Stacks and Layers have been rendered into a single texture:
Scripting Reference
Structs
| struct TextureStack | |
|---|---|
| string Name | A name to identify each area (Head Chest, Arms, Legs) |
| Color InspectorColor | An inspector color for each area to differentiate between areas |
| TextureLayer[] Layers | How many layers are needed? (Tattoos, Clothes, Jewelry, etc) |
| RectInt Rect | Predefined rect based on position and size values |
| struct TextureLayer | |
|---|---|
| string LayerName | Identifier for each layer (ex: Tattoos, Clothes, Jewelry) |
| Texture Subtexture | The subtexture which will be copied to the final texture |
| bool HasError | Does the subtexture have an error that prevents rendering? |
Classes
| ScriptableObject TextureBuilder | |
|---|---|
| ScriptableObject Instance | You can access this singleton from anywhere using TextureBuilder.Instance |
| Texture BaseTexture | Character’s base texture / skin tone. |
| Material DrawMaterial | Material used to draw the final image |
| TextureStack[] TextureStacks | All the Texture Stacks defined in the Texture Builder Window |
Functions
| TextureBuilder.cs | |
|---|---|
| RenderTexture BakeTexture() | Bake the final texture based on current settings and return a RenderTexture. |
| Example: characterMaterial.mainTexture = TextureBuilder.Instance.BakeTexture(); | |
Upcoming Features
- Outfit Manager: Create some way to create outfits: clothes that go with each other. A tuxedo or dress will span across several or all of the Texture Stacks and there needs to be a way to “add tuxedo” outfit without manually assigning every piece of it.
- More C# functions for getting & setting Texture Stack and Texture Layer variables.