Improving efficiency in remote consultations

Medgate, a Swiss telehealth provider, built a web-app to replace their legacy electronic health record (EHR) system. Although the change was triggered by technical needs, Medgate set out to increase the efficiency of doctors by 40% through the new solution.

Company
Medgate

Year
January 2023 – now

Role & team
Leading designer, working along Product Owners, Developers and Doctors

TL;DR

Challenge

Medgate doctors have worked with the legacy electronic health record for over a decade. Medgate had designed and maintained the software itself. New features were added over the years, while unused ones were seldom removed. Each functionality hid a complex set of rules, sometimes due to the federal Swiss healthcare system and other times because of the misalignment between business decisions and software design.

Besides replacing outdated technology, the primary goal of the new software was to enhance doctor's efficiency by 40%, enabling them to complete more patient consultations while simultaneously creating high-quality documentation.

Approach

Especially in the beginning of the project time and resources were scarce. I shadowed doctors during their daily work and consulted with Product Owners to gain insights into workflows and the current software. I designed everything from the concept to the UI component of the newly created design system. I managed a team of 3 developers, who coded a prototype, which I used to test the ideas with users and discuss them with stakeholders.

For the final implementation, I worked as the sole designer with up to 7 Product Owners, which made it challenging to stay abreast of all topics sufficiently to make informed design decisions. To address this, I engaged the Product Owners in human-centred design methods, such as involving them directly in the usability testing sessions.

Result

The previous software did not have a single major efficiency killer; instead, it suffered from numerous small inefficiencies that cumulatively wasted time. In addition to reducing unnecessary clicks, we managed to improve the information hierarchy to lower the cognitive burden on doctors. The new software is designed to reveal just the right level of information at the precise moment it is needed. This ensures that doctors are not distracted by the software during patient interactions but are instead guided through their conversations with patients.

The new software went live in September 2024. Despite receiving only a fraction of the training provided for the old software, most users have successfully utilized it during patient calls. The overall feedback has been very positive. Although most performance-enhancing features are not yet implemented, making it difficult to measure efficiency gains at this stage, we are optimistic that the key workflows will ultimately improve efficiency and allow doctors to focus more on patient care rather than navigating the software.

Centralized medical information for enhanced efficiency and patient safety

While observing Medgate doctors using the previous software, I noticed that they frequently had to navigate between different pages during patient consultations. This observation led to a key decision: reorganizing the information architecture and layout to consolidate all medical information on one page. The new layout is structured as follows:

  • Center: A chronological feed of progress notes displaying information about the patient's current and past encounters with Medgate.
  • Right Side: An overview of general health information, providing a quick summary of the patient's health status, including allergies, family history, and more.
  • Left Side: A zoomed-out timeline of all Medgate visits, organized by diagnosis.

To accommodate all relevant content, temporary surfaces appear on the right side, allowing the user to obtain or edit specific information without losing context. For example, doctors can document allergies while still viewing the medication list, or quickly determine if a piece of information is relevant only for the current anamnesis or should be documented in the general conditions for easier access by other Medgate doctors in the future.

A three-step approach for efficient care provider search

One of the most time-consuming interactions in the previous software was finding the right care provider for specialist referrals. Upon closer investigation, I discovered two primary scenarios in which a Medgate doctor needs to search for an external care provider: either the patient already knows which care provider they want to visit, or they have no idea and seek a suggestion from the Medgate doctor.

To address these scenarios efficiently, I segmented the search process into three steps:

  1. Favorites and past visits: When the doctor clicks into the search field, any care providers marked as "Favorites" by the patient appear immediately, along with care providers the patient has visited in the past.
  2. Dynamic search: As the user starts typing, results surface based on the search term using fuzzy logic. This allows the doctor to type partial keywords, such as "Zur" and "Derm," to find dermatologists in Zurich. The search accommodates queries by care provider name, address, or specialty.
  3. Extended search: For more precise results or browsing options, the doctor can open the Extended Search. This feature allows filtering by a wide range of parameters, including opening hours, language, and diagnostic capabilities.

Simplifying business processes to reduce manual labour

In addition to the EHR we designed and built a web portal that allows patients to submit files relevant to their treatment as well as download the documents created by doctors (e.g. prescriptions, sick leave certificates) after the consultation. Previously this involved a complicated workflow including 3rd party email services and manual labor by the patient receptionists.

Leveraging AI for enhanced communication and medical documentation

The recent boom in AI technology offers new possibilities for efficient documentation in healthcare. While significant efficiency gains for Medgate doctors were anticipated through the use of AI tools, it's crucial to carefully consider unwanted outcomes.

For instance, a tool that corrects a doctor's chat message to ensure it's patient-friendly and grammatically correct is relatively harmless. However, using AI to summarize a patient questionnaire might be riskier, as important information could be lost. Additionally, it is important to avoid giving doctors the impression that they might soon be replaced by AI.

These factors require careful consideration when designing AI tools. We addressed these challenges by clearly indicating when information was enhanced by AI and branding the AI tools as "Assistant," rather than using any term that might suggest doctors are gradually being replaced by machines.

Building trust in remote care

For over two decades, Medgate has provided remote doctor visits. Initially conducted exclusively via phone, these consultations can now be held through a mobile app. In telehealth, digital touchpoints replace physical doctors' offices. How do they have to be designed to cultivate a trustful bond between patients and physicians?

Company
Medgate

Year
October 2022 – now

Role & team
Leading designer and design system manager, working with POs and a freelance designer

TL;DR

Challenge

When it comes to telehealth, digital touchpoints assume the role traditionally occupied by physical doctor's offices. Just as the interior design of a waiting room can influence assumptions about the quality of care, so can the design of an app. Digital health services need to convey to their patients that the medical care is high quality and the patient's health data is safe.

After years of relying on short-term engagements of external designers, in 2022, I became Medgate's first in-house designer. The haphazard involvement of design in the creation of the app became evident through awkward user flows, inconsistent UI and a large number of bugs.

Approach

My primary objective was to stabilize the design system and elevate the app to a new standard of professionalism. I had the opportunity to hire a freelance designer to help redesign user flows, while I concentrated on establishing the design system as the new, unified source of truth for brand expression.

Result

We have given the app a fresh, more cohesive look and improved its accessibility. While there is still more work to be done, this is a significant step toward creating a digital touchpoint that inspires confidence and trustworthiness.

An accessible colour palette optimized for multi-brand-use

Previously, the color system consisted of various scales made of tints and shades with non-descriptive names. The colors were used inconsistently and several of the color values didn't fulfill accessibility standards.

Furthermore, the Medgate app is published in four different brand versions, one in the Medgate branding and three for partnering health insurance companies. Previously, colors were manually swapped for each brand on a per-screen basis, leading to implementation errors and a time-consuming process for both designers and developers.

I revised the color system to achieve the following benefits:

  • Accessible color palettes: The slightly adjusted color values are more vibrant and fulfill accessibility requirements.
  • Semantic color tokens: Descriptive names reflect the intended use of colors and simplify communication with development.
  • Streamlined branding: To optimize efficiency, only the primary color will be swapped for each brand. This decision, combined with Figma's new variable feature, significantly reduces the effort for the creation of visual assets (like app store screens) and development.

Streamlined icons for a professional look

Previously, icons came from different sets or were individually customized, resulting in a mismatched set characterized by varying line thicknesses and levels of detail. To address these issues, we've introduced a new icon set combining phosphor icons and Google Material icons.

Consistent language across the patient journey

Marketing professionals, translators, content creators for educational materials, and medical experts all play a role in generating text content at Medgate. However, this diverse input often resulted in inconsistencies in wording across the patient journey. To address this issue, I've developed a comprehensive glossary to be utilized company-wide. The new glossary offers several advantages:

  • Consistent wording throughout the patient journey: By ensuring uniform terminology across various touchpoints such as emails and apps, the glossary enhances coherence in communication.
  • Target-specific language: Our glossary meticulously documents medical terms alongside their patient-friendly equivalents, facilitating clearer and more accessible communication.
  • Efficient translation workflows: Through integration with Phrase, our localization tool, the glossary has significantly streamlined translation processes compared to our previous manual methods.

A home screen that adapts to the current context of the user

The redesign of the app's home screen marked our first significant overhaul. Formerly lacking a clear visual hierarchy and failing to guide users on forthcoming steps, we addressed these shortcomings through several key alterations.

  • Giving room to what matters at the moment: Previously, upcoming appointments and ongoing chats were buried in a sliding "reminder" section, alongside less crucial information. Recognizing the impact of missed appointments and delayed chat responses on patients and Medgate's finances, we've now given dedicated sections to these crucial aspects, ensuring they occupy prominent space on the screen.
  • Clear Call-to-Actions: We've enhanced call-to-actions with shadows and arrows while maintaining a classic blog-like layout for content. This distinction helps users quickly identify and respond to interactive prompts, improving engagement and navigation.
  • Enhanced Accessibility: In our commitment to improving accessibility, we've removed any interactive elements or text superimposed on photographs.

More to come...

An easy-to-understand pension forecast

BLPK (Basellandschaftliche Pensionskasse) embarked on a project to revamp their client portal, with a primary focus on enhancing user experience. At the heart of the portal lies a pension simulator, designed to provide users with a clear and insightful projection of their second-pillar pension earnings. This transformation aims to help individuals better understand the financial aspect of their retirement, thereby ensuring a more informed and secure future.

Client
BLPK

Year
Juli 2020

Role & team
Designer and project manager, working with the client and their brand agency

How might we make a dry but important topic more engaging?

Complicated rules and exceptional cases make it almost impossible for laypersons to understand how they can optimize their pension funds. The subject of retirement provision is often postponed, and most people deal with it too late.

To address this challenge, the project sought to define what is desirable, viable, and feasible. After the kick-off workshop, I created user stories. Some of the ideas from the workshop turned out to be too difficult to implement within a realistic budget.

The current state of your pension always on display

The new customer portal offers users a continuous snapshot of their current pension status, accompanied by a user-friendly pension forecast. Moreover, users can access and review saved pension simulations, as well as create additional scenarios for a more comprehensive and informed perspective.

Dynamic pension simulation for informed planning

Within the real-time pension simulator, users can explore diverse future scenarios, gaining valuable insights into the potential impact of adjustments like salary changes or early retirement decisions on their projected funds.

Remote financial advice for the modern bank

The landscape of business interactions was transformed by the Covid-19 pandemic. Talking to a relationship manager remotely has become a service that people expect. In response to this evolving need, Migros Bank has taken the initiative to provide its customers with the option to receive financial advice through video calls.

Client
Migros Bank

Year
Juli 2020

Role & team
Designer, working with a project manager and a developer

TL;DR

Challenge

The concept of a remote financial advice service had been lingering in the pipeline for some time. However, with the onset of the COVID-19 pandemic, the project's urgency was heightened, demanding swift implementation.

Approach

Thanks to our compact project team, consisting of a project manager, a developer and me as a designer, we were able to implement the solution quickly and in tight collaboration with the client. I led client workshops, worked on the design from wireframe to high-fidelity UI and was leading the usability tests.

Result

The video consultation platform was launched directly to real customers upon project completion. The team received highly positive feedback from the client, who praised the collaboration as outstanding.

A seamless user experience thanks to the attention to detail

Creating a user interface to start a video call might not seem very complex. However, there are many possible dead ends, if the UI is not designed carefully. We had to consider things like access rights procedures for different browsers, video formats sent by Skype for Business and the design of confirmation emails.

Breaking down information silos in electronic health records

Nurses and physicians rely heavily on the electronic medical record (EMR) as their central hub for patient information. However, crucial patient data often gets lost in a maze of disparate forms, hindering the seamless exchange of information across hospital departments. How can we redesign medical record applications to enhance information flow, minimize redundant documentation, and improve overall efficiency?

Year
August 2018 – July 2019

Role & team
Leading designer, working with POs, software developers and various hospital stakeholders

Unveiling hidden insights through a user-centric approach

Previously, software projects at the hospital were often initiated without the benefit of field research. Requirements were typically gathered through extended meetings between developers and user representatives, potentially overlooking the intricacies of real-world usage." Fortunately, this time we were granted the opportunity to observe individuals in their workplace and conduct in-depth interviews, unveiling valuable insights that would have otherwise remained hidden.

Our findings revealed several key areas for improvement:

  • Software designed for silos: Crucial patient information was often trapped within individual departments or professional groups, hindering effective collaboration and patient care.
  • Unstructured data dilemma: Doctors' tendency to dictate or write medical information in lengthy paragraphs made it challenging to extract and reuse specific data points, limiting the potential for data-driven insights.
  • Patient Exclusion from Medical Records: Elderly patients, in particular, faced difficulties in managing their medical information and keeping track of appointments.

A user journey map showing pain points a patient might experience when visiting the hospital.

A user journey map visualising inefficient steps in the workflow of a secretary.

Building less but better

Any staff member of the Hôpital du Valais had the possibility to request the development of new forms for the EMR. This led to an overwhelming backlog and a proliferation of forms (over 900), each catering only to a limited user group. To address this inefficiency, I undertook a comprehensive mapping of existing forms, identifying those with overlapping functionalities that could be consolidated into a single, unified web application.

Unlocking data's potential with FHIR

The current forms require doctors and nurses to input the same data multiple times. Simultaneously, this valuable data remains underutilized, lacking integration into broader contexts, statistical analyses, or automated summaries. To address this inefficiency, we embraced the FHIR framework, enabling us to establish meaningful relationships between disparate data points within patient medical records. For instance, if a transfusion reaction is documented on the transfusion form, it could be automatically displayed as a "Complication" on the problem list.

Establishing consistent rules and interaction patterns to ease cognitive load

To achieve a quick win with a potentially significant impact on medical staff productivity, I standardized the presentation of recurring information. This involved creating a consistent layout featuring a header section for page-related tasks such as 'print' and 'help,' and a sidebar displaying critical patient information like 'allergies' and 'reanimation status', that had to be visible at all times.

The decision to adopt Google Material Design and Angular Material as our framework was a pragmatic one, driven by Material Design's inherent suitability for both desktop and touch interfaces, its widespread adoption, and its ability to expedite the development process.

From a collection of digitized forms to modern software

This project paved the way for a pipeline of web applications that will be developed and implemented in a phased approach. The key improvements we achieved include:

  • Fewer applications for more users: By incorporating effective filtering, search functions, and improved UI design, we eliminated the need for separate forms catering to individual user groups. This consolidation fosters cross-disciplinary knowledge sharing and reduces redundant documentation.
  • Minimizing cognitive burden with standardized interaction design: Enabling users to locate recurring information effortlessly and consistently reduces frustration and accelerates onboarding for those transitioning to new roles within the hospital.
  • Unlocking data's value through meaningful connections: Repurposing data across different contexts amplifies the value of each data input and streamlines workflows, saving valuable time for healthcare professionals.
  • Empowering users with accessible help: Providing accessible information on application usage reduces reliance on IT support, freeing up resources for further product development and innovation.

'Hospital stay' gives a high-level overview over the patients encounters with the hospital. The card-based design allows to add modules for specific departments if needed.

The 'problem list' shows all of the patients conditions and is shared across departments. Drag and drop allows to quickly change the category of a problem.

A chronological feed of notes about a patient, that can be filtered and searched.

Interventions can be connected to conditions in order to avoid documenting the same information twice. An underlying catalogue automates steps of the billing process.

Introducing apps to clinical workflows

At the Hôpital du Valais, doctors and nurses rely on desktop computers or laptops on trolleys to access patient information and perform clinical tasks. However, the hospital had decided to run a pilot-project to understand how mobile phones could streamline processes and enhance communication.

Year
2018

Role & team
Leading designer, working with POs, software developers and various hospital stakeholders

Are mobile phones just gadgets or can they improve workflows?

Rather than replicating the entire medical record on a mobile device, we focused on utilizing unique mobile phone features like the camera, barcode scanner, and mobility to enhance specific workflows. This approach enabled us to develop a lean mobile application for a pilot project, offering a few shared devices on each floor that nurses could access when performing the targeted task.

Understanding nurses’ workflows

I had the chance to immerse myself in the daily routines of nurses for a week, I observed their tasks and engaged in insightful coffee break conversations. Some of the challenges I have observed:

  • Digital and non-digital task switching: Nurses often switch between digital and non-digital tasks, sometimes resorting to temporary paper notes due to time constraints or limited computer availability.
  • Inadequate hardware: Nurses rely on laptops on trolleys as their primary mobile devices. However, these trolleys are not designed for transporting medical supplies, forcing nurses to maneuver multiple trolleys and equipment, creating inefficiencies and hindering their mobility.
  • Task- instead of patient-based workflows: Workdays are organized by tasks rather than patients, resulting in nurses completing one task (e.g.: handing out medication) for all patients before moving to the next task.
  • Nurse-devised workarounds: To compensate for technology limitations, nurses print patient lists and take notes on paper throughout the day.

Streamlining the blood transfusion workflow with mobile technology

The blood transfusion process involves multiple identity checks, traditionally requiring two nurses to ensure patient safety. Additionally, space constraints at the patient's bedside and the need to maneuver two trolleys – one with equipment and one with a laptop for documentation – add to the complexity.

Our mobile app leverages barcode scanning to streamline identity checks, enabling a single nurse to quickly verify patient and blood product details, enhancing both speed and patient safety. The app also eliminates the need for a laptop trolley, reducing clutter and improving maneuverability.

The mobile app's design seamlessly aligns with the desktop application for blood transfusions, ensuring a consistent user experience.