01
Discovery and workflow mapping
Mapped the full journey from public discovery to registration review so the product would support both donors and hospital staff instead of solving only one side of the workflow.
Case Study
BMC Hospital - Donation Program Platform
A full-stack web platform for BMC Hospital that streamlined donation program registration, gave administrators a clearer operational dashboard, and made the experience easier to access across desktop and mobile.
01 / Problem
The Problem
Overview
Before the platform, donation program workflows were harder to manage because registration, event coordination, and administrative monitoring depended on disconnected manual steps.
Target Users
Hospital administrators, donation-program organizers, support staff, and community members who wanted to register online.
Real-World Issue
The project addressed a real operational need: make it easier for people to join donation initiatives while reducing the staff time spent collecting, organizing, and reviewing participant information.
02 / Ownership
My Role
Designed and built the public-facing landing page and registration experience.
Developed the admin dashboard for monitoring registrations and program activity.
Connected frontend screens to backend endpoints for structured submission and record handling.
Implemented responsive layouts so the experience worked across desktop and mobile devices.
03 / Process
Development Journey
02
Interface and data modeling
Structured the experience around clear registration data, event visibility, and dashboard-ready records so information stayed useful after submission.
03
Full-stack implementation
Built the landing page, registration flow, dashboard views, and backend routes using Next.js, React, Node.js, Express, and AWS-based deployment infrastructure.
04
Iteration and handoff
Refined the platform around usability, mobile access, and operational clarity so the final system felt practical for real program use rather than just technically complete.
04 / Product
Key Features
Public landing page for presenting the donation program clearly.
Online registration flow for faster participant onboarding.
Administrative dashboard for reviewing and tracking submissions.
Mobile-friendly interface for users registering from phones.
Centralized records that reduce repetitive manual coordination.
05 / Architecture
Technical Architecture
frontend
Next.js and React powering the landing page, registration flow, and dashboard interface.
backend
Node.js and Express API layer.
database
Persistent data storage for registrations, program records, and admin-side tracking.
apis
REST-style endpoints supporting form submissions, dashboard data, and administrative actions.
deployment
AWS-based deployment with environment-driven configuration and production hosting.
integrations
Application flows were connected around registration intake, admin review, and operational monitoring.
06 / Decisions
Challenges + Solutions
Challenge
Keeping the registration experience simple for the public while still collecting data that staff could actually use.
Solution
The registration flow was kept clear and lightweight on the frontend, while the submitted data was structured in a way that made dashboard review and follow-up easier for administrators.
Challenge
Reducing repetitive manual coordination around donation events and participant records.
Solution
Registrations and program-related information were centralized into one platform so staff could review activity in one place instead of piecing it together from separate steps.
Challenge
Making sure the platform remained usable on mobile devices, where many users would likely access the registration form.
Solution
The interface was built responsively, with layouts and content blocks adjusted to keep both the landing page and registration journey readable and usable on smaller screens.
07 / Impact
Results
Enabled 234+ online registrations within the first year.
Reduced administrative workload by 60% by moving key registration and tracking tasks into a central platform.
Created a stronger digital touchpoint for BMC Hospital's donation programs across both public and internal workflows.
08 / Visuals
Project Gallery
09 / Reflection
Final Learnings
This project reinforced how much impact a focused internal tool can have when it improves both the public experience and the staff workflow behind it. It also pushed me to think carefully about responsive form design, operational clarity, and building systems that are useful beyond the first user interaction.