Games Development - Task 3 / Game Prototype

23.4.2025 - .5.2025 (Week 1 - Week )
Chong Hui Yi / 0363195
Games Development / BDCM
Task 3 / Game Prototype



TABLE OF CONTENT


LECTURES

-



INSTRUCTIONS


<iframe src="https://drive.google.com/file/d/1PnT4yjnZ2OED7bHjCsQN_lJcPmrYhu-2/preview" width="640" height="480" allow="autoplay"></iframe>



Task 3: Game Prototype

Instruction

"Students given the task to create 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."

Progression

For this task, we were required to develop a basic prototype of our game. We decided to begin with Level 2, as it was the most complex stage, featuring all enemy types, minions, and the final boss. However, our goal was not to complete the entire level, but to build a functional foundation.

Our work distribution is shown in Fig. 1.0. My main responsibilities focused on preparing the game level setup. This included designing the environment and tile layout, setting up collisions and defining tile boundaries, and adding a parallax background to enhance depth.

I also developed the mechanics for potion and scarab pickups. This allowed Sahira to collect these items and increase her health bar after consuming potions. In addition, I implemented border collision logic to ensure proper interaction with these collectible items.

Fig. 1.0 Breakdown of Team Contributions

Background Process

I began by working on the background setup in Unity. My initial idea was to divide the background into multiple layers to create a parallax effect as the player moves, with each layer scrolling at a different speed. I also intended for the background to repeat seamlessly to give the illusion of an endless environment.

Fig. 2.0 First Version of the Background

At first, I tried to implement this with the help of ChatGPT. However, the results were not ideal and led to several issues, as shown in Fig. 2.1. In that version, the front layers moved faster than the back ones, which is the opposite of how a parallax effect should behave. Additionally, the background images could not tile properly, creating visible gaps. If the player fell off the level, these gaps became very noticeable.

Eventually, I turned to YouTube and found a much clearer and more effective tutorial: https://www.youtube.com/watch?v=zit45k6CUMk. It was simpler to follow and delivered the exact result I was aiming for.

The background of Level 2 consists of ten layers in total: layers 1 to 6 contain desert elements, layer 7 features clouds, layer 8 shows the sun, layer 9 is the background colour, and layer 10 is a dark overlay to improve the visibility of foreground platforms.

To set up the parallax background, I followed these main steps:
  • Imported all .png background assets and set them to:
    • Texture Type: Sprite (2D and UI)
    • Sprite Mode: Single
    • Mesh Type: Full Rect
  • Dragged all background layers into the Hierarchy and adjusted their scale and position.
  • Duplicated each background layer twice and placed them to the left and right of the original. Both duplicates were made children of the main layer to allow seamless looping.
Fig. 2.1 Level 2 Background - 10 layers
  • Created a Parallax script and attached it to the main layer.
Fig. 2.2 Parallax Script
  • The script includes a parallaxEffect variable to control the relative movement speed of each layer.
    • 1 = static (e.g. background colour, sun)
    • < 1 = moves faster with camera (e.g. 0.3)

Fig. 2.3 Parallax script component
  • Converted the setup into a prefab for reuse.

The final result can be seen in Fig. 2.4. The entire background now follows the player’s movement smoothly and remains within the camera view without any gaps.

Fig. 2.4 Final parallax background


Ground Tile Progress

To create seamless repeating ground tiles, we used a custom Sprite Unlit Shader Graph called WorldUVPattern. This allows the tile pattern to repeat automatically based on world position, removing the need to manually align textures.

The process was as follows:
  • Used the Sprite Unlit Shader Graph (WorldUVPattern) to enable repeating textures.
Fig. 3.0 Sprite Unlit Shader Graph (WorldUVPattern)

Fig. 3.1 Surface Type: Transparent
  • Created a new Material using this shader and assigned it to the GroundTile’s Sprite Renderer.
Fig. 3.2 New Material for Ground Tile
  • Added Box Colliders to both the top and bottom parts of the GroundTile.
  • Converted the setup into prefabs for reuse.
Fig. 3.3 Ground Tile Prefab (with collider)

This method ensured that the ground texture remained seamless, no matter where the tiles were placed in the level.

Besides that, the floating platforms were also given colliders and turned into prefabs, similar to the ground tiles.

Fig. 3.4 Floating Platform Prefab (with collider)

Heath Bar Logic - Sahira Potion

To create the HP bar, I added a Panel in the UI and placed an Image inside it named HPBar. The image settings were configured as follows:
  • Image Type: Filled
  • Fill Method: Horizontal
  • Fill Origin: Left
  • Fill Amount: 1 (for full health)

Fig. 4.0 Image Component Settings

After that, I wrote a HealingPotion script to handle item collection and HP restoration.

Fig. 4.1 Healing Potion Script

Finally, I updated the PlayerSahiraController script to connect the HP bar and apply the healing effect when a potion is collected.

Fig. 4.2 Update Player Controller Script

Fig. 4.3 UI Canvas

Fig. 4.4 Healing Potion Prefab


Scarab Picking Up 

Next, I created a basic ItemPickup script to allow the player to collect scarabs. This was an early and simple version, and at this stage, it was not yet connected to our item inventory system.

Fig. 5.0 Scarab Prefab

Fig. 5.1 Item Pickup Script


Final Outcome

Fig. 6.0 Game Dev Task 3  by Winnie Ho

Fig. 6.1 Demo Video



FEEDBACK

Week 10:

Dr Mia praised our game prototype for being well-developed, especially highlighting the originality of the soul collection and crafting feature.



REFLECTION

In this task, my main role was setting up the game level. I realised that while AI tools can be helpful, sometimes looking up tutorials online is a better option for certain issues. That said, using ChatGPT definitely helped me understand Unity more deeply. For example, when I first encountered the Sprite Unlit Shader Graph, I felt completely lost. But one of the advantages of AI is the ability to keep asking questions and receiving step-by-step guidance or corrections when needed.

One difficulty we faced was working with Unity in a team setting. Since we were not using a version control system like Git, we had to constantly upload and download Unity files via Google Drive to share updates. This process was time-consuming, especially due to the large file sizes that slowed down syncing.

Although Winnie eventually bought an external SSD to allow direct editing and faster access to the Unity project, it didn’t make much difference for me personally, as we rarely met in person.

I am truly grateful to my teammates. Winnie was responsible for level design and handled enemy behaviours, including movement, attack patterns, and mechanics. Guo Ying took charge of coding the crafting system, which I believe was the most challenging part of our game. Overall, despite the challenges, this task taught me a lot about both Unity and collaborative development.

Comments

Popular Posts