My work on the University of Portsmouth Game Jam 2019 submission Fish Styx as my team’s VFX artist. I have revisited this project and decided to make visual upgrades the game’s assets. It took around 3 weeks of work to get this to a level of quality that I am happy with posting online, the following posts will explain how I made some of these effects.
Original Game:
https://www.youtube.com/watch?v=Dd1e6_t-erE
Updated Game:
https://youtu.be/cwGNwJxMzok
https://www.youtube.com/watch?v=7Rv67LWeyCA
A lot of the textures I used for the water effects were first made in Substance Designer. These files are then sent through either a panner or a 4waychaos function node to produce the desired effect.
https://imgur.com/DJ4LwG6
Material used for the bubble particles, makes use of refraction.
https://imgur.com/AKqqwhv
The size of the particles increase quickly towards the end of the particle’s life to mimic the bubbles popping.
https://imgur.com/JZLPjXs
The background bubbles makes use of a and radial gradient and have no refraction, this plus the fact that they are sprites instead of meshes was intended to save of on processing power and memory.
https://imgur.com/VO8dfUP
God ray material, makes use of a depth fade so that it does not cut off when clipping through the game’s floor.
https://imgur.com/2i7d3QX
These meshes are then placed in a particle system to mimic the effect of a moving background, this also allows the material to fade out to the end of the particles life via dynamic parameters.
https://imgur.com/Vd5CHaw
Here is the material used for the water caustics effect, which is then used as a light function.
https://imgur.com/V2QbYsw
This is the material on a spot light in game.
https://imgur.com/sPtFakr
In the next post I will cover how I made the post processing effect, which I am proud of 
1 Like
Breakdown of Post Processing Effect
https://www.youtube.com/watch?v=yED7vEYaKXw&feature=youtu.be
The main focus of my work was the post processing material, making sure that game felt underwater without overpowering the colourful textures of the other assets. This was to match the Game’s Dia De Los Muertos theme and the colourful palette of that aesthetic.
The first component of this material was to mask the absolute world position and then subtract the value into different components to produce the following result.
https://imgur.com/qtOYbNS
A blue palette is then multiplied onto each shade of gray and then added to produce a darkening ocean effect. The same technique is applied to a red palette, which is then linearly interpolated with the blue palette with an offset scene depth to make it look like a red light is coming from the right of the screen. This red light effect is connected to some code in the enemy fish blueprint, so that the light grows more intense in colour when the player is close to death.
https://imgur.com/CfSa2vq
https://imgur.com/HP7vsXM
The same world position layers were also used to linearly interpolate the intensity of water distortion. Like the other Water Effects, the distortion was made with a panning material. In this case the result is multiplied by a texture coordinate node (UVs) to distort the visuals. The Scene’s base colour and normal textures that are blended into this material make use of those distorted UVs.
https://imgur.com/hvBrvI9
To make the watery post processing not overly dominant on other assets, 3 masks were made to distinguish these assets. The first mask was made from the base colour input, which took all the meshes and left only the background.
https://imgur.com/Tz13lsu
After blending in the current base colour, another mask was made, this time made from a normal map input. This mask was made to make the meshes pop out more.
https://imgur.com/cdiQm5m
The final “mask” made use of the custom depth value, something which can be uniquely applied to individual meshes. Any meshes with a high enough custom depth value are masked out from the blue colour but retain their original distortion effects.
https://imgur.com/mx2OleZ
For fun, I wanted to display the components of this shader individually and have them blend into each other over time (as shown in the video above). To achieve this I had to make use of a time node and tan node. Since there were 7 different components to this shader in total, they each had 14% of the total time dedicated to being shown. Clamp and lerp nodes were used to achieve this. Each lerp would linearly interpolate between consecutive components.
https://imgur.com/rf1yEI5
Rainbow scales and glowing paint effects were applied to the fish models to make them pop out to the player more. To prevent the entire mesh from glowing, the artists of my team were encouraged by me to make RGB maps alongside the main textures. The red components of the texture were used to make rainbow fish scales. The normal maps of the fish would be added onto a panning camera vector which is then fed into a rainbow gradient texture. The paint components are then multiplied by a timed sine node to produce a pulsing glow effect.
https://imgur.com/Ee6IQsL
All the fish scale parts were made by me in substance designer for the artists to use in Substance Painter. They were achieved by modifying a spherical shape and then warping it with a starburst node to give it it’s rough edges.
https://imgur.com/QXWRiBi
This is then placed in a slope blur with a blurred fur texture to give them more detail.
The same techniques were applied to a shape mapper tool in order to make the fish scale flower patterns. Modifiable gradients were then applied to them so that the artists can control the colour of each scale. Masks were also generated to cut out the black background of the textures when using them in substance painter.
Results:
Another feature our group wanted to add was randomly generated skull textures. This was achieved with some blueprint logic and if statements. There were 3 patterns in total, so for those we had a random integer be generated. The colours were comprised of vector parameter values, where the RGB channels each had a randomized float between 0 and 1. These skulls were used for both the game’s pain objects and background.
To get the skulls in the background to float like they were underwater, they had to be placed in a particle system. The random variables of the skull texture were then determined by dynamic parameters instead.
https://imgur.com/dwMNiaP
These skulls were also randomly generated when used as items that would deal damage to the player in the game. They were given a panning red aura texture that was made in Substance Designer and brought into Unreal.
The final piece of work to be done on this revision was the addition of linear interpolation to the games camera and player character. One major problem with our game when it was submitted to the game jam website was the fact that everything felt stiff, the main character fish would snap into fixed angles when moving up and down and the camera would always be fixed onto the character.
https://www.youtube.com/watch?v=Dd1e6_t-erE
This was solved with the implementation of float interpolation nodes. The max value of interpolation is always changing based on when the up and down movement keys are pressed, and when released the max value returns to 0.
This results in the player character having more smooth movement going up and down. The same technique was applied to the game camera to make movement feel more natural.
Final post I swear 
, I forgot to post about the updated background which now makes use of the random cell generator code made back during the game’s original development. This simply spawns more cells in the background and is offset by the width of each cell.
https://imgur.com/FYQahga
Art Station Posts:
https://www.artstation.com/artwork/VdWzPN
https://www.artstation.com/artwork/QzD9R4
Original Game Jam Upload:
Updated Game Jam Upload:
https://drive.google.com/open?id=1voywzDgilfyWenA6Nzf8tGFvaOgLURfX