POCKET ANATOMY

(aka Pocket Pelvis)
The human pelvis is one of the most anatomically complex areas in the human body for students to understand due to its complex 3D geometry, the layered pelvic walls, and the differences between male and female pelvises.

Pocket Anatomy is an AR app to 3D visualize the pelvic area, developed by UBC The HIVE. Compared to other learning tools like textbooks or cadavers, the mobile application provides a unique learning experience for medical students learning to visualize the pelvis in 3D.

*Additional project details under NDA.

UBC - The HIVE

University of British Columbia (UBC) - The HIVE is a multidisciplinary hackspace for innovation and visualization. The HIVE leverages the potential of emerging media to improve the educational experience for all learners in the Faculty of Medicine and around the world. The Pocket Anatomy is an AR App project used for a better understanding of Pelvis Anatomy.

UBC - The HIVE Page

My Role

Senior UX/UI Designer

  • Worked with the development and design teams on educational AR applications in the medical field.
  • Led the design team through critical design decisions.
  • Kept a strong communication between the design and development team.
  • Iterated user flow and prototypes to determine a new visual style.
  • Designed UI mockups for various in-app screens while maintaining a consistent style.
  • Facilitated design sprints to improve user experience.
  • Created a new design guide to highlight the refreshed visual identity.

Software Used

Our Goal

The aim of this app was not to re-create an anatomical model but rather to create a teaching tool that is both accurate and conceptual. The iterative design of the user interface and the user experience led to an educational experience where students can manipulate the 3D-printed pocket-sized pelvis and have control over which structures they can view in the augmented reality app.

Pocket Anatomy is an AR app that enhances the 3D visualization of the complex anatomy of the human pelvis. We combine a physical model of a human pelvis with 3D-modelled muscles, nerves, vessels, and organs. The app provides a unique educational tool for medical students as they learn to envision the pelvis in three dimensions. The pelvis itself is 3D printed, while the associated structures are created in Blender and ZBrush, and superimposed onto the physical model using Unity and Vuforia.

Our objective of this project is to redesign the Pocket Anatomy app interface to ensure the user experience is friendly and engaging.

Key Features

The application needs to be intuitive and easy to use, with simple navigation that feels natural to the user so it does not distract them from the visual and interactive experience.

The main feature of the mobile application is to allow the students to scan the physical 3D-printed Pelvis (image on the left below) and study the Pelvis anatomy.

The pelvis is 3D printed, while the associated structures are displayed in the app colour coded (eg: Bones are white, ligaments are red, Organs are yellow.) with coloured labels. The student can rotate, zoom, and move the model to view it more closely.



There are several features that can aid the students' studies:
  1. Lessons: Review the curriculum by going through each lesson.
  2. Explore: Explore the whole Pelvis 3D Model freely.
  3. Scenario: Watch videos/clips of a specific scenario.
  4. Scan: Scan a QR code.
  5. Saved Screenshot: Review saved notes/screenshots.

Challenges

  1. Attention span: Provide an engaging and interactive way for students to learn the human Pelvis.
  2. Display important information: Ensure all the important information such as bones, organs, and legament, are displayed in a meaningful way.
  3. Easy of use: Make sure the app is easy to use and navigate. Students can choose the specific chapters, show/hide parts of the model, and save sections of the chapters for future studies.

Design Process

User Flow

User charts, wireframes, and storyboards were created to better communicate the details of our application design to our technical team, helping to reduce development time.

Our application made use of a simple design with only two main points of interaction, enabling users to quickly and easily start a study chapter and explore the pelvis 3D model.

Wireframe

One of our key priorities was to ensure the useability of the app is friendly and easy to use. For example, it should be clear what icons mean and how each function works. It is also important to include features such as learning the course by chapters, hiding/showing name labels, rotating and enlarging the 3D model, and saving & editing chapters.

We start by making a low-fidelity wireframe click-through for our initial user test.

Visual Development

Our main goal was to redesign the user interface and add new features, such as chapter details and saving notes. We first focused on updating colours that are more delicate and easy on the eye while maintaining the medical and educational theme (comparison images below).

Final Deliverable

Through our ongoing prototyping, testing, and iterations, the final version was created:

Completion Rewards

When the student completes all tasks in a lesson, they are rewarded with a completion animation. This can encourage the students and motivate them to complete future tasks.

In-App Assets

These are some icon designs for the app.

Future Growth

With the success of our project, unfinished features will be developed. Further consideration could then be given to potential expansion through the exploration of different parts of the human body.


Want To Get In Touch?


Drop me a line anytime at the email below and I'll get back to you as soon as I can!