MOBI-CPR

MOBI-CPR

Roles

  • UI/UX Designer
  • Unity Developer
  • C# Programmer
  • Sound Designer
  • 3D Modeling

Technologies Used

  • Unity
  • Blender
  • Figma / Adobe XD
  • Adobe Photoshop
  • FL Studio 12

Overview

MOBI-CPR is a mobile serious game designed to teach Basic Life Support (BLS) according to European Resuscitation Council (ERC) guidelines. This project was my first and longest, spanning over a year, and it served as my thesis. It was developed to provide an engaging and interactive way for users to learn and practice life-saving skills. The project was also featured in studies, including in the journal Resuscitation, to evaluate its effectiveness in teaching BLS. You can read more about it in the study published here.

During this project, I was responsible for every aspect of development, from UI/UX design, 3D modeling in Blender, programming in Unity (C#), to sound design and even composing the soundtrack. This project allowed me to combine my passion for game development with a desire to create impactful educational tools.

Development and Learning Experience

Like many gamers, my fascination with video games naturally led me into the world of programming (it’s a common story among us, isn’t it? 😄). I’ve always been inspired by the immense amount of work that goes into creating a truly engaging product. Companies like Rockstar Games stand out to me, not just because of their success, but because of their obsession with excellence and perfection. The smallest details—like the famous touch of the horses’ balls shrinking in the cold in Red Dead Redemption 2—are what make their products truly exceptional. I’ve carried this appreciation for detail into other areas, especially in my current focus as a front-end developer. I believe what truly makes a product stand out from the crowd are those small details, subtle animations, and a well-thought-out UX design.

When I attempted to channel this passion into creating a teaching video game it taught me invaluable lessons about what it takes to actually finish a project. One of the most important lessons was understanding that development is a never-ending cycle of improvement—there’s always something more to add or refine. But I also learned the importance of recognizing when to say, “Okay, it’s done now,” and move forward. This balance between striving for perfection and knowing when to wrap things up is something I continue to apply in my work today . It's also easy to get excited about the initial idea but much harder to push through the more tedious or less glamorous tasks that come later. It requires persistence to tackle the boring but essential parts—like debugging, optimization, or finalizing UI tweaks—that are crucial for making a project complete.

Game Architecture and Components

The game is designed around several core components and managers that handle different aspects of the game. Some key components include:

GameManager: This central script manages the overall game state, handling the flow between different scenes and user interactions. It listens for state changes and updates the UI and other game elements accordingly.

public class GameManager : MonoBehaviour
{
public static event Action<GameState> OnStateChanged;
private GameState \_state;

    public GameState State
    {
        get => _state;
        private set
        {
            _state = value;
            OnStateChanged?.Invoke(_state);
        }
    }

    private void Start()
    {
        UpdateGameState(GameState.Start);
    }

    public void UpdateGameState(GameState newState)
    {
        State = newState;
        // Additional logic for handling new state
    }

}

CameraManager: Utilizes the DOTween library to manage smooth camera transitions between different game scenes. This enhances the user experience by providing fluid movement and focus shifts based on game events.

public class CameraManager : MonoBehaviour
{
public Camera mainCamera;

    public void MoveCamera(Transform target, float duration)
    {
        mainCamera.transform.DOMove(target.position, duration);
        mainCamera.transform.DORotateQuaternion(target.rotation, duration);
    }

}

SwipeManager: Handles gesture recognition for user inputs, such as swipes for navigation or interaction within the game.

public class SwipeManager : MonoBehaviour
{
public float swipeThreshold = 50f;

    public void CheckSwipe(Vector2 start, Vector2 end)
    {
        if (Vector2.Distance(start, end) > swipeThreshold)
        {
            // Determine direction and invoke swipe actions
        }
    }

}

Game Flow and User Interaction

The game is structured around different scenes representing the steps in BLS according to ERC guidelines:

  • Safety Scene: Players must identify hazards and ensure the environment is safe before proceeding.
  • Response Check Scene: Players perform a simulated response check using device sensors like the accelerometer to simulate shaking the patient.
  • Call for Help Scene: Players must call emergency services and correctly respond to prompts regarding defibrillator usage.
  • CPR Scene: Players are guided to perform chest compressions and rescue breaths. The rate and depth of compressions are monitored and guided by audio cues created in FL Studio.
  • AED Use Scene: Players learn to use an AED, including applying electrodes and delivering a shock when necessary.

Watch the Game in Action

To see MOBI-CPR in action and get a better sense of its design and gameplay, you can watch a video demonstration on YouTube here.