Feature announcement video and accessibility

Pixel just got better- feature drop videos on YouTube

Pixel just got better- feature drop video is well made! But it triggered an eye epilepsy episode for me. These high contrast colors may work in small-sized icons on a white background but when viewed on full screen with fast-paced motion can be painful for some people.

Screenshot showing thumbnails of “Pixel just got better- feature drop” videos on YouTube

These videos have some cool animation, fast-paced motion transitions, and communicate well. There is no doubt! before you read more should see the video👇

Browse the channel to see the other videos of the series to get the full picture.

The only thing is their color blast caused discomfort in my viewing experience. I guess this series of videos is for repetitive viewing. It’s difficult to watch it multiple times.

Initially, I thought it may be my eyes problem and, I forgot about it.

A few days back, I installed some plugins in a web browser to pick colors and check web accessibility. (For one of my projects)

After my task, a thought to check the contrast ratio of these videos came to my mind and gave it a try, and here is the process I followed:

a series of print screen frames from the video arranged in a storyboard style

It was a little difficult to pick colors directly from moving video so taken a series of print screens, then used the color picker plugin to identify the color codes.

colors picked from a video grab/ print screen frame

Later fed these codes in WebAIM to analyze the contrast ratio, They have a web section which is called CONTRAST CHECKER. let’s see the results:

Red ( #e82219) color on Blue (#0069f0) the contrast ratio is 1.12:1

See the test link: https://webaim.org/resources/contrastchecker/?fcolor=DB3A30&bcolor=017DF3

Yellow (#feae18) color on Blue (#0069f0) the contrast ratio is 2.63:1

See the test link: https://webaim.org/resources/contrastchecker/?fcolor=FEAE18&bcolor=0069F0

According to the WebAIM website: WCAG 2.0 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. WCAG 2.1 requires a contrast ratio of at least 3:1 for graphics and user interface components (such as form input borders). WCAG Level AAA requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text.

I guess the biggest advocate of good design can’t comply with 100% compatibility for people with photosensitive vision. Or sometimes, a tight deadline, a quick vendor output can lead to an unchecked push the button scenario?

Disclaimer: All the images/screenshots, videos, and links shown here belong to respected owners and are shared here for appreciation or analysis purposes.