Your health, made clear.
Most patient portals feel like a hospital database. DClaw Med answers a simpler question the moment you open it — “what do I need to know or do about my health today?” — with plain language, calm design, and the same information beautifully arranged on your phone, tablet or laptop.
Your Hemoglobin A1c is ready and is slightly above range.
Next appointment
Health overview
Patients drown in data and still don’t know what to do.
Results arrive as raw numbers with no context. Actions hide behind menus. And the phone experience is usually a shrunken desktop table. Care suffers when the portal is an administrative burden.
Numbers without meaning
“HbA1c 6.1” tells a clinician plenty and a patient almost nothing — is that good, or should I worry?
What am I meant to do?
The next appointment, the dose due now, the message waiting — all buried at equal weight with everything else.
Mobile as an afterthought
Wide tables and hover-only controls crammed onto a phone. The most-used device gets the worst experience.
One calm experience that answers “what now?” first.
DClaw Med leads with clarity, safety and action. The same records, presented so the clinically important thing is always the first thing you see.
Plain-language results
Every result shows its value, reference range, trend and a human explanation — never a bare number.
Status you can’t misread
Clinical status is shown with an icon, a word and a direction — never colour alone — so meaning survives colour-blindness and glare.
Today, at the top
Urgent alerts, the next appointment, the dose that’s due, a new result and unread messages — prioritised, one tap away.
Family, safely
Switch to a child or dependent’s record with an always-visible banner showing exactly whose record you’re viewing.
Honest states
Skeleton loaders, meaningful empty states, and plain-language errors that say what happened and what to do — no raw stack traces.
Built for everyone
Keyboard navigable, screen-reader friendly, reduced-motion aware, with a visible focus ring throughout.
Not a shrunken desktop. A device-appropriate experience.
The same information and actions exist everywhere — only the composition changes. One design system, one data model, responsive components.
Phone
A priority stack: alert → appointment → medication → result → quick actions. Big touch targets, a thumb-friendly bottom bar, sticky primary actions.
Tablet
The stack widens; a compact sidebar appears. Content regroups into two columns without cramming.
Laptop & desktop
An asymmetric grid shows the hero appointment beside a health overview, with results, messages and a timeline — powerful but calm.
Everywhere
Identical records and actions, one shared design system, so nothing is missing and nothing is duplicated.
One data model, one set of rules, a real database.
The app talks only to a typed API contract. Behind it, one TypeScript rules engine runs on a real PostgreSQL database (Neon, via Vercel) — every visitor gets a private copy of the synthetic sample data that persists across visits and devices. A future clinician app reuses the same model, rules and design system.
What’s actually built — and what isn’t yet.
This is a working early build, not slideware. The matrix below mirrors the live app exactly and is refreshed as the product grows.
| Capability | Status | What’s there today |
|---|---|---|
| Design system | Built | “Calm Clinical” tokens, clinical-status palette, typography scale, shared components. |
| Responsive shell & nav | Built | Collapsible sidebar (desktop), bottom bar + “More” sheet (mobile), verified 375–1440px. |
| Family switching | Built | Safe profile switch with an always-on “viewing record for…” banner; data isolation verified. |
| Home dashboard | Built | Priority stack / asymmetric grid, health overview, next appointment, meds due, latest result, timeline. |
| Loading / empty / error states | Built | Skeletons, meaningful empty states, plain-language retry — across the dashboard. |
| Accessibility | Built | Skip link, visible focus, reduced motion, status never by colour alone. |
| Search & theming | Built | Global search across results, appointments and medications; light/dark theme toggle; branded 404 and error pages. |
| Test results | Built | Responsive list plus a rich detail view — value, reference range, trend, previous results, ordering clinician and documents. |
| Medications | Built | Today’s schedule with an idempotent “mark taken”, the active list, and a per-medication detail sheet. |
| Appointments & booking | Built | Upcoming/past list and detail; a 4-step booking flow; reschedule and cancel with confirmation. Double-tap safe, slot-conflict aware. |
| Messaging | Built | Two-pane on desktop, list → thread on phones; start a new conversation; replies are saved and the clinic sends an automatic acknowledgement. |
| Health tracking | Built | Trend views plus “add a reading” with a live interpretation and an urgent safety alert for dangerous values. |
| My Health | Built | Conditions, allergies, medications and a dated history in one calm place; allergy severity shown with icon + word, never colour alone. |
| Records | Built | A documents library (lab reports, imaging, visit summaries) with a text preview and a real download. |
| Notifications | Built | An alerts centre grouped by severity; mark-as-read is saved and clears the header bell. |
| Family & caregivers | Built | Add and remove family members, safe switching, a child’s full record, and caregiver invitations with an access level. |
| Video visits | Built (demo) | Device check with a real camera preview, waiting room, a simulated call with mute, camera and speaker controls, visit info and chat beside the video on desktop, and an after-visit summary. |
| Health assistant | Built (demo) | Asks your permission per profile before reading anything, then answers only from that record with source links — as a side panel on desktop or full screen on phones. Emergency guidance; declines diagnosis or dose changes. Scripted and on-device, not an LLM yet. |
| Profile & settings | Built | Personal details, contact preferences, notification switches, appearance, and sign-out that clears your data from the browser. |
| Clinician app | Built (demo) | Same records from the clinician’s side: a triage list (dangerous home readings, results awaiting review, unanswered messages), schedule, patient charts with allergies pinned, result review with a patient-facing note, replies, and visit completion that files a summary to the patient’s records. Demo sign-in picker. |
| Demo guide | Built | A 14-step checklist of everything to try, with progress and a one-click reset to the sample data. |
| Real backend (PostgreSQL) | Built | A Next.js API over Neon Postgres. Each visitor gets a private, persistent copy of the demo data; a “continue on another device” link opens the same account elsewhere. Double-tap safe under concurrent requests. |
Where it goes next.
✅ Shipped
- Calm Clinical design system
- Responsive shell & navigation
- Home dashboard
- Family switching & safety banner
- Test Results — list + rich detail
- Appointments — list + detail
- Medications — schedule + detail
- My Health · Records · Notifications
- Search, dark mode, branded errors
- Accessibility pass
- Booking, reschedule & cancel
- Messaging — two-pane + compose
- Add a reading with safety alerts
- Family & caregivers · Profile
- Video visits & health assistant (demo)
- Demo guide
🛠 In progress
- Real sign-in and roles for patients and clinicians
🗺 Planned
- Real video calls (WebRTC)
- LLM assistant grounded in the record
- Clinical-grade storage and audit logging
Run it in the cloud, or keep it on your own hardware.
The same application, two ways to try it — flipped with environment settings alone, no code changes.
Your data, your hardware
Runs on your own machines against live systems, with any AI kept local and zero egress.
npm run build && npm start
Nothing to install
The identical app on a small cloud box, pointed at cloud models through a keyless gateway and a synthetic dataset — up 24×7.
deploy/twin/docker-compose.yml
This demo uses synthetic patient data only — no real personal health information is present. The live demo is gated by a PIN and serves the same build you see here.
Everything in the demo works — here’s what to try.
The same checklist lives inside the app as the Demo guide (bottom-right), which ticks each item off as you go and can reset the sample data at any time.
Your day at a glance
Read the dashboard, mark a dose as taken, and open the HbA1c result to see its range, status and trend.
Visits
Book an appointment, reschedule or cancel one, and join today’s video visit with Dr. Smith.
Stay in touch
Message the care team, then record a blood pressure reading — try 185/122 to see the safety alert.
Family & help
Switch to Vihaan’s record, then ask the health assistant about results or your next visit.
Your records
Download a document from Records and clear your notifications.
Make it yours
Search your record and switch to dark mode in Profile.
See the real thing.
Read the story, then sign in and drive the actual product in your browser — on your phone or your laptop.