Overview & My Role
UX Designer @ Thrive | Client, Mirion Technologies Inc. | 3 months | Nov. 2019 - Jan. 2020, Mar. 2020 - Apr. 2020
Mirion Technologies Inc. is a radiation detection company. Thrive previously helped Mirion design ACCURAD PRD (a personal radiation detector) and its packaging. This time, Mirion came to us with the challenge of redesigning the companion mobile App for this PRD.
I worked closely with a UX director and a designer throughout this project. I was primarily responsible for:
exploring different visual options for Home and Event screens
creating 1/3 of training videos so that they are ready to be animated
curating and co-facilitating the kick-off workshop with 8 clients onsite
co-presenting on weekly review session to clients
Animation by me , illustration by Maddie S.
What is Personal Radiation Detector (PRD) and What does it do?
Mirion AccuRad below is a Personal Radiation Detector (PRD) that detects radioactive and nuclear sources. It alerts users when a threat is detected by triggering selectable audible, visual and vibration alarms. First responders use it for public events like sports competitions and political gatherings where numerous people attending a single venue, to emphasize the need for reliable solutions to protect against potential radiological threats. PRDs also empower emergency response teams to efficiently detect and assess radiological risks within and surrounding critical infrastructure like government buildings.
Below are the pictures of this PRD and some scenarios it appears in.
Render images credit Thrive Industrial Design team
How might we redesign the app for the PRD so that it supports the PRD's functions instead of repeating it?
The PRD's screen always show the dose reading it detects and the direction of source in a graph. The previous app's home screen also shows the dose rating in the center in a circle, which is very similar to the PRD's presentation. Mirion team wants to re-build the companion app and makes it very clear that they don't want this app replace what the PRD does, it should only be a supporting device. Therefore, figuring out a new way to display the same information has become one of the challenges.
Main screen always show the dose rating in number
PRD image by Thrive Industrial Design team, old screen images from client
Radiation dose rating showing in number in the center, similar to the PRD
A seamless companion app, providing easy and
robust connection between the PRD and smartphones
AccuRad app is the companion mobile interface for the AccuRad™ PRD. It is the bridge between first responders on the ground and command center software, which provides real-time geospatial and radiological data relay so agencies can get access to the information when and where they need it.
How to Start
One-day kick-off meeting to understand what this PRD app needs to do and get our questions answered
During the 1-day kick-off meeting, clients from Mirion and 2 UX designers and a Design director from Thrive participated and discussed how this App should function and what features it should include.
Relationship for first responder & App
Phone data is trigger to series number of PRD
Chain of ownership is a problem
Must be connected to PRD (data key) to access data on phone except training
Pin code on device
Mixed population of phones + PRDs (how do we manage this)
Nothing is stored until event
What We Know
What We Don't Know
Steaming REQ on opposite side – content?
User level security
Is it accurate to access shift data without the PRD?
Mix population phone & PRD – management
What We Think We Know
NFC Pairing needs to be a thing if possible (bring your own & government issue)
Pin security on APP
Multi-states of paired/limited connectivity/etc (define today)
Data retention – needs to encrypted on phone
Streaming Realtime Data with Easy Way to Report
Home page shows most recent alarms, swipe to send events to people who needs to know
Histogram Shows Dose Read Over Time
Histogram matches the recent alarms and shows how long alarms happened
Options to Add Notes or Photos in Report
The system allows users to create mini reports at the moment with options of adding notes, photos, and recipients
Videos and Images Training Tutorials
First responders are able to learn how to use the PRD through the training session's video or step-by-step static-image style tutorials
Discuss and creating user EPICs with clients to determine high-level goals
During the kick-off meeting, we used the User Story tool to explore the app's functions. This helped facilitating collaboration and discussion between stakeholders, and the format is filling in "As a ..., I want to ... so that ...". We did this exercise with Mirion team and documented 12 high-level stories, which we concluded as epics in Jira.
Epics collaborated with clients onsite
Divide epics into several user stories focusing on how the app Help users to accomplish those goals
In order to better explore the experience from the user's point of view, we created listed and created more detailed scenarios under each epic. Every story is specific to an individual user, goal, and feature.
User Stories in collaboration with Jeff M. and George R.
What Are the Key Screens
Information architecture based on previous discussion and former app key screens
Since the app should only work when it's connected to the PRD, we built a very broad IA that divides the app's tasks into 2 statuses. When it's connected and when it's disconnected. Besides, we temporarily named the 5 main screen groups as Home, Events, PRD, Resources, and Setting.
Information Architecture Overview created by Jeff M.
Let's have the first round of flows
As we discussed and listed different user stories for each epic, we started building potential interaction flows under each scenario. Based on the information Mirion provided, the app should only work when it's connected to the PRD. When it's disconnected, only the training part in the app could still work.
User Flow created by UX team
Iteration, Iteration, Iteration
Challenge here, how much we show on home screen? Starting wireframes for the key screens
In order to explore the concepts for the key screens within the app, we listed related user stories combined with user flows as guidance to start the first path of wireframes. Here I demonstrate the Home and Event, these 2 screens as examples.
Relate user stories:
1. As a first responder, I need to be notified of events from the PRD so I can respond accordingly.
2. As a first responder, I need to send events to others so they are aware.
5. As a first responder, I want to know that my PRD is working so I can confidently complete my mission.
12. As a first responder or admin, I want to manage the connection of the PRD with the mobile phone so it is easy to pair/unpair it.