The problem
The current “Birds in The Trap” game store web page is visually noisy, it is also not very user-friendly. These two things would drive viewers away and reduce their interest in the PC game.
Role- Product Owner & UX designer
The product
The “Birds In The Trap” game store web page.
The goal
The goal is to design an aesthetically pleasing and user-friendly game store page for the Birds in the Trap PC game.
Duration- 1 weeks
Sprint
It took only 1 sprint to complete this project, the sprint took a week. I was the product owner on this project, I was the liaison between the designer and the stakeholder (I helped with research and some design work). A product backlog was created, and I prioritised the items based on how important and valuable I believed they were to the end product. I communicated daily during the week virtually with users and separately with the other team members during the sprint process. I conducted a sprint review in which I showed the design to gain feedback from the stakeholder and also I conducted a sprint retrospective to discuss how the sprint went, the process and the tools we used were the topics.
Project Background
“Birds In The Trap” is a PC game, currently being developed by Pentecost Studios. I was tasked by the studio to design a new store page for the game on itch.io, this was an exciting moment for me which I took on very well. There is a current store page but this needed revamping, so I took on this project to propose a new look and feel.
Snapshots of the current game page
Prototyping
After understanding the task at hand, wireframing began.
Paper wireframes
3 different wireframes were sketched showing what the game store page could look like. An asterisk was placed next to the most-liked features (communications were held with the stakeholder)
Digital wireframes
After creating paper wireframes, Figma was used to create digital wireframe versions.
Chosen wireframes
High-fidelity mockup
High-fidelity prototype
After choosing a final design, a high-fidelity mockup was created We iterated on the design after some feedback and thought.
We then incorporated the features with the asterisk to create the final wireframe.
Testing
When the prototype was finished, I did a guerrilla test to get high-level feedback and to spot any issues. A diverse range of people had a chance to view and use the prototype, including the owner of Pentecost Studios. The users (apart from the owner of Pentecost Studios) were shown the current page before they used my prototype.
Final prototype feedback
Person 1- “This looks super cool, I like it but it is a bit wordy”
Person 2- “I like this! it is very user-friendly”
Person 3- “The text is readable for people like me who are visually impaired, the images are great as well”
Person 4- “ This looks good, everything is well put together, the current one looks a bit messy”
Person 5- “I do prefer this more than the current one”