introduction
WordGotchu was a collaborative project between D3 and FWSD students, specifically our team, OkayGeBusiness, comprised of 3 UX/UI Designers and 4 Full-Stack Developers. As a UX/UI Designer, my responsibilities included creating pixel background assets, developing personas, prototyping wireframes, and conducting user testing.
Tools
Figma, Miro, Photoshop
Scope
A team of 3 designers and 4 developers. 22 weeks.
the premise
Solve. Fight. Catch.
WordGotchu is a word-based pixel game where you can obtain unique “Gotchus”, collectable pets that fight along your side while you battle against friends. With each Gotchu having a special ability, players must solve as many words as possible with the limited time on the clock. In the end, the winner earns happiness points, money and more Gotchus!
Choose a gotchu to be your companion and champion.
At the start, you're given three gotchus to choose from. Select the one you prefer to be your initial companion.
Fight to earn happiness and money.
Enter the Gotchu Dome to join or start a match with a friend.
Players input a code to participate in battles or share a code to invite their friends to engage in combat.
When winning, you earn coins and happiness to keep your companion happy and level up.
Unlock the gacha feature to roll for more gotchus and expand your collection.
Spend your coins to acquire rare gotchus, giving you an advantage over your opponent.
The game journey🎮
ideation
Each member of the team came up with a game that must include multiplayer functionality and be compatible on web.
My silly idea was creating a world ruled by raccoons and monsters, the one collecting the most trash wins. It combined strategic thinking with elements of luck, offering players a mix of skill and chance.
some of the rough sketches I came up for Rac-kingdom:
Considering time constraints, technical needs, and team decisions, we decided for a game that combined two popular games: wordle + pokemon = wordgotchu!
User Flow & story Map
Next, we created a user story map that allowed us to prioritize users’ values while experiencing the game. With each user focus task, we brainstormed functionalities needed for the user to complete their task. Each functionality was judged based on the amount of effort it would take to design and build. We also laid out the user flow to lay out possible paths a user will encounter during their playthrough.
competitive analysis
To stand out in the market, we conducted a competitive analysis on seven both direct and indirect games with similar concepts and premises, such as Neopets, Pou, etc. We discussed what the games did well, what they didn't do well, and how they could improve through a list of actionable items.
This process allowed us to generate ideas and unique features that other games lack to engage. We also recognized characters that have consistent designs and engaging activities that don’t easily bore out the users were a big priority on our list.
user Survey findings
Gamers shared their love for games that look and feel good.
We gathered 26 participants to answers our survey for deeper insights and understanding when it comes to gaming. We want to understand what makes their favorite games stand out and how we can ensure our game captures attention and maintains enjoyment.
major commonalities
major pain points
user personas
We created two gamer personas and used Quantic Foundry to help us understand specific motivations and needs for different types of players.
Low-fidelity designs
On Figma, our low-fidelity was created to showcased the flow and user journey of key features. Our primary focus was on how to deliver the necessary information to users with minimal navigation required.
moodboard
Prior to committing to specific designs, we explore inspirations from numerous pixel games and art forms, allowing us to learn and develop our own skills in pixel art.
Given my role in designing the backgrounds and logo, I initially sketched out concepts before transferring them to Photoshop.
game UI designs
We designed a diverse range of assets, including intricately crafted Gotchus with distinct evolutionary stages, detailed environments, intuitive buttons for navigation and abilities.
part 1: usability testing
3 participants engaged in 7 scenarios, which were then evaluated and ranked according to their level of ease, difficulty, and completion.
For our low-fidelity prototype usability test, we recorded their path to reach each page, as there were two options for accessing it. Feedback was given by asking questions about their assumptions of the game based on the title, their thoughts on similar games, their preferred method of playing (keyboard or mouse), what they liked the most and least, and suggestions for improvement.
main issues
possible solutions
high-fidelity prototype
Considering all aspects, our goal is to recreate the ultimate gameplay experience and capture the pixel aesthetic within Figma. Despite facing limitations, we successfully prepared a high-fidelity version for our next round of usability testing.
part 2: usability testing
Users showcased a solid grasp of the game mechanics.
Our high-fidelity usability test was conducted with a group of 6 participants who were given 7 tasks to complete. We also solicited their opinions on various aspects of the game such as its art style, music, character appeal, and unlock progression. The participants were asked questions about what they liked the most, what they liked the least, and what improvements they would suggest to enhance the game.
main issues
possible solutions
final product
The game can be played here -> WordGotchu!
key takeaways
A first taste of UX Game Design.
This project was very fun as I've always been eager to explore game design and understand the process from the perspective of a UX/UI Designer.
What are my key takeaways?
01 – Pixel art is hard:
It was my first time venturing into pixel art, which required me to understand the techniques involved in creating artwork with pixels. I wanted to challenge myself artistically by creating the background artwork, and although it was initially difficult, I gradually became more proficient with practice. Through this experience, I have gained a great respect for pixel artists and continue to be amazed by their skills.
02 – Use a Game Engine:
I was a little worried when it came to prototyping our game in Figma, given the extensive frame requirements and the need to work within Figma's limitations. We chose to use Figma due to the time required to learn a new game engine. In the future, I would research game engines in the research/ideation process to avoid this being an afterthought.
03 – Making a game is harder than you think:
Finding the perfect balance between challenging and engaging is difficult to maintain since games can quickly get dull or difficult to solve. The feedback we received from testing was crucial, letting us know if the mechanics and user experience were heading in the right direction.