Human-Centered Digital Gateway for Family Health Center
Case Study: Modernizing Primary Care – Digital Transformation of a Family Health Center
Project Overview
This project focused on redesigning the digital presence of a Family Health Center (ASM) to meet modern healthcare standards. The goal was to bridge the gap between institutional reliability and user-centric design, ensuring that patients of all ages could access vital health services such as appointment scheduling and health tracking with zero friction.
1. Research & Ecosystem Analysis
Before moving to the canvas, we conducted a deep dive into the local healthcare landscape:
Benchmarking: We analyzed existing primary care platforms in Turkey to identify common UI patterns and, more importantly, recurring UX failures.
User Behavior Insights: Through interviews and surveys, we identified that the primary pain points were difficulty in finding physician schedules and a lack of mobile-friendly health tracking tools.
Journey Mapping: We mapped various scenarios from a parent checking a child’s vaccination schedule to an elderly patient looking for directions ensuring every "touchpoint" was optimized for speed and clarity.
2. Information Architecture & UX Strategy
Healthcare websites demand a "content-first" approach. We prioritized information based on urgency:
Hierarchy of Needs: Physician hours, appointment links, and location data were placed at the forefront.
Accessibility-First Design: Given the broad demographic, we focused on high-contrast visuals, legible typography, and intuitive navigation flows.
Wireframing: We developed low-fidelity structures to test the logic of features like the "Pregnancy Tracker" before adding visual layers.
3. Visual Identity & Brand Consistency
Working within the framework of the Ministry of Health’s corporate identity, we aimed to evoke a sense of professional trust.
Institutional Trust: We utilized the official color palette and typography guidelines while modernizing the layout for a cleaner, more organized feel.
Interactive Prototyping: Using Framer, we built high-fidelity prototypes that included micro-interactions and animations to guide the user through complex tasks.
4. Technical Execution: Custom Logic & Interactive Tools
To differentiate the platform from static health sites, I developed specialized code components within Framer. These tools provide immediate, personalized value to the user:
Personalized Immunization Scheduler: Unlike static charts, this component allows parents to input their baby’s birth date to generate a tailored vaccination timeline. It calculates specific dates for each dose, providing a clear, actionable roadmap for pediatric health.
Pregnancy Progress Calculator: By entering the expected due date (or last period), users receive a dynamic pregnancy milestone guide. This tool breaks down the gestation period into manageable phases, offering relevant health information based on the specific week of pregnancy.
High-Utility Navigation: I integrated optimized "one-tap" triggers for Appointment Booking and GPS-linked Directions, specifically designed to improve the mobile experience for users in urgent or high-stress situations.
5. Quality Assurance & Performance
Usability Testing: The prototype was tested with a focus group to ensure the navigation was "idiot-proof." Feedback led to simplifying the appointment flow.
Responsive Optimization: The site was rigorously tested across all screen sizes. Special attention was paid to the fluidity of the custom components on mobile browsers.
Performance & SEO: Using Framer’s high-performance infrastructure, we ensured rapid load times a critical factor for accessibility and search engine ranking.
The Result
The project successfully transformed a traditional health center's requirements into a modern, accessible, and highly functional digital platform. By integrating custom-coded health tools with a user-centric UI, the final product provides a seamless experience that empowers patients and elevates the professional standing of the health center.