Jump to content

Recommended Posts

Hello,

If you guys could add these contrast ratio feature in Affinity, it would be a really great tool. Here are some links that checks the contrast of background and foreground color.
https://coolors.co/contrast-checker/112a46-acc8e5
https://colourcontrast.cc/
https://webaim.org/resources/contrastchecker/


I also attached a video explaining the feature request.


Regards,
Hossein

Share this post


Link to post
Share on other sites

Hi,

on the german site leserlich.info you will find helpful calculators in German and English:

leserlich.info is a service offered by the German Federation of the Blind and Partially Sighted (Deutscher Blinden- und Sehbehindertenverband)

It would be nice to integrate. If it is possible to define presets you can add other guides as well. When you choose a font you can check it of size and contrast. Therefore you must have the possibility to measure cap height and x-height and setting them automatically. This helps especially with Art Text.

Share this post


Link to post
Share on other sites

Very interesting idea. What I usually do to check contrast (on illustrations, for example) is to put a black rectangle over the area that I need to check, and change its Blendo Mode to Color.

That will give you a very good idea of the perceived light that you are getting from that imagen. Avoid simply using and HSL Adjustment to bring down the Saturation, because that gives worng results.

Best regards!


You'll never know what you can do until you get it up as high as you can go!   

AMD FX 8350 :: Radeon HD 7870 :: Windows 10 ::  http://mithferion.deviantart.com/

Oxygen Icons :: Free Quality Fonts :: Public Domain Pictures :: iOS 11 Design Resources :: iOS App Icon Template :: Hot to do High Quality Art :: Mesh Warp / Distort Tool Considerations

Share this post


Link to post
Share on other sites

Mithferion,

you're right. It is an easy work around for checking contrasts. But - please correct me if I'm wrong - it doesn't suffice to check by estimation if you have to design objects that have strict rules regarding accessibility for visual impaired people. There are so many different difficulties people can have with their eyes. In my very own case: I have Keratoconus (progressive thinning of the cornea, may result in blurry vision, double vision, nearsightedness and light sensitivity). By classification I am concidered to have mild to moderate visual impairment and moderate to severe visual impairment without correction. But with correction (glasses/contact lenses) I am officially not impaired even if I feel like that.

In my case I need proper contrasts to see what's going on. If it's too dark I can't see stairs but I see black walls that aren't there - scared to run against them. This is irrelevant for my design process because I am not color blind and have a trained eye for color tones. My problem is double vision: several parts of the same image layered on top of each other but tilted and shifted. It has to be large enough that I can filter out that stuff in my brain.

But there are a lot of people that have color blindness. Approx. 5 to 10 percent of the population are affected. Official numbers are way smaller but there are always unreported cases that you should concider.

Here is an example about the different types of color blindness from Wikipedia:

 Safe_Chart_Colors-F99-FEC-ADD.jpg

Quote

 

Protanopia

Protanopes are more likely to confuse:-
1. Black with many shades of red
2. Dark brown with dark green, dark orange and dark red
2. Some blues with some reds, purples and dark pinks
3. Mid-greens with some oranges

Deuteranopes

Deuteranopes are more likely to confuse:-
1. Mid-reds with mid-greens
2. Blue-greens with grey and mid-pinks
3. Bright greens with yellows
4. Pale pinks with light grey
5. Mid-reds with mid-brown
6. Light blues with lilac

 

Quote by www.colourblindawareness.org

That is a very complex topic. If you would create a color pallete with red, orange and yellow tones - an autumn themed design - it may be possible thar some color blind people can't even read it because the tones look like the same color without any contrast. The same goes with blue and violet and so on.

Share this post


Link to post
Share on other sites
On 9/9/2020 at 4:48 AM, Jochen Damm said:

But - please correct me if I'm wrong - it doesn't suffice to check by estimation if you have to design objects that have strict rules regarding accessibility for visual impaired people

You are not wrong in the slightest. There are several conditions that need to be addresed and what I mentioned covers just a small part of it.

Best regards!


You'll never know what you can do until you get it up as high as you can go!   

AMD FX 8350 :: Radeon HD 7870 :: Windows 10 ::  http://mithferion.deviantart.com/

Oxygen Icons :: Free Quality Fonts :: Public Domain Pictures :: iOS 11 Design Resources :: iOS App Icon Template :: Hot to do High Quality Art :: Mesh Warp / Distort Tool Considerations

Share this post


Link to post
Share on other sites

Webflow added this. I think I'll give it a try some time:

https://webflow.com/blog/color-contrast-analyzer

Best regards!


You'll never know what you can do until you get it up as high as you can go!   

AMD FX 8350 :: Radeon HD 7870 :: Windows 10 ::  http://mithferion.deviantart.com/

Oxygen Icons :: Free Quality Fonts :: Public Domain Pictures :: iOS 11 Design Resources :: iOS App Icon Template :: Hot to do High Quality Art :: Mesh Warp / Distort Tool Considerations

Share this post


Link to post
Share on other sites

+1

I was planning to implement some visual identity helping software which allows collaborating designers to easily get the right VI elements and color according to their actual application senario.

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...

Important Information

Please note the Annual Company Closure section in the Terms of Use. These are the Terms of Use you will be asked to agree to if you join the forum. | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.