2022 Academic Capstone
.png)
Sole UX Designer
User Interview
Wireframes
Prototype
Animation
Usability Research
Scoliosis is a lateral curvature of the spine affecting 7 million people in the US today. 80% of the scoliosis patients are females. If left untreated, it can lead to back pain and potentially require surgery.
The standard treatment involves:
1. Wearing a rigid brace for an average of 18 hours per day → help slow the curvature progression
2. Wearing a monitor to track brace-wearing time → ensure compliance
3. Rehabilitation exercise is recommended after taking off the brace → prevent the muscle from weakening
This design project aims to support effective scoliosis treatment and management.
"Only 10% of guardian knows their child's actual brace wearing time."
.gif)
I contacted 6 scoliosis patients online who had worn brace and now in 3 different stages of treatment from scoliosis support group. Then I distilled their complaints for scoliosis management service into 1 persona shown below.
I did the user experience analysis to 3 competitors, to understand their capabilities, challenges, and opportunities for improvement. This helped me to identify market gaps and potential opportunities.
However, I found that there are 3 challenges hindering the effectiveness of scoliosis brace.
No better way for patients and parents to track brace time that uncovers compliance issue.
Patients are disconnected from doctors until few months later to report compliance issue.
Maintaining the routine to activate muscle post-bracing can be challenging.
Encourage better brace-wearing habits in users
Report and address compliance issues efficiently
Establish consistent rehabilitation routines
.gif)
I started with sketch on paper, then developed concepts based on the features hierarchy, the user flow that I wish users to follow. Then I created mid-fi prototypes based on the paper sketch.
Building information architecture helped organizing my logic, provided a framework for the information I intend to include. It notably eliminate redundant repetition in information for later stages.
I made Home, Exercise, and Message to be in the sticky bottom menu, because they are the most important features that should be easily accessible and consistently visible across various screens. While Profile stays on the right top corner due to less frequent interaction and logical separation.
I conducted a usability test with 3 designer friends on the first version of design, and they pointed out the following problems. Taking their feedback into consideration, I created the second version.
The launch screens collect user's information with minimally 4 questions, which are user's name, age, curvature degree and brace type.
To reduce churn rate, it's crucial to foster positive emotions and motivation in users. An intuitive, simple home page can ease cognitive load, especially when users are already dealing with brace-wearing challenges. It needs to be:
1. Clear display of wear time progress.
2. Incentives to complete required wearing hours.
3. Motivation to start today's exercise.
I used conversational UX to encourage brace-wearing continuity. Additionally, I placed the exercise schedule on the home page, hooking users to engage with the app beyond just monitoring data.
Rehab exercises are vital for scoliosis management, yet often overlooked in related apps. During my interviews with orthopedists, they highlighted these exercises in preventing muscle weakening and scoliosis relapse due to bracing. Therefore, I designed the app's exercise section to provide personalized exercise recommendations through an algorithm and motivational prompts to increase user engagement.
Orthopedists have limited availability, resulting in delays addressing patient compliance issues with braces until appointment several month later, which can be too late. I was inspired by Lemonade app, to implement an AI assistant to help address outsourceable compliance problems, such as needing brace modifications due to discomfort.
The profile page displays a user's information and allows sharing compliance diagnostic reports with guardians. Users can select in 3 privacy preferences when sending the reports.
I employed a rose pink hue as the primary color to create a calming visual experience, helping users distance themselves from the struggles of scoliosis. Gradient pop colors highlight important information or titles.
I identified the different styles from the mid-fi prototype and created a visual guide for the app interface design. While applying the visual design, I optimized the layout, utilized margin spaces, adjusted font and component sizes and color to highlight the information hierarchy.
I conducted a usability test of the high fidelity prototype in maze.co with a group of 8 users. I found that:
1. Users miss 'notification' when it is under irrelevant UX script, 'privacy setting'.
2. Onboarding pages are crucial at helping user understand the app's purpose. Without it, almost no user can determine the app's purpose at first glance.
more patients say Airy app helps their doctors to analyze if any treatment plan adjustment is needed due to better engagement in the worn time and exercise tracking.
of testers can correctly find out how to check their wear time, access exercise tutorials, and update the scoliosis progression in the first 3 attempts.
I once believed the user experience started with the launch screen of an app, but it truly begins much earlier. It can be the first advertisement seen, initial website search, or unboxing a product. Even packaging that entices users with a seamless onboarding process shapes expectations. Considering the entire user journey, from awareness to advocacy, allows for a cohesive experience that helps a product stand out. Designing holistically across all touchpoints creates a more impactful overall experience than just thinking about the screens.
I realize that interface serves as a vehicle for communicating information efficiently, and guide user actions in a clear, intuitive manner given hardware constraints. The goal is to direct users down a desired path by prioritizing calls-to-action, like clicking "likes" or subscribing to a service. Designers must thoughtfully utilize limited screen space to optimize this experience.
Typography hierarchies are constrained by space and accessibility. Designers must analyze a system's type usage holistically to ensure the proper communication of informational importance at first view. Merely using the largest type on a page does not guarantee consistent hierarchy across interfaces. Establishing typographic guidelines promotes uniformity by strategically employing type sizes for optimal user orientation.
