Skip to content
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

Global reduced motion config #128595

Closed
JacksonKearl opened this issue Jul 14, 2021 · 9 comments
Closed

Global reduced motion config #128595

JacksonKearl opened this issue Jul 14, 2021 · 9 comments
Assignees
Labels
accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues feature-request Request for new features or functionality on-testplan
Milestone

Comments

@JacksonKearl
Copy link
Contributor

JacksonKearl commented Jul 14, 2021

On MacOS (and probably windows too), there's a global "reduce motion" configuration. It would be nice if we could have something similar, possibly using that global value by default.

image

@JacksonKearl JacksonKearl self-assigned this Jul 14, 2021
@JacksonKearl JacksonKearl added the accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues label Jul 14, 2021
@JacksonKearl JacksonKearl added this to the On Deck milestone Jul 14, 2021
@JacksonKearl JacksonKearl modified the milestones: On Deck, Backlog Jul 14, 2021
@JacksonKearl
Copy link
Contributor Author

Started to implement this with f76d07f, using workbench.welcomePage.preferReducedMotion

@isidorn
Copy link
Contributor

isidorn commented Jul 26, 2021

I think this makes sense. However we should have a global workbench setting, and not a setting per area. So the user could just flip one setting, and it is up to various workbench areas to respect this setting. Due to that I suggest to name this
workbench.reduceMotion. And in the setting description to explain that this is only supported for now by the welcome page...
preferReducedMotion is not very concise and I am not sure what prefer brings?

@bpasero
Copy link
Member

bpasero commented Aug 2, 2021

I agree this should be global and Electron has API to ask the OS for its configuration: https://github.com/electron/electron/blob/44491b023ac2653538b7ac36bb73f3085a938666/docs/api/system-preferences.md#systempreferencesgetanimationsettings

@isidorn
Copy link
Contributor

isidorn commented Aug 2, 2021

If we can already get this from the OS as @bpasero says maybe we should just respect it out of the box and we do not need a setting at all. Only in the future if users want to disable this automatic respecting of OS setting we can introduce a setting.
I guess we can not get this automatically from the browser? So when in web a setting might make sense.

So I suggest

workbench.reduceMotion: "auto" | "on" | "off"

auto is the default and that means pick ip up from Electron API. For web users would have to explicitly set to "on"

@bpasero
Copy link
Member

bpasero commented Aug 2, 2021

I think you will always find users that want a setting if you wait long enough. This is probably similar to the settings we have around detecting high contrast theme or dark mode in the OS where we have a setting to override this.

@JacksonKearl
Copy link
Contributor Author

Added reduce-motion / enable-motion classes to the base .monaco-workbench and some new bits on IAccessibilityService:

readonly onDidChangeReducedMotion: Event<void>;
isMotionReduced(): boolean;

@isidorn
Copy link
Contributor

isidorn commented Mar 8, 2022

@JacksonKearl this is a great start.
I think we can disable all usages of animations in css when motion is reduced. A good way to find animation is to search for "keyframe" or "animation-name" in our repository. On top of that we could change the cursor to "editor.cursorBlinking": "solid"

fyi @bpasero @joaomoreno for animations we use

I just tried Apple reduce motion and they do not change mouse hover interaction. So I suggest we keep that.
I will consult accessibility team if there are other things we should disable.

@JacksonKearl
Copy link
Contributor Author

Interesting, from Apple's Human Interface Guidelines:

Be cautious when displaying moving or blinking elements. Although subtle movement and blinking can draw the user’s attention, these effects can also be distracting and they aren’t useful for people with visual disabilities. Worse, some blinking elements can cause epileptic episodes. In all cases, avoid using movement and blinking as the only way to convey information.

But then they don't disable blinking cursors. Also, with system wide Reduce Motion enabled, I still see blinking cursors everywhere. I think it makes good sense to edit the motion reducing text to include "animation" for queries though, that's what many related settings use already.

@isidorn
Copy link
Contributor

isidorn commented Mar 9, 2022

@JacksonKearl thanks for looking into Apple's guidelines.
I have reached out to @DanteGagne and he informed me that Windows has a setting for disabling cursor blink - it is in the old Keyboard Properties section in Control Panel, so it’s not particularly discoverable, but it’s there. VS respects this setting. Also VS does not have a lot of animations so there is not much to disable for them.

@JacksonKearl I guess that on Windows we can not automatically detect if the user disabled the cursor blink?
I leave it up to you if turning this on should disable cursor blinking. I am leaning towards yes, but we can fine tune after we get feedback.

image

@github-actions github-actions bot locked and limited conversation to collaborators May 6, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues feature-request Request for new features or functionality on-testplan
Projects
None yet
Development

No branches or pull requests

3 participants