Project Description

For the module "Games for Learning", taught over 5 weeks during the first semester our team was assigned with the challenge to create a mock-up of a game design for learning on one area of our interest. One of our teammates had a especial interest in teaching empathy skills to children, when she pitched her idea we decided that we all wanted to engage in that challenge!

The final product we created was a mock-up for an online game for children ages 6-8 that was anchored in storytelling components.

The Empathy Games is played on a tablet. It is designed to help children recognize their own and other’s emotions and to develop perspective-taking skills needed for empathy development. Children create stories, share them with their peers, and empathize with the stories of others to develop emotional literacy. Parents participate as learning companions and scaffold parts of the learning experience.

After the conclusion of this module, I used what I was learning in an Accessible and Inclusive Design module to propose a second iteration.


  1. Children between 6 and 8 years old will create stories about experiencing emotions and will explore also their emotions as they interact with stories of other learners.

  2. Learners will develop their emotional literacy by building their perspective-taking skills through understanding the emotions that the characters in stories feel in different situations.

  3. Parents will be able to support their children through the process of developing their empathy skills.

Learning Objective:

Learners will be able to recognize their own and other’s emotions through storytelling and develop perspective-taking skills necessary for empathy.

Game Design Process ad Key Features

Game Design & Features


We wanted to design an experience that was authentic for young children, as we also learned that narratives are important components of game design. We decided to base our game in storytelling. We decided to choose age 6-8 since kids this age are developmentally where it is appropriate for them to gain socioemotional awareness (Cress & Holm, 1998).

The learning technology will engage the learners in building socio-emotional awareness by allowing them to read picture-based interactive stories that are designed to help learners identify emotions and the facial expressions that accompany the emotions the characters in the story experience. Learners also would experience dramatic agency by choosing the outcome of the story and experiencing the consequences of their choices through the interactive story. Cress & Holm (1998) point out that children’s literature is an appropriate method to help children through the process of developing empathy because children ages 6-8 have the ability to describe emotions and respond to others who they see in pictures and stories. In addition, our research findings revealed that games are effective in developing identities. As being empathetic is a part of identity, we decided to move forward with our goal choosing a game format.

After gaining competence with identifying emotions and facial expressions in the characters of predetermined books on their own, the learning technology will be able to provide a way for the learners to join a community of learners (in a safe online environment) to create new stories together based on emotions so that the learners can have agency in the stories they want to tell and the emotions they want to explore with others, which will make them empowered learners as described by Gee (2005). The process of working with others will help them expand their mental model of socioemotional awareness and transfer what they learned on their own to a new collaborative setting. The technology will need to be able to make it easy for young learners to create their own picture stories in collaboration with other learners that show the emotions and accompanying facial expressions for the characters that they create.

Design Decisions on Features


An important design decision based on the literature was that children create their character (avatar) that reflects their identity, and play along with their own character. Gee (2005) and Schrier (2019) discuss how it is important for learners to be able to customize their game in some way to help them identify with the game and make it their own in some way, and customizing an avatar is a way help the learner see themselves in the game and relate to the stories they are reading. Users have the ability to customize their character by choosing their appearance, skin color, hairstyle and color, facial features, etc. This way, the users can create an avatar they can identify with throughout the game and have the opportunity to develop the character as they advance in the game by adding various new features, styles, etc.

Emotion rooms

Children explore emotions in specific emotion rooms

Once the learners enter the game, we decided they could explore different emotions by visiting different emotion rooms in which a stories related to that emotions embeded as a sandbox function to model storytelling, so that kids can later tell their own story. To make the game relatable to learners in our age group, we decided to focus on basic emotions that everyone feels: sadness, anger, happiness, and fear. In each room, they will encounter stories that will allow them to explore situations that lead to the emotions that are highlighted in that emotion room. We backed up this idea of a skill atoms analysis from Deterding (2015) to help us make decisions. For example, here are some rules for our game:

  • Learners can visit emotion rooms in any order they want

  • Learners need to complete to certain tasks before they can unlock other rooms

  • Users can switch between the rooms at any time.

  • Learners can share their experiences with emotions in each room by telling stories.

Gee (2005) describes the importance of giving learners the opportunity to make choices in a game, so if learners have the opportunity to decide which order they want to visit the rooms, how long they want to stay in that room, and whether they want to visit all of the rooms in one sitting or come back later to keep exploring. Thus, users gain autonomy in the game which has a positive effect on intrinsic motivation to play the game.


Children create their own stories and are able to share and interact with other ones created by their peers.

Learners need to be proficient in recognizing emotions by reading stories before they can start creating their own stories based on emotions. Once learners are ready to move to the step of creating and sharing their personal stories, they will use the same structure they saw in all of the other stories to create stories based on their own experiences. The Atlas of Emotions (Eckmand and Dalai Lama, 2016) outlines that our emotions unfold on a timeline, the timeline begins with a trigger that initiates an emotional experience and ultimately results in a response. Scaffolding through this model; “trigger- emotional experience- result” followed by strategies that help us cope with emotional reactions, children can build narratives and stories related to their experiences.

To help the learners use the structure of “situation-emotional response-action,” the app will scaffold the experience by asking them four questions that make it easier for them to concisely tell the core parts of their story that relate to what led to their emotion and the actions they took based on that emotion. Once they finish creating their stories, the app will animate it for them so they can enjoy seeing their story come to life in the app.

Allowing learners to share their own experiences allows them to connect the new concepts that they are learning about emotions to their previous experiences and helps them to expand their mental models about emotions and how they deal with their emotions. This makes the experience personal and meaningful for the learner, which fosters learning.

Parent's App

Since our targeted learners are young, they will need some assistance with using the game and transferring what they learn in the game to their real-world experiences, so the learning technology will be able to engage the teachers and parents/guardians through a guide so they can help learners use the game and also track the progress that the child is making as they use the game.

The guide will also help parents/guardians learn to help their children recognize emotions that people are feeling when they read other stories and in everyday life situations so that the learners can transfer the socioemotional awareness that they are gaining through the game to the real world.

Design Process

Mock-up iteration

FIRST DRAFT (1st iteration)

Our first draft of the mock-up was developed in a meeting in which all the team members contributed by sharing their ideas and coherently articulating them. We integrated game design principles in a white board that illustrated the possible interactions and design features in different steps that the learners may encounter within the game.

It was especially useful to sketch, and imagine each step and key interactions across the game in order to achieve the learning goals in a collaborative brainstorming session. We incorporated ideas drawing from the literature and the previous knowledge and experiences of the team members. It was important for us to keep in mind how this game would help kids develop socioemotional skills and emotional literacy in an engaging way through storytelling. Also, we wanted to make sure that we were incorporating game-like features and interactions.

Sketches of our group brainstorming session

SECOND DRAFT (2nd iteration)After having a concrete idea about what the game would look like we created a digital version of the storyboard to mock-up the basic interactions and features expected, so that our peers could better understand our objectives and desired interactions within the game.

In this version we included graphics that reflected the look and feel of the app if it was to be developed. This process of going "screen by screen/interaction per interaction helped us to identify what was missing in the process and how we could incorporate it. It especially helped us identify key moments and desirable interactions that the parent's app would play to help scaffold and guide their children in critical moments of the app that we recognized might need adult mediation.
This mockup illustrates and explains each of the desirable interactions and the design features we included for each stage of the interaction.

Click down to explore the storyboard and the description of each interaction.
PERSONAS In this iteration, we incorporated learner personas and their roles as a design practice to identify how the different interactions and features of the design to guide the use cases and understand which needs and opportunities each persona might encounter/bring across the learning design. Click below the images to learn more

Child Persona: Rebecca

Name: Rebecca

Age: 6 

Behavior Patterns: Rebecca is a very outgoing and energetic girl, she is very caring with her family members. She enjoys going to school and school work/learning  overall. She is smart and talkative. In her group at school and at home is a leader. 

Goals: She engages in ipad apps

Needs: Rebecca is the oldest of 3 siblings; one brother that is 2 and one that is 4. She is starting to deal with more homework in school as she is in first grade now. She often feels a little bit overwhelmed since she has always been competitive. She enjoys playdates with her friends at the park and in her friend’s houses although since the pandemic this interaction has been reduced which also makes her kind of anxious. Since she is very creative and artistry she has found other ways with help of her mother  to entertain herself with arts and crafts with her brothers. Both of her parents engage in her education and have quality time together. 

Attitudes, beliefs, and opinions: Since she is the oldest sister sometimes she feels responsible for taking care of her brothers. She is a very caring and loving girl with her friends and teachers as well. She likes following rules.  Overall is very confident, mature and a perfectionist. 

Skills: painting, playing games, sharing, communicating her ideas. 

Interests: Skating, art, playing with friends, being with her family,  school work. 

Parent persona

Parent Persona

Name: Sofia and Noah

Age: 35 and 38

Children: A seven-year old and a one-year old

Behavior Patterns: They both work 40 hours a week. Their children are in daycare and school while they are at work. After they and their children come home, Sofia and Noah prepare dinner together so that they can share a family meal together each night. On weekends, they participate in family activities together and also have leadership roles in community groups that take up some of their time on weekends.

Goals: They want their children to develop empathy for others.

Needs: They are busy and need some options for keeping their children occupied when they are busy with household activities and when they can’t directly interact with the children. They need to give their seven-year old options for things to do on their own when they are busy with the one-year old or other activities. 

Attitudes, beliefs, and opinions: They believe that children should have many options for ways to learn and utilize books, crafts, music, computers, and iPads to provide learning opportunities for their children.  They believe that iPads can provide educational experiences and allow their seven-year old to use the iPad for a limited period of time each day. They want to learn more about how to help their children develop empathy and how to apply what they learn from the game to real-world situations. 

Skills: They are tech savvy and know how to use an iPad and apps.

THIRD ITERATION: for Universal Design for Learning Class: Graphic Redesign

In my Accessible and Inclusive Design Module, I got the opportunity to redesign one aspect of the app to improve accessibility and inclusion from a Universal Design for Learning (UDL) perspective. including accessibility features for apps, and color contrast and graphic design principles.

Click down to learn more about the changes I incorporated

Learner Personas

We developed three examples of learner personas through our first iteration in the games for learning class. Then in our accessible and inclusive design class, I refined those personas based on possible challenges and opportunities that different persons may encounter and that we have to acknowledge through the design of the app.
These iterative process of refining personas with the lenses of accessible and inclusive design helped me broaden my perspective about the constraints and affordances this game may have for some people. And also, provided me with resources and data on what to pay attention to, in further iterations of the app in order to minimize the barriers the app might provide to some particular populations and enhancing user cases.
Click down to read the learner personas of The Empathy Games
Graphic redesign

Next steps

  • The feedback we received through peer review from our cohort members and professor helped us to realize that we could reach more learners if we modified our app to be used on Smartphones in addition to tablets, so we would need to decide what changes need to be made to allow the game to be successful on a smaller screen.
  • We also received feedback that suggested that sound effects, voice samples, and music would enhance the learners’ experience, so we would need to consider which types of sound effects and audio cues would be most effective for our target population. This could include doing some playtesting with various sound effects to see which ones are most appealing to our learners in further iterations.
  • We decided, due to financial constraints, that a good next step for this project would be to develop a paper prototype of our app that we could test with children, adults, and maybe with subject matter experts. This would help us test our desirable interactions and scaffolding elements before building a digital prototype.


What we did well

  • For addressing the learning objectives we provided interactions with stories and sharing personal stories to help learners identify emotions and relate them to their personal experiences.
  • For supporting mental model building we provide "sandbox" stories as one of the first interactions with the game, and examples that could help learners identify what is expected and at the same time, we provide specific scaffolding that help them recall personal experiences (prior knowledge) that relate to the story and that they could build-on.
  • For the process of addressing variation among learners we though about multiple learner personas with different backgrounds, needs, opportunities and possible barriers with the design. We worked on this part of the project in depth in our accessible and inclusive design class. We took design decisions of providing supports for multiple interactions (audio, record, written, drawings) for expressing emotions.

What we could improve:

  • Design justice: We missed sharing our ideas with the targeted learning population as co-designers; compared with other projects in which we could talk and formally test out designs and ideas with real learners, it is a whole different story. There were a lot of decisions that we had to make by ourselves based on the literature review, but not founded on what the learner population needs and wants. I believe that flashing out ideas with real learners could've been a good way to incorporate them into the process. Maybe by having brainstorming sessions with them, and, further in the process, testing our prototypes and mock-ups with them.
  • Supports for mental model building; Along with including the learner population in the process, we need to have expertise in our team either internally externally, on child psychology to inform our conjectures on socioemotional development in this stage and to support the creation of the stories.
  • Addressing variation among learners: The app design and interactions could be a bit complicated or confusing in some parts for some learners. It would be useful to rely on UDL and Human-computer interaction principles for UX/UI design to inform our design process to facilitate interactions and focus on the learning outcomes while being accessible and responding to variation among learners.

Key Takeaways

  • TEAMWORK! I enjoyed working with Sue and Anahit; we all contributed from our previous experiences, insights, and what we have learned over the course in a different way to build this game. It would have been a different game without the input of all the members of the team.
  • Create learner personas that reflect both parents and kids as learners to address the supports that each group needs.
  • Design a sketch of a mockup collaboratively before building the digital version of the mockup. This process helped to rapidly evaluate and refine our ideas collaboratively first to visualize expected interactions that addressed the learning goals based on the literature review. And afterward, built a digital version that flashed out our ideas graphically.
  • It is very useful to have formal brainstorming sessions early in the process in which the main purpose is to flash out ideas and openly share insights, critique early ideas and discuss learning objectives with team members. It is important to create a friendly atmosphere so that everybody feels welcome to share ideas in multiple ways. I realized that by engaging with materials such as markers, boards, or screens to sketch our ideas freely, and share our insights via sketches, words, drawings, or in written form. This helped a lot to understand together the learning goals and set clear expectations for the next steps in the design. As learning engineering is teamwork, this experience was very useful to engage collaboratively and recognize what each team member brings to addressing the design challenge.

  • The literature is always a great resource for generating ideas, insights and connections for the learning design. As all of our ideas in this project emerged from either literature for games for learning class or for our independent research, we could generate creative ways to address the challenge.

  • To engage in a real "learner-centered" design approach, we have to test ideas with real learners. We missed this chance, which was a component that definitely was missing due to time constraints. As learning engineers we always have to involve the learner population in the process. This is an insight to take into account for future projects or iterations of this same project.

Interested in knowing more about this project? Check our final presentation...

Final_Carolina Ali