top of page
Role

UX Design, User Research, Visual Design, Usability Testing

Team

Cooperation Project

Liujun Du, Nicolette Tseng

Ming Gong, Jiazhi Han

Tools

Figma, Adobe Illustrator, Adobe Photoshop, Adobe After Effects, Adobe Premiere, Rhino, V-ray

Company

Beaba | Brazil

CEO - Simone

Designer - Elisa

Timeline

Oct 2021 - Nov 2021

Background
Beaba | Alpha Beat Cancer

Creating Multiple Mini Games, Reward System and Immune Final Challenge in the Mobile Game.

Alpha Beat Cancer is a Game Mobile APP designed by Brazil Beaba company for children with cancer. The goal of this project is to optimize the current game, let more cancer children play this game and accompany them through the treatment process. Through the educational content in the game, let them treat the disease correctly, learn to take care of themselves, and cooperate with the treatment without fear and resistance. 

What has Beaba done?

Beaba (bay-ah-bah), an institute that provides clear, objective and optimistic information about diseases and treatments. 

Since 2013, they have empowered patients, families and health professionals through information and communication, increasing engagement with financial support, cancer treatments and life quality improvement.

presentation-2.jpg
title1-0.jpg

Although there are a lot of game content, the game lacks level difficulty changes and specific challenge object, so that children are unwilling to continue playing after 3-4 game levels.

Discover & Empathy
Online Meeting
Online Regular Meeting.jpg

Through our online meetings with Beaba's CEO, Simone and designer, Elisa, we determined our design direction to optimize the current game APP problems, which is shown as below:
Business Goals:Enhance the game experience and attractiveness, allowing more users to play repeatedly. At the same time, to optimize interface design, some new game levels must be conceived.
User Goals:Children can have a better time in the hospital, and they can learn the basic information and treatment methods of cancer by playing different game levels. Let the children reduce the fear of treatment.
Target Users:Children 4-10 years old with cancer

Interview

At the beginning, I conducted a detailed interview with my friend in the Hematology Department of Children's Hospital. At the same time, I also interviewed his leukemia patients to learn about the specific information and needs of target users.

校-interview!2.png

Interview with the doctor

doctor.png
校-interview!3.png

Interview with the patients

patients.png
User Journey Map

Use the user journey map to determine the user's views and attitudes towards the various steps and details in the game. At the same time, determine the user's pain points and the opportunities that the game can develop.

USER JOURNRY MAP.png
Empathy Map

Through empathy map, I can better understand the expressions, actions, feelings and thoughts of patients, and have a clearer view of the suggestions and opinions of cancer children on this game, so that we can solve various pain points more accurately and efficiently and optimize this game.

EMPATHY MAP.png
Game Comparison Analysis

We compare other children's games to find out the design reasons behind the same features and functions of the games. In this way, we can optimize and modify the current functions according to our own design goals and user needs. We have summarized the characteristics and differences of the following children's games:


1. Children's games generally have educational attributes and have a reward system.
2. Most games have Final Challenges to arouse children's desire to win.
3. Voice Direction and Mutiple Dfficulty Levels can greatly improve the gaming experience.

COMPARISON ANALYSIS.png
Definition

Through the above investigation and analysis, we have summarized the problems, challenges and solutions currently faced by the project to facilitate our further new designs. After discussion, we concluded the following four solutions:


1. Set up games of different difficulty levels, allowing users to choose independently.
2. Add evil character and design the final challenge.
3. Add different environments to the map and other game levels, such as forests or streams.
4. After the child passes each term, the item will be rewarded.

DEFINITION.png
title1-1.jpg

Only by arousing children's desire for victory to a certain extent can they increase their interest in playing this educational game and gain basic medical knowledge.

Ideate
Brainstorming

Through regular meetings, we carry out project design as planned. In the conception stage, we brainstormed and conceived the following content to be added in the game:


1. Anemia:Because children with cancer often fainted due to anemia, we started with Anemia as a term to design games with different levels of difficulty. Through this mini game, children with cancer can take better care of themselves and avoid sudden fainting and injury.


2. Immune Challenge:In order to stimulate children's desire to win, I proposed the concept of Final Immune Challenge. Children can learn and accumulate energy in different levels, and then they can choose to fight against the monster.


3. Energy bar:Whenever the energy bar meets 10 units, children can choose to challenge the cancer boss and accumulate energy by collecting fruits and vegetables on the map.


4. Wardrobe:It is used to collect the outfits rewards received by children, which can be checked at any time in the wardrobe.

微信图片_20211121010734.jpg
Sketches

I am mainly responsible for the analysis and redesign of the cartoon image in the game, as well as designing the operation process and specific interface of Immune Challenge. I drew the following sketches to help me advance the design:


1. The conception of the character image of Final Immune Challenge and the drawing of the game flow and interfaces.
2. Analyze and optimize the existing cartoon characters, and put forward the idea of multiplayer and animation.
3. Draw wireframe sketches of Anemia's game interfaces of different difficulty levels.

微信图片_20211017121333.jpg
微信图片_20211017121334.jpg
微信图片_20211017121335.jpg
Mid-Fidelity Wireframes

We determine the basic function interface and user flow of the game by drawing the mid-fidelity wireframe, and continuously iteratively optimize the main game levels and gameplay, including the expression of sentences, to match the children's psychology. We have summarized the following points:


1. The game levels are mainly divided into Anemia-Level1, Anemia-Level2 and Immune Challenge.
2. When the level is successful or unsuccessful, there will be a relative interface popping up to encourage the children or let them not be too discouraged.
3. Whenever a Mini Game is passed, the reward system starts to distribute reward items to children.

hebing.png
Character Design

In this project, I am responsible for the modification of existing cartoon characters and the design of new characters and outfits. Through the analysis of the existing image and painting style, including the needs of the game experience, I made the following design:


1. Cancer Boss:Added the evil character in the final challenge. In order to be different from other characters, the cancer boss image is bolder and exaggerated, which is used to arouse the desire of children to overcome it.
2. Immune Challenge Outfit:In order to add to the challenge image of the bear in Immune Challenge, headdresses, glasses, capes, and superman clothes are used to highlight the character.
3. The Expressions of Each Character:Various expressions are designed for each character in the game, which is convenient for displaying different emotions according to the game procedures.

Cancer Boss

monster.jpg

Immune Challenge Outfit

bear.jpg

The Expression of Each Character

EXPRESSIONS.png
title1-3.jpg

Here are our Key Decisions! We creat Multi-level mini-games, Reward system and Immune challenge  to achieve our design goal and provide cancer children with  better gaming experience.

Key Design Decisions
Design Decision1 - Multi-level Mini Games
1.png

- Levels of difficulties, to attract kids to keep playing.
- Rewards after unlocking all levels, to encourage kids play more.
- Collecting fruits and vegetables to increasing strength bar and preparing for immune challenge.

2.png

-  More gestures and skills, more challenging to a higher level.
-  Different backgrounds for kids to get familiar with more environments.

Design Decision2 - Reward System
3.png

-  Instead of using sword and shield as rewards, kids get items more related to their treatment process.
-  Each reward has its corresponding special effect.

4.png

-  Kids can also get outfits as rewards for fun. 
-  With more tasks accomplished, kids will unlock more outfits and will be able to change their appearance in wardrobe.

Design Decision3 - Immune Challenge with 'Cancer Boss'
5.png

-  Increase the final challenge to increase the fun of the game and stimulate the child's desire to play repeatedly.
-  Whenever the energy bar is full of ten units, children can choose to initiate a challenge to Cancer Boss.

6.png

-  When the challenge is lost, it will show that children need to eat more vegetables and fruits and complete more game levels to strengthen themselves.
-  Celebrate when the game is won.

title1-2.jpg

Through feedback from children with cancer, clients and other users, we have further optimized it. Comprehensive consideration is given to children of different ages.

Usability Testing
Feedback & Optimization

Through testing and reporting on children with cancer, our clients, professors and classmates, we have received a lot of feedback and made the optimizations based on these information.

校-interview!4.png
校-interview!5.png

User Testing - 4-6 years old

User Testing - 7-10 years old

1. The instruction steps need to be further simplified and clearer, otherwise young children will not be able to read it.
2. The color of the interface can be brighter, so as to better attract the children's attention.
3. User flow needs to further simplify the operation steps to facilitate children's quick navigation.

1. The Final Immune Challenge needs to strengthen the skills that users have. For example, when using the eyes, the background will turn into lightning.
2. The choice of term needs to be more cautious, try to find something that is related to the daily contact of cancer children, not too abstract.
3. Outfits needs more styles.

校-interview!7.png
校-interview!6.png

Internal Testing

Other Feedback

1. Change the tree species of the background tree of the map, such as the number of the Brazilian tropical rain forest.
2. The fruits on the map can be replaced with bananas and other foods with skins, because fruit with skins is safer and more suitable for children's daily lives.

1. When the wardrobe is changed, the background of the game can also be changed, which will be more interesting.
2. You can add voiceovers from children of the same age, so that the children may feel more cordial.
3. The multiplayer system can have a positioning function, allowing children in the same hospital or even the same ward to play together.

title1-4.jpg

We hope that through the optimization and modification of Alpha Beat Cancer, we can provide cancer children with a better gaming experience and learn to take better care of themselves in the treatment process.

Reflections
Reflections

Through this game design for children with cancer, I have a better understanding of the role of interaction psychology, interface design, and game content on the growth of children. Children with cancer are often more mature and sensitive than other children of the same age and need more careful protection, both physically and psychologically. I hope that through the design of this project, children can ease their pain and give them the motivation to continue the treatment.

Here is my Beaba Certificate 😉 👇 

Jiazhi Han-certificate.jpg
bottom of page