ZIndex Surfaceappearances

This is a refined repost of my initial suggestion in 2022. If you wish to see, please follow this link:

Layer UV Mapped Textures + Change Color3 Values - Feature Requests / Studio Features - Developer Forum | Roblox

I also believe that this post covers the same topic: Add ZIndex property to SurfaceAppearance - Feature Requests / Engine Features - Developer Forum | Roblox

Currently, it is too difficult as a Roblox developer to create customizeable characters using SurfaceAppearances. To create a customizeable character where you can customize different coat colours, patterns, etc. it requires you to take one of two approaches:

1.) Splitting parts, which results in visible seams within the mesh, multiple ngons (in certain instances), and a messy, destructive workflow where re-weight painting etc. is not possible without re-combining the mesh and splitting it again.

Split mesh example, where you can see visible seams within the mesh (note the little sand-colored pixels, this effect becomes even more apparent when the mesh is deformed or with a non-flat texture.

2.) Layering pieces ontop of the base model to give the illusion of the model having markings

Layering pieces example from Warrior Cats: Ultimate Edition , note the floatiness of the mesh, as well as the addition of more triangles to add markings.

To fix this, implementing the ability to add multiple ColorMap texture SurfaceAppearances with a ZIndex feature is the way to go.


My project, Wolf Story

I am creating a project called Wolf Story with @iiau , and due to the destructive workflow and overall “wonkiness” of implementing customization features, we have decided to go with a “skin” system, where you can select what coat you want your wolf to have, and then can change its color based on the newer SurfaceAppearance Color3 option.


Two different Color3 values, first being 255, 255, 255, and the other being 255, 234, 193

Using this approach, however, we are unable to attain the level of customization that games such as Warrior Cats: Ultimate Edition has. What if somebody wants to colour the underfur (the white components) of the wolf a different colour than the body (gray components)? By using Color3 on SurfaceAppearances, you’re able to get the entire wolf to have a “brown” tint, but you’re unable to leave the white parts the way that they are, as they also receive this tint.

By having multiple SurfaceAppearance ColorMaps (with transparent backgrounds on where the markings shouldn’t be), and a ZIndex feature, it’d be possible to layer these markings ontop of each other, allowing the user to customize their wolf exactly the way they want it.

With this feature, you could also achieve different effects like easily being able to put moss on trees without making two different bakes, creating different “makeup” options for custom humanoid models, and much, much more.

I’ve been wanting this feature for years. Please Roblox, allow me to create my dream game. :slight_smile:

9 Likes

The request to add a ZIndex property to SurfaceAppearance highlights a significant limitation in Roblox’s current rendering pipeline for customizable characters and complex models. SurfaceAppearance was introduced to provide physically‑based rendering (PBR) capabilities, allowing developers to apply realistic textures such as color maps, normal maps, and roughness maps. While this system greatly improves visual fidelity, it lacks layering control, which makes it difficult to achieve certain customization workflows.

At present, developers attempting to create customizable characters with multiple coat colors, patterns, or overlays face two problematic options:

  • Splitting parts: Developers divide meshes into separate sections to apply different SurfaceAppearances. This results in visible seams, introduces ngons, and creates a destructive workflow where re‑weight painting or mesh recombination becomes necessary.
  • Workarounds with decals or textures: Some developers attempt to overlay decals or use alternative texture workflows, but these approaches often fail to integrate cleanly with PBR shading and can cause performance or visual issues.

Both approaches are inefficient and limit creative flexibility. Without a ZIndex property, developers cannot control the rendering order of multiple SurfaceAppearances, meaning layered customization is effectively impossible.

Key points to consider:

  • Workflow efficiency: A ZIndex property would allow developers to stack multiple SurfaceAppearances on the same mesh, controlling which texture appears above or below. This eliminates the need for destructive mesh splitting.
  • Customization potential: Developers could create characters with interchangeable coats, patterns, or accessories by layering textures. This aligns with modern game design practices where customization is a core feature.
  • Consistency with UI systems: Roblox already uses ZIndex extensively in UI design to control layering. Extending this concept to SurfaceAppearance would provide a familiar and intuitive workflow for developers.
  • Industry standards: Many engines (such as Unity and Unreal) support layered materials or texture blending. Adding ZIndex to SurfaceAppearance would bring Roblox closer to these professional standards.
  • Implementation feasibility: Since Roblox’s rendering system already handles draw order for UI and decals, extending similar logic to SurfaceAppearance is technically achievable. It would involve assigning a render priority to each SurfaceAppearance and resolving conflicts based on ZIndex values.
  • Community impact: Developers working on avatar customization, creature design, and stylized games would benefit immediately. This feature would reduce friction, improve creative freedom, and demonstrate Roblox’s responsiveness to developer needs.

It is also worth noting that this change would not negatively impact existing workflows. Developers who do not require layering could continue using SurfaceAppearance as they do today. The addition of ZIndex would simply expand functionality for those who need it.

In summary, adding a ZIndex property to SurfaceAppearance would resolve current limitations in character customization, align Roblox with industry standards, and provide developers with a powerful new tool for layering textures. This adjustment is straightforward yet impactful, and it would be welcomed by the community as a meaningful enhancement to Studio’s rendering capabilities. By implementing this feature, Roblox would demonstrate its commitment to supporting developers with tools that meet professional expectations and enable modern game design practices.

3 Likes

You can use editable image for that
Although would be nice to have and maybe add support to 2D clothing aswell

2 Likes

You literally can’t.

Yes, with EditableImage, you can “draw” on a pre-existing image in Roblox, but there is no way to create an image in a software such as Photoshop and layer that ontop.

1 Like

You can create SurfaceAppearance using EditableImage
You literally CAN combine 2 EditableImages
https://create.roblox.com/docs/reference/engine/classes/AssetService#CreateSurfaceAppearanceAsync

If it is possible, I’d like to know more about this, but to my knowledge, it most definitely is not.

My models use a texture that follows along a UV map that I created in Substance Painter.

Is there a way that I can use two images, one for the “base” coat, and then add another image “ontop” of that for something like stripes?

I’m not talking about manually editing the image within Roblox Studio, I’m talking about creating a secondary texture layer like this in Photoshop or Substance Painter.

Additionally, changing the Color3 value of the specific stripes separate from the base coat.

you can use editable images to do that, but the downsides is that youd have to create your own replication system for it, it takes up more memory than normal images and editable images are kinda just slow. Also if you have multiple meshes that you want to use that with, unless the image resolutions are low, youre going to run out of memory really fast.

CreateSurfaceAppearanceAsync isnt recommended to be used in live experiences for performance reasons and is really just made for plugins and custom UGC

Fair enough, and in this case, this feature is still necessary.

It’s also worth adding that your game has to be 13+ to even enable EditableImages.

the only workaround for this is using specialmeshes + decals (which support zindex AND it’s applied to the whole mesh), but it lacks mesh deformation

2 Likes