The Client

INVIA Medical Imaging Solutions provides software for nuclear cardiologists and other medical professionals. Nuclear cardiology is the leading, non-invasive, imaging technique for evaluating a patient’s risk of cardiac disease, and INVIA’s core product, 4DM, provides these doctors with 4-dimensional quantification tools for assessing cardiac health.

"Vitalsphere was a pleasure to work with and we are grateful we chose them to assist us in our web development. Their strength was in their simplicity; they were able to understand what we wanted after a single explanation, outline a straightforward plan for achieving the goal, and develop to that plan with very little deviation. Their developers were sharp and experienced, seamlessly working with our team to quickly implement effective solutions. Having a consistent, reliable, and predictable partner with us through this project made all the difference in our ability to complete it on time. We strongly recommend their services."

— Ashley Emery, Senior Director of Program Management

The Solution

INVIA’s core product, 4DM, has provided a 4-dimensional quantification and review environment for medical professionals for over 20 years. However, 4DM was built as a Windows application, and could only run on computers it had been installed on. INVIA hired us to help engineer a web-based solution: a “thin client” version of their product that could run in a web browser on any secured network.

Since both time and budget were key considerations, we worked closely with INVIA to find the most efficient path forward for their MVP. The solution we landed on was a hybrid: a combination of front-end and back-end rendering. We creatively engineered this dance between the server and client on a feature-by-feature basis to optimize for responsiveness.

Invia

The Services

Design System
UI/UX
Web App Design
React Development
Technical Documentation
System Level Architecture
Performance and Optimization

Supported Platforms

The App

Our design team worked closely with INVIA to improve 4DM’s user interface. We made incremental changes to modernize the application’s look and feel without alienating their longstanding user base.

Icons

We took INVIA’s original Windows application icons and translated them for the web. We optimized for efficiency by creating flat files and minimizing the colors involved. At each step, we triangulated between the original design choices, web standards, and more user-intuitive UI.

Invia Icons

Func & Quant

Invia Func Quant

MPI Summary

Invia MPI Summary

Screen Capture

4DM’s screen capture function allows users to capture an image or video. Since some of the web app’s canvas was coming from the server and some was drawn within the browser, we engineered a screen capture solution that composited server-side and client-side canvases into a single image or video.

Invia Screen Capture ViewerInvia Screen Capture OptionsInvia Screen Capture Full

Color Bar Slider

INVIA needed their users to be able to change the hue and saturation/contrast of images or video using 4DM’s color bar slider. In the web app, since the slider is on the client side and the images are rendered by the server, we programmed the interface to continuously pull updated frames in response to the slider position. To remove the risk of lag with animated content, we suppress animation while the user drags the slider and resume it upon release. We implemented similar solutions for the Magnification and “Cine” tools.

Scoring Maps

To improve UI responsiveness, we adapted this server-rendered feature to handle user input and render client-side.

Slice Control

This feature allows users to manipulate multiple cross-sectional image slices at the same time. We improved the overall UI, allowing synchronization of sliders and facilitating comparison of a given slice axis across multiple datasets.

Design System

The components we built for INVIA’s web-based version of 4DM can be used for additional features as new versions of the software are designed and developed.

Design System

Security Integrations

In order to serve up patient data to its users, 4DM must also integrate with multiple secure medical file systems. We worked with external partners to come up with authentication solutions that satisfy HIPAA security requirements while giving users seamless access to the 4DM web app.