Overview
In this project I wanted to highlight my game UI/UX skills. Grocery Store Samurai is a 2d pixel art game taking place in a dystopian world where a samurai has to fight for their groceries.
Throughout this process I created all the pixel art elements and tried to create a well-rounded thoughtful design that incorporates the aesthetic of the game into the UI.
My contribution
User Experience
User Interface
User research
Motion Design
Software Used
Figma, Procreate, Unity
Process
Research & Inspiration
For this project, I took a deep look into the Game UI Database looking at both pixel art and 2d metroidvania games for inspiration. Some games I took inspiration from are, Prince of Persia: The Lost Crown, Hollow Knight, and Moonlighter. I also wanted to make sure that my UI matches the metroidvania requirements.
Drawing
Based on my research it seemed that it would be required to make the elements of the game hand drawn pixel art. For this I used procreate and created my own pixel brush and designed elements into a design system so that they can be changed in any way for screen size, and unique buttons.
Final Design & Implementation
Once I finished making the elements I started building the UI. I used Figma for the final design, and implemented my designs into Unity for fun. When making the layouts of this design I wanted the 'Options' panel to look like a series of folders and or a filing cabinet.
Conclusion
While this project is just a UI design concept, it let me test my UI/UX design for gaming and it taught me how to implement retro elements into modern game UI.
I was able to create a design that is visually appealing, is consistent across all screens even though each one has it's own different purpose. This project strengthened not only my UI/UX skills but also my designs skills and my drawing skills with procreate. Finally this project gave me the confidence to continue working on UI/UX for gaming and learn even more.