Patient Portal APP
My Role
Product Designer — User Research, Interaction Design, Visual Design, Prototyping, Design QA
Team
1 Product Owner
2 Product Designers
3 Product Managers
6 Engineers
Timeline
2020-2021
Project Overview
With more than 20,000 users, AICS patient portal app makes it easier for patients to manage their own care with easy access. Services include appointment scheduling, prescription pick-up scheduling, medications reminder, and more.
As one of the design owner of the app, I collaborated cross-functionally and incrementally enhanced the app's experience over the course of seven months across multiple projects.
Selected Project—
A Refresh Look For The APP
The problems
The team consistently received user complaints concerning the small, hard-to-read text. This poor accessibility poses a challenge for our primary user base, most of whom are over 40 years old and above.
Due to the increasing product complexity and legacy design, designers have struggled to reach consensus and maintain design consistency.
The app desperately needed a more accessible and unified design language.
The strategy — keep the ambition humble
While we recognize that there are numerous potential improvements for the app, we must balance our ambitions with what can realistically be achieved within given timeframe and resource. Also, we don't want to scare our users away with drastic changes. In this project, we want to achieve:
Refine the app's typography to enhance readability, and allow the text size to adjust according to system settings.
Revamp pages/flows of 4 core features that have critical usability issues or fail to accommodate large text.
Establish unified design language and UI libraries for the design team.
The results
After rolled out our updated design, we garnered much positive feedback from our users, and never received the complaints about small text. Also, the Google Pay Store rating went from 4.2 to 4.6.
The established component libraries also greatly elevate the design consistency, as well as enhance the team's work efficiency across design and development.
Our team conducted a review of the existing design to determine how the current type scale was applied. Following this, we established a new type scale capable of accommodating our product and its various contents. In addition, we increased our font size to guarantee that our content remains easy to read for all users.
I established the component libraries in Figma with the incorporation of predefined typography, colors, and spacing. The components not only greatly elevate the design consistency, but also enhance the team's work efficiency across design and development.
Revamp the appointment scheduling feature
The appointment scheduling is a frequent-used feature in our app, with over 4.5K MAU. In efforts to enhance design conformity and improve accessibility, I adjusted the design to comply with our design guidelines and heightened color contrast. Additionally, my analysis led me to discover that the calendar page suffered from a high bounce rate. With a focus on ease of reading, scanning, navigation, and action-taking, I redesigned the page. This overhaul resulted in a 15% reduction in the page's bounce rate.
Selected Project—
Hospital Admission Pass
The problem
In 2021, as a proactive response to the COVID-19 pandemic, the Taiwan CDC strengthened the access control in hospitals, mandating that visitors to hospitals must provide their personal information for contact tracing before entering the buildings.
Typically, hospitals collect this data by scanning visitors’ NHI cards. However, our collaborating hospital soon identified an unintended consequence — the queues formed for card scanning at the entrance were escalating the risk of gatherings, consequently heightening the potential for disease transmission.
The solve
We introduced the Hospital Admission Pass, allowing visitors to provide personal information upfront for quicker access, effectively mitigating crowding at the entrance. The pass further facilitates the identification of visitors with an high infection risk.
For the business goal, we aimed to leverage this initiative to drive both our user base and registration numbers.
The results
The feature was successfully launched in two weeks, with more than 5K MAU. This also led to a 33% rise in downloads.
Enable a seamless process for users to obtain passes promptly. The information is auto-populated for registered users to reduce necessary exertions.
Through the clear status on passes, hospital staff can easily identify a user's eligibility for hospital access immediately upon sight.
We encourage users to sign up when they leave the feature. This allows them to save more time for the next visit. Moreover, it enables us to boost the registration count.