Medical Records Platform— UX/UI Design
Medical Records Platform—
UX/UI Design
Medical Records Platform—
UX/UI Design
Prototype Demo
Role
UX/UI Designer
UX/UI Designer
UX/UI Designer
Duration
2 Months
2 Months
2 Months
Tools
Figma, FigJam
Figma, FigJam
Figma, FigJam
Project Overview
Curanostics is a medical records management platform that allows users to manage their health data securely and efficiently. The platform was in its early development stages, with only a basic framework in place. It lacked a clear user experience strategy, making health records difficult to navigate.
The goal was to transform a foundational concept into a fully realized, user-friendly healthcare records management system that streamlined workflows, improved accessibility, and met industry standards.
Curanostics is a medical records management platform that allows users to manage their health data securely and efficiently. The platform was in its early development stages, with only a basic framework in place. It lacked a clear user experience strategy, making health records difficult to navigate.
The goal was to transform a foundational concept into a fully realized, user-friendly healthcare records management system that streamlined workflows, improved accessibility, and met industry standards.
Curanostics is a medical records management platform that allows users to manage their health data securely and efficiently. The platform was in its early development stages, with only a basic framework in place. It lacked a clear user experience strategy, making health records difficult to navigate.
The goal was to transform a foundational concept into a fully realized, user-friendly healthcare records management system that streamlined workflows, improved accessibility, and met industry standards.
Results
The redesigned platform delivers a seamless experience across both desktop and mobile, ensuring accessibility across devices.
With a structured interface and HIPAA-compliant security, the platform saw an increase in user satisfaction, improving from a 2/5 to 4.5/5 average rating.
The redesigned platform delivers a seamless experience across both desktop and mobile, ensuring accessibility across devices.
With a structured interface and HIPAA-compliant security, the platform saw an increase in user satisfaction, improving from a 2/5 to 4.5/5 average rating.
The redesigned platform delivers a seamless experience across both desktop and mobile, ensuring accessibility across devices.
With a structured interface and HIPAA-compliant security, the platform saw an increase in user satisfaction, improving from a 2/5 to 4.5/5 average rating.
Context
In the U.S., nearly 90% of adults struggle with health literacy, making it difficult for most to understand their medical records and make informed decisions. This, combined with growing distrust in healthcare providers, leads to poor patient engagement and reluctance to share medical information.
Curanostics addresses these issues by providing a secure, user-friendly platform that simplifies health data management, enhances privacy, and empowers users to take control of their medical information with confidence.
In the U.S., nearly 90% of adults struggle with health literacy, making it difficult for most to understand their medical records and make informed decisions. This, combined with growing distrust in healthcare providers, leads to poor patient engagement and reluctance to share medical information.
Curanostics addresses these issues by providing a secure, user-friendly platform that simplifies health data management, enhances privacy, and empowers users to take control of their medical information with confidence.
In the U.S., nearly 90% of adults struggle with health literacy, making it difficult for most to understand their medical records and make informed decisions. This, combined with growing distrust in healthcare providers, leads to poor patient engagement and reluctance to share medical information.
Curanostics addresses these issues by providing a secure, user-friendly platform that simplifies health data management, enhances privacy, and empowers users to take control of their medical information with confidence.
Process
Research
The research phase focused on understanding user needs, industry standards, and compliance requirements for handling sensitive medical records across both mobile and desktop platforms. Given the healthcare context, regulatory research was critical to ensuring both usability and security.
The research phase focused on understanding user needs, industry standards, and compliance requirements for handling sensitive medical records across both mobile and desktop platforms. Given the healthcare context, regulatory research was critical to ensuring both usability and security.
The research phase focused on understanding user needs, industry standards, and compliance requirements for handling sensitive medical records across both mobile and desktop platforms. Given the healthcare context, regulatory research was critical to ensuring both usability and security.
Usability Audit
A usability audit was conducted on the beta version of the platform to assess the platform’s user experience, focusing on pain points in navigation, accessibility, and data retrieval. Key considerations included minimizing cognitive load, ensuring clear call-to-action elements, and reducing friction in accessing critical health data.
A usability audit was conducted on the beta version of the platform to assess the platform’s user experience, focusing on pain points in navigation, accessibility, and data retrieval. Key considerations included minimizing cognitive load, ensuring clear call-to-action elements, and reducing friction in accessing critical health data.
A usability audit was conducted on the beta version of the platform to assess the platform’s user experience, focusing on pain points in navigation, accessibility, and data retrieval. Key considerations included minimizing cognitive load, ensuring clear call-to-action elements, and reducing friction in accessing critical health data.
Annotated Screen from Usability Audit
Competitive Analysis
An analysis of competitor platforms helped identify industry best practices for medical record management. This research highlighted common security pitfalls, compliance strategies, and UX patterns used to simplify complex health data.
An analysis of competitor platforms helped identify industry best practices for medical record management. This research highlighted common security pitfalls, compliance strategies, and UX patterns used to simplify complex health data.
An analysis of competitor platforms helped identify industry best practices for medical record management. This research highlighted common security pitfalls, compliance strategies, and UX patterns used to simplify complex health data.
Competitors Analyzed
Regulatory Research
Understanding HIPAA (Health Insurance Portability and Accountability Act) compliance was essential in designing a secure system that protects patient health data (PHI—Protected Health Information).
Understanding HIPAA (Health Insurance Portability and Accountability Act) compliance was essential in designing a secure system that protects patient health data (PHI—Protected Health Information).
Understanding HIPAA (Health Insurance Portability and Accountability Act) compliance was essential in designing a secure system that protects patient health data (PHI—Protected Health Information).
Define
The define phase established structured workflows to ensure both usability and compliance with regulatory requirements.
The define phase established structured workflows to ensure both usability and compliance with regulatory requirements.
The define phase established structured workflows to ensure both usability and compliance with regulatory requirements.
User Personas
Personas were developed to represent users with diverse needs and behaviors when interacting with medical records. These helped tailor user flows across different
use cases.
Personas were developed to represent users with diverse needs and behaviors when interacting with medical records. These helped tailor user flows across different
use cases.
Personas were developed to represent users with diverse needs and behaviors when interacting with medical records. These helped tailor user flows across different use cases.
Rachel
Rachel
26-year-old school teacher, passionate about holistic health
Recently diagnosed with a thyroid condition
Wants a platform that combines medical records with personal goals
26-year-old school teacher, passionate about holistic health
Recently diagnosed with a thyroid condition
Wants a platform that combines medical records with personal goals
Robert
Robert
67-year-old retiree who manages multiple chronic conditions
Manages multiple chronic health conditions
Wants a simple tool that makes it easy for him to access and understand his health information
67-year-old retiree who manages multiple chronic conditions
Manages multiple chronic health conditions
Wants a simple tool that makes it easy for him to access and understand his health information
Sandra
Sandra
38-year-old mom, caring for her children and aging father
She manages her family's health and is often overwhelmed
Needs a platform to manage health data without adding stress
38-year-old mom, caring for her children and aging father
She manages her family's health and is often overwhelmed
Needs a platform to manage health data without adding stress
User Flow
User flows mapped how users create an account, complete onboarding, and securely share their medical records—ensuring a smooth entry into the platform while adhering to privacy regulations.
User flows mapped how users create an account, complete onboarding, and securely share their medical records—ensuring a smooth entry into the platform while adhering to privacy regulations.
User flows mapped how users create an account, complete onboarding, and securely share their medical records—ensuring a smooth entry into the platform while adhering to privacy regulations.
User Flow
Brainstorm
During this phase, ideation centered on making complex medical data more intuitive while maintaining compliance with regulatory and accessibility standards.
During this phase, ideation centered on making complex medical data more intuitive while maintaining compliance with regulatory and accessibility standards.
During this phase, ideation centered on making complex medical data more intuitive while maintaining compliance with regulatory and accessibility standards.
Wireframes
In Figma, I created mid-fidelity wireframes to outline the structure and layout of the redesigned platform, for both mobile and desktop.
Considerations included:
Mobile: Prioritized a simplified, touch-friendly interface with easy navigation.
Desktop: Designed for data-heavy tasks, incorporating advanced filtering, larger data views, and multi-panel layouts.
Adaptive UI Components: Ensured elements like buttons, forms, and menus worked well across various screen sizes.
In Figma, I created mid-fidelity wireframes to outline the structure and layout of the redesigned platform, for both mobile and desktop.
Considerations included:
Mobile: Prioritized a simplified, touch-friendly interface with easy navigation.
Desktop: Designed for data-heavy tasks, incorporating advanced filtering, larger data views, and multi-panel layouts.
Adaptive UI Components: Ensured elements like buttons, forms, and menus worked well across various screen sizes.
In Figma, I created mid-fidelity wireframes to outline the structure and layout of the redesigned platform, for both mobile and desktop.
Considerations included:
Mobile: Prioritized a simplified, touch-friendly interface with easy navigation.
Desktop: Designed for data-heavy tasks, incorporating advanced filtering, larger data views, and multi-panel layouts.
Adaptive UI Components: Ensured elements like buttons, forms, and menus worked well across various screen sizes.
Wireframes
Design
This phase brought the wireframes to life, incorporating secure, accessible, and compliant design elements to meet industry regulations.
This phase brought the wireframes to life, incorporating secure, accessible, and compliant design elements to meet industry regulations.
This phase brought the wireframes to life, incorporating secure, accessible, and compliant design elements to meet industry regulations.
Prototype
The high-fidelity prototype provided an interactive representation of the final design, enabling detailed stakeholder feedback and internal validation of key user flows and interface elements.
The high-fidelity prototype provided an interactive representation of the final design, enabling detailed stakeholder feedback and internal validation of key user flows and interface elements.
The high-fidelity prototype provided an interactive representation of the final design, enabling detailed stakeholder feedback and internal validation of key user flows and interface elements.
Prototype Demo
Design System
A design system was developed to ensure consistency across mobile and desktop platforms. This system included standardized UI components, color palettes, and typography, enabling a cohesive user experience. This laid the foundation for scalable future design work and streamlined the overall design process.
A design system was developed to ensure consistency across mobile and desktop platforms. This system included standardized UI components, color palettes, and typography, enabling a cohesive user experience. This laid the foundation for scalable future design work and streamlined the overall design process.
A design system was developed to ensure consistency across mobile and desktop platforms. This system included standardized UI components, color palettes, and typography, enabling a cohesive user experience. This laid the foundation for scalable future design work and streamlined the overall design process.
Some Components from the Design System
Test
The testing phase validated that the design was both user-friendly and compliant with healthcare regulations.
The testing phase validated that the design was both user-friendly and compliant with healthcare regulations.
The testing phase validated that the design was both user-friendly and compliant with healthcare regulations.
A/B Testing
A/B testing was used to optimize:
Data visualization methods (e.g., tabular vs. card-based medical record displays).
User engagement metrics while maintaining privacy safeguards.
A/B testing was used to optimize:
Data visualization methods (e.g., tabular vs. card-based medical record displays).
User engagement metrics while maintaining privacy safeguards.
A/B testing was used to optimize:
Data visualization methods (e.g., tabular vs. card-based medical record displays).
User engagement metrics while maintaining privacy safeguards.
Conclusion
The Curanostics platform redesign improved the user experience with a streamlined interface, better navigation, and HIPAA-compliant security features. Users reported they would check the platform more frequently, which suggests higher engagement and satisfaction, with positive feedback on the overall design improvements.
A key takeaway from this project was the importance of early user feedback. As a solo designer, managing communication and aligning with stakeholders was critical to stay on track, especially with limited resources and time. Additionally, leveraging Figma’s Auto Layout feature sped up the design process significantly, helping me keep the project on schedule.
The Curanostics platform redesign improved the user experience with a streamlined interface, better navigation, and HIPAA-compliant security features. Users reported they would check the platform more frequently, which suggests higher engagement and satisfaction, with positive feedback on the overall design improvements.
A key takeaway from this project was the importance of early user feedback. As a solo designer, managing communication and aligning with stakeholders was critical to stay on track, especially with limited resources and time. Additionally, leveraging Figma’s Auto Layout feature sped up the design process significantly, helping me keep the project on schedule.
The Curanostics platform redesign improved the user experience with a streamlined interface, better navigation, and HIPAA-compliant security features. Users reported they would check the platform more frequently, which suggests higher engagement and satisfaction, with positive feedback on the overall design improvements.
A key takeaway from this project was the importance of early user feedback. As a solo designer, managing communication and aligning with stakeholders was critical to stay on track, especially with limited resources and time. Additionally, leveraging Figma’s Auto Layout feature sped up the design process significantly, helping me keep the project on schedule.
Mobile Screen
Mobile Prototype Demo