Spectra: Color-Blind Assistant

Spectra: Color-Blind Assistant

Topics:

Accessibility

Color

Spectra is an Android app that I created independently, with 10,000+ downloads on the Google Play Store. Inspired by my mother’s experience with color blindness, Spectra helps make color-blind users’ worlds more colorful. It also lets non-color-blind users experience the world through the eyes of color-blind loved ones.

Spectra is an Android app that I created independently, with 10,000+ downloads on the Google Play Store. Inspired by my mother’s experience with color blindness, Spectra helps make color-blind users’ worlds more colorful. It also lets non-color-blind users experience the world through the eyes of color-blind loved ones.

Roles:

Sole developer, designer, researcher

Duration:

Jul 2019 - Sep 2021

Tools:

Java

Figma

Two screens of the app Spectra, -- a color blind test and enhanced camera view

Spectra’s Impact

Spectra’s Impact

Since release on Google Play Store, Spectra has helped over 10,000 people across 20 countries.

Since release on Google Play Store, Spectra has helped over 10,000 people across 20 countries.

Reviews from Google Play Store

15

3

Sep 10, 2020, 10:46

Device language: English

Spectra app is very useful and friendly to the user

4

1

April 3, 2021, 10:35

Device language: English

It’s one in the world. Helpful and unique. If in color-blind person mode we can use t/d/p parameters just like not color blind person mode that would be great. Also please add android 5 support if it’s possible.

24

5

Sep 11, 2020, 02:14

Device language: English

Great work! I am not a colorblind, but I can imagine the countless possibilities in which this app makes someone’s day :)

0

0

May 29, 2023, 16:41

Device language: Portuguese

It really works! It could also be a filter for the colors on the cell phone screen

24

5

Sep 11, 2020, 02:14

Device language: English

Great work! I am not a colorblind, but I can imagine the countless possibilities in which this app makes someone’s day :)

0

0

May 29, 2023, 16:41

Device language: Portuguese

It really works! It could also be a filter for the colors on the cell phone screen

The Problem

Color-blind people struggle with daily tasks, like picking out clothes or identifying ripeness of fruits, and rely on others for help in distinguishing colors.

According to the National Eye Institute....

1 in 12

1 in 12

men have some form of color blindness

men have some form of color blindness

1 in 200

women have some form of color blindness

3 in 4

3 in 4

color-blind folks need help verifying colors

color-blind folks need help verifying colors

Goals

Goals

When creating Spectra, I wanted to ensure that it was customizable and usable for folks with varying severities and types of color blindness.

When creating Spectra, I wanted to ensure that it was customizable and usable for folks with varying severities and types of color blindness.

Existing Solutions

Existing Solutions

There are many apps that aim to help with color blindness, but most only offer testing options, have limited personalization, and are hard to use.

There are many apps that aim to help with color blindness, but most only offer testing options, have limited personalization, and are hard to use.

Spectra logo

Color-blind Filters

Testing / Activities

Effectiveness

Color Blind Helper logo
Color Blind Pal logo
Color Blind Pal logo

Color Blind Pal

  • Provides scientific and common names of a color

  • Gives predetermined filters to enhance color images

Color Blind Helper logo

Color Blind Helper

  • Displays name, RGB, and hex values of each pixel in image

Usability testing revealed the apps...

  • Assume all people of a color blindness type have the same needs

  • Are difficult to navigate

  • Contain features, like names and color codes, that aren’t useful in users’ daily lives

This lack of personalization led me to the idea of real-time filters that are dependent on one’s type and severity of color blindness.

This lack of personalization led me to the idea of real-time filters that are dependent on one’s type and severity of color blindness.

Current tests for color blindness include...

Sample color plate test with the number 74 in green dots hidden amongst red background dots

Ishihara test (aka color plate test): most common, asked to identify number hidden in the colored dots

Sample hue test, with 4 rows each containing 10 shades in no particular order

Farnsworth-Munsell test (aka hue test): asked to arrange hues from red to purple

These tests at best give you what type of color blindness you have, failing to address severity.

These tests at best give you what type of color blindness you have, failing to address severity.

I then delved deeper into the anatomy of the eye and how our eyes process color. In this process, I consulted with 3 different doctors of optometry to confirm my understanding of the eye functionality and present initial ideas about color-blind tests that address severity.

I then delved deeper into the anatomy of the eye and how our eyes process color. In this process, I consulted with 3 different doctors of optometry to confirm my understanding of the eye functionality and present initial ideas about color-blind tests that address severity.

Original color-blind test, with option 1 matching the original color

Inspired by the hue test, I had users repeatedly match hues to an original shade and then calculated severity.

  • Having two options reduced the cognitive overload and made it easier for selection

  • Severity calculation was adjusted upon each round, accounting for where folks struggled in identification

  • I received a go from the doctors of optometry, so this structure made its way to the final app

One of the major challenges of this project was confirming that the test was accurately calculating severity.

To address this, I conducted interviews with 5 different people of varying types and severities of color blindness to learn about their experiences and then had them test the feature. These tests confirmed the accuracy of my novel color blindness test.

Instruction screen of Spectra outlining the structure of the color-blind test
Color-blind test screen of Spectra, featuring a progress bar at the top to indicate progress
Original color-blind test, with option 1 matching the original color

Inspired by the hue test, I had users repeatedly match hues to an original shade and then calculated severity.

  • Having two options reduced the cognitive overload and made it easier for selection

  • Severity calculation was adjusted upon each round, accounting for where folks struggled in identification

  • I received a go from the doctors of optometry, so this structure made its way to the final app

One of the major challenges of this project was confirming that the test was accurately calculating severity.

To address this, I conducted interviews with 5 different people of varying types and severities of color blindness to learn about their experiences and then had them test the feature. These tests confirmed the accuracy of my novel color blindness test.

Instruction screen of Spectra outlining the structure of the color-blind test
Color-blind test screen of Spectra, featuring a progress bar at the top to indicate progress

Initial Version of the Filters

  • Filtering required a complex algorithm that enhanced the colors that a person was weak in and dulled the other colors

  • I started by creating the algorithm on static images, ensuring that the filtering itself made sense before moving on to dynamic real-time adjustments

  • As with the novel color blindness test, I tested this on color-blind and non color-blind folks alike

Grid of 4 images, each containing the same aurora image but with varying enhancements to red, green, and blue
Camera integrated screen of Spectra with the original view, paused on a frame of a painting with flowers

As I was using Android Studio for the first time, the biggest challenge was the real-time filtering with camera integration.

The APIs and tools for camera integration in an app were difficult to navigate, and required me to spend many hours looking at developer resources and videos to grasp.

To emphasize the effects of the filters on the camera view, I only created two buttons for this screen -- pausing the camera frame and switching the filter on and off.

  • Pausing allows for folks to zoom in and examine particular objects without having to keep their hands still

  • Filtering adjustment allows control for when users want support

Initial Version of the Filters

  • Filtering required a complex algorithm that enhanced the colors that a person was weak in and dulled the other colors

  • I started by creating the algorithm on static images, ensuring that the filtering itself made sense before moving on to dynamic real-time adjustments

  • As with the novel color blindness test, I tested this on color-blind and non color-blind folks alike

Grid of 4 images, each containing the same aurora image but with varying enhancements to red, green, and blue
Camera integrated screen of Spectra with the original view, paused on a frame of a painting with flowers

As I was using Android Studio for the first time, the biggest challenge was the real-time filtering with camera integration.

The APIs and tools for camera integration in an app were difficult to navigate, and required me to spend many hours looking at developer resources and videos to grasp.

To emphasize the effects of the filters on the camera view, I only created two buttons for this screen -- pausing the camera frame and switching the filter on and off.

  • Pausing allows for folks to zoom in and examine particular objects without having to keep their hands still

  • Filtering adjustment allows control for when users want support

Spectra also helps non color-blind folks gain insight into color-blind people’s lives via contacts.

Spectra also helps non color-blind folks gain insight into color-blind people’s lives via contacts.

Inspired by social media platforms, Spectra allows color-blind people to share a unique code to their non color-blind friends and family.

Inspired by social media platforms, Spectra allows color-blind people to share a unique code to their non color-blind friends and family.

Codes are structured to be simple to remember, taking the form of [T,D,P] [0-100] where the letter indicates one’s type of color blindness and the number indicates one’s severity.

Non color-blind users can select from 3 pre-installed contacts (shown to the right), or add their own contact by supplying a name and the code. When using the camera filter feature, these users can see how the selected contact sees the environment.

Contacts screen, with three default contacts -- Protan Peter (P30), Deutan Daisy (D40), and Tritan Tom (T20)

My Learnings

1.

Iterating in small modules

In order to create the full functionality, I had to break down the project into small modules and test each stage. For example, with the filters I started with unit tests applying an algorithm on static images and once I refined the algorithm I then moved to dynamic image processing.

2.

Understanding the eye

Creating an application designed to help color-blind individuals required diving deep into how the eye functions and how the cones are affected in folks that have color blindness. The insights I gained through my own research as well as consulting with the doctors of optometry pushed Spectra in new directions that ultimately led to its success.

3.

Using Android Studio

Android Studio is not a beginner friendly developer tool, which made it difficult to learn as a first-time user. It was also quite different than Java, which I had lots of experience in, so I spent countless hours parsing through documentation and applying the concepts in small modules.

Create a free website with Framer, the website builder loved by startups, designers and agencies.