Find My Doctor Calendar Widgets
Find My Doctor Calendar Widgets
Optimized the appointment booking experience by designing multiple calendar widget variations for the Find a Doctor feature. Through strategic color hierarchy, responsive design, and collaborative approach with product managers and developers, I created variations that reduce friction in scheduling and guide users toward booking with clear visual engagement states. The variations are positioned for future A/B testing to measure impact on patient conversion rates and booking completion.
Title
Find My Doctor Calender Widgets
Industry
UX/UI Design
Date
June 2026 - August 2026
June 2026 - August 2026
Introduction
As my first major project during my internship at Atlantic Health, I was tasked with redesigning the calendar widget for the Find a Doctor page. Although the current booking experience was functioning and appointments were being scheduled, the primary focus was elevating provider availability visibility. Through effective collaboration with product managers and developers, I worked to make it obvious that providers had open slots and empower patients to book with confidence. Patients needed to see availability clearly and immediately, yet the existing design obscured this information behind unclear interfaces. This lack of visibility impacted patient engagement and accessibility across all demographics. I set out to design calendar widget variations that would transform provider availability into the hero of the interface and increase patient bookings.
Defining the Problem
Before designing, I met directly with Amy Augenstein and Christene Blend to develop a shared understanding of the challenge. Their primary focus was creating a calendar widget that displayed meaningful availability—not empty date slots, but actual times patients could book. Specifically, they wanted the widget to show 5 dates, with each date displaying the earliest available times and subsequent dates showing the next available times based on provider schedules. The challenge was presenting this amount of information in a compact widget format without overwhelming users or cluttering the interface. We needed a solution that revealed availability progressively—showing essential information at first glance, with the ability to explore deeper when needed.
Before designing, I met directly with Amy Augenstein and Christene Blend to develop a shared understanding of the challenge. Their primary focus was creating a calendar widget that displayed meaningful availability—not empty date slots, but actual times patients could book. Specifically, they wanted the widget to show 5 dates, with each date displaying the earliest available times and subsequent dates showing the next available times based on provider schedules. The challenge was presenting this amount of information in a compact widget format without overwhelming users or cluttering the interface. We needed a solution that revealed availability progressively—showing essential information at first glance, with the ability to explore deeper when needed.
Research & Discovery
I conducted competitive analysis across leading healthcare platforms, with Novant Health emerging as the primary reference point. Their calendar design featured a plus functionality that expanded to show more dates, with highlighted time slots and arrows enabling navigation across different days of availability. This approach effectively communicated availability while managing information density. However, I identified a key limitation: their expanded view still displayed days with empty time slots, which created confusion about actual availability. I recommended mimicking their interactive expand/collapse functionality but improving the core value proposition by only displaying days with actual available times. This refinement would give patients immediate clarity about when they could book without wading through unavailable dates.
Research & Discovery
I conducted competitive analysis across leading healthcare platforms, with Novant Health emerging as the primary reference point. Their calendar design featured a plus functionality that expanded to show more dates, with highlighted time slots and arrows enabling navigation across different days of availability. This approach effectively communicated availability while managing information density. However, I identified a key limitation: their expanded view still displayed days with empty time slots, which created confusion about actual availability. I recommended mimicking their interactive expand/collapse functionality but improving the core value proposition by only displaying days with actual available times. This refinement would give patients immediate clarity about when they could book without wading through unavailable dates.
Ideation & Design Process Part 1
With user research and team alignment established, I moved into Figma to design the calendar widget variations. I collaborated closely with Amy, Joseph, and Christene to apply Atlantic Health's design system throughout, ensuring visual and functional consistency. The primary widget design applies progressive disclosure, a UX principle that reveals information gradually rather than overwhelming users with everything at once. The initial display shows one day with 5 available time slots, each highlighted in blue to indicate they are interactive booking options. Below the time slots sits a plus icon that expands the widget to show 5 days of availability, each day displaying 5 times based on the selected provider's actual schedule. When expanded, users see the full week of availability without any empty date slots. A minus icon collapses the widget back to the compact view, or users can scroll to explore additional days of availability.
With user research and team alignment established, I moved into Figma to design the calendar widget variations. I collaborated closely with Amy, Joseph, and Christene to apply Atlantic Health's design system throughout, ensuring visual and functional consistency. The primary widget design applies progressive disclosure, a UX principle that reveals information gradually rather than overwhelming users with everything at once. The initial display shows one day with 5 available time slots, each highlighted in blue to indicate they are interactive booking options. Below the time slots sits a plus icon that expands the widget to show 5 days of availability, each day displaying 5 times based on the selected provider's actual schedule. When expanded, users see the full week of availability without any empty date slots. A minus icon collapses the widget back to the compact view, or users can scroll to explore additional days of availability.
Ideation & Design Process Part 2
I implemented color hierarchy strategically through button states to enhance the interactive experience. Passive states show a lighter fill, while active engagement states through hover interactions display a darker, more prominent fill. This visual progression guides user attention and communicates interactivity clearly, allowing progressive disclosure to reduce cognitive load while keeping detailed availability accessible. The hover feedback ensures users understand which elements are clickable and reinforces their navigation choices throughout the booking experience.
I implemented color hierarchy strategically through button states to enhance the interactive experience. Passive states show a lighter fill, while active engagement states through hover interactions display a darker, more prominent fill. This visual progression guides user attention and communicates interactivity clearly, allowing progressive disclosure to reduce cognitive load while keeping detailed availability accessible. The hover feedback ensures users understand which elements are clickable and reinforces their navigation choices throughout the booking experience.
Prototyping & Testing
Note: The calendar widget design is not currently live on the Atlantic Health website. Testing and validation are planned for the next couple of months on dev2 and stage environments. This represents a demo to increase patient engagement and booking conversion rates
The key focus during prototyping and testing was validating the expanded and unexpanded states and ensuring they displayed correctly across the website. I created a variation where selecting the plus sign transitions the widget from a compact view showing one day with 5 times into an expanded state displaying 5 full days of availability. At the bottom of the expanded calendar, another provider appears directly below, enabling users to quickly compare availability across multiple clinicians without navigating away. If users prefer a different provider, they can immediately see that provider's calendar, or they can select the minus sign to collapse back to the compact view. I incorporated color hierarchy through button styling with fill treatments that clearly differentiate passive and engaged states through hovering interactions, ensuring users understood each element's function. This iteration was tested rigorously to validate both the interaction model and visual communication across the Find a Doctor experience.
Note: The calendar widget design is not currently live on the Atlantic Health website. Testing and validation are planned for the next couple of months on dev2 and stage environments. This represents a demo to increase patient engagement and booking conversion rates
The key focus during prototyping and testing was validating the expanded and unexpanded states and ensuring they displayed correctly across the website. I created a variation where selecting the plus sign transitions the widget from a compact view showing one day with 5 times into an expanded state displaying 5 full days of availability. At the bottom of the expanded calendar, another provider appears directly below, enabling users to quickly compare availability across multiple clinicians without navigating away. If users prefer a different provider, they can immediately see that provider's calendar, or they can select the minus sign to collapse back to the compact view. I incorporated color hierarchy through button styling with fill treatments that clearly differentiate passive and engaged states through hovering interactions, ensuring users understood each element's function. This iteration was tested rigorously to validate both the interaction model and visual communication across the Find a Doctor experience.
Final Solution & Reflection
Through effective collaboration with developers, product managers, and design specialists, the calendar widget design was approved. I created a solution that simplifies the user experience by applying progressive disclosure, color hierarchy, and responsive design to showcase provider availability. The widget successfully displays more options, which was the marketing team's core objective, while remaining compact and scannable. Currently in development, this solution will advance through A/B testing on dev2 and stage Atlantic Health environments to measure impact on patient engagement and booking conversion rates. Every design decision was grounded in patient behavior and stakeholder feedback. This project taught me the importance of cognitive load and conducting competitive analysis in healthcare design. By making provider availability immediately visible and navigation intuitive, we eliminated the friction that prevented patients from booking appointments, ultimately improving overall healthcare accessibility and usability. This project showcases my ability to combine research-driven insights with strategic design execution to create solutions that measurably impact organizational performance and patient outcomes—a key value proposition for healthcare organizations seeking to differentiate through thoughtful digital experiences.
Through effective collaboration with developers, product managers, and design specialists, the calendar widget design was approved. I created a solution that simplifies the user experience by applying progressive disclosure, color hierarchy, and responsive design to showcase provider availability. The widget successfully displays more options, which was the marketing team's core objective, while remaining compact and scannable. Currently in development, this solution will advance through A/B testing on dev2 and stage Atlantic Health environments to measure impact on patient engagement and booking conversion rates. Every design decision was grounded in patient behavior and stakeholder feedback. This project taught me the importance of cognitive load and conducting competitive analysis in healthcare design. By making provider availability immediately visible and navigation intuitive, we eliminated the friction that prevented patients from booking appointments, ultimately improving overall healthcare accessibility and usability. This project showcases my ability to combine research-driven insights with strategic design execution to create solutions that measurably impact organizational performance and patient outcomes—a key value proposition for healthcare organizations seeking to differentiate through thoughtful digital experiences.
Introduction
As my first major project during my internship at Atlantic Health, I was tasked with redesigning the calendar widget for the Find a Doctor page. Although the current booking experience was functioning and appointments were being scheduled, the primary focus was elevating provider availability visibility. Through effective collaboration with product managers and developers, I worked to make it obvious that providers had open slots and empower patients to book with confidence. Patients needed to see availability clearly and immediately, yet the existing design obscured this information behind unclear interfaces. This lack of visibility impacted patient engagement and accessibility across all demographics. I set out to design calendar widget variations that would transform provider availability into the hero of the interface and increase patient bookings.
Projects
Explore more like this one
Explore more like this one
Selected projects that reflect my approach to design, development, and execution.