I've been working on a LOT of different aspects of the game over the past few days so I have quite a backlog of things I want to talk about. it's now turning into a bit of a mountainous task to do the topics justice, but I'll be starting wiiiiith:
procedural colour palettes
yet another one of those things that had been planned from the very beginning. it's belonged to the 'visual pass' of the game that I was saving for later in development and I'm very glad I treated it as such, because otherwise I don't know how long it would've taken to build the rest of the game. the only downside is that when I came to it, the codebase structure and our art assets weren't so well equipped to just drop random colours into.
after a lot of back-and-forth before I settled on using SVG assets and
SVG Importer. the sacrifice that came with this was the loss of the original mockup concept of soft filters on terrain. however, what began as a compromise has now transformed into a very definite preference, at least on my end. we had some in-person feedback from somebody who mentioned they liked the 'flat' look, and initially I was just batting it away with 'yeah that's temp art', but the more I mulled on it the more I realised that the planned colour palettes, foliage, gradients AND image filters were just going to look messy. it's also an easy shortcut to 'ah yes. this game looks like it was made with Flash's built-in filters', which I'd rather avoid.
the reason this is relevant is that SVG Importer by default was lacking some things I found myself needing for the levels, namely non-additive alpha blending. we settled on having the layer of 'goopiness' be represented by a translucent SVG layer underneath the base terrain shape. here's an example of it in action with a test SVG file I'd been working with:
the issue with the one on the left is that if there are multiple rooms chained together, we can't guarantee that they'll link in exactly (plus it's just a bit of a nuisance to constrain level designs to always perfectly lining up). this means that we draw our level overlays with a bit of 'overdraw', i.e. they bleed into the next room's object space. it becomes very obvious to the eye that the game is a system of rooms if you can see where each area starts and ends like that, so I ended up writing a very small modification to a shader for the one on the left that uses a stencil buffer to ensure overdraw is accounted for.
for reference, the bright Wobbledog-magenta is recoloured dynamically in a second pass and acts as the 'highlight' layer to give some more ~sheen~.
combining this selective highlighting with the alpha blending above, I end up with just a single shared material for the entirety of the base level's structure, which is then tinted according to our base hue.
. . ¿ but what should our base hue be ?
I've had a few pages bookmarked on colour theory (and algorithmic palette selection) since the dawn of time and I was looking forward to finally getting to implementing the ideas I'd read in days of internet yore. initially I focused a lot on trying things out from
this article by Herman Tulleken (it's very thorough!), and was keen on the colour-harmony generator he'd posted. I think this is a great solution but I found myself feeling that it was 'over-parametrised', and ended up tinkering for perhaps too long. I also attempted generating schemes around pre-set triads (
here is a good page with a very nice intuitive guide to colour harmonies if you're unfamiliar). the problem with triad-schemes is that it gets increasingly difficult to ensure things amply contrast where they need to. when we already have background + foreground required to contrast, adding both traps - which players NEED to see - and foliage on top of that - which would be NICE to see - it gets tough to ensure something will work when randomised a little.
I went back to
another article he references that I'd initially avoided as it didn't seem flexible enough. it merely boils down to rotating around the imaginary hue wheel in golden-ratio steps to ensure colours are never too close to one another. it works out really well - consider that a full 180 degree shift (or + 0.5 on a 0-1 normalised range) around the wheel results in direct complementary colours, shifting by just-a-bit-over (0.618 . . .) ensures that things still complement one another, and won't just simply repeat in cycles of 2. I added some range restrictions on the hue to avoid murky greens on the background or garish yellows on the foreground and it's working quite well.
so almost everything is done in HSV space and then converted to RGB for Unity's internal purposes. just shifting hues around the spectrum isn't quite enough, though - I've been playing around a lot with randomised and tuned saturation + value params for individual items. the rough rule of thumb is 'objects have to stand out no matter what. foliage can be somewhere in between' - in other words, prioritise contrast over the exact hue or saturation associated with switches, flatgrass, etc. it's been a bit of a battle to keep things looking nice while being easy to distinguish at speed, and for certain items like the boosters I extended another shader so that I could specify an outline colour that then gets a darker value than the base colour:
a dynamic tint object, before and afterthe only thing that uses rgb-based randomization is the grassy foliage decals, which I've also padded out a bit with things like little mushrooms and swirly vines.
in the process I ended up refining the 'squish/push-able' script to be a lot more customisable. I've ended up being able to use it on most dynamic items in the game without it seeming recycled (hopefully). I'll put up a more in-depth post about it if there's any interest.
I have a feeling I'm not quite done in the colours realm but for now I'm happy enough to move on. SafetySnail is goin' bananas with room designs and we're clonking our heads together to try and get party rooms at the ends of levels. overall this game needs a LOT more balloons and novelty party items, is my feeling. RJ is also beat-tinkering behind the scenes and we're aiming to get an alpha video out in the world very soon!
--
Hey just dropping in 2 ur thread 2 say hi & that the grass & char movement looks rly sproingy & good.
thanks, snappo. I radiate waves of mutual appreciation out in your direction. ps I'm going to be living in california for a year starting this september, hit me up if ever want to literally high five or discuss shader internals in excruciating detail together!
Community
