WebGL Buildings and Props
Making games for WebGL means our limitations are more than normal PC or Console games. We've chosen to optimize our assets using trim sheets and a custom vertex recolor shader to greatly reduce our texture footprint. Each building type shares a diffuse and normal map, hero props have the same, but 90% of our props all run on a single shared texture set and all our assets leverage vertex colors so we don't worry about color variation in the texture.
All buildings and half of these props as well as the custom shader were created by myself for our studio.
Home furniture props were made with the support of Vaikunth Raghavan.
Modular building shells for backgrounds.
You can kitbash the parts together into a wide variety of houses without getting too into the weeds because the chunks are still pretty large.
A fishing dock with nets and some more shell buildings in the background.
Food props made all sharing one 2k texture sheet.
These books and paintings all use this single texture and clever UV unwrapping.
warehouse props
home furniture props
Because we want to limit our memory footprint, we leveraged a vertex color shader to apply color tints to a wide variety of objects that use simple trim sheet textures.
90% of the props in our game all share this generic props texture and use an instance of the vertex color material to add color on the fly.
An overview of the 6-way color mask nodes. I mask out each color range of RGBCMY and then add white at the end, otherwise the color tint will be too dark.
Close up on a single channel mask.