UX/UI & Visual Designer
polaris.jpg
 
 

Polaris

A web-based data analytics platform to help optimize patient management and counseling. Some of the features I helped design were:

 

Physician order task flow

I was tasked to re-design the physician order task flow in order to incorporate a new sample collection option with saliva. With saliva option there are flows compared to the blood sample. Before I began on the design, I analyzed the previous design and gathered feedback and insight.

previous order flow analysis

Some user feedback & noticeable changes to be made for blood sample

  • Due to column alignment of content on step 3 with the stepper bar, users thought item correlated to the different steps

    • However each item on the page is for step 3 only

  • The iconography for some of the steps were not needed

Using those feedback, we can update the blood collection step and then apply the same designs to the saliva step.

 

final design implemented

The main difference with the design is the usage of rows instead of columns. This allows the users to read down the page which is the natural progression of user flow. The final design also includes the numbering of the step and less icons involved. This cleaned up the visual hierarchy on the page and lets the users focus on one thing at a time. User feedback from physicians stated that it was easier to read and follow.

 
 

final Saliva collection flow implemented

The saliva flow has one extra step which is that physicians give 3 options for patients to collect their samples with different information for each option.

If physician has a kit and the patient wants to give the sample during the visit

If physician does not have a kit, then they can have it mailed to the patient’s address for collection

If physician has a kit at hand and patient wants to do this at home

New proposed design with updated ui kit

As I got promoted to UX/UI designer, I started to look into aligning the Celmatix brands and their UI kits. A lot of the UI designs are not consistent through the platform. During the first designs, I was told not to re-design the progress stepper. However, for this proposal, I decided to ailgn all the stepper designs that is recognizable during the registration of the Fertilome genetic kits.

Fertilome order progress flow

After the physician collects your sample for the Fertilome genetic test, the patient has to register the kit and wait for the order to process before the results are sent to their physician. Previously, the patient did not have any way to see where their order is and what part of the order flow they are at.

 

New proposed design

As I started to delve deeper in the Polaris platform and trying to align all of the designs of the Celmatix brand, I noticed some disparities in minor UI elements. With that in mind, I decided to design a new progress stepper to align the UI kit.

  • Cleaner, easy to follow layout

  • Utilizes updated progress bar UI to align all Fertilome related brands

  • This will allow more text space

  • Users are used to seeing horizontal progress bars on other platforms and applications

 

Previous Designs

first iteration

I was tasked to design the flow last year with specific requirements to include iconography. Based on the constraints with specific design request, time and inclusion of iconography in the progress bar, I was only able to work on one iteration for review.

Current design

The final design that was chosen was for a vertical version of the design.

 

Polaris email opt-in

After the physician collects your sample for the Fertilome genetic test, the patient has to register the kit and wait for the order to process before the results are sent to their physician. Previously, the patient did not have any way to see where their order is and what part of the order flow they are at.

 

New proposed design

To meet HIPPA compliances, users are given the option to opt-in to receive protected health information. I was given the task to simplify the user flow and also to design the interface of the opt-in page.

  • I was able to reduce the flow to 3 simple flows rather than 3 flows with more nested flows