GAME DEVELOPMENT: PROJECT COMPILATION
Week 1-Week 16 (22/04/2026-06/07/2026)
Jennifer Michelle Hiendrawan/0374682
Game development/Bachelor of Design (Honours) in Creative Media
Project compilation
TABLE OF CONTENT
1.Instructions
2.Project
3.Feedback
4.Reflection
INSTRUCTIONS
PROJECT
For this module, we were required to create a game using PlayCanvas. We decided to form a group of four members:
1.Cindy Noverin (0376409) – Team Leader
2.Aquela Zefanya Soares (0374377)
3.Celine Christabelle Patricia (0374872)
4.Jennifer Michelle Hiendrawan (0374682)
For this semester, the theme is about mental health: "Where healing meets fun."
Story development
Week 1-2
After knowing the theme and listening to Ron's briefing, we began discussing ideas as a team. Initially, we decided to create a game about Hoarding Disorder. Once we had chosen the main theme, we continued with brainstorming, conducting research, and developing the game concept in more detail. The following is the FigJam link that we used for brainstorming and drafting several sections of our Game Design Document (GDD) during Weeks 1–2.
Figjam link: https://www.figma.com/board/giSW3PFB0eQO18v7hlCKHz/gamedev--BRAINSTORMING?node-id=0-1&t=Eolcneymm0cd7Kos-1
Our initial concept was to create a mental health game that focused on grief, moving on, and emotional healing. The game explored how people cope with grief after losing someone they love by collecting the objects and memories left behind. The story followed a protagonist grieving the loss of their beloved dog and blaming their parents for its tragic death, causing them to isolate themselves from the outside world. One day, a mysterious white dog appears outside their room and leads them through a doorway that opens onto a beautiful island instead of their home. Determined to uncover the truth, the protagonist begins a journey across the island while gradually learning to heal from their grief.
Fig 2.1 Figjam brainstorming idea week 1-2
However, from Week 3 onwards, we decided to completely change and redesign our game concept because we feel that the story initial idea was hard to explore, too niche for a mental awareness when all of us does not really have a basic understanding on it, we decided to change the entire story, something that is more relatable to our daily lives.
After several days of discussion, we carefully considered what game theme would be both meaningful and engaging. In the end, we decided to create a game about Anxiety Disorder. This was the first concept after brainstorming our new game idea.
This is the final concept of our game
.png)
Fig 2.2 Final game idea
It revolves about a person who is invited by his close friend to a birthday party at a club. Although he feel uncomfortable about attending, he is unable to refuse because the invitation comes from his best friend. As a result, he reluctantly decides to go. During the party, he suddenly experiences a severe anxiety attack. Through this game, we aim to raise awareness about anxiety by allowing players to experience and feel about it, particularly when it is unexpectedly triggered in crowded social situations. Below are some of the gameplay mechanics and obstacles that we plan to develop for our game.
Game executions
Week 4
On Week 4, We started to divide our task and make these game assets to start proceeding on making the game assets.
Fig 2.3 Task division
These are the work that i created:
Fig 2.4 Game objects
Fig 2.5 UI elements
Fig 2.6 Wireframe (PDF)
After that, we continue to finalize our GDD. This is our Game Design Document (Draft 1)
Fig 2.6 Game Design Document (Draft 1)
Week 5
Proceed on week 5, we started adding our asset to Playcanvas as well as turning out background into GSplat. For this Gsplat, we intially made the background 2D, but to prevent it to be too visual novel like, we wanted to add more depth to the background, that is why we looked for tutorials. Refer to the video below:
The following shows the progress of transforming the 2D background images into 3D Gaussian Splats (3DGS)
Fig 2.7 Gsplat
Week 6
We continue on adding asset to the playcanvas to adjust the camera position and ui design for the game, textbox, and such.
Fig 2.8 adding ui design and textbox
Fig 2.9 adding ui design and textbox
This week, we also had a consultation with Ron about Gaussian Splat and asked how to import it into PlayCanvas. After looking into the process, Ron showed us how to do it. He explained that Gaussian Splats cannot be imported directly into PlayCanvas and must first be processed using SuperSplat. The Gaussian Splat is first imported into SuperSplat, where its height, position, and other properties can be adjusted more easily. Once everything is properly configured, it can then be exported and imported into PlayCanvas as an SOG file.
Fig 2.9 Supersplat
Fig 2.10 Importing gaussian splat to playcanvas
Fig 2.11 Importing gaussian splat to playcanvas
This week, we discussed the design of our dialogue text box. We were concerned that using our previous text box would make the game feel too much like a visual novel. After discussing it as a team, we decided to redesign it into this style instead.
Fig 2.12 New dialogue box
This week, we also had a consultation with Ron and he advised us to reduce the size of our game assets, especially the Gaussian Splats, as it were causing the game to take a very long time to load.
This week, we consulted with Ron about how to implement a dialogue system that displays dialogue and images sequentially. The goal was to allow players to click and progress to the next dialogue and image, while also supporting any number of dialogue lines and images depending on the script. The following code was used to create this system.
Fig 2.13 dialogue sequence script
In the Inspector, we first specify the number of dialogue lines and images that will be used in a scene. After that, the corresponding dialogue and image assets are assigned in the same order so that each image appears together with its matching dialogue, ensuring they are displayed sequentially and at the correct timing.
Fig 2.14 dialogue sequence inspector
This week, we also decided to add a new concept. Since our backgrounds are in 3D, we chose to make them fully 360 degrees, allowing players to freely look around and explore the environment using their cursor. To achieve this, we created the front, back, left, and right sections of each environment and combined them into a seamless 360-degree background using copilot. This process took quite a long time because Copilot sometimes could not generate images that matched the prompts we provided.
Fig 2.15 Copilot images
The following shows some progress of it.
Fig 2.15 360-degree background
Fig 2.16 360-degree background
Week 10-Week 11
There were several days this week when we fully focused and worked intensively to complete the remaining parts of the game.
Fig 2.17 Progress w10 and w11
This week, we were almost finished with the game. We only had a few mechanics left to refine and one additional gameplay mechanic to implement.
Fig 2.18 Progress w10 and w11
Fig 2.19 Progress w10 and w11
This week was quite surprising. During our consultation with Ron, he pointed out that we had placed our game assets incorrectly. Instead of placing it under the 2D screen, it should have been placed in the 3D world so they would become part of the environment. If it remained under the 2D screen, it would not behave responsively within the 3D scene. As a result, we decided to rebuild the project from scratch. We created a new, empty canvas and started over from the beginning. Since we were already rebuilding the project, we also decided to remake the background. We felt that our previous background, which used Gaussian Splats, was not polished enough, it had many holes that could not be fixed easily, inconsistent object sizes, and several other issues. In the end, we chose to restart by recreating the background first. This time, we decided to use 3D assets instead, with several of the assets being individually modeled and assembled in Blender.
Fig 2.20 New background progress
After that, we combined all of the background assets into a single scene. During this process, we encountered some difficulties with Blender because, when we tried to merge the different parts together, it appeared to be floating and did not align properly. We are very grateful to our friend Katherine, who helped us resolve this issue.
Fig 2.21 Background
Fig 2.22 Background import
Fig 2.23 Background import
Week 12-Week 14
This was an incredibly challenging and intense week. Since we decided to rebuild everything from scratch, we truly had to start from zero again. We had to set up the camera, implement the WASD movement, recreate all of the gameplay mechanics, redesign the dialogue and image system, and rebuild the entire UI. Everything was different from our previous version. Because of the amount of work involved, we worked together almost every day throughout the week, often from the afternoon until early the next morning. This was the weeks where we got the least amount of sleep while working on this project. To manage the workload, we divided the tasks among the team members. I was responsible for developing the bartender section of the game (creating the bartender animations and dialogue, the animations and dialogue with Sarah (the female character), the "Press E to interact with the glass" mechanic, and the bubble mechanic, where players must click on positive words to succeed. Clicking on negative words causes the progress bar to decrease. The following is the progress.
First i created the bartender animation, dialogue, and images using a script called dialogue sequence second and then i add the script to the bartender sprite and fill the inspector.
First i created the bartender animation, dialogue, and images using a script called dialogue sequence second and then i add the script to the bartender sprite and fill the inspector.
Fig 2.24 Script
Fig 2.25 Inspector
However, after testing the game by launching it, I encountered a large number of issues. Some of the animations did not play at all, while others played but caused the characters to shrink unexpectedly. The dialogue and images also failed to appear, along with several other bugs. Fixing these issues took a considerable amount of time. After resolving the problems, I created a new script called SaraDialogue. This script was responsible for managing the dialogue and images that appear after the bartender interaction, ensuring the conversation continued smoothly into the next sequence.
Fig 2.25 Script
The same issues occurred while I was developing this section. I encountered many errors, with some animations not playing at all and others moving in the wrong direction or behaving incorrectly. These are some of the progress
Fig 2.26 Progress
Fig 2.27 Progress
After spending several hours fixing the script, I continued by refining and organizing the dialogue and images, adjusting the camera lock, cursor behavior, and other related features. Once those were working properly, I moved on to developing the bubble mechanic.
I used script called "bubblemoving" to create this game mechanic.
Fig 2.28 Script
These are some of the progress updates from developing the bubble mechanic. At first, I successfully made the bubbles move, but the movement was not yet smooth, and there were no visual or gameplay effects when the player clicked the wrong bubble.
Fig 2.29 Bubble game mechanic progress
After refining the mechanic, this was the updated result.
Fig 2.30 Bubble game mechanic progress
Finally, I reduced the screen opacity while this gameplay mechanic was active and finalized both the visual design and the gameplay experience.
Fig 2.31 Bubble game mechanic progress
Finally, I implemented the "Press E to interact with the glass" mechanic by reusing the same script that was used for the bartender dialogue, called DialogueSequenceSecond.
Fig 2.32 Click E to interact with glass
After that, I added the sound effects (SFX) and fixed several remaining issues that needed to be addressed. After everything was completed, we thoroughly tested the game to ensure all the mechanics worked as intended. Once the testing was finished, we recorded and made the game's walkthrough video.
FINAL OUTCOME
Playcanvas publish link: https://playcanv.as/p/qEd6dIE2/
Final Game Design Document:
Fig 2.33 Game Design Document
Game walkthrough video:
Fig 2.34 Game walkthrough video
FEEDBACK
Week 2
Idea wise, this is too mild to make it into a hoarding disorder, can be milden Still haven't get so much visualization about the story on how it will go Narrative wise, there are no unique mechanisms on it
Week 3
[No Class]
Week 4
For the Overall color scheme its already nice, maybe can make another Color palette for the normal one To prevent it to be so visual novel like, using a 3D background can be great For the breathing mechanics, can use "microphone" to let users understand how they control breathing, it would be more meaningful
Week 5
[No Feedback]
Week 6
Week 7
For the dance floor, the mechanism is messed up because of the camera position. Change the position and turn off cast shadow, turn on light map. The splats are too heavy which causes the game to be quite heavy, make the file less than 1 MB
Week 8
Week 9
Ron helped us create a script for displaying different dialogue texts sequentially in PlayCanvas. Using the Display Sequence script, we can edit the dialogue through the Properties panel by entering each line into the available text fields. We can also use Gemini to help generate or modify scripts when needed. A useful tip is to prompt AI in English, as it generally produces more accurate results. We also learned how to use the SuperSplat Editor to crop and clean up SOG/point cloud assets. Unnecessary points or dots can be deleted to reduce the asset size, which helps improve the game's loading time and overall performance.
Week 10
Week 11
Week 12
Ron said earlier that if we want to put all the assets in, don’t put them under the 2D Screen because apparently when we render the game, the camera will behave differently and it won’t be responsive. Instead, we need to create an Empty Entity, then put all the assets underneath it, so basically group them together. Also, if we move the assets out from the 2D Screen, some things will change and need to be adjusted again. Some of the scripts might also be affected because we’ve been setting everything up under the 2D Screen this whole time, so some things will have to be changed.
Week 13
[Still fixing Week 12 feedback]
Week 14
Good progress on the mechanism. Great 3D and 2D approach. Just a suggestion It would be better to fix the sprite of the 2D people so it won't be too flat, also the bartender sliding animation. Ron asked why we changed the Splat idea into a 3D asset, I answered, it was a very tough discussion with the whole entire team.
REFLECTION
I am very happy and grateful that I am finally able to complete this module. It has been the most challenging module I have taken so far. PlayCanvas was completely new to me, and I started developing this game without any prior knowledge of it. I had to learn everything on my own throughout the project. A long the way, I encountered countless scripting errors. There were many times when features did not work as intended, and sometimes the results were completely different from what I had expected. Fixing these issues took a significant amount of time and effort. There were also times when all of us had very little sleep because we had to rebuild the game from scratch after deciding to restart the project. We often worked together from the afternoon until early the next morning. Overall, this has been an unforgettable experience. I would also like to say thank you to my teammates. I would not have been able to complete this module without them. Love you guys! ❤️
.png)
Comments
Post a Comment