Trying to make a Switch Online GBA shader out of vba-color

[Jackrabbit]

Hello, I’m very new to this, so I apologize in advance for butchering a finely-tuned shader.

I’ve been playing Metroid Fusion on mGBA, and though I appreciate that the vba-color and gba-color shaders are much more accurate to the original hardware, I recently tried Fusion on Switch Online and I really like their color implementation. It’s toned way down compared to the raw output, but it’s a lot more saturated than the vba-color/gba-color shaders. I wanted to try to match that with a customized shader, so I copied vba-color.slang into a new file and have been messing around with the parameters for a few hours, and I am way down a rabbit hole now. I’m a JS dev, but I have no education in coding shaders. I know some basics like what saturation, lumosity, and gamma mean, so I’ve just been changing parameter values via trial and error and have gotten about as far as I can without advice from someone more knowledgeable. I appreciate any and all advice/criticism, and thank you for reading!

First, here’s a screenshot with vba-color and darken screen set to 0.4:

Next, here’s a screenshot from Switch Online’s GBA app:

And here is my attempt at adjusting vba-color, and the params I have set:

I mean, it’s kind of in the ball park but not really, and there are a lot of things I don’t know how to control. I bumped up the saturation and lumosity a bit, and played around with adjusting the r, g, and b, and left everything else alone. Some things I notice:

-NSO’s reds are way less saturated, but the pinks pop like crazy. I don’t know how to affect the pink saturation level without also affecting everything else. -NSO’s blues and purples are also darker and more saturated, see the minimap grid in the upper right, Samus’ legs, and the computer control panel. When I try to fix that by bumping up the blue levels and/or overall saturation, the rest of the image goes way out of whack. When I darken the image or adjust the gamma, I lose too much detail in the room background. -NSO’s yellow floor tiles look way greener/colder than in mine, but the light gray ceiling tiles are warmer/more yellow. what the heck.

I’m obviously taking a very crude stab at this, but I am really enjoying this, and I’d love to learn more about how to do it properly. I have the comparison screenshots up on my monitor, changing the .slang file in vscode, restarting retroarch every time I adjust a value, and it’s a lot of fun.

[hunterk]

if you use the ‘color mangler’ shader on which the gameboy color shaders are based, you can change those values on the fly with parameters.

There’s also a color-grading LUT shader, which might be easier for you to use if, you’re using to doing this sort of thing in photoshop:

RetroArch Tone-mapping LUT Shader

[Jackrabbit]

Wow, that is great. Thank you for the resources! I’ll give LUT a try.

[Jackrabbit]

Here’s my attempt using the LUT/photoshop method:

and NSO again:

It’s still way off in some places, but it was challenging trying to match it using only whole-image adjustment. I only know how to use Brightness/Contrast, and Hue/Saturation with both master and specific color sections. I don’t know how to use levels, curves, or any of those other tools. The bright yellows in particular were difficult. I could match the green background and the beige floor more closely, but then the bright yellow in the ‘ENERGY’, door carets, minimap and suit kept becoming a dark, sickly blue-green yellow. I tried to make my bright yellows as light and saturated as I could while keeping the other colors in the ballpark, and I’m pretty happy with the result so far. Playing through all my GBA games with the custom shader is a lot of fun.

[hunterk]

@Jackrabbit

a dark, sickly blue-green yellow

that’s something that the color mangler excels at because you can affect the amount of, say, blue tint, in the yellow, which can help deal with this sort of thing.

[crosi12]

It would be possible to share the settings? Was about to get a shot at this since I also like the NSO color correction method, but yours looks pretty good.

[Jackrabbit]

Sure! Here is the shader png:

To install on PC:

1. Download the png and place it in RetroArch-Win64>shaders>shaders_slang>reshade>shaders>LUT. I named the file “16gbabalanced.png” but when you download you’ll have to rename it yourself.
2. Open RetroArch-Win64>shaders>shaders_slang>reshade>lut.slangp in your text editor of choice, and change the line “SamplerLUT = shaders/LUT/16.png” to “SamplerLUT = shaders/LUT/16gbabalanced.png” or whatever you named the file.
3. In RetroArch, in the Quick Menu, go to Shaders>Load>shaders_slang>reshade>lut.slangp

I don’t think it’s close enough to the NSO colorization to call it that, but I’m looking at it as a balance between no color correction and the very de-saturated hardware-accurate shaders. I’m really enjoying playing through Metroid Fusion and Zero Mission with it, it fixes the blown-out oversaturation and brightness while still being nice and colorful.

[crosi12]

Works great and looks great! As you said it helps with the oversaturation but still keeps to (what is to me) the colorful charm of the GBA. This will probably be my favourite way to play GBA from this point on, thank you!

[Jackrabbit]

Thank you, I’m glad you like it!