Case study · Healthcare provider operations
BMC
A full-lifecycle hospital management system covering front desk registration, OPD/IPD episodes, pathology, pharmacy and billing — backed by a library of 40+ MIS reports.
Role
Senior UI Engineer
Focus
Design system,
accessibility & reporting
Stack
Angular · PrimeNG
FullCalendar
Industry
Healthcare provider
operations
200+ staff
Used daily across front desk, clinical and financial departments at a government hospital.
40+ reports
A full MIS suite spanning financial, operational and clinical reporting screens.
10 reviewed
Code reviewed for 5 frontend developers, design reviewed for 5 UI/UX designers.
India-ready
GST, Aadhaar and PAN fields built directly into the core patient and billing model.
The problem
A hospital runs dozens of parallel workflows — registration, lab orders, dispensing, billing — that all have to stay connected to the same patient encounter without slowing staff down.
The system needed a single episode/encounter model that pathology, pharmacy, HR and finance could all hang off, payer-class-aware pricing, and a reporting layer deep enough to cover financial, operational and clinical needs across the hospital.
What it does
Registration & episodes
Front-desk registration through OPD/IPD episodes, encounters and ordered clinical services.
Pathology & pharmacy
Lab sample workflows and drug dispensing/inventory managed on the same platform.
Payer-class billing
Pricing varies by payer class — cash, insurance, corporate — in one consistent price-list model.
Multi-godown inventory
Pharmacy and warehouse stock tracked down to item, batch and sales rate.
40+ MIS reports
Financial, operational and clinical reporting screens covering the whole hospital.
India-specific compliance
GST code, Aadhaar number and PAN captured natively in patient and billing records.
Try it
A live OPD/IPD scheduling calendar
A simplified version of the appointment-scheduling pattern used across BMC's clinical departments, built on FullCalendar. Switch between month, week and day views and page through dates to see how the toolbar and event rendering hold up.
My role
I contributed to this enterprise healthcare platform as a Senior UI Engineer, reviewing work across a large team while owning the styling architecture, accessibility and reporting output directly.
- • Reviewed code for 5 frontend developers and design work for 5 UI/UX designers to keep quality and consistency high across the team
- • Rebuilt the stylesheet on a scalable 7-1 SCSS architecture with customizable PrimeNG theme variables
- • Improved accessibility with keyboard navigation, visible focus states and stronger color contrast
- • Built HTML-to-PDF report generation for printable application reports
- • Delivered responsive layouts optimized for small-to-large laptop screens
Key decisions
A styling base the whole team could build on
With 5 frontend developers and 5 designers shipping in parallel, one-off styling was inevitable without a shared foundation — I rebuilt the stylesheet on a 7-1 SCSS architecture with customizable PrimeNG theme variables so every department module started from the same visual base.
Verifying accessibility against real components
Keyboard navigation, focus order and contrast were checked against the actual running app, not just the design file — catching gaps that only surface once real data and real interaction states are in play.
Reports staff could actually print
A hospital MIS suite is only useful if staff can hand a report to someone — I built HTML-to-PDF generation so every report screen in the 40+ suite exports as a clean, printable document.
Outcome
BMC gives the hospital one connected system from patient registration through clinical service delivery, pathology, pharmacy and billing — with a 40+ report MIS suite giving staff and management a full operational view.
Let's talk about your project