NexoPrima Patient Monitor

Project Duration

October 2018 - December 2018


NexoPrima (Freelance Project)


1 Product Manager, 1 UI/UX Designer


Nexoprima is a newly founded startup that focuses on Medical-Tech Appliances such as Patient Monitor, Bedside Ventilators and Nitric Oxide Delivery Devices. Recently they have managed to secure a research grant from a well-known private hospital here in Malaysia to spearhead on an integrated electronic medical record initiative.

The idea is to centralize the data obtained from every purchased proprietary medical appliance from different brands such as General Electric, MindRay, and Philips. This data is then accessible by registered user from anywhere in the world via any device that is able to run modern internet browser i.e Chrome.

As a heart surgery is ongoing in an Operation Theather, other healthcare practitioners can watch and monitor the progress of the patient elsewhere, regardless wherever they are. It is one prominent use case for this project.

My Role

I was tasked to design the UI and develop the front end codebase for this project.

Ideation and Process

Medical Appliances UI Convention

Patient stats are complicated and come in different multitudes of numbers. Since this is a short project, I do not have the liberty to run the usual UX exercises that I always do with other projects.

As commonly practice rule of thumb when dealing with a type of well-established consumer product. I experimented my design exploration with the common Medical Appliances UI convention.

Graphs, Vibrant Colors, and Mobile Friendly

One of the critical features that separate this initiative with existing solution is that the user can scan the QR code from a said device, and view in on his/her mobile phone. Hence, the challenge lies in making the whole view in a smaller format.

I was struggling to look for the best graphing approach for this project. Since it runs on a web browser, some criteria that I need to be careful with were its whole performance when more than three graphs are running concurrently.

Apart from that, the color scheme chosen is on a dark spectrum where it is friendly to human eyes in a dimmed room settings. The device usually will be switched ON 24/7 next to the patient. Having a bright background is absolutely a bad idea since it will lit up the whole room at night (sleeping time)

Visual Design

As with my other projects, I created a fully-functional HTML page to define all the needed scaffold for the back end developers. I also prepared a thorough how-to guide on how to run this project locally and paramount CSS classes usage, in case they want to develop the code base further.

Design Inspiration and Exploration

Inspiration : Philips MX550 IntelliVue Interface

Inspiration : Philips CM150 Efficia Interface and MindRay Passport8 Interface

Exploration : First HiFi mockup

Exploration : First HiFi mockup (Mobile View)

Exploration : On-screen keyboard placement for input using tablet

Exploration : Device settings menu

Exploration : Connectivity status

Exploration : Device settings menu

It works on normal browser. Try the DEMO version yourself using these links - Web, Mobile Optimized, and Frontend Documentation.

Watch the platform mimicks a proprietary patient monitor. Play video on a new tab.