Tigerconnect

2016-2017

Redesigning TigerConnect's

Web App

Redesigning TigerConnect's

Web App

Redesigning TigerConnect's

Web App

Transforming a broken messenger into a scalable healthcare platform

Transforming a broken messenger into a scalable healthcare platform

Transforming a broken messenger into a scalable healthcare platform

Overview

The redesign of TigerConnect's web app addressed critical adoption barriers that prevented the company from evolving beyond encrypted messaging. The project aimed to transform a difficult-to-use, hard-to-scale interface into a healthcare workflow tool by creating a design framework that could serve charge nurses, doctors, and administrators simultaneously. This redesign was fundamental to TigerConnect's transition from messaging tool to comprehensive healthcare collaboration platform.

Healthcare design context: Healthcare design operates under unique constraints: user data cannot be collected due to privacy regulations, efficiency often matters more than engagement (clinicians need to focus on patients, not interfaces), and research relies on direct observation rather than analytics.

My Role

Lead Designer

UX/UI designer

Brand Designer

Project Manager

Platforms

Desktop App

Desktop Web

Mobile Web

Tools

Adobe Illustrator

Sketch

Zepplin

Invision

Figma (2017)

Year

2015-2017

1.5-year project

The Problems

TigerConnect was stuck as "just an encrypted messenger" when it needed to become a healthcare workflow platform. Through research and collaboration with engineering, we identified 3 primary problems blocking this evolution.

1. Broken

The web app was fundamentally broken for both users and developers. It was difficult to use and impossible to scale for new capabilities, with underlying technical issues from spaghetti jQuery code that broke with every edit.

2. Unusable

Key healthcare users couldn't perform their essential work with the web app. Charge nurses, who orchestrate care processes for hospital departments, worked with a high scale of information and couldn't use the web app for anything beyond basic messaging. The broken interface limited them from coordinating care at scale and in detail.

3. Inflexible

The interface design couldn't evolve beyond simple messaging. It was designed for only one purpose and couldn't scale to support the detailed workflows that healthcare requires. The interface structure limited us from creating the features hospitals needed.

Tensions

  • The charge nurse bottleneck: Charge nurses orchestrate care processes but couldn't use the mobile-first platform. They were the key to growth beyond messaging.


  • "Intuitive or death": Care teams can't learn new tools during emergencies, but most of their workday is emergencies. The product had to teach itself.


  • Multiple conflicting users: Nurses, doctors, administrators, IT, supply operators, security, and charge nurses all needed different workflows in one app.


User Targets

TigerConnect's users include every role within a modern healthcare clinic, making it almost impossible to prioritize since all should be considered to some extent. To address this, I created a clinical user context graph that would help us orient where our top 3 users per product would fit within the current project's use cases. This graph helped us understand user context more than their specific roles, allowing us to prioritize them and study specific use cases with those priorities in mind.

The Solutions

Emergency Messenger

Built around a simple messenger for emergency cases first, to reduce learning curves. If stressed care teams could use it during life-or-death situations without training, it’s likely to work everywhere else. Emergency departments became our guides.

Nested Apps

Added a feature navigator within the app to serve conflicting user types. This allowed different user roles to access their specific workflows without getting lost in each other's features. The same platform could serve multiple needs while keeping the core messaging experience simple.

Visual Hierarchy and the feature framework

Built a self-teaching hierarchy to reduce onboarding for future features. The macro-to-micro visual system (Tool → Organizations → People → Events → Details) taught users the structure through natural interaction patterns. Future features could plug into this framework without requiring new training.

Built a framework for the unknown to unlock future growth. This scalable design system could accommodate products we couldn't yet envision while maintaining consistency for users. It became the foundation for dozens of features that followed.

The Opportunity

A redesign could unlock the workflow features needed to become a hospital hub.

A redesign could unlock the workflow features needed to become a hospital hub.

A redesign could unlock the workflow features needed to become a hospital hub.

Brand Foundation & Design System

The web app redesign established TigerConnect's brand style and colors that eventually took over all company products. We created a set of colors, fonts, and styles that worked across Android, iOS, and web while allowing marketing flexibility for campaigns.


Although we built this before modern design system tools (pre-2016 design software, transitioning from Adobe Illustrator to Sketch), the web app later became the foundation for TigerConnect's atomic design system in Framer around 2021. The color palette we established has been used for over 10 years.

Implementation & Development

Designing and developing the new web app while simultaneously maintaining the old one created unique challenges. As TigerConnect continued adding features for customer and sales needs, I had to design for both the legacy system and the new framework simultaneously.


We launched massive features that changed healthcare tech operations during the redesign. The Roles feature, which focused TigerConnect entirely on healthcare (leaving finance and general security messaging), was completed halfway through our redesign. This meant building two versions of every new feature—one for the old system, one for the new.


Development took about a year as every function was built from scratch. We recreated middleware for better security and rebuilt the front-end completely in React to be modular and enable better user testing.

Final Designs

The following designs shipped to every Tigerconnect user.

Launch

The project started in late 2015 and launched mid-2017—about 18 months of parallel effort while building TigerConnect's other healthcare features.


We launched the messenger internally at TigerConnect, using ourselves as the first testers for daily work messaging. This gave us real-world usage data before external deployment.


We tested with a few pilot clinics, fixed issues, and added more clinics with each iteration. By the time 40% of the user base was on the redesign, common complaints from clinics stopped and key metrics were increasing. We rolled the redesign to all TigerConnect users by July 2017.

Results

43% increase in web engagement within one year of launch.

Unlocked charge nurse adoption, enabling TigerConnect's evolution from messaging tool to workflow platform.

Paved the way for new services

The engagement increase was great, but the real value was scalability. We didn't know what the future would bring, but we had a hunch the web app would be needed to manage it. The redesign enabled dozens of features that mobile couldn't support, making the web app essential for complex healthcare workflows.


Transformed company positioning from "encrypted messenger" to "healthcare workflow platform." The framework we created enabled dozens of new features that mobile couldn't support, making the web app essential for healthcare workflow management.

For more on this project download the app

Product Designer

Paul Rada Product Designer

Paul Rada

View Resume

View Code

Get in touch

Email Copied

View Resume

Get in touch

Email Copied

View Resume

View Code

Get in touch

Email Copied

Create a free website with Framer, the website builder loved by startups, designers and agencies.