
ClearCare posed a creative challenge focused on improving the relationships between patients and their personal health.
Click to jump to a section:
UX Design
User interviews, flow maps, A/B testing, low-fidelity prototypes
UI Design
Logo, brand identity, typography, motion design, visual assets
Final Presentation
3 interactive prototypes, stakeholder presentation, iterative user testing
Overview
CONTEXT
ClearCare is a one-stop solution to provide efficient communication and increased accessibility towards health conditions, lab results, imaging, doctor notes and medical summaries. The platform uses artificial intelligence (AI) to process medical documents, extract key information, and generate clear and concise summaries.
CHALLENGE
Electronic health records are designed for healthcare professionals and contain complex medical jargon. Additionally, for patients with English as a Second Language (ESL), language is often a massive barrier. ClearCare aims to make medical records and test results easier to understand for all.
OUTCOME
ClearCare was designed for patients of varying ages, ethnicities, and technological proficiency who are seeking efficient access to medical data.
TEAM
James Poe, Jasper Chang, Ajit Alapati, Alex Nelson
ROLE
UX Design, UI Design, User Research
TOOLS
Figma, Sketch, Adobe Creative Suite
TIMELINE
August 2023 - PRESENT
Define
RESEARCH
In the initial project phase, I conducted secondary research to explore users' needs in interpreting medical notes. The following highlights from a focus group discussion offer insights into patients' perceptions of their doctors' notes.
Additionally, a significant emphasis was placed on patients with English as a Second Language (ESL). In order to ensure an equitable design, I wanted to address the unique challenges faced by ESL users.
Ideate
PROBLEM
Understanding your health should be straightforward, but doctor's notes can be difficult to decipher! As seen in the situation below, doctor’s notes often come in dense blocks of text laden with medical jargon. This issue leads to confusion, misunderstandings, and ultimately hinders the patient's ability to actively engage in their healthcare journey.
In the ideation phase, I talked with users from different age groups/ levels of English proficiency to better understand their needs. I organized my findings with affinity diagrams and empathy maps.
SOLUTION
Through these findings, I honed in on three key challenges and a refined solution statement.
To address the challenge of comprehending medical results, ClearCare is designed to provide clear and concise summaries of doctor notes, additional resources to supplement the patient’s understanding, and translations into different languages.
Design
DESIGN EXPLORATION
I collaborated with our engineer to establish the scope of the project and to ensure a seamless and intuitive experience. Using our research insights, I created a user flow and sketches that directly address the identified pain points of patients.
Iterations
WIREFRAME TESTING
I started wireframing by conducting A/B testing with 25 participants (students, senior patients, ESL patients) for two user interface designs. The focus was on comparing the effectiveness of tabs versus scrolling navigation methods.
After receiving feedback, I discovered that the tabs provide a structured and organized layout, but interrupted the user flow. Conversely, scrolling provided a holistic view of the information, but users prefer to toggle to the original document. In the final solution, I opted for a combination of both interfaces.
USER INSIGHTS
I surveyed 30 respondents to gain a better idea of their experience with the interface. I compared the previous interface with the new interface, and conducted task success rate tests.
User Interface
BRAND IDENTITY
I aimed to create a brand identity for ClearCare that feels approachable and reliable. With a palette of calming blue tones and a round, friendly font, the brand creates a comforting experience for users navigating their health journey.
MOTION STATES
ACTIVATED
PROCESSING
ERROR
ERROR
INTERFACE DESIGN
The interface design was guided by universal design principles, ensuring that it is easy to navigate for all users, regardless of their technological proficiency.
Outcome
SOLUTION
Many iterations later, ClearCare has evolved into a user-centric platform designed to provide a more intuitive experience for reading doctor's notes. With an emphasis on increasing accessibility for ESL patients, ClearCare aims to provide a seamless and user-friendly interface.
Summarize Doctor's Notes
Translate complex medical notes into understandable insights, providing patients with a clear understanding of their condition with clear next steps and treatment plans.
Simplify Lab Results
Convert lab results into visually intuitive formats and eliminate confusion by providing explicit explanations for each test conducted.
Instantly Translate Page
Translate entire page with the translation feature, breaking down language barriers and ensuring accessibility.
Reflections
THE ONES THAT GOT AWAY
My key takeaway from this project is that design is not always linear! Collaborating closely with the team, we explored a multitude of ideas and concepts that ultimately did not make the final cut.
This prototype was made during the initial phase of the design to demonstrate the backend development of the simplification and translation feature. Adapting to the challenges and constraints inherent in the initial prototype, the team iteratively refined this design to align with the project's goals.
LEARNINGS
As we iteratively added more and more features to ClearCare, I realized the need for a complete UI redesign. This taught me the value of a holistic design approach, emphasizing an integrated design ecosystem over individual pages for better scalability and coherence.
Working in a startup environment required me to adaptable. Beyond my primary role in UX/UI design, I found myself delving into visual design, communications, and marketing. This approach not only allowed me to become a more versatile designer but also underscored the importance of adaptability and cross-functional collaboration.
A key learning from working in a collaborative team environment, especially as the sole designer, is the value of diverse feedback. The success of the project was dependent on the shared passion and belief in the product by all team members.
NEXT STEPS
The upcoming phases for ClearCare involve collaborative testing with developers and Quality Assurance teams. This aims to ensure that my prototypes are feasible, while maintaining alignment with the shared vision and goals established during the development phase.