Accessibility - Color contrast of video controls

Hi Lisa,

Happy to help!

Right now, there isn't a way to modify the appearance of the video control buttons. I'd like to take a closer look at the behavior you're experiencing so we can identify what's making the video control buttons hard to see.

Since it looks like specific browser settings are needed for the issue to appear, I'd like to ask for the following information so I can test the issue on my end:

• Which browser are you using to view the published course? Is the issue happening for all browsers?
• Would you mind making a Peek 360 recording of the browser settings that you are modifying on your end so we can make the exact changes on our browsers for testing? 

For your reference, here are the font settings that I had configured on my browser: 

Looking forward to your response!

 

Hi Jose, 

Thanks for your reply and sorry for my late response! I tried to get Peek 360 working but unfortunately I am unable to open it and also unable to uninstall (as I wanted to uninstall and re-install to see if that works)

But I hope, that I can give you all needed information by explanations and screenshots anyway.

So, for the audit Firefox was used.

I added a screenshot of the video control bar before changing the browser settings (we used the light theme)

Now I went into the settings of the Firefox browser and did the following:

Under "Language and Appearance" / "Colors" I opened "Manage Colors..."

In the next window you can change the color for text and background. For "text" I chose a blue and for "background" a dark grey.

Then there is the following setting "Override the colors specified by the page with your selections above" For that I chose "Always"

I added a screenshot of these settings and also how the video control bar looks after these settings.

You can see, that the text (seconds display) is now blue and the background is dark grey but the symbols are now more or less no longer visible, as they do not automatically react to the new, insufficient contrast due to the dark gray.

I hope, that this information helps you :)

Hi Steven!

I tried that and attached what it looks like.

A bit better but not as good as it is on your screenshot.

It seems to me that these icons stay the same color no matter what background color I choose in the browser settings (at least in my project) - That is also e.g. a problem when I hover over an icon with a dark background as in that case the icon nearly becomes invisible

 

Hope you can help me with that :)

Hi Lisa, 

Thanks so much for those screenshots! Happy to help. 

• Have you tried replicating this behavior in a new .story file? I'm curious if there is any difference. 
• Do you notice any change if you adjust the brightness settings on your computer? 

It would be very helpful to take a closer look at your file. Feel free to upload your current file to this thread or privately in a support case. 

Looking forward to hearing from you!

Hi Luciana!

Yes, I tried it in a completely new project and also made sure to have the latest update installed.

Also adjusting the brightness of my computer didn't fix it unfortunately and I also let a colleague try it with her own account and a new project but it looks the same as for me..

I just did another test round and included the modern player and it seems like the player responds to the browser settings really good compared to the video controls.. is the same logic implemented for the video control bar as for the modern player? I attached some screenshots to show you how it looks like for me with the player and the video controls.

You can clearly see how the icons are really dark first in the player and after I changed the background color in the browser settings the icons get really light.. that's exactly the behavior I would need in the video control bar as well for our accessibility requirements :)

Another off topic question: I have noticed that as soon as you add captions to a video, the option to turn the caption on and off appears in both the video controls and the player. However, the option to show the transcript only appears in the video controls. Is there a way to bring this option into the modern player as well?