Mobile UI
PineApp — Pre-Visit Flow
Designed the Pre-Visit flow for Baptist Health's PineApp — a mobile feature that moved hospital pre-registration from paper forms into a clear, step-by-step digital experience.
A mobile feature that moved hospital pre-registration from paper forms and front-desk queues into a clear, step-by-step digital experience inside the Baptist Health app.
Type
Agency work · 110 Theory for Baptist Health
Industry
Healthcare / Mobile Health
Year
2023
Platform
Mobile app · iOS and Android
Status
Shipped to production
Role
Senior Product Designer — 110 Theory
Design Challenge
Before this feature existed, Baptist Health patients had to complete pre-registration forms manually at the front desk — on paper, under stress, and close to their appointment time.
The app already showed appointment information, but patients had no way to complete pre-visit steps digitally before arriving. The challenge was to bring this offline process into the app in a way that felt simple, clear, and trustworthy for users who were often older adults with limited smartphone confidence.
At the same time, the flow had to handle real operational complexity: multiple appointments on the same day, several document types with different statuses, and a final confirmation step that had to feel irreversible by design.
Design Direction
The user research pointed consistently toward older adults — many of them retired, using a smartphone mainly for calls and texts. That shaped every design decision.
Progressive disclosure over long forms. Instead of recreating a paper form inside the app, the experience reveals information step by step. Users first see what needs attention, then drill into each item only when needed.
Status visibility as the core pattern. Every checklist item carries a clear state: Not Started, Needs Review, or Completed. Progress is visible at a glance without relying on instructions.
Irreversible confirmation by design. Once submitted, the data could not be changed by the patient inside the flow. Rather than hiding this, the UI makes it explicit before the final step — reducing confusion and accidental submissions.
Multi-appointment without confusion. When users had multiple appointments on the same day, the accordion pattern showed exactly which visits the forms applied to, removing ambiguity from a stressful scenario.
UX Structure
The flow was built around one goal: arrive at the hospital with everything already completed.
Entry Point — Appointment Card
The Pre-Register CTA lives directly on the appointment card on the Home screen. A contextual hint below explains the action in plain language, reducing hesitation for less experienced users.
Multi-Appointment Confirmation
If the user has multiple appointments on the same day, a dedicated screen lists them before the flow begins, explaining that the information applies to all listed visits.
Pre-Registration Checklist
The checklist is the core screen. Each required document is listed with its current status and users can address items in any order. The appointment accordion collapses once the user has understood the context. The Continue CTA remains anchored to the bottom regardless of scroll position.
Success State
Once all items are submitted, a clear success screen with arrival instructions closes the loop. For virtual visits, the flow communicates when the visit becomes accessible. Push notifications confirm each completed step outside the app.
UI System
The Pre-Visit flow was designed within the existing Baptist Health / PineApp visual system and extended with new components specific to this feature.
Color was used functionally. Baptist Health green drove primary actions. Amber handled attention and review states. Neutral grays provided structure and supporting text.
Typography for older users. Large, high-contrast body text. Label/value hierarchy on document cards. Each screen focused on a single topic to reduce cognitive load.
Layout for thumb reach. Single-column mobile layout throughout. Generous tap targets. Bottom-anchored CTAs. Compact but readable document cards. Collapsible accordion to preserve vertical space.
Components created or extended
- Status badge: three states (Not Started, Needs Review, Completed)
- Expandable document review card
- Multi-appointment accordion
- Confirmation modal
- Success state screen
- Step-by-step push notification pattern
- Document type icons: insurance card, consent form, license / ID, MSPQ
Home Card Redesign
The appointment card on the Home screen was redesigned to surface the Pre-Visit entry point without disrupting the existing UI.
A Manage dropdown consolidated secondary actions — appointment info, reschedule, cancel — freeing the primary CTA area for Pre-Register and its contextual hint.
Once pre-registration was complete, the card updated to show a Confirmed badge, registration status, tappable address and phone links, and a Review button replacing the Pre-Register CTA.
Result
The Pre-Visit flow shipped to production and replaced a manual, in-person process with a mobile-first digital experience available to Baptist Health patients before their hospital visits.
What this project demonstrates
- Complex process translation: Turning an offline hospital workflow into a clear mobile experience.
- System thinking: Designing a multi-state component architecture that supports different document types, appointment quantities, and user confidence levels.
- Accessibility-minded UX: Designing for low digital literacy without making the product feel limited for more capable users.
- Design system extension: Working inside an established system and extending it with native-feeling components.
- Shipped product work: Delivering production-ready design that reached real users.
Reflection
This project pushed me to think carefully about the gap between a user's real context and what a clean interface often assumes about them.
Designing for patients in their 60s and 70s — many managing health anxiety alongside unfamiliar technology — meant that clarity was not a nice-to-have. It was the core requirement.
It also showed how a single feature can cascade through an existing product. The Pre-Visit flow touched the Home screen, the appointment card, the notification system, confirmation logic, document components, and edge-case handling. Getting that right required thinking in systems, not just screens.
Selected screens
Next work
BlockBind