Strescape: Gamifying Mental Health

Strescape is a game designed for high school students to recognize and process the factors causing stress while providing an interactive gaming experience. The player works through a series of puzzles and clues similar to an escape room setting with guided mindfulness chats between each puzzle with the game agent.

Team Project for the CHI 2020 Student Game Competition
4 Months
Adobe Illustrator, Premier and XD
UX Research and Design, Mobile App Design, Game Design

About the Project

I worked on designing this game for the CHI 2021 Student Game Competition with three other teammates who are also Master's of Information Science students. We also received guidance from Dr. Carol Scott (Post Doctoral Research Fellow, Social Work) for conducting background research on the topics of stress, mental health, mindfulness for high school students.

Strescape Team

A Quick Overview of the Game

Project Overview - Strescape
Game Overview

The Goal

Our goal was to create a transformative and transgressive play where we expanded traditional gameplay by using a gaming interface to provide high school student with a game that motivates them to recognize and process their stress and the factors contributing to it.

Brainstorming and Ideation

We started by brainstorming as many problems as we could solve using a game based on transgressive and transformative play and organized our ideas in a table as we moved ahead.

Organizing Ideas in a Table
Organizing Ideas in a Table

But the main idea that we unanimously agreed on was one that came from just having a conversation and bonding as a team. As we spoke about our high school experiences, we realized that all of us went through stressful situations of some type.

An Idea from Common Experiences

And we concluded having a that would help us reflect on these stressful situations might be a great problem to solve.

An Idea from Common Experiences

Background Research

To further solidify and define the idea, conducted background research under the guidance of Dr. Carol, we researched various concepts of mental health such as stress, anxiety, mindfulness, and meditation. From our research, we defined our problem statement and solution as follows:

Problem Statement

Students in high school struggle with stress and anxiety regarding peer pressure, academics, parental expectations and most of the time these issues go unnoticed due to social stigma.

Solution

Our solution would be targeted towards helping students recognize, process and possibly reduce the impact of the stress and anxiety they are facing as well as motivate the students to be aware of their issues and seek help through providing suggestions.

Target Audience

Based on our background research, we decided high school students would be a great target audience for this app

Platform

Once we narrowed our target user group down to high school students, we decided to design the game for smartphones making them available to the user whenever they needed to reflect on their stress and the factors contributing to it.

User Personas and Scenarios

Based on the background research and competitive analysis, we were able to create user personas which helped us assess the needs and the goals of our user related to our game. We also created detailed user scenarios which allowed us to discover the flow of the game.

Strescape Personas
4 Personas - Overview
Strescape Detailed Persona
Detailed Persona
  • The user scenario also helped us realize the puzzles in the game should not be very complex as the effect of the game itself being stressful would be counterintuitive to the overall of goal of the game which is to help students in managing their stress.
  • It also led us to deciding on adding another functionality to the game - a journal that stores player's progress.

Sketching and Wireframing

Once we all had an outline of how the game would function we started with creating sketches and wireframes for the screens of the game.

Simple Wireframes 1
Simple Wireframes 2

After completing the basic wireframing, we moved on to the define the specific details of each of the screens with each of the visual elements needed for the game as well as the mindfulness prompts that would be placed between each of the puzzles as shown in the game flowmap below.

Game Flowmap
Game Flowmap

Visual Design Elements

As we moved on to prototyping, we first defined the design components to make sure that there was consistency in the visual identity and the aesthetic of the game

UI Elements
Strescape Design System with UI and Game Elements

Our visual identity and elements aimed at:

  • Maintaining a calming aesthetic, using the primary color scheme of a desaturated purple and yellow.
  • Providing a sense of playfulness through the secondary color scheme
  • Designing a empathetic guide to walk the user through mindfulness exercises

Using these elements, we designed the final Strescape Prototype.

Try the Final Strescape Prototype

Strescape: Adobe XD Prototype

Other Deliverables: User Testing, Gameplay Video and Research Abstract

Along with the high-fidelity prototype, we also submitted a gameplay video where our prototype was tested by two users.

And we also submitted a paper explainng our research and game development process which can be found here

Concluding Remarks

Although we did not move to the next stage of the competition, this project was certainly a great experience of combining UX Research and Design Methodologies with Game Design, which is one of the reasons I loved working on this project.