Dealing with Discoloured Assets

First Written    Sun Oct 17 04:56:23 2021
File Modified    Wed Feb 14 18:32:26 2024
Latest Upload    Thu Sep 19 03:09:54 2024

In 2020 and the age of the pandemic, I colonized a spare room in our house to have a second desk for work (leaving the one in my room for gaming and socializing). This was a great move for work-life balance and having physical separation between the two, but it had an unfortunate side effect:

The monitor on my work desk did not have accurate colour.

This was a problem, because I didn't just use the new desk for my day job, but for working on personal projects too. Any games and art I worked on were affected, and I realized far too late.

My solution? Lay a filter over everything!

Here's a screenshot from my work laptop's monitor, showing dim and dull colours. The spare monitor I was using was too bright and too saturated, leading to art that was too dark to compensate.

Compare it with how Tributary is supposed to look:

I didn't even notice until I posted this piece online, which looks a lot duller than I had planned:

My monitor was so off that at certain viewing angles, I couldn't tell apart green and red lines on a git-diff. Just to be clear, I'm not normally colour-blind. Tweaking the monitor's settings didn't solve the problem, and the monitor's inflexible stand meant having to trade ergonomics for proper colours as I lowered my chair or propped up the screen with stacks of paper.

The problem was pervasive throughout my projects, so I did some research and settled on the following:

1. I needed to get a new monitor which I could set to display in sRGB, which would match most websites and apps
2. I needed to add colour settings to my games for anyone whose monitors weren't in sRGB

For my Godot projects, I set about making a standalone scene that I could drop into a game to apply an overlay over the whole display. The UI isn't much to look at yet, but it served its purpose — I was able to use the same scene in Pilum too!

The solution involved several sliders that sent signals to modify two nodes:

1. A PanelContainer the size of the screen whose colour and opaqueness could be used to tint the whole game
2. A WorldEnvironment whose Environment resource could be used to modify brightness, saturation, and contrast

The result was more than satisfactory!

With a few sliders (and the ability to save combinations), I could boost contrast, maybe to simulate a flash of light or tense moment in-game:

Or to simulate glaring heat and harsh sunlight:

Noir-style flashbacks:

Night-time:

Crafting a solution to accidentally dull art ended up adding a lot of potential liveliness to my game worlds!

Tags: Blog, Tributary with Moons