Game Prototype: Gut Stop
These are screenshots from the prototype. Click here to try it out!
Project Type
Media
Audience
Game Prototype
Illustrator, Figma, InDesign
General Public
The final printed dissertation booklets.
A web-based game prototype exploring the digestive pathway and the relationship between nutrition and mental health. There are three playable routes, focusing on the digestion of different food classifications: fibre, protein, and sugars.
This prototype was developed to address the current limitations in nutrition education, such as the accessibility and lack of comprehensive visual resources. It serves as a proof of concept for how gamification can be applied to nutrition education to improve nutrition literacy levels among the general public by promoting user engagement to nutrition content, while reinforcing learning and retention through storytelling and interactive gameplay.
This project was a part of my Master's dissertation ("Gut Stop: Evaluating the Use of Interactive Multimedia in Nutrition Education") for my MSc Medical Art program at the University of Dundee. Along with the prototype, a booklet documenting the research, methodology, results, and findings for this project was produced.
A simple flowchart mapping out the key stages and features.
Ideation and Planning
Preliminary research and literature reviews were first conducted to help conceptualize the game's focus on the digestive system, forming the foundation for understanding nutrition and how the body processes food to support overall health.
A simple flowchart was created to define the key stages and its features, along with mapping out the general flow of the prototype. The different routes were also colour-coded to illustrate their own digestive paths.
A storyboard overview of the stages in game.
Asset Creation
All visual assets of the game were creating in Illustrator, allowing for the flexibility to rescale and reuse the assets without compromising on quality.
The design was kept minimalistic, using only a limited colour palette while maintaining key anatomical features. To achieve this, a paper cutout illustration style was adopted to create depth between layers, further defining each structure and giving more dynamic to the overall illustration.
Figma Prototyping
The prototyping was done in Figma, mainly utilizing its wireframing function to simulate the gameplay flow and user interactions.
The main UI assets (i.e., prompt buttons, dialogue boxes) were first created as Figma components such that they could be reused throughout various frames. The frames were designed by piecing together the different visual assets of each game stage, and were placed in sequence according to game flow. This allowed the ease of implementing interaction links between frames, ultimately forming the wireframe of the prototype.
Feedback Survey
An online survey was conducted to collect feedback on the prototype regarding its content, design, and gameplay experience. The prototype received positive feedback overall, with many participants citing that the prototype has potential to serve as an engaging and informative resource for gamified nutrition education among a general public.
Survey recruitment poster.
Final Prototype
It is recommended to try the prototype in full screen mode for an optimized experience.