Games Development - Task 3: Game Prototype

13/11/2024 - 08/12/2024 / Week 8 - Week 12
Joey Lok Wai San / 0350857
Games Development / Bachelor of Design (Hons) in Creative Media 
Task 3: Game Prototype



TABLE OF CONTENTS



LECTURES

All lectures and exercises completed in Games Development - Lectures & Exercises



INSTRUCTIONS


https://drive.google.com/file/d/1Gtkh4m9BvehlC5o1Vlk3Ja0el36iSHBI/preview



TASK 3: Game Prototype

Students were given the task of creating the prototype of their game. The prototype doesn’t need to have the final art asset, and the use of grey boxing is allowed. The focus here is to quickly test out the game mechanics and to troubleshoot any technical difficulties discovered during the development. The focus should be the MVP of your game. This includes:
  1. Coding movements and actions
  2. Coding obstacles and enemies’ interactions
  3. Coding game levels (Logic of the game)
Prototype Process in Unity
This is the prototyping process in Unity. To start I created multiple scenes and labelled them according to order. I started with making the first level of my game which also acts as a tutorial on how to play. The prototype will showcase the following elements:
  • Tile set map
  • Player movement
  • Obstacles 
  • Hiding 
  • Player attack
The game mechanics will be shown through the tutorial-level walkthrough, showing how to navigate the environment, interact with various elements, and utilize the core gameplay features.

Gameplay 
In the process of developing my prototype, I made a few changes in terms of gameplay so the game would feel more consistent instead of all over the place.

Initial Prototype using Existing File
When developing my game prototype, I wanted to use the file done in the tutorial as it already has a few existing components. However, when I tried adding my own sprites and assets as well as other code on top of it for obstacles, everything stopped working. This wasted at least a few day's worth of work.


Fig. 1.1 Creating Prototype using Existing File from Tutorial, Week 12

*I had to delete all my progress because obstacles and scripts did not work, only basic movement was working


Fig. 1.2 Initial Prototype, Week 12

Restarting Everything from Scratch
I then restarted everything in a new empty file. I readded all my assets including character, animations, and environment. To start, I imported my main character asset and sprites to set up the animation. Once that's done I placed the player controller script with all the character movements including running, jumping etc


Fig. 1.3 Slicing Spritesheets, Week 12

When my sprites were sliced I realized they looked really pixelated even when I put them on the scene. This problem took me at least a day to solve and going back and forth of slicing the spritesheets 5 times. The issue was that the file was not exported as high quality and the max resolution size on Unity was set too low. 


Fig. 1.4 Increasing Sprite Quality (Before - Left, After - Right), Week 12

This is some of my progress that I have recorded, basically redoing everything from scratch using my own code and help from AI as well as YouTube tutorials.


Fig. 1.5 Basic Character Movement (Left Right, Jump, Attack), Week 13


Fig. 1.6 Character Attack/ Shooting, Week 13


Fig. 1.6 Character Attack with Effects and Enemy, Week 13

Once the basic movement was done, I used the tile sheet I had and added it to the scene so it would look a lot nicer. Then I added in some obstacles such as the puddles that slow movement, trash bins to hide behind, enemy patrol, etc. This is a list of items that were added for this tutorial scene.
  1. Puddles slow movement
  2. Trash bin to hide behind
  3. Enemy patrol
  4. Parallax effect on background

Fig. 1.7 Adding in Obstacles to Scene, Week 13


Fig. 1.8 All Progress, Week 13

Asset Building 
One of the key things I wanted to do moving forward from the previous task was to change the animations of the characters, not just one but all. The way they moved, especially when walking and running, looked really dumb in my initial attempt and I was not happy or confident with my work at all. This was because I did not use any references.

Main Character - Student
For all the characters, I made their legs longer, as well as distinguished the front and back legs and arms by making the back ones darker and the front ones lighter in colour. This gave the character more dimension and would look more sense when animated.


Fig. 2.1 Character Design Body Changes (Before - Left, After - Right), Week 9

Due to this change, all the animations I created initially had to be redone in order for them to all look consistent.

Animations (in order):
  • Idle
  • Walking
  • Running
  • Jumping
  • Attack
  • Hit/ Injury
  • Defeat

Fig. 2.2 New Main Character Idle, Week 9

Fig. 2.3 New Main Character Walk, Week 9


Fig. 2.4 New Main Character Run, Week 9


Fig. 2.5 New Main Character Jump, Week 9


Fig. 2.6 New Main Character Attack, Week 9


Fig. 2.7 New Main Character Hit/ Injury, Week 9


Fig. 2.8 New Main Character Defeat/ Death, Week 9


Fig. 2.9 New Main Character Caught, Week 9

Fig. 2.10 New Main Character Summary of Sprites and Animation, Week 10


Fig. 2.11 New Main Character Attack Sprites, Week 10

Main Enemy
The changes made to the main enemy were to make the colour more saturated as it blended into the backgrounds. I also played around and experimented with the clothing colour, trying out black instead of green but it appeared too formal. In the end, I stuck with what I already had for the clothing.

Fig. 3.1 Main Enemy Design Changes (Before - Left, After - Right), Week 10

Animations (in order):
  • Idle
  • Walking
  • Running (Chase)
  • Alert
  • Hit/ Injury
  • Defeat
Fig. 3.2 New Main Enemy Idle, Week 10


Fig. 3.3 New Main Enemy Walk, Week 10


Fig. 3.4 New Main Enemy Run, Week 10


Fig. 3.5 New Main Enemy Alert, Week 10


Fig. 3.6 New Main Enemy Hit, Week 10


Fig. 3.7 New Main Enemy Death, Week 10

Fig. 3.8 New Main Enemy Summary of Sprites and Animation, Week 10

Enemy #1
I also changed the colour of the enemy, especially for its skin tone. I increased its saturation and brightness so it would stand out more. I did the same for the clothing and made it a vibrant dark blue to provide contrast.


Fig. 4.1 
Enemy #1 Design Changes (Before - Left, After - Right), Week 11

Animations (in order):
  • Idle
  • Walking
  • Running (Chase)
  • Hit/ Injury
  • Defeat

Fig. 4.2 New Enemy #1 Idle, Week 11


Fig. 4.3 New Enemy #1 Walk, Week 11


Fig. 4.4 New Enemy #1 Run, Week 11


Fig. 4.5 New Enemy #1 Hit, Week 11


Fig. 4.6 New Enemy #1 Death, Week 11

Fig. 4.7 New Enemy #1 Summary of Sprites and Animation, Week 11

Enemy #2
I changed the uniform to become a skirt which gives more variety to the character's uniform.  I also changed the colour of the enemy, especially for its skin tone. I increased its saturation and brightness so it would stand out more. 

Fig. 5.1 Enemy #2 Design Changes (Before - Left, After - Right), Week 12

Animations (in order):
  • Idle
  • Walking
  • Running (Chase)
  • Alert
  • Hit/ Injury
  • Defeat

Fig. 5.2 New Enemy #2 Idle, Week 12


Fig. 5.3 New Enemy #2 Walk, Week 12

Fig. 5.4 New Enemy #2 Run, Week 12


Fig. 5.5 New Enemy #2 Hit, Week 12


Fig. 5.6 New Enemy #2 Death, Week 12


Fig. 5.7 New Enemy #2 Summary of Sprites and Animation, Week 12


Asset Items 
I already created some of my assets in the previous task. However, I was not really happy with them and they did not look consistent in style. This caused me to recreate quite a number of assets on top of making new assets that have no been created yet.

Character Weapon Combat
For the long-range attack, the weapon and bullet is a paper plane. For the explosion, I decided to make it like like a paper ball expanding and then exploding so it would look connected to the paper plane weapon instead of just having a regular exploding effect (e.g. fire, smoke, etc)


Fig. 6.1 Paper Plane and Explosion Animation, Week 12


Fig. 6.2 Paper Plane Summary of Sprites and Animation, Week 12


Fig. 6.3 Explosion Summary of Sprites and Animation, Week 12

Obstacles
I updated the design  to look more consistent in terms of shape and colour. These obstacles and assets will be used for characters to jump over, use to get to higher places or slow down their movement.


Fig. 6.5 Initial Obstacle Assets, Week 12

These are the updated obstacle assets, alongside additional developed assets needed for the game.

Fig. 6.4 Final Obstacle Assets, Week 12

Environment
I made some additional changes to the background as the design of the characters would still clash a little with the background colours. To find a design that was satisfactory, I tested the characters on a bunch of different backgrounds. I even considered making a gymnasium or library so key mechanics would make sense but at the end of it, there would be too much work.

 
Fig. 7.1 Testing Characters on Different Backgrounds, Week 12

Transition Scenes
I created some transition scenes that I would like to put into my game. The one on the left would be the introduction scene to show the character is running late for school. The staircase would be the transition between levels, e.g. showing the character going between two floors.


Fig. 7.2 Transition Scenes, Week 12

Outdoor Background Scene
These are all the new backgrounds I have created and updated from the previous task. I made a few changes here and there so it would look more consistent between scenes. I also made tilesets for the ground for all the scenes. There isn't many platforms so I didn't create tilesets for those, the platforms would be objects.


Fig. 7.3 Level 1/ Tutorial - Street, Week 12


Fig. 7.4 Level 1/ Tutorial - Street, Week 12


Fig. 7.5 Level 2 - School Yard, Week 12


Fig. 7.6 Level 1 & 2 - Outdoor Tilesets Week 12

Indoor Background Scene
For the hallway, I found some references online of 2D illustrations of school hallways and used that as inspiration for my design. I did not want to make the background so busy as there would be lots of obstacles as well. 


Fig. 7.7 Hallway References, Week 12


Fig. 7.8 Level 3 - School Hallway, Week 12

Things to be done for Final Project:
  • Add enemy attacks
  • Health system animations
  • Implement sound effects and background music
  • Game GUI
  • Create levels 1, 2 and 3
  • Create mechanics for level 4 (fight scene) 
Final Task 3: Game Prototype
Video Presentation & Walkthrough 

Fig. 9.1 Final Game Prototype - Presentation Video, Week 12 (15/12/2024)



FEEDBACK

WEEK 8-12
No feedback was given



REFLECTION

This task was definitely an experience for me. I'm new to coding and making a game in Unity, so it took a lot of time to figure things out and make a feature work. I spent at least a whole day doing one obstacle and making it work. I definitely felt like I could do a lot better if I had more experience and understanding of the code. The workload from beginning to end is very intimidating and the pressure got to me. I am very grateful for the tutorials Mr. Razif provided in class as they served as a good foundation for creating a basic game which we can then build upon. 

When working on the final project, there are still a lot of things I can improve on from the prototype and still a lot of things I need to create and fix. It is honestly a very rough prototype with lots of missing components, and some design aspects can be improved on. I hope I can finish everything for the final.

Comments