> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://blueprint.ziro.health/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://blueprint.ziro.health/_mcp/server.

# Data Visualization for Health

Health data is uniquely complex — multi-dimensional, time-sensitive, and critical for decision-making. Good visualization makes data understandable; bad visualization can lead to clinical errors.

## Patient-Facing vs. Clinician-Facing Visualizations

The same data serves different purposes for different audiences:

| Aspect       | Patient-Facing             | Clinician-Facing                   |
| ------------ | -------------------------- | ---------------------------------- |
| Complexity   | Simple, trend-focused      | Detailed, multi-dimensional        |
| Language     | Plain language             | Clinical terminology               |
| Context      | Personal progress          | Population comparison              |
| Actions      | Motivation, understanding  | Clinical decision-making           |
| Data density | Low (one metric at a time) | High (many metrics simultaneously) |

## Trend Visualization for Chronic Conditions

Chronic disease management relies on trend visualization:

* **Time series**: The most common and important health visualization
* **Goal ranges**: Show target ranges (e.g., blood pressure goals) as shaded areas
* **Annotations**: Mark significant events (medication changes, doctor visits, symptoms)
* **Aggregation**: Daily/weekly/monthly views with appropriate granularity

## Risk Communication

Communicating risk is one of the hardest design challenges in health:

* **Icon arrays**: Show risk as people (e.g., 5 out of 100 people) — the most effective format
* **Absolute vs. relative risk**: Always show absolute risk, never just relative risk
* **Comparative risk**: Show how the user's risk compares to the general population
* **Uncertainty visualization**: Show confidence intervals, not just point estimates

## Accessibility in Health Data Visualization

Ensure visualizations work for all users:

* **Colorblind-safe**: Use patterns, textures, and labels in addition to color
* **Data tables**: Provide tabular alternatives for all chart data
* **Screen reader friendly**: Descriptive alt text and ARIA labels
* **Zoomable**: Allow users to zoom into detailed data
* **Printable**: Design visualizations that work in black and white

## FHIR Data Visualization Patterns

FHIR resources map naturally to visualization patterns:

| FHIR Resource     | Visualization Pattern                          |
| ----------------- | ---------------------------------------------- |
| Observation       | Time series chart with reference ranges        |
| Condition         | Timeline with onset, remission, and recurrence |
| MedicationRequest | Medication timeline with adherence overlay     |
| Procedure         | Event markers on a health timeline             |
| CarePlan          | Gantt chart of planned activities              |

***

## Related Chapters

* [Accessibility as Baseline](/design-patterns/accessibility) — Accessible data displays
* [Behavioral Design](/design-patterns/behavioral-design) — Visualization for motivation
* [API Design & FHIR](/technical-architecture/api-design-fhir) — Data sources for visualization