Overview

Femi Dashboard is a management-level analytics tool designed for the operational staff of a medical organization.
The goal was to provide a clear, high-level view of patients, workloads, and statuses - enabling managers to make quick, data-driven decisions without being buried in raw tables.

My Role: Lead UX/UI Designer & Front-End Developer
Timeline: 6 weeks
Tools: Figma, Angular, Bootstrap
Stakeholders: Product Manager, development team

The Challenge

The existing internal dashboard was overloaded with unstructured data - long tables, unclear statuses, and no prioritization.
Managers couldn’t get a quick sense of what was happening: how many patients were active, where the bottlenecks were, or which departments were overloaded.

The product manager emphasized the need for a bird’s-eye view:

“I want to open the dashboard and immediately understand the situation - where we are, what’s urgent, and how the workload is distributed.”

So the core challenge became:

How to visualize complex medical data for management-level users - clearly, calmly, and efficiently.

‍

Initial Requirements (Product Brief)

Purpose

The dashboard is intended to serve as a management and operational tool for the Home-Care Unit Managers and Coordinators.
Its goal is to provide quick, reliable insight into the different aspects of home-care activities — helping management monitor performance, workload, and SLA compliance across all patients and care packages.

High-Level View (Top Overview)

The first screen should provide a general snapshot:

• Total number of patients.
• Breakdown of patients per care package and care group.
• There are two main groups:
  • Rehabilitation
  • Home-bound Patients
• Within each activity, there is an insurance provider:
  Meuhedet, IDF, Ministry of Defense, etc.
• Each activity contains multiple care packages.

Performance Overview

Show the completion percentage across all packages — the overall status of performance (execution level) per:

• Group
• Package

Required Filters

1. Group: Rehabilitation / Home-bound
2. Insurance Provider: IDF, Meuhedet, Ministry of Defense, Private
3. Package: Each package separately
   • When “no package” is selected, hide irrelevant columns or data.
4. Coordinator (referent): the staff member assigned to each patient.
5. Care-Tracking Filters:
   • No visit scheduled
   • Requires follow-up / treatment
   • SLA breach (did not meet service level)
   • Alerts

Alerts

• If a patient has an active alert, it should appear in the dashboard view.
• When hovering or clicking, the system should show the alert details.

Drill-Down Screen

The drill-down view should be redesigned to resemble a patient record view, with a clearer layout.

Details to include:

• Breakdown of performed visits per discipline.
• Execution percentage per package.
• Next scheduled visit date per discipline.

Additional Business Logic

SLA Compliance

Mark cases where:

• A treatment session was not scheduled in advance (X days before).
• The visit date has passed but no visit summary exists.
• The authorization is no longer valid.

Scope

The dashboard should display all patients — including those not currently assigned to a package.
In such cases, certain columns or metrics may be irrelevant and should be hidden dynamically.

Summary

The Home-Care Dashboard is designed to:

• Centralize data for management visibility.
• Support quick, actionable insights.
• Enable filtering, prioritization, and SLA tracking.
• Serve both operational and business needs of the Femi Home-Care Unit.

‍

‍

Understanding the User

Since there was no direct access to end users, the design was built on business requirements and logical reconstruction of managerial workflows.

Primary Persona:
Operations Manager - responsible for tracking all patient activities across departments.

• Needs to see the overall picture first, then dive into details.
  
  
• Has limited time - scans key metrics in under 30 seconds.
  
  
• Makes daily decisions based on workload and patient distribution.
  
  

Key goals:

• Quickly identify critical or delayed cases.
  
  
• Monitor patient flow between departments.
  
  
• Communicate issues with medical staff efficiently.
  
  

Design Goals

1. Deliver an immediate understanding of the system’s state at a glance.
   
   
2. Reduce cognitive load through hierarchy and visual grouping.
   
   
3. Highlight urgent information without overwhelming the user.
   
   
4. Make filtering and deep-dive analysis effortless.
   
   
5. Ensure scalability for future metrics or additional modules.
   
   

Process

1. Audit and Problem Mapping

I started with a structural audit of the existing dashboard:

• Overcrowded tables made it impossible to focus on what matters.
  
  
• No visual cues for urgency or completion.
  
  
• Important summaries (like patient distribution) were hidden in deep layers of navigation.
  
  

2. Reframing the Data Architecture

I reorganized information flow based on decision-making logic:

• Top level: high-level KPIs (active, critical, completed patients).
  
  
• Mid level: distribution by packages, activities, and departments.
  
  
• Detail level: patient list with sorting, filters, and contextual insights.
  
  

3. Interface and Interaction Design

• Introduced a visual overview separating Payload and Heavyload activities.
  
  
• Created a patient list with contextual visualization - icons, color codes, and inline data representations (bars, badges, status icons).
  
  
• Designed a multi-layer pop-up window (triggered from the overview) that breaks down patient data by packages, departments, and activities - using tabs and collapsible accordions for clean navigation.
  
  
• Added a filtering system for fast, combined queries.
  
  
• Implemented urgent notifications with a bell icon and a dedicated “Critical” section.
  
  

The Solution

Overview Layer

A visual summary of all key metrics - total patients, active vs. completed, and critical alerts - displayed in a grid of clean, minimal tiles.
Each tile functions as a gateway to deeper layers of data.

Patient List and Filtering

An improved table layout with contextual visualization:

• Custom icons and color-coded statuses for faster recognition.
  
  
• Inline graphs where applicable (progress, test completion).
  
  
• Sticky filters that can combine parameters without losing context.
  
  

Popup Breakdown View

A modal window that opens from the overview panel, showing:

• Breakdown by packages, activities, and departments.
  
  
• Clear segmentation with tabs and collapsible sections.
  
  
• Designed for fast scanning and cross-comparison between units.
  
  

Urgent Notifications

A bell-based alert system that highlights critical updates in a dedicated right-side panel - so urgent items are visible but don’t interrupt workflow.

Visual Language

The visual design is clean, structured, and intentionally understated - following the aesthetic of health-tech systems:

• Neutral greys and medical blues for calmness and clarity.
  
  
• Color used only for meaning (status, urgency, or success).
  
  
• Tight typographic hierarchy - readable tables, distinct headers, and subtle emphasis.
  
  
• Modular grid and consistent spacing for scalability.
  
  

Impact

While no formal UX testing was conducted, the redesign was evaluated and approved by the product manager and internal stakeholders.

Perceived results:

• Managers now get a situational overview within 10–15 seconds.
  
  
• Critical cases are instantly visible, reducing oversight.
  
  
• Communication between departments became smoother thanks to clearer categorization.
  
  
• The interface was accepted without additional onboarding.
  
  

Reflections

Even without direct user testing, UX reasoning can turn business requirements into intuitive interaction.
This project taught me how to translate complex backend logic into visual structure - using hierarchy, rhythm, and information clarity as core design tools.

If redesigned today, I’d like to expand it with:

• Predictive analytics modules powered by AI (e.g., workload forecasting).
  
  
• A mobile-optimized summary screen for on-the-go decision-making.
  
  
• Usability testing with actual management staff to validate assumptions.
  
  

Takeaways

• Less data ≠ less insight - the key is clarity and prioritization.
  
  
• Business dashboards should communicate state, not just data.
  
  
• Even in data-heavy B2B projects, empathy lies in how fast someone can think using your design.
  
  

‍