Summary in 30 Seconds
In this three-month group project, my teammate and I created a makeup app TintPal from the idea to high-fidelity design. This platform would enable colorblind users to receive personalized guidance and feedback on various makeup products. It acts as a digital database utilizing both crowdsourcing and Artificial Reality (AR) technology.
Context
1 in 12 men Are affected by color blindness
8% women Are carriers of color blindness
5% world population Have some form of color blindness
​
*Based on a Color Blind Awareness' 2023 report:
Problem
Color perception challenges complicate shopping experience for colorblind users.
-
Difficulty in color differentiation
-
Ambiguous color description on package
-
Limitations of RGB in Color Representation
Solution
Streamline the discovery, color recognition, and purchase decision process for colorblind users.
-
AR-powered color adjustment filter
-
Interactive product scanning
-
Crowdsourcing color impression
Design Saga
Beginning Story: Makeup Experience
Makeup is so hard! I simply don't get these colors...they all look same to me...
No I totally understand. It's even harder for me as I can never tell the difference between shades.
That moment raised a question: what about people with colorblindness?
Research
During our initial research, we explored three key solutions. However, none of them played a productive role in helping colorblind people in real-life makeup shopping.
​
​
In a word, we were on our own as being the FIRST...
Motivated by the belief that accessibility is a fundamental human right, we wanted to design an App ensuring accessibility to be accessible to everyone who is passionate about exploring beauty in life.
User Interviews
We then interviewed 5 individuals with a variety of colorblindness to understand their makeup experience
Insights
#1: Difficulty distinguishing shades
Colorblind users face significant challenges in discerning subtle shade differences, particularly when selecting makeup items like foundation, lipstick, and blush.
#2: Unclear color communication
Colorblind individuals often struggle to perceive makeup colors due to unclear color communication on product packaging.
#3: RGB tool's limited relevance
The color representation offered by RGB tools falls short in practical application, lacking real-world usability and relevance.
User Persona
Initial User Flow Design
Community Engagement:
Addressing the challenge of distinguishing colors, colorblind users often rely on external opinions for makeup shopping. Thus, we introduced a mutual-help feature, enabling access to immediate, insightful feedback on makeup colors.
​
Camera Detection:
To help colorblind users find the useful color information ASAP, we decided to incorporate a camera detection feature to lead them to the product page within one click.
Prototyping & Usability Test
Circle Back: What’s the REAL Challenge with Color Blindness?
“I thought it was color?”
​
This question from the participant dropped a bomb in my mind when we ran the usability test. We called our App “TintPal” but actually did not make the tint straightforward to our pal…
​
So, what's the plan? Shall we introduce a whole series of brand new features? Or...we can make current things a little bit more "colorful"?
User-Centric Ideation: Make Everything Easier
More perceivable color
+
More streamlined layout
+
More intuitive button to prioritize the accessibility needs for colorblind individuals
​
3 Paper Prototype Tests
6 Usability Tests
1 Heurisitc Evaluation with a Field Expert
Introducing New Character: Daltonizaton AR Technology
​
​
​
​
The colorblind type selected during onboarding will be the default Daltonized View
Daltonization is a technology that adjusts image colors to enhance visibility for color-blind individuals. When integrated with smartphone cameras, it allows users to independently perceive colors.
Iterate, Iterate, and Iterate...
Con
Users found the pin and hear icons irrelevant to help distinguishing different post types
​
Con
Users indicated challenges in identifying the plus icon as camera detection
​
​
Pro
-
Visually distinguishable post type via orientations
-
Easily found camera icon
​
​
Updated Color Pick:
DD3434
1353CE
According to the research, both are the easily perceivable colors among people with a variety of colorblindness
*source: https://venngage.com/blog/color-blind-friendly-palette/
​
​
​
Final Product: Anywhere, Anything, Anytime
Feature 1: Detecting the Color
Lipstick color? I got you!
Daltonization AR technology, integrated with smartphone camera, to enhance visibility for colorblind users.
Feature 2: Identifying the Product
Like it? Want more info? Here we go!
Users can instantly identify product information with a quick camera scan. A pop-up message then directs them to the product page.
Feature 3: Learning What Others Have Said
Check the color insights from your peers!
Color impression bubble provides crowd-sourced insight of product colors, fostering a collaborative and informative community.
Final High-Fidelity Design
Reflection
Don't Be Afraid of Being the Pioneer
Before embarking on our wonderful, productive journey, we stepped into uncharted territory, as WE WERE THE FIRST seeking solutions for colorblind makeup lovers. Throughout the semester, we successfully achieved our initial objectives, marking a significant milestone in our design journey.
Always Put Users at 1st Place
Bring solution to the target users just like bring balance to the force. As a team of able-bodied designers, we initially overlooked certain design elements that, we later realized, were not fully aligned with the needs of our target audience. This experience underscored the importance of empathetic and inclusive design practices, ensuring that our solutions truly resonate with and empower the communities we aim to serve.