CPR Training is a virtual reality application for the Oculus Quest, which offers the opportunity for players to immerse themselves in a scenario where they can both learn and practice CPR.
My responisibilties included:
Motion Capture animations implementation
UI/UX design & implementation
Localization & Subtitle systems
In order for players to practice the proper teqniques, and experience the force required to compress the chest of a CPR patient, we developed a system for syncing the 3D model of the patient with an actual CPR mannequin.
The application was intended for use by a demographic that had never used VR, or even other traditional gameplay equipment like gamepads, before. This meant onboarding the player from a very basic level, while still allowing the experienced user to move forward at every turn, without having to wait around for prompts to appear.
GAMMA3 SURGICAL TRAINING
PROJECT MANAGER, UI DESIGN & IMPLEMENTATION
Gamma3 is a virtual reality application for the Oculus Quest, where medical professionals and students can practice orthopedic procedures.
My responsibilities included:
UI design & implementation
UI DESIGN & IMPLEMENTATION - BREAKDOWN
Canvas interaction is achieved through a custom VR Input module, handling interactions like hovering and clicking.
The pointer, together with responsive hover colors on interactive elements, offers a reticule which is filled in when the player can interact with an element. An optional tooltip can also be offered for each UI element, clarifying its funtion.
The interface has support for hand switching, allowing the user to switch to whichever her dominant hand is, by pressing the trigger, otherwise also used for button presses. To confirm the user's actions, haptics and matching sound cues are used on hovering and clicking interactible elements.
The menu is split up into several canvases, categorized as either static or dynamic, preventing batch re-generation of the entire menu content when only some elements are changing. Dynamic elements are also not set to be pixel perfect.
Since this menu mainly uses color switching for interactions, Unity does not even have to rebuild an entire canvas for all changes.
Menu animations are done using a tweening library, since using regular animatiors dirties their elements (causing a rebuild of the canvas) even when no animation is playing.
Each piece of text in the UI is entered as a key string, which is then used as a key in the currently selected language's dictionary. The dictionary is generated from an XML file (one per language) consisting of pairings of keys and translations.
All UI design (as well as web layouts, presentations etc.) is based on an established Style Guide, outlining typography, colors, shape language, etc.
This style guide is then continously updated to meet the needs of the UI design and implementation.