-
-
Notifications
You must be signed in to change notification settings - Fork 3.5k
[p5.js 2.0 RFC Proposal]: Add a way to simulate color blindness #6775
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Comments
I think this is a great accessibility feature to add, and adding it via a filter shader seems like a good fit! It looks like this would be an additive feature without breaking backwards compatibility, so it maybe could be added post-2.0 if we need to focus our dev efforts on the breaking changes that are part of the release? So that also gives us some extra flexibility if it looks like our dev schedules are going to be packed |
Thank you @nickmcintyre , and I truly appreciate your consideration of the issue, especially regarding making our sketches accessible for color-blind individuals. I believe I grasp the key aspects of the matter, and your suggestion of incorporating the feature through a |
Hi! @nickmcintyre , this a great proposal for p5. I made the Processing ColorBlindness library, which is how Processing can support colorblind users. I'm happy to help out as we think through this proposal. The ColorBlindness library works by pre-calculating the color transformation for every possible color, storing the results in a lookup table, and doing a pixel by pixel translation of colors. There is a small up-front cost (a few hundred milliseconds?) to pre-calculate that lookup table. The alternative is to do the calculations on the fly, but that will impede Sketch performance, particularly for larger Sketch windows. Using a shader is good approach for users with GPUs or good CPUs with integrated graphics. Do all p5 renderers support shaders? Or just the ones that use WebGL? Since p5 runs in a browser, you might be able to use SVG filters. I have seen examples of this online. If it works, this might be easy to implement, fast to execute, and work for all renderers. |
@hx2A we now have the ability to run shaders on 2D canvases too! (under the hood it creates a WebGL canvas to run the shader on, then draws it back to the main canvas.) |
Neat! Perhaps I am thinking about it in terms of Processing, where the default JAVA2D renderer cannot run shaders but the OpenGL renderers P2D and P3D can. I suggest exploring the different approaches to see which has the smallest performance impact on the Sketch frame rate. Ideally, the the frame rate with this feature should be as close as possible to the frame rate without it. |
I'm not familiar with Windows OS but one thing to consider for Mac is that they have accessibility features built-in and can handle different use cases for different types of colour blindness:
I wonder if there's something similar for WIndows or other OS's so that we don't have to invest in building this feature ourselves? |
Increasing access
A simple tool for simulating color blindness will make it easier for people to ensure their sketches accessible to people with color blindness.
Which types of changes would be made?
Most appropriate sub-area of p5.js?
What's the problem?
There's no easy way for people to ensure their sketches are accessible to people with color blindness. Doing so requires research and third-party software such as Color Oracle.
What's the solution?
I propose adding ways to simulate color blindness and to help coders adjust colors so that their canvases are more accessible. These tools should be available in p5.js by default. Doing so would help folks to get in the habit of making their sketches more accessible early in the design process.
@hx2A's ColorBlindness library could serve as a starting point for the design and implementation. We could add new functions or perhaps new filters for
filter()
.Pros (updated based on community comments)
TBD
Cons (updated based on community comments)
TBD
Proposal status
Under review
The text was updated successfully, but these errors were encountered: