Rogue Rhapsody
Designing an action rhythm-based video game challenging the player’s sense of rhythm.
Game UX/UI Design, Agile game development, Playtesting.
Roles & Responsibilities
Team Leader: Scrum Master and Art Direction.
UX Design: Ideation, Storytelling, Game Mechanics, Playtesting data analysis.
UI Design: Environment design, Character animation, Colour palette, Typography, and UI pop-ups.
Timeline and Team
2 Months, Autumn 2023.
Development: Andres & Brandon.
Art & Animation: Piti Pichedpan & Pei Shan.
Tools
Task Management: Trello
Design & Development: Figma, Illustrator, Procreate, GitHub & Unity/C#.
Background
Rogue Rhapsody was a project made as a part of one of my core classes at UTS, ‘Game Design Studio.’ Each student was divided into teams of 5 and tasked to design and develop a complete sellable game using Design Sprints. We used 'User Stories' for each sprint from a player’s perspective. Using the agile game development process, we successfully built and iterated on our creative decisions and collaborations, resulting in a fun and engaging game that mixed action shooting with rhythm-based gameplay to challenge players' rhythm skills. My team combined action shooting with seamless rhythm-based gameplay to test the player's sense of rhythm.
Recognitions
Top: SXSW, Bottom Left: UTS Tech Fest and Bottom right: Power house museum.
Play Now on PC
Movements: Use the WASD keys to move.
Shoot by pressing the left mouse key.
Press R to cycle between weapons.
Our Approach
Sprint 1
Scrum Master
Planning (Team Building)
Game Story
Vision & Scope
Mood Board
Game Design Document (Character Bios & Artistic Style outline)
Task Allocation - Trello
Version control - Github
Sprint 2
Game Mechanics
Game Controls
Audio Integration
Character Animation
Environment design
User interface
Rhythm based UI indicator
Play testing feedback Questionnaire - 1
Sprint 3
Feedback Analysis - 1
Refinement Game Mechanics
Refine Game Animation
Refine Environment
Refine UI
Marketing Assets
Play testing feedback Questionnaire - 2
Sprint 4
Feedback Analysis - 2
Design Refinement
Launch
Things I led
Sprint 1
Inspiration & Planning
24 March 2023, The John Wick Chapter 4 was released, and my team members had to look no further to get inspiration for the next game design project. Its captivating visual style, action genre, and character's unique personality made us excited and pumped and heavily impacted our development for Rouge Rhapsody.
Therefore, as a Scrum Master, I divided our timeline into 4 Sprints, each of 2 weeks. Each week included 2 Scrum meetings with all team members. Our roles were divided based on expertise, interest and curiosity to learn new skills. Each member's task was split into a “User Story,” and we decided to manage, track, and update our work progress using Trello.
In the first week of our sprint, I was to shape the visual and artistic direction. Our initial scrum meeting was an intense brainstorming session where we combined genres and mapped out the scope of our project using a SWAT analysis. We decided on a top-down, rhythm-based shooter with a dark, underground-themed aesthetic and a metal soundtrack.
Vision
Based on our brainstormed idea, I created a mood board to represent the artistic style and vision for the game. This included a thorough breakdown of game visual elements from action-oriented rhythm-based games, dungeon-style environments, title screens, UI popups, navigation, typography, pixel art and character animation sprite sheets.
Getting the foundations right
We decided to work on the game's functionality first. Therefore, we kickstarted the development with basic visual elements in place. The core idea was to develop the game mechanics based on the game's rhythm (audio) beats and player actions within the gameplay. I wanted to ensure that the gameplay was “enjoyable” and “fun.” The fine-tuning and evolution of the visual style will be done simultaneously based on the gameplay feedback, user experience, and basic interface likability from our playtesting.
To do so, I spearheaded the research and discussions on game mechanics, contributing significantly to developing our game's basic visuals using a sprite sheet and pushing it to GitHub for my team members to kickstart building the animations and mechanics. I also created a Trello board to organize tasks related to game mechanics, sound design, and visual/UI elements, ensuring effective collaboration and aligned goals.
Game Design document
Next, I worked on the game design document. I fine-tuned the story and character bios, ensuring a structured approach to set a solid foundation for developing our tech demo in the following weeks.
Sprint 2
Build to Test
During our second sprint, I focused on designing the look and feel of the environment. I picked up tasks based on the “User Stories” assigned while my team worked on the other critical aspects such as audio integration, game mechanics, player movements and controls. We aimed to build a minimum viable demo version of our Idea to test with players and gather first-hand feedback on the gameplay experience.
User Stories I worked on were: As a player, I want to navigate through the map along with directions to navigate and get obstructed by elements in the map.
As an environment, I want to create a feel and vibe of a dark underground city and city at night to serve and resonate with the story and follow the game's theme.
As a player, I want a distinct difference between my enemies and player character.
As a player, I would like to have a UI element that represents the music and rhythm-based criteria while playing.
As a player, I would like to provide feedback on the playtesting (Questionnaire).
A glimpse of the project management and User Stories assigned in Trello.
Based on our game story, I collaborated closely with my team, discussing and analyzing rough map layout ideas to ensure alignment with the vision. Using the Rouge Fantasy Castle assets, I designed a map that resonated with our "Metal City" theme. The central idea was to divide the map into 3 parts, where the protagonist has to navigate from the lowest difficulty level to the highest, ensuring the game-winning condition is met. I also ensured it captured the dark, trapped underground city vibe essential to our gameplay experience.
Map Ideation
Map Environment design
Defining characters
I decided to have a distinct visual contrast between the protagonist and each enemy to create a sense of differentiation. Additionally, I made some basic incorporation of UI elements to reflect the rhythm-based gameplay. Based on their visual style and narrative roles, I defined the game’s main character, Echo - animation state, Rhthm-based - UI shooting indicator and Player health Animation.
Echo
UI Indicator
Game Interface
To test our concept, we needed a basic playable character and animations to gather constructive criticism from our Playtesting. To do so, I, along with the artist and animator, decided to put together a basic game UI that the players can navigate. A few options are shown below.
Option 1: Mode & Select Screen - Start
Option 1: Mode & Select Screen - Game pause
Mode & Select Screen - Game end
Option 2: Mode & Select Screen - Start
Option 2: Mode & Select Screen - Pause
Playtesting - 1
By the end of Sprint 2, we had our basic game mechanics, visual design and audio in place to test our proof of concept. In total, 18 responses were recorded to validate and learn about the gameplay experience of our demo concept. The participants were classmates, tutors, faculty members, and colleagues.
To do so, I prepared a feedback questionnaire divided into six sections (Game Mechanics, Visual Design, Gameplay, Audio/Music, Game Controls, and Overall game feel) to collect the qualitative and quantitative data from our first playtesting. This mixed method ensures a complete overview analysis that can be made based on the overall gameplay experience, functionality of the game and usability. This comprehensive approach laid a solid foundation for the team to refine the game further in the upcoming Sprints and helped us receive first-hand reviews.
Sprint 3
Play testing 1 Analysis
I analyzed the feedback from our first playtesting. At this stage, we agreed to improve every bit of the game; therefore, we decided not to restrict the input by quantifying; thus, we didn’t use any success metrics. Since I was responsible for most of the Visual design part of the game, I analyzed every response from that section and looked for design opportunities to improve it. Next, I created User Stories to refine and added them to the Trello.
Design Refinements based on feedback
Based on each user story generated, I decided to fine-tune the complete visual design of the game, which included the first title and the end screen, tutorial pop-ups, health indicators UI, weapon selection menu, cut scenes and UI popups. Based on the feedback from the playtest, there was a lack of visual consistency overall. Therefore, I focused on those elements to be consistent and legible using appropriate contrast, layouts, typography, and game mood, intuitively reflecting the game's tone and feel.
I used the Fonts Dosis & Macondo Swash Caps from Google Fonts. I decided on the typographic style and color board and worked on various layouts and Interface options to represent various Ideas we could explore. Internally, we decided to move ahead with the option that reduces the cognitive load during the playtesting and focuses on the core gameplay.
A few of the ideas explored are shown here:
Title screen
End screen
Dialogue & Guided Tutorial - Protagonist
Dialogue & Guided Tutorial - Antagonist
Player Navigation, Player health and settings menu
Weapon selection screen
Cut Screen that displays the player's objective and aligns with the game story – Idea 2.
Player health UI Indicator – Idea 1
Player health UI Indicator – Idea 2
Player health UI Indicator – Idea 3
Playtesting - 2
By the end of the intensive Sprint 3, we had our refinements done from all departments, ready to be playtested for the final time. I was responsible for playing the game continuously after any updates were made to evaluate its smooth operation and any bug issues. Next, we playtest, and 10 responses were recorded for this phase. The participants were classmates, tutors, faculty members, and colleagues.
Playtesting 2 - In progress by one of the participants.
Sprint 4
Playtesting 2 - Analysis
After gathering the feedback responses, I analyzed the responses, and at this stage, we decided to qualify our responses. To quantify our results, we aimed to validate the data with a rate of more than 50% responses in the feedback. Responses below 50% acceptance were considered for review or further modification.
Design Refinements based on feedback 2
Based on the feedback received, we conducted our final scrum meeting, added our user stories to Trello and focused on refining any aspects of the game design that needed our attention. The analysis revealed that players needed more visual cues, identified spelling errors and were overwhelmed by the number of enemies in the gameplay. I added my User stories to the Trello and proceeded refining those bits.
Design decisions
To make it less overwhelming and easy to understand, I decided to add an enemy counter to make the game feel more cooperative and provide information informing players’ decisions. The first idea provided count of all the enemies individually, and the second one showed a collective number. After a quick discussion and A/B testing between ourselves, we decided to move ahead with Idea 2 as it was a compact design, reduced cognitive load with visually appealing features.
Secondly, I also added the Tutorial button icon for better accessibility so that the players could revisit the game's tutorial easily; however, this was an additional feature that might not be required, as the player could quit the game and play the tutorial again. This concluded our final sprint and the game was finally tested and published at itch.io publicly.
User Stories and a few tasks that were based on my previous work in progress of the UI: As a player, I would like the visuals to provide visual cues and not be overwhelming while in the gameplay.
As a player, I would like the visuals to enhance the overall game experience.
As a player, I would like to see no spelling errors while playing the game.
As a player, I would like to access the other guns while playing the game.
Enemy Counter UI System – Idea 1
Enemy counter UI System and Tutorial Icon – Idea 2
Impact
The game received many positive reviews, gained interest among local indie game developers, and invitations from industry-leading showcases. Our game analytics show that the game has been played more than 200 times, which is small but greatly rewarding for me.
Powerhouse Meuseum
UTS Tech Fest
SXSW
Reflections.
This project allowed me to showcase my ability to collaborate in a highly development environment, resolve conflicts, provide quick solutions, and work alongside the best artists, designers and creators.
The sprint-based approach was tightly framed with an action-oriented approach toward our development process. Every 2 weeks was a great learning opportunity to dive into unknown game UX/UI concepts and how they differ from traditional UX processes. Without the expertise of the developers in our team, our vision would have been a child-like concept, which would have never taken any shape or form within this timeframe.
The overall experience of the workflow was intensive yet enjoyable and rewarding. As a result of my retrospection, I realized that the game design document provided a deeper understanding of each aspect required for the next steps to skillfully execute actionable approaches in shaping the gameplay, where music plays a vital role in our planning.
Resolving Conflicts
Interpersonal Conflict: As a Scrum master, I believe the game idea is unique, fresh and exciting. However, to translate my artistic vision, I experienced that every designer/artist owns their unique style, which they tend to practice and have a comfortable relationship with. This mismatched the earlier ideas and did not align with my vision. The challenge for me was to show them that it is important to move out of the comfort zone to learn, grow and experience new styles of art and aesthetics. I made them believe in my vision through multiple 1:1 conversations about new art styles, providing YouTube videos to learn unity UI and later analyzing playtesting results.
Technical Conflict: During the end of Sprint 2, I faced impediments during my workflow. The first was Merge conflicts on Github, and the second was the files not being present as every team member was working on the same scene in Unity. To resolve the issue, we planned and started using individual scenes inside Unity to preserve our work. I merged most of the work on Github only when supervised or in the presence of Brandon or Piti, who could resolve issues if they occurred.
If I had to take this workflow again, I would make more skill-based improvements to understand better and deliver the coding or game mechanics elements that can help and provide more technical improvements and pace in the development.
Online scrum sessions, and happy faces.
What’s next?
We decided to keep fine-tuning our game and developing our art assets and music for future commercial releases. If I revisit this project soon, I will invest my time in understanding if the map can be generated using AI during the gameplay and how that would affect the gameplay experiences.
During our showcase at SXSW and Powerhouse Museum, we were successful in receiving some valuable Industry professional feedback on the game mechanics and guidance on how this can make a great market fit, especially for individuals who are music enthusiasts. To do so, we are currently looking for Independent music artists to collaborate with.
Lastly, I would work closely with animators to develop smoother UI interactions and Character animations, which will aim to provide a great sense of in-game emotional impact and satisfaction.
