Art Asset Optimisation (Puzzle Blocks)
Up til now we’ve been focused on getting core features in and making sure the game is fun. We believe it’s rarely a good idea to pre-optimise, especially when you’re not sure if the feature you’re working on is going to fit nicely into the game.
We’re now at the point where the core features are in, the game is fun, and now we want it to run on as many platforms as possible making it possible for you to TopplePOP wherever you want!
Lots of platforms means lots of difference in hardware specs. While Unity does a decent job of allowing you to build to most platforms it still falls on the developer to optimise their game to not just run, but run well.
Our game before optimisation was quite cpu heavy & we wanted to look at moving some of that load over to the GPU as on most of our target platforms the GPU is proportionately more powerful than the CPU. I (Tim / t3rmi) have been working on Arena Environment art as well as Block art in this regard but for this devlog we’re going to focus on Blocks. The block prefab it the most heavily used in the game, We have one for each block/obstacle type in game.
I figured any cleanup done here would affect in-game the most, Shown Below is our prefab pre-optimisation. It was great when testing and prototyping new ideas as we could just drop in the new bits and see if we liked it, however as you can see below it made for quite a hefty pile of GameObjects.
[h2]Block Hierarchy Before[/h2]
Note: I’ve enabled and staggered the different layers so you can see the composition of the prefab, normally they’d be disabled/enabled as needed with most of the layers sitting at the same z depth.
We have a textured mesh showing what material type comprises the block(think wood/metal/stone), Thick outlines, Thin outlines, Intermediate outlines, Bold outlines, Some Fire/Ice/Bramble and other coatings we add to blocks as well as special effects particles & scripts to make the gameplay associated to all these bits possible.
Each block in game held all this info, all these meshes etc. and we figured we could do almost as much with much less.
We decided to move almost everything visual to the gpu using custom shaders, so instead of toggling GameObjects We could just fire value changes to the shader, This should reduce draw calls and definitely cut down on the GameObjects, triangle count and general scene complexity
[h2]Block Hierarchy After[/h2]
Here we have our optimised block prefab, it has a the majority scripts that used to be throughout the prefab now sitting on the root gameobject and a couple on the block_mesh itself, unseen here is a coating_mesh which is now created at runtime only as required by the blocks, Impbox also found savings to be made on the code side of things too including some bits that were redundant due to changes in approach.
Even before building the new shader, we noticed marked improvements in performance on our benchmark just from stripping away most of the GameObjects and moving to a much simpler base mesh, We settled on using a distance field texture for our block outlines, as it would allow us to change their thickness quickly and easily as well as being super cheap to get looking good
What is a distance field texture you may ask, For a more technical understanding you could read this but in regards to how we use them they look like a simple gradient shape as seen here
The interesting part is what it represents as data, brightness in this texture shown as a range from 0 (black) to 255 (white), with 127 being middle gray, if we color the middle grey with a red tint it shows us the original shape, each pixel value tells us the distance from the edge of the shape (127 = edge of the shape, 0 = far from the edge on the outside, 1 = far from the edge on the inside).
If we walk up and down the brightness values it gives us more indicator of how we can use a distance field for everything from exterior outlines to interior glows
The step cutoff is middle grey
Detailing the implementation of each effect into our block master shader could be a smaller devlog in itself as we employ different tricks to get the look we’re aiming for eg. We use a texture that looks like this (right) to make the blocks flash and pulse at the right moment to alert the player, We use screen-space coordinates on the ice overlay effect to fake the reflective sheen on icy coated blocks, we also use distance field texture quite a bit to mask features of the block as needed and to delineate between outline and inner (fill) of the block, the best part ? We can accomplish all of this on a few materials with a single mesh.
So with all these changes we’ve reduced render time, triangle count & draw calls as well as marginally increasing visual fidelity! The minimum system requirements are considerably reduced since the Demo release.
Overall we found great results in making these changes, allowing us more room to breathe on the CPU, allowing us to jam more fun stuff into the game, Regardless of platform you choose to play on :)
Let us know
[h2]How do you most want to play TopplePOP? [/h2]
[h3]
- solo, chill
- solo, competitive (leaderboards)
- local co-op, chill
- local vs. competitive
- online co-op, chill
- online vs. competitive
[/h3]
Pick one - Join our Discord and let us know:
https://discord.gg/4Ajzqepr
(otherwise a great game with a poignant story - worth playing!)
