Inspiration
Recently, as I was doing research for school, I came across a website with hard-to-read text due to the color scheme. Looking back on my school career, there have been many instances where I would come across websites that were inaccessible even for people with "normal eyesight," not to mention the difficulties that those with colorblindness face. This can make it especially hard to do research and require extra steps, such as using voice readers. ColorHelp was built to help solve this issue.
What it does
ColorHelp is a chrome extension that changes the color of websites to more accessible colors. There are many types of colorblindness, including the common red-green as well as the rare blue colorblindness. Due to the variety, I decided that the best option to help the most people would be black text on a white background. Through my research, I also found that many users were having difficulty recognizing a blue link from a purple visited link. With this information, I also changed the color of visited links to dark orange.
How we built it
I first created the manifest.json file to specify the basic details of the application and a CSS file where to code to change the colors would be. I uploaded the folder as a chrome extension to allow for testing throughout its development. Next, I created the extension popup that opens when it is clicked on using HTML and JavaScript. JavaScript was used to switch between the light and dark modes.
Challenges I ran into
Originally, I had planned to implement different color combinations for the users to choose between. However, I ran into difficulty changing the CSS of actual web pages as opposed to the CSS of the extension popup. Another challenge was the new implementation of manifest 3. Many of the tutorials that I found were in manifest 2, so it took a lot of side research to find the manifest 3 equivalents.
Accomplishments that we're proud of
Before this challenge, I viewed building a chrome extension as a very hard task. However, after building my own, I found that it can be accomplished by anyone using online resources. Having no previous knowledge of javascript or JSON, I was proud of myself for learning the basics within a short period of time.
What we learned
While building this application, I learned about JSON and JavaScript, and refined my HTML and CSS knowledge. I also learned a lot about the different types of color vision deficiencies.
What's next for ColorHelp
ColorHelp will continue to seek out difficulties that colorblind people face on online web pages and try to solve them using new features. I will also continue finding a solution for the different color combinations options as I believe that it will be of great help for people to choose the combination that works best for them.
Log in or sign up for Devpost to join the conversation.