Post-Process

 

There were two main aspects to the post process

1. Outline:

• Black outline line- so white sections stand out
• Simultaneous white outline for black sections
• Dynamic – depending on the lighting, either white/black outline will be present.

 

2. Black filter:

• Makes everything black and white

 

The second part of the post-process was completed early on by David; this only left the outline. Originally, John was tasked with this, but I ended up taking over, as they didn’t have access to Unreal over Easter.

 

 

 

 

Henry sent a couple shaders and I did some supplemental research into unreal shader settings and using shader nodes in unreal to find a solution to the outline. I tested these in game; however, none of the outlines did a white and black ‘dynamic’ outline.

 

 

Henry made a shader which was perfect but unfortunately in the wrong Unreal version. However, I was able to recreate it following his example as a guide. (details further down)

 

 

As I recreated the shader, I ran into some issues. Despite understanding how the shader worked, I lacked a lot of basic Unreal knowledge, like how to delete node links.

 

 

I read Unreal Engine’s guide to familiarise myself with the correct language and UI.

 

 

In the correct version of Unreal, the shader’s material functions were missing. The main issue was that certain nodes had different names or contained other custom material functions that had to be remade. I roughly figured out the use of every missing node and used the resources I found to create replacements.

 

Material functions

 

Material Functions for shader:

 

 

Pixel_Depth: Calculates the distance from the pixel to the camera.

 

 

Get_Occluded: adjusts visibility of outline based on occlusion.

 

 

BlurSampleOffsets: Calculates the outline by multiplying the object and offsetting it in each axis.

 

 

CombineSamples: I couldn’t figure out its purpose but found that changing the input values affected the background. I believe it converts values for 3D rendering on a 2D screen.

 

 

get_subject_depth: Affects the continuity of the outline

 

 

 

 

Edge_Detection: Adjusts line thickness

 

 

Edge_detection_1: Unsure of its function

 

 

 

 

 

 

Final Material

 

 

 

 

I managed to recreate the material using the newly remade material functions.

 

Final Results

 

 

 

I’m really happy with the final shader. I learnt a lot about post-processing in Unreal, and although I relied heavily on Henry to build this shader, I’m still proud I managed to reverse engineer it and understand most of its components.

Cutscene

 

A cutscene was planned for the game to introduce the setting and plot; however, we unfortunately ran out of time and could not complete it. The following was the beginning stages of the storyboard I made for it.

   

 

 

 

 

 

   

 

 

 

Final Game

 

 

Production

 

Feedback received from the style guide presentation:

• Blender shaders can’t be transferred to Unreal .
• Henry offered to help us with the shaders in Unreal Engine.
• The models would likely need really exaggerated geometry to achieve the angular style.

 

Models:

 

Modelling

 

I followed a polymodeling pipeline, as we discussed having a low-poly style.

 

 

First attempt: I created the facial features from a subdivided cube; however, it felt primitive and difficult to develop and add detail to. I used a Blender shader to replicate the final black and white effect.

 

 

I researched other methods. This was another way to go about polymodelling, which I recognised. You build the loops first, then join everything after.

 

 

 

Second attempt:

• Improved the facial details
• Eye shapes were more accurate.
• Additional topology gave more freedom for facial animation.
• Used more extreme geometry, e.g., cheekbones, nose and chin shadows. (This creates built-in shadows which recreate the 2D style from all angles)
• The shading sometimes looked off despite the topology looking good – to fix this, some vertices had to be angled weirdly. I asked for advice, as I felt the topology was starting to look crazy, I was told that good topology is whatever achieves the correct shading with the least amount of geometry possible; only N-gons are considered objectively bad. I developed really weird geometry but it functioned well in different lightings, so I stuck with it.

 

 

 

I recognised the model needed textures for details like the eyes and beauty mark. The eyes were a big issue, as they appeared pitch black but needed to have some white and shape to them.

 

 

 

 

I identified an issue in the shadows caused by the topology:

• At poles, shadows would blur or extend oddly.
• This also happened in quads if one vertex was pushed too far out.

 

I could work around this by:

• putting poles in inconspicuous areas .
• readjusting pushed-out vertices.

 

 

To-Do & Notes for solving issues with in Unreal.

 

 

 

I followed the same method as the face, building each limb separately, then connecting them at the end.

 

 

• redid the hair.
• connected all topology
• Redid the skirt to have built-in pleats so it’s affected by the shader like the face.

 

hands

 

 

I made blocky hands that fit the angular style; however, when I looked at the topology, I realised that it wouldn’t work well for animation, so I chose to redo it entirely.

 

 

Using a reference, I remade the hand. The number of loops could be reduced to emphasise the angular style; however, the topology now works for animation.

 

 

 

• Connected the feet and hands to the body.

• tested the model in different lighting.

 

 

Unreal Test:

• flipped some normals.

 

Textures

 

 

 

 

My rough attempt at the textures; I used Substance Painter rather than Krita for more control.

• I decided where I should put the textures/lines.

• The textures looked blurry; needed an increase in the resolution for the hair.
• I ‘drew on’ the eyes, as the original method didn’t work; however, it didn’t look good.

 

 

Second attempt:

• UVs were overlapped in some areas, which made black lines appear randomly on the model.
• My notes mentioned using a white emissive layer for permanent highlights that aren’t affected by the shader.

 

 

 

 

• I redid the mesh and UVs, as they were affecting the resolution of the textures too much.
• The main change was the eyes– I used a technique I learnt for making Vtuber models: make the eye a flat surface and create the pupil and eyelashes on top as planes.

 

 

Final model with textures

• added white strips to the skirt so it could have highlights
• new eyes
• higher resolution hair
• fixed UVs

 

Rigging

 

 

I used the robot tutorial to build the model’s rig. Coincidentally, all the previous models I made in other modules were serpent-shaped, so this was my first time making a human rig.

 

 

• I made all the controls and adjusted the weight painting.
• The forward IK foot roll didn’t work.
• Arms IK and FK functional.

 

 

 

I wanted to push myself and try making a face rig too; I looked up a couple of videos to become more familiar with the general concept; the second one helped the most as it slowly built up in complexity.

 

 

I used the second video’s 3rd example. The deformation of the face isn’t great, which limits the exaggeration possible, but these basic functions work:

• open mouth
• eye tracking
• eyebrows

To improve this I would:

• add more mouth space
• define lips more
• Be more specific with weight painting.

 

 

Made a skirt rig for extra control.

 

 

 

 

Fix: Removed weightpainting on IK wrist control.

 

Animation

 

 

I researched idle animations to understand the general requirements for these animations. I noted the following:

• Looping actions
• ‘Small’ or contained actions.
• Simple

 

The main action I chose for the animation is a ‘FootTap’, which works as a simple loop; however, the game team requested a smoking action and a few randomisable actions. So I created a couple of different movements based around smoking that the secretary could do at the same time.

 

 

I researched depictions of smoking in film noir and animation and combined them with the basic foot tap aniamtion I made.

 

 

As requested the movements were split into multiple actions so they could be randomised in game.

 

Animations in Sketchfab

Environment

 

Although I was tasked with making the secretary’s model and animations, we needed the background made to test textures and contrast, so I pivoted and worked on that.

 

 

First attempt:

• tried to make built-in blinds in the room, but they looked half-finished.

 

 

 

 

 

Redid the room:

• Added a door.
• New blinds.

 

Textures

 

To create the textures, I brought the UVs into Krita and handpainted them. I marked the UVs in Blender so I could line up the pattern properly.

 

 

 

After testing it in Unreal, I decided to set the wall texture to a white emissive so it wouldn’t be affected by the shader to help the scene’s clarity.

 

 

 

Flooring

 

 

 

• Hand-painted textures in krita.

Blinds

 

Feedback from the lecturer:

• Redo the blinds
• make them thinner and more.

 

 

 

I improved the blinds by:

• bettering the topology
• Making the string mechanism accurate.
• added a wood texture using the Krita technique.

 

 

 

 

• Added a slight curve to the individual strips for more realism and interest.
• Redid the string mechanism
• Made the strips thinner and added more
• Spaced them out evenly

 

 

Blinds reference.

 

 

I was struggling to understand how to UV map in the new Blender version. This video explained the new unwrap options.

 

 

To optimise UVs for gameplay, I overlapped individual strips so less memory is used on textures.

 

Textures

 

• Textured in krita.

 

 

The orientation of the top section was wrong.

 

 

• Fixed the orientation
• resized the textures

 

However, it still looked bad.

 

 

The texture was too harsh but felt closer to the style of the game.

 

 

 

These had a similar issue: the texture looked like static when applied to the model.

 

 

• I chose a subtler texture that had most of the detail around the edges to avoid the static feeling.

• Upped the contrast.
• Resized it a bit.

 

 

Textures I made: walls, blinds, flooring, and secretary.

 

I’m happy with the results; the new technique saved some time. Despite only using black and white, the scene doesn’t feel overwhelming.

 

Fireplace

 

 

 

I made a list of all the items left to do. Although I still had to do the animation for the secretary, I felt helping the team with the textures was more important with playtesting coming up. I chose the fireplace, as it stood out, making the room look unfinished.

 

 

 

I did the Krita-Blender texturing. matching the orientation of the brick texture to the labelled UVs.

 

 

 

 

 

I’m happy with the amount of work I completed. Although the quality of my work could’ve been improved, mainly the animations, I couldn’t spend time redoing or perfecting anything as other work needed to be done. Furthermore, I unexpectedly had to take on the post-processing, so I had to manage my time to get everything done.