ALTEACARE
Your Wellness On-the-Go — Crafting Intuitive Healthcare Apps
[case.study]
[ui—ux.design]
[app]
[healthcare]
[mobile]
[2023]
ALTEACARE
Your Wellness On-the-Go — Crafting Intuitive Healthcare Apps
[case.study]
[ui—ux.design]
[app]
[healthcare]
[mobile]
[2023]
[approach]
Primary Research
Secondary Research
Comparative Research
Usability Testing
[role]
UX Researcher
UI/UX Designer
[timeframe]
2 Weeks
[tools]
[approach]
Primary Research
Secondary Research
Comparative Research
Usability Testing
[role]
UX Researcher
UI/UX Designer
[timeframe]
2 Weeks
[tools]
[overview]
[overview]
Altea Care is a healthcare provider platform that offers telemedicine services and medical consultations to patients in Indonesia. One of the challenges Altea Care faces is that new users may feel uncomfortable with the platform, leading to low user acquisition rates. Additionally, Altea Care faces tough competition from other healthcare providers, such as Halodoc, in Indonesia. Therefore, the goal of this design brief challenge is to improve Altea Care apps for new users, making them more comfortable and confident in using the platform, and to innovate in ways that allow Altea Care to compete with Halodoc.
Altea Care is a healthcare provider platform that offers telemedicine services and medical consultations to patients in Indonesia. One of the challenges Altea Care faces is that new users may feel uncomfortable with the platform, leading to low user acquisition rates. Additionally, Altea Care faces tough competition from other healthcare providers, such as Halodoc, in Indonesia. Therefore, the goal of this design brief challenge is to improve Altea Care apps for new users, making them more comfortable and confident in using the platform, and to innovate in ways that allow Altea Care to compete with Halodoc.
DESIGN PROCESS
DESIGN PROCESS
01.
01.
Understanding Design Brief and Scope
Understanding Design Brief and Scope
[objectives]
Improve user experience and engagement.
Enhance transparency for user comfort and confidence.
Increase user acquisition by making it an attractive alternative to Halodoc.
Innovate for competitive strength in the Indonesian healthcare market.
[deliverables]
User-friendly interface design enhancing transparency and user experience.
Comprehensive style guide outlining design elements, colors, and typography.
Design rationale document explaining design decisions.
Prototype for usability testing.
Innovative features for competition with Halodoc and other providers.
[target.user]
User
Buyer
[objectives]
Improve user experience and engagement.
Enhance transparency for user comfort and confidence.
Increase user acquisition by making it an attractive alternative to Halodoc.
Innovate for competitive strength in the Indonesian healthcare market.
[deliverables]
User-friendly interface design enhancing transparency and user experience.
Comprehensive style guide outlining design elements, colors, and typography.
Design rationale document explaining design decisions.
Prototype for usability testing.
Innovative features for competition with Halodoc and other providers.
[target.user]
User
Buyer
[problem.statement]
[problem.statement]
Surveys, usability testing, and interviews uncovered key challenges within the Altea Care application. Users struggled with accessing the telemedicine booking feature, leading to a less smooth experience. Page differentiation issues and an underutilized Altea Care feature added to user confusion and a steep learning curve. These challenges contributed to a high bounce rate and difficulties in retaining loyal users, ultimately resulting in a suboptimal user experience.
Surveys, usability testing, and interviews uncovered key challenges within the Altea Care application. Users struggled with accessing the telemedicine booking feature, leading to a less smooth experience. Page differentiation issues and an underutilized Altea Care feature added to user confusion and a steep learning curve. These challenges contributed to a high bounce rate and difficulties in retaining loyal users, ultimately resulting in a suboptimal user experience.
02.
02.
Secondary Research and Comparative Analysis
Secondary Research and Comparative Analysis
[my.research]
[my.research]
In this research, I employed a combination of primary and desk research methods. Primary research involved conducting interviews with individuals to gather firsthand insights and information. Meanwhile, desk research, a form of secondary research, entailed the collection and analysis of existing data from sources like books, articles, and reports. This dual approach allowed for a comprehensive exploration of the research topic, leveraging both direct perspectives and previously published knowledge.
In this research, I employed a combination of primary and desk research methods. Primary research involved conducting interviews with individuals to gather firsthand insights and information. Meanwhile, desk research, a form of secondary research, entailed the collection and analysis of existing data from sources like books, articles, and reports. This dual approach allowed for a comprehensive exploration of the research topic, leveraging both direct perspectives and previously published knowledge.
RESEARCH
RESEARCH
[interview]
[survery]
Respondents
Users who have previously used a similar healthcare application.
Users who have used a healthcare application in the last 3 months.
Users who have used a healthcare application for Doctor Consultation, Purchasing Medication, Prescription Redemption, or Health Check.
Insight
Users find it challenging to navigate the Homepage interface.
Users find it difficult to choose a category for doctor consultation services.
Users encounter difficulty in finding doctors based on their desired criteria.
Users experience difficulty in finding doctors based on their schedules.
Users face challenges when attempting to make changes during Transaction Details.
Users have trouble finding the command to upload their ID card (KTP).
Users perceive it as irrelevant to provide overly detailed personal information.
[interview]
[survey]
Respondents
Users who have previously used a similar healthcare application.
Users who have used a healthcare application in the last 3 months.
Users who have used a healthcare application for Doctor Consultation, Purchasing Medication, Prescription Redemption, or Health Check.
Insight
Users find it challenging to navigate the Homepage interface.
Users find it difficult to choose a category for doctor consultation services.
Users encounter difficulty in finding doctors based on their desired criteria.
Users experience difficulty in finding doctors based on their schedules.
Users face challenges when attempting to make changes during Transaction Details.
Users have trouble finding the command to upload their ID card (KTP).
Users perceive it as irrelevant to provide overly detailed personal information.
[interview]
[survey]
Respondents
Users who have previously used a similar healthcare application.
Users who have used a healthcare application in the last 3 months.
Users who have used a healthcare application for Doctor Consultation, Purchasing Medication, Prescription Redemption, or Health Check.
Insight
Users find it challenging to navigate the Homepage interface.
Users find it difficult to choose a category for doctor consultation services.
Users encounter difficulty in finding doctors based on their desired criteria.
Users experience difficulty in finding doctors based on their schedules.
Users face challenges when attempting to make changes during Transaction Details.
Users have trouble finding the command to upload their ID card (KTP).
Users perceive it as irrelevant to provide overly detailed personal information.
COMPARATIVE ANALYSIS
COMPARATIVE ANALYSIS
[01]
HALODOC
Offers online and offline doctor consultations.
Allows users to order and have medications delivered.
Provides comprehensive healthcare services, including lab tests and specialist consultations.
[02]
ALODOKTER
Focuses on health information and medical articles.
Enables users to search for symptoms, diseases, and general health info.
Does not provide doctor consultations or medication ordering.
[03]
KLIKDOKTER
Provides health information and medical articles.
Users can participate in health discussion forums.
Lacks doctor consultations or medication ordering.
[04]
SEHATQ
Offers online doctor consultation services.
Allows users to search for specialized doctors.
Facilitates online doctor appointments.
Provides general information about diseases and symptoms.
[01]
HALODOC
Offers online and offline doctor consultations.
Allows users to order and have medications delivered.
Provides comprehensive healthcare services, including lab tests and specialist consultations.
[02]
ALODOKTER
Focuses on health information and medical articles.
Enables users to search for symptoms, diseases, and general health info.
Does not provide doctor consultations or medication ordering.
[03]
KLIKDOKTER
Provides health information and medical articles.
Users can participate in health discussion forums.
Lacks doctor consultations or medication ordering.
[04]
SEHATQ
Offers online doctor consultation services.
Allows users to search for specialized doctors.
Facilitates online doctor appointments.
Provides general information about diseases and symptoms.
[conclusion]
[conclusion]
I have improved and optimized the doctor's consultation process by strategically designing the interface to deliver an excellent user experience. The streamlined application ensures that users can easily achieve their goals, leading to better conversions and improved business performance.
I have improved and optimized the doctor's consultation process by strategically designing the interface to deliver an excellent user experience. The streamlined application ensures that users can easily achieve their goals, leading to better conversions and improved business performance.
03.
03.
Ideation, Creating Design, and Prototyping
Ideation, Creating Design, and Prototyping
[ideate.problem]
[ideate.problem]
After conducting primary research, secondary research, and comparative analysis, I created a user persona that includes pain points, needs, and goals. Then, I ideated 'How Might We' (HMW) questions and solutions to achieve the best possible outcome.
After conducting primary research, secondary research, and comparative analysis, I created a user persona that includes pain points, needs, and goals. Then, I ideated 'How Might We' (HMW) questions and solutions to achieve the best possible outcome.
IDEATE PROBLEM
IDEATE PROBLEM
[user]
[matrix]
[user]
[matrix]
[user.persona]
[priority.matrix]
OKKY AVIANTI
Gender
Age
Location
Occupation
: Woman
: 26
: Jakarta, Indonesia
: Data Analyst
[brands]
[pain.point]
Time Constraints: Okky’s busy schedule makes traditional appointments challenging.
Lack of Experience: She might feel uncertain about navigating a healthcare app.
Trust Issues: Credibility and transparency concerns as a new user.
Overwhelm: Complex or cluttered interfaces can deter her.
[goals.&.needs]
Convenient Healthcare Access: Okky's seeks quick and convenient medical consultations to fit her busy schedule.
User-Friendly Experience: As a first-time healthcare app user, she desires an intuitive interface.
Transparency: Okky's values clear information about medical procedures and diagnoses.
Innovative Features: She appreciates gamification and personalized recommendations.
Competitive Alternative: Okky's is open to exploring Altea Care as a reliable healthcare platform.
[design.style]
[design.style]
Design style in UI/UX refers to the visual presentation and aesthetic decisions made in the interface of a digital product. These choices, which can include flat design, material design, minimalism, and various others, have a significant influence on the user experience and the product's brand identity.
Design style in UI/UX refers to the visual presentation and aesthetic decisions made in the interface of a digital product. These choices, which can include flat design, material design, minimalism, and various others, have a significant influence on the user experience and the product's brand identity.
STYLE GUIDE
Color Pallete
Primary
#E85250
#FF8D8C
#FF8D8C
Accent
#4367AB
#619CC1
#7FC6B8
#ECF5FE
#DAECF5
Greyscale
#222222
#585858
#989898
#C4C4C
#F2F2F2
Typography
[Manrope]
Aa
20 Bold
Aa
16 Semibold
Aa
16 Medium
Aa
14 Regular
Aa
12 Regular
brown fox
jumps over
the lazy dog
Color Pallete
Primary
#E85250
#FF8D8C
#FF8D8C
Accent
#4367AB
#619CC1
#7FC6B8
#ECF5FE
#DAECF5
Greyscale
#585858
#989898
#C4C4C
#F2F2F2
#222222
Typography
[Manrope]
Aa
20 Bold
Aa
16 Semibold
Aa
16 Medium
Aa
14 Regular
Aa
12 Regular
brown fox
jumps over
the lazy dog
[wireframe.&.information.architecture]
[wireframe.&.information.architecture]
A user flow directs users through a process, encompassing their actions and choices to create an intuitive user experience. A sitemap provides a visual representation of the product's structure, assisting with content organization and navigation. It serves as the basis for creating wireframes and facilitates communication among stakeholders.
A user flow directs users through a process, encompassing their actions and choices to create an intuitive user experience. A sitemap provides a visual representation of the product's structure, assisting with content organization and navigation. It serves as the basis for creating wireframes and facilitates communication among stakeholders.
[wireframe]
[user.flow]
[wireframe]
[user.flow]
[wireframe]
[user.flow]
[ui.solutions]
[ui.solutions]
To resolve the problem of limited information visibility on the current website, I have created a new website that prioritizes improved readability. Through strategic categorization and hierarchical organization of content, users can readily access and comprehend the information. Furthermore, each page features clear and fitting calls to action to ensure the best possible user engagement.
To resolve the problem of limited information visibility on the current website, I have created a new website that prioritizes improved readability. Through strategic categorization and hierarchical organization of content, users can readily access and comprehend the information. Furthermore, each page features clear and fitting calls to action to ensure the best possible user engagement.
MOBILE DESIGN
MOBILE DESIGN
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
[01]
Optimize the hierarchy of information on the homepage for a more intuitive experience.
[before]
[after]
[02]
Maximize the 'Search Bar' feature on the homepage for a more effective search experience.
[before]
[after]
[03]
Organize the categories for doctor consultation services to be more intuitive and easily accessible for users.
[before]
[after]
[04]
Present more complete and clear information on doctors' schedules for better user convenience.
[before]
[after]
[05]
Rearrange the placement of filters and sort options for easier user access.
[before]
[after]
[06]
Provide comprehensive information on the doctor’s page, including consultation types, doctor’s profile, professional experience, patient ratings, consultation schedule, and total cost.
[before]
[after]
[07]
Change the usage of "Tambah Daftar Keluarga" to "Tambah Data Pasien", and provide additional information in the "Pilih Pasien" step to help users easily select the patient for consultation, ensuring they do not get confused during the process.
[before]
[after]
[08]
Adjust the information in "Rincian Telekonsultasi" and the payment methods to make them clearer and more user-friendly.
[before]
[after]
04.
04.
Conduct Usability Testing
Conduct Usability Testing
[type]
Unmoderated
[duration]
10-15 minutes
[participant]
8 Users
[tools]
[testing.remotely]
[testing.remotely]
Six tasks have been created to assess whether users can effectively complete them, and the results will help determine the user-friendliness of the application.
Six tasks have been created to assess whether users can effectively complete them, and the results will help determine the user-friendliness of the application.
[task]
[1st.result]
[2nd.result]
[task]
[1st.result]
[2nd.result]
[task]
[1st.result]
[2nd.result]
[summary.&.conclusion]
[summary.&.conclusion]
Based on the results of the usability testing I conducted, I have successfully achieved an average success rate of 97.45%, which is significantly higher than the initial result of 61.4%. These results indicate that the design I have created effectively addresses user issues. Out of the 8 tasks that were tested, on average, users encountered obstacles in completing their tasks, and they found the interface and user experience of the application to be disruptive.
However, in the second usability testing, users were able to successfully complete the tasks, where the first, second, fifth, sixth, and seventh tasks, which were previously challenging for users, were completed perfectly.
In conclusion, the results of the usability testing confirm that my design has been successful in most cases, with significant improvements over the initial testing. Nevertheless, there is room for further enhancements that can help users overcome potential obstacles they may encounter in specific tasks. I am committed to continually improving our design to provide the best possible user experience.
Based on the results of the usability testing I conducted, I have successfully achieved an average success rate of 97.45%, which is significantly higher than the initial result of 61.4%. These results indicate that the design I have created effectively addresses user issues. Out of the 8 tasks that were tested, on average, users encountered obstacles in completing their tasks, and they found the interface and user experience of the application to be disruptive.
However, in the second usability testing, users were able to successfully complete the tasks, where the first, second, fifth, sixth, and seventh tasks, which were previously challenging for users, were completed perfectly.
In conclusion, the results of the usability testing confirm that my design has been successful in most cases, with significant improvements over the initial testing. Nevertheless, there is room for further enhancements that can help users overcome potential obstacles they may encounter in specific tasks. I am committed to continually improving our design to provide the best possible user experience.
[type]
Unmoderated
[duration]
10-15 minutes
[participant]
5 User
[tools]
THANK YOU!
and hope to hear from you soon.
THANK YOU!
and hope to hear from you soon.
