Tuesday, June 5, 2018

Remastering Rinse and Repeat

Rinse and Repeat remastered, for Radiator 3 (2018)
Rinse and Repeat (2015)
I'm nearing the end of the remaster process for my shower game Rinse and Repeat, as part of a future re-release planned for late 2018. As I've said before: if you have the time and energy, I highly recommend remastering your games -- you get to revisit all the compromises and sacrifices you inflicted on yourself, and now you're not desperate to get the game out the door -- you can finally do things calmly and properly.

The time difference helps you see the project with new eyes. In my case, it's been about two and a half years since the original Rinse and Repeat release in October 2015. Game engine technology has changed, my skills and tastes have changed, and it's surprisingly therapeutic to revisit my past decisions. Like, why did I give everything a weird green tinge? I don't remember. Maybe I had good reasons that I've now forgotten.

Here's some of the specific changes I made to the shower scene, and some of my reasoning:

First, you'll notice the whole scene is generally less colorful and more dark gray. Above, I've pixelated the two screenshots to emphasize the colors.

Much of that change comes from upgrading my materials to use physically-based shaders, and adding a post-process stack to do some basic color grading on the camera. The result is a much more consistent photographic feel, without the blown-out neon green highlights of the older art style. While I feel bad about how the colors are more boring now, the game is already pretty surreal, so I decided it was more important to setup the game with normality and match contemporary game aesthetics.

Lately I've been paying more attention to materials. The original had poorly defined materials, where every tile had the same identical sheen, because I basically used the same tile textures for the ground and the walls. But after inspecting many bathrooms and locker rooms, I've noticed the wall tiles are often very smooth and glossy, while the floor tiles usually have more friction and noise. I realized I had to make these materials read better, and distinguish more between the wall and floor. This differentiation would help players visually understand the scene more easily.

For the tile wall, I found some photosource of slightly old smooth tiles with slightly offset alignments. Those small offsets were key to selling the age of this shower room. Once I swapped the new albedo texture onto the wall, it fit almost instantly. I didn't even change the normal map, it's technically using the same normal map as the floor, just at a different tiling scale.

Next, I noticed the composition felt a bit sparse, with no small clutter details / set-dressing to anchor the scale of the space. There's generally two rules of thumb when it comes to detail placement:

Try to balance the amount of big objects (wall forms, in yellow) and medium-sized objects (furniture, in magenta) and small objects (bottles, cans, leaves, in cyan)... but if you want a place to feel cleaner, err on fewer small clutter objects.

When you place medium-sized and small-sized objects, try to have some in the foreground and some in the midground / background. Notice there's a shower fixture near the player as well as far from the player; some shampoo and soap bottles are also at the player's feet, as well as the far wall. The viewer will assume these objects are the same size, and use that to judge distances. (You can also exploit this assumption, which is called forced perspective.)

My last addition was the dark wall stripes, to add more of an institutional feeling. If you examine public gym showers, especially older mid-century showers, they sometimes have a stripe bisecting across the walls. I think it helps demarcate the area like a line of caution tape, but also in the manner of a large public swimming pool with its tiled transitions. I also like how it adds more visual weight at eye-level and accentuates / unifies the shower fixtures.

For the game, I didn't want to make a separate wall texture variant with some stripes painted on. So in the game world, these stripes are technically just some long semi-translucent sprites layered over the walls.

It's nothing fancy, but I think bringing this graphic design sensibility to level design is often helpful. It also helps breaks up the big wall shape into several "medium-scale shapes", which were previously lacking in the older version, and I think the composition feels more balanced now.

I'm also updating the hunk. I didn't have much time for the original release, so his teeth were just a light gray cube embedded in his mouth. In this new version, I've finally given him proper teeth... but again, I went for a quick solution that would be "good enough" for my purposes. Because the hunk is almost always facing toward the camera whenever he speaks, I've found that this flat teeth card works surprisingly well.

There'll be a few other surprises in this remastered version, but I fear I've already said too much...

Until next time.