FREE UP YOUR MEMORY SPACE: THIS APP WILL DO IT FOR YOU
This interactive prototype was inspired by playing a popular video game Mario Kart 8 with friends. Its main intention is to do the heavy lifting and instead of having the player to memorize all the 48 level shortcuts t o memorize it for them.
This fun kart race with engaging animated characters offers many different race tracks with unique layouts where knowing the specific turns can significantly increase one’s chances to win. Some of the shortcuts only accessible when the player possess a special booster when other shortcuts can be easily assessed without it.
Even though the game community provides many helpful on-line resources and video tutorials, the timing is crucial when it comes to remembering all the details while playing. Having a quick references on mobile device helps to review the shortcuts while opponents are still joining the battle and provides an easy way to visualize specific short cut locations on the map and to get ahead of the opponents.
The Problem Statements
Design a handy solution for a quick cross-referencing Mario Kart 8 track shortcuts during playing an on-line game.
MOST IMPORTANT THINGS TO CONSIDER: THE DESIGN PROCESS
While designing the Guide and planning the mobile app layout, the two main things I wanted to consider is including a unique map for every single race track and an image of each shortcut clearly indicating left or right turn and the need of a speed booster.
For that purpose, I decided to use a combination of screenshots that I took while playing the game with a set of icons that I designed and the images of the race track maps in blue gradient that I found on-line.
WHAT I CAME UP WITH AFTER ALL THE STRUGGLE: THE SOLUTION
I made a Basic Logo and a Footer for my Main app Page where all the buttons with links and potential future resources such as 7 Tips to Win the Race can be displayed. Then I designed a Race Track Shortcuts Page, which is the main purpose of the app, showing all 48 levels in a grid system where each card is clickable and leads to a page specific to the chosen level.
For each level, I includes a Hero Image showing the level from a distance which can be quickly recognized by the player. Below the Hero Image is a race track map where with the circles I indicated the shortcuts using blue color for left turns and red color for right turns. Below the map are the screenshots indicating the specific location of the shortcut and the mushroom icon on the side which shows if the booster is needed for the shortcut access.
I also included the YouTube Video link with a lever walkthrough and a simple navigation buttons to get back to the Main Page or the Race Track Shortcuts page. Lastly, I added the Footer with the encouraging Good Luck message and an image I collaged using the game characters.
TESTING THE DESIGN AND MAKING THE FINAL CHANGES
On my original design, because there is so many levels and screenshot images, I wanted to save some screen space and used two columns instead of one. When testing on users, the feedback I received was that images and buttons are too small and that user would prefer to scroll down but be able to see larger images. Once I adjusted the design accordingly, I proceeded to creating all the game levels and linking the correct prototype frames into a flow.
WHAT CAN BE IMPROVED? MY PROJECT TAKEAWAYS
Testing, testing and more testing! As a designer, it is easy to make assumptions instead of performing a split testing on the user to identify the best solution. Certain parts of the design process can be avoided if the solution is tested at an early stages of the design.
On the other this app has many more possibilities of helpful articles to include, such as character and weapon overview, that can be added to the Main Page among with the 7 Tips to Win the Race.
Mobile App Concept for Mario Kart 8 Video Game Guide by Tatiana K, TK Create Design (2023)
For inquires, please email TKCreateDesign@gmail.com directly.
