MA Games Design Diary

Semester 3 Learning Agreement: : Western Project (UI Design) Research + Development Blog Posts: Week 1: Planning the Looting System Week 2: Design Characteristics of the Western Genre Week 3 + 4: Collecting Inspiration Week 5 + 6: Initial Concepts Week 7: Creating the Western Prototype in UE5 (Part 1) Week 8: Creating the Western Prototype in UE5 (Part 2) Week 9: Creating the Western Prototype in UE5 (Part 3) Week 10: Creating Loot Icons Week 11: Adding Pop-Up UI Elements Week 12 + 13: Creating Mission Passed/Failed UI Week 14: Improving the Lighting + Final Touches Knight Light (UX Design) Research + Development 

 I will use a 2.5D platformer template  by Alan Yarid for my game prototype.  Original Template Gameplay:

Learning Agreement: Western Prototype Playthrough:  Mission Failed: Time Running Out Warning: Environment Design + HUD: UI Elements: Loot Item Icon Designs: Menu Designs: Research + Development Blog Posts: Week 1: Planning the Looting System Week 2: Design Characteristics of the Western Genre Week 3 + 4: Collecting Inspiration Week 5 + 6: Initial Concepts Week 7: Creating the Western Prototype in UE5 (Part 1) Week 8: Creating the Western Prototype in UE5 (Part 2) Week 9: Creating the Western Prototype in UE5 (Part 3) Week 10: Creating Loot Icons Week 11: Adding Pop-Up UI Elements Week 12 + 13: Creating Mission Passed/Failed UI Week 14: Improving the Lighting + Final Touches

Playtests: From observing the playtests, I identified tasks for me to complete, such as: - Fixing the gap between 'loot' and 'the saloon' in the HUD, using a horizontal box.  - Improve the footsteps SFX. - Improve some sound effects, such as the sound effect for the door being locked.  - Make the 'interact' and 'take' pop-ups smaller. - Fix some objects, such as the wine bottles and glasses, which reflect light incorrectly.  - Remove the black bar that appears with the leave menu.  - Add a warning for the player to leave when they almost run out of time.  Improving the Item Notification Icons I added a drop shadow to my icon designs to make them stand out more. I also reduced the size of the icons slightly and moved the position of the rifle to diagonal instead of horizontal to stop the image from being squashed.  Improving the Lighting + Adding a Skybox Before + After: The default lighting and lanterns made my environment look flat, so I decided to crea...

I started week 12 by collecting visual inspiration for my designs, defining my design characteristics of my UI, and creating rough sketches.  Creating the Exit Menu I created my menu design using Adobe Illustrator and then exported it into Photoshop to add a ripple and a median effect to create the effect that the design had been printed on paper.   I then exported the menu background and the buttons separately as PNGs and imported them into UE5 and created the script below. If the player chose to leave the saloon with less than 10 items collected, they would fail the mission, and if they had more than 10, they would pass the mission and be awarded 1, 2, or 3 stars depending on how many items they found.  Creating a Custom Mouse Cursor  I created my mouse cursor in Procreate and imported my design into UE5. I then further edited the design using Procreate and Photoshop to add more contrast to make the cursor stand out more. I then created a widget containing my ...