Painted Connections

Painted Connections is a game centered around the theme of watercolor paint. We wanted to give the player a graceful experience, with pacifist gameplay and wonder-evoking visuals. The game was made by a team of 6 students at Howest Digital Arts & Entertainment.

You can play Painted Connections on Itch.io

We created an exploration-adventure experience with a non-linear world design. The player has to find paint droplets scattered throughout the many floating islands, and gather them from various sources using their staff. They can use these to paint buildings into the air, as a means of reaching new places. Finally, the staff actually doubles as a glider, and we used gliding as the main form of transport in order to give the player a sense of freedom and majesty while exploring.

The watercolor look was achieved with a custom main shader implemented in Unity’s shader graph. It uses combinations of gradients and distortion (amongst others) to create a painterly feel.

To save on draw calls, we used a single color lookup table to texture every asset in the game. The V-coordinate of the texture has horizontal bands of different color and saturations, each a pixel wide. Therefore we opted for no texture filtering. The brightness of a fragment is controlled by its U-coordinate. This allowed for value gradients and, as this did not need to be part of the LUT, we were able to make the texture a single pixel wide. The artists unwrapped on top of a preview texture that emulated the result of the shader.

To increase immersion & wonder, we decided to eschew all HUD elements, so, to keep track of how much paint (our main resource) the player has, we used the character's hair. The hair shader gave our team control of hair length, color and color interpolation, thus showing the player how much & what color of paint they have.

In order to make the growth effect exclusive to the ponytail, we used vertex colors.

The Red channel controls whether or not a fragment is part of the hair cap or the ponytail. The hairs of the ponytail are unwrapped in such a way, that they form a smooth gradient from root to tip along the V-axis.

The Green channel holds a smoothed hair mask, which, when multiplied by the red channel which holds the horizontal falloff gradient, and by the V-coordinate, results in something similar to an SDF. This can then be thresholded to get a mask for the hair opacity, where the threshold drives the hair's length.

The color is controlled similarly, by using smoothstep functions to produce smooth color masks whose vertical size can be controlled. This is repeated for each color and the masks are then used to blend the colors together.

We made this project over the course of 12 weeks, with the following amazing team. We had a lot of fun doing so and will benefit from this experience in the start of our careers.

Tijmen Matthys - Production & Code
Axel Adant - Level Design & Code
Bram Tempelaere - Tech Art & Lookdev
Alex Sterneckert - Character, VFX, Tech Art
Zena Steenmans - Prop & Environment Art
Johanna Csonka - Environment Art

Special thanks to Stijn Van Coillie and Luna Fierens for your invaluable feedback!