Transform Hospital Discharge Summaries with Aftercare AppTransform Hospital Discharge Summaries with Aftercare App
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Isum's avatar
Isum Enuka
• Jul 6
✨ Aftercare
The hospital discharge summary, redesigned into a calm, patient-first recovery companion.
Good healthcare information can save lives. Good information design helps people understand it.
🔗 Project Links
🎨 Wonder Design File: https://app.wonder.so/isumenuka/files/019f31a3-8c46-7707-b8d1-9bb74298da0b
💻 React Export / GitHub: https://github.com/isumenuka/Aftercare
🩺 The Challenge
Every day, millions of patients leave hospitals with discharge instructions that are difficult to read, filled with medical jargon, and presented in dense blocks of text.
Patients are often tired, anxious, in pain, or under medication when they receive this information. Unfortunately, this is exactly when understanding it matters most.
This isn't simply a healthcare problem.
It's an information design problem.
📚 Research Validation
📄 Engel et al. (2009)
Annals of Emergency Medicine
Key Finding
78% of emergency department patients demonstrated deficient comprehension in at least one aspect of their care or discharge instructions, and most believed they understood everything correctly.
This reveals a dangerous gap between what patients think they understand and what they actually understand.
Research Paper
https://consensus.app/papers/details/78ce400adebd51cfa38953d47bbc82f7/
📄 Sahhar et al. (2025)
The American Journal of Medicine
Researchers found that:
• 81% of standard English discharge instructions exceed the recommended sixth-grade reading level.
• Multilingual discharge instructions remain limited, reducing accessibility for many patients.
Together, these studies demonstrate that improving information design can directly improve patient safety.
💡 The Solution
Aftercare
A mobile experience that transforms a hospital discharge summary into a clear, personalized recovery companion.
Simply scan the discharge document and receive an interface designed around what patients actually need.
Instead of pages filled with confusing medical language, patients receive simple guidance that answers:
✅ What happened?
✅ What should I do today?
✅ Which medications should I take?
✅ What symptoms should I watch for?
✅ When should I contact my doctor?
✅ When should I visit the emergency room?
📱 Core Screens
📄 Scan Discharge Summary
Capture the printed discharge document and instantly convert it into structured, readable information.
❤️ Recovery Today
A simple daily dashboard showing recovery progress, today's tasks, hydration, activity, appointments, and care reminders.
💊 Medication Reminder
An interactive medication timeline explaining:
• What to take
• When to take it
• Why you're taking it
• Missed dose reminders
🚨 Warning Signs
Important symptoms are grouped into clear actions.
🟢 Continue recovery
🟡 Contact your healthcare provider
🔴 Visit the emergency room immediately
No medical jargon.
Just clear actions.
🎨 Design Language
The interface was designed to feel calm, reassuring, and easy to read.
• Deep near-black background
• Soft ambient magenta, pink, and blue shader lighting
• Bento-style information cards
• Large accessible typography
• Ghost-style LCD numerals
• High-contrast layout
• Warm pastel recovery cards
• Yellow highlights for urgent information
Every visual decision helps reduce stress instead of creating it.
⚙️ Built Entirely in Wonder
The entire experience was designed inside Wonder.
Workflow
✨ Wonder Chat generated the initial component system.
✨ Wonder Shader tools created the ambient backgrounds.
✨ Wonder components built the reusable interface.
✨ Wonder MCP connected Claude to structure the discharge data.
✨ The finished design was exported directly to React and Tailwind CSS.
This demonstrates a complete Design → AI → Code workflow.
🛠 Technology Stack
• Wonder
• Wonder Chat
• Wonder Shader Generation
• Wonder MCP
• Claude
• React
• Tailwind CSS
🔌 API Stack
Free APIs
• HL7 SMART on FHIR Sandbox
• NIH RxNorm / RxNav
• MedlinePlus Connect
❤️ Why It Matters
Healthcare already has the right information.
Patients simply receive it in the wrong format.
Aftercare demonstrates how thoughtful interface design, accessibility, and AI-powered workflows can make recovery instructions understandable, actionable, and reassuring.
Better information design is patient safety.
✨ Designed in Wonder.
🏥 Built for the day patients go home.
AI DevelopmentUI DesignClaudeWonderwonderchallenge
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started