Health Calendar
Helping patients schedule appointments effortlessly.
Project Overview
The Health Storylines app's Appointment Calendar needs a redesign to become a core tool. Renaming it to Health Calendar, this project aims to enhance user experience, enabling effective appointment management and preparation through features like 'Notes.'
Problem
The Appointment Calendar in the Health Storylines app was intended to streamline appointment management, but user feedback and usage patterns reveal significant limitations. The current design lacks value as a core tool, demanding improvements to enhance usability and align with user expectations.
Solution
The Health Calendar redesign focuses on three key areas: optimizing the user interface for smooth navigation, enhancing synchronization with the HS app and external calendars, and introducing additional features for core functionality. This solution aims to provide a clear, user-friendly, and customizable appointment management experience within the Health Storylines app.
Project Type
In-app Feature
Project Year
2022
Scope
4 Weeks
Role
Product Designer
Tools
Sketch, Figma, Jira
01 - Discover
Product Walkthrough
The project initiation involved a comprehensive evaluation of the Health Calendar's current assets within the Health Storylines app. Identified shortcomings include a challenging user interface and a lack of visual cues, rendering the tool ineffective as a core appointment scheduling tool. To address these issues, the redesign focuses on gathering qualitative data, introducing a reminders/notifications section, enabling integration with various calendar types, and implementing a rebranding strategy. Our project manager outlined a timeline, and I initiated task delegation using Jira to streamline the redesign process.
.png)
.png)
.png)
Research
In the course of my research, I conducted an in-depth examination of various healthcare applications, with a specific focus on their appointment calendar functionalities. The overarching objective was to discern the features offered by our competitors and identify those that truly make a significant impact on the lives of patients.
Based on my findings, it is evident that many other healthcare apps showcase intricately detailed calendars that seamlessly integrate with popular platforms such as Google Calendar and iOS Calendar. Notably, a majority of patients express a preference for using calendars as their primary tools for organizational and planning purposes. They particularly appreciate the capability to attach images or documents relevant to their appointments.
Moreover, a notable observation concerns the deliberate use of colors in these applications.Colors are employed judiciously to accentuate critical information and events, effectively drawing attention to significant upcoming days such as Women's Day or Prostate Cancer Day. This sophisticated approach not only elevates visual aesthetics but also significantly contributes to a more user-centered experience.
Based on the market research here are the new project features I decided to include in the redesign:
Integrated with other calendars (ios, google, outlook) & tools within the HS app
Interconnect other tools within the Health Calendar
Reminders within calendar for other tools
Location of the appointment displayed
Patients use it track what happened during the appointment
Push notifications & In-app notifications
Uploading images or other documents within the tools for the appointment
Easily access previous appointment information
02 - Ideate
User Flow
Initially, the Health Calendar aspired to serve as a comprehensive calendar and appointment portal, addressing patient needs by allowing them to:
-
Synchronize seamlessly with other calendars
-
Easily create and manage appointments
-
Link appointments with other in-app tools
The fundamental idea revolved around empowering patients with a personalized in-app experience and convenient access to essential data—tasks, medical appointments, upcoming events—all seamlessly integrated within the scheduling interface.
Lo-fi Wireframes
Incorporating insights from past patient feedback, my goal was to ensure that the design flow simplifies the complexity of processes. For the scheduler, I incorporated the following elements into the wireframe:
Seamless User Experience:
Intuitive calendar view for easy navigation.
Efficient Integration:
Streamlined syncing with external calendars.
Integration with various Health Storylines tools, including a dedicated section for questions to ask, medication tracking, and a health routine builder.
Comprehensive Appointment Management:
Calendar reminders and appointment-specific features such as example questions for health providers, appointment reminders, displaying location, and support for repeating appointments.
Mid Fidelity Wireframes
Homepage
Notifications
Add New Event
Event Details
Day Calendar View
03 - Design
Branding
Following the incorporation of new features to enhance usability, my next focus was on the UI design. However, given that the Health Calendar was an integral component of the pre-existing health app, Health Storylines, I encountered limitations regarding color adjustments. Adhering to the brand guidelines and style guide became imperative in maintaining visual consistency.
UI Inspiration
Starting the UI phase involved seeking inspiration and drawing from competitors highlighted in my market research. Platforms like Mobbin were instrumental in understanding common UI practices seen in similar existing products. Adhering to the overall interface of Health Storyline posed constraints on color palettes, button dimensions, and spacing. Despite these limitations, my goal was to preserve a sense of intuitiveness for the user throughout the design process.
High-Fidelity Mockups
Homepage
Add New Event
Event Details
Day Calendar View
04 - Test
User Testing
Starting the UI phase involved seeking inspiration and drawing from competitors highlighted in my market research. Platforms like Mobbin were instrumental in understanding common UI practices seen in similar existing products. Adhering to the overall interface of Health Storyline posed constraints on color palettes, button dimensions, and spacing. Despite these limitations, my goal was to preserve a sense of intuitiveness for the user throughout the design process.
Before User Testing
Usage of icons buttons were useful but users lost the importance of more crucial CTAs.
Users had to scroll to see their schedule
After User Testing
A concise schedule section which also allows the user to go from one tool to another by clicking.
Usage of colour to determine the importance of appointments/events + symbolize the tool type.
Final Design
Incorporating all received feedback, I focused on refining the high-fidelity mockups for handover to the development team. To facilitate seamless communication of design decisions, specifications, and requirements, I provided the developers with comprehensive annotations. Having experienced the benefits of developer annotations in streamlining the design-to-development process before, and considering the iterative nature of the project, providing the developers with all necessary information brought me reassurance, knowing that my designs would be accurately implemented.
.png)
05 - Reflect
Next Steps
Undertaking my initial project for the Health Storylines app marked a significant learning endeavor. The amalgamation of secondary and primary research played a pivotal role in acclimating myself to the market dynamics and fostering a deep connection with the daily experiences of our patients.
In reflection, this project has been a comprehensive educational journey, guiding me through the multifaceted process of feature design—from initial concept to the polished end product. Developing a tool tailored for individuals navigating chronic conditions necessitated a meticulous evaluation of every design decision, ensuring a solid foundation in thorough research. This feature design not only yielded valuable insights into addressing complex stakeholder needs but also emphasized the pivotal role of collaboration and adaptability in the dynamic field of design.