Powertoys: [Launcher] Fluent UX: improve accessibility

[niels9001]

In some cases, the launcher is hard to find:

High contrast mode
Current implementation does not have high contrast mode, needs to be added.

1 pixel border
Current windows in Windows follow a model where there is a 1 pixel border around every window. It defaults to lightgray, so it blends in with the backdrop shadow. The user is capable to change this and e.g. use the accent color. Would be nice to follow this approach.

Backdrop
Having a (semi)transparent backdrop (like Shortcut guide) could help. Should be theme dependent as well.

Here's what that could look like:

cc-ing @anuthadev @mdtauk

[crutkas]

Maybe we do a lighter / grey style shadow for darkmode to cause it to pop more

[AnuthaDev]

Hey, @niels9001 @crutkas , this is how acrylic is implemented in Windows Terminal, can the same be done for Launcher?:

https://github.com/microsoft/terminal/blob/master/src/cascadia/TerminalControl/TermControl.xaml

https://github.com/microsoft/terminal/blob/db5d2fe0a5f4664c62ca0696a9c4bc14874ae66c/src/cascadia/TerminalControl/TermControl.cpp#L313

[niels9001]

We are using WPF to host the XAML Islands. The UWP controls background are already set to an acrylicbrush, and the WPF window is set to transparent but that doesn't seem to work.

@mdtauk is heavily involved in the conversation around this on the WinUI repo. It seems that this can be done with C++/UWP, but not with Island? Or just not in WinUI3.0 atm?

[AnuthaDev]

Hey @niels9001 Try this: https://github.com/windows-toolkit/Microsoft.Toolkit.Win32/issues/160

[AnuthaDev]

HostBackdropAcrylic can be done in winUI 2.x, but is scheduled to be removed in 3.0 only to be back in 3.x

[AnuthaDev]

@niels9001 These should help you further:

https://github.com/hansmbakker/AcrylicBackdropWithRoundedCornersBugRepro?files=1

https://stackoverflow.com/a/209949

[crutkas]

We need to go with what we have access to now and then do the shift to WinUI 3.

[AnuthaDev]

@crutkas winUI 3.0 won't release until november this year, so would the shift be after that or will we shift as soon as winUI 3.0 preview is released ??

[crutkas]

@anuthadev, we are proactively working with the team to see when a good opportunity for us to adopt is. If we were in the office, most of the team is across the hallway from me :)

[niels9001]

Nice idea in #3663 - using Blur instead of a regular backdrop.

[htcfreek]

@AnuthaDev
My thoughts on PR #2988: If we add the accent border colour (maybe as optional feature) then we should have it on both windows. The search bar and the result list.
This then leads to a consistent look and feel and I think we must have the visibility problem on the result list too.

[AnuthaDev]

Nice idea in #3663 - using Blur instead of a regular backdrop.

@crutkas I have found a way to enable backdrop acrylic in wpf, based on this project (which btw also supports rounded corners 😊 ). Is there interest in it? We can maybe use acrylic as a backdrop or the background of the searchbox/resultlist. What are your thoughts?

[AnuthaDev]

Nice idea in #3663 - using Blur instead of a regular backdrop.

@crutkas I have found a way to enable backdrop acrylic in wpf, based on this project (which btw also supports rounded corners 😊 ). Is there interest in it? We can maybe use acrylic as a backdrop or the background of the searchbox/resultlist. What are your thoughts?

Also, we can customize every aspect of it, since its a custom brush, not provided by the system. Blurring windows in wpf isn't particularly trivial... Let alone acrylic...

[AnuthaDev]

@crutkas @niels9001 Until we can switch to winUI 3, should this be added to the resultlist items' command buttons (open file location, start as admin etc): https://blog.walterlv.com/post/fluent-design-reveal-brush-in-wpf.html

[lazerl0rd]

I like the idea of a backdrop, but I'd like to suggest two more things:

1. The possibility of showing "just the desktop and taskbar" when PowerToys Run/Launcher is launched.
2. The option of the backdrop to have an element of blur, maybe Gaussian Blur as the Fluent UX system seems to use that a lot. This should definately be an option as it could harm performance.

[lazerl0rd]

3663 mentions that blur was dropped to support older versions of Windows, but I don't see why it can't just be an option that is shown on newer versions.

[lazerl0rd]

Nice idea in #3663 - using Blur instead of a regular backdrop.

@crutkas I have found a way to enable backdrop acrylic in wpf, based on this project (which btw also supports rounded corners 😊 ). Is there interest in it? We can maybe use acrylic as a backdrop or the background of the searchbox/resultlist. What are your thoughts?

This seems great.

[ghost]

Referred to this issue from #4862 by @niels9001

A darkened background is cool for light mode, but in dark mode it doesn't stand out - not enough contrast when apps in the background are black as well. How about a background blur option for users who use dark mode?

[niels9001]

3663 mentions that blur was dropped to support older versions of Windows, but I don't see why it can't just be an option that is shown on newer versions.

We'd need for WinUI 3 to support this.. I think version 3.1 will support this, 3.0 not will not AFAIK.

Referred to this issue from #4862 by @niels9001

A darkened background is cool for light mode, but in dark mode it doesn't stand out - not enough contrast when apps in the background are black as well. How about a background blur option for users who use dark mode?

As a backdrop I would go for a dimmed background: better for permoance I guess, and it would follow other Windows 10 experiences that do this (Gamebar, Cortana, Snip and Sketch).

That should work for Dark Mode as well, we can try that out. Seems to work fine for me when using e.g. Shortcut Guide.

[michaelgosling]

3663 mentions that blur was dropped to support older versions of Windows, but I don't see why it can't just be an option that is shown on newer versions.

We'd need for WinUI 3 to support this.. I think version 3.1 will support this, 3.0 not will not AFAIK.

Referred to this issue from #4862 by @niels9001
A darkened background is cool for light mode, but in dark mode it doesn't stand out - not enough contrast when apps in the background are black as well. How about a background blur option for users who use dark mode?

As a backdrop I would go for a dimmed background: better for permoance I guess, and it would follow other Windows 10 experiences that do this (Gamebar, Cortana, Snip and Sketch).

That should work for Dark Mode as well, we can try that out. Seems to work fine for me when using e.g. Shortcut Guide.

For the love of god, do not dim my whole display for a launcher. Look at Spotlight, Alfred, and many third party alternatives for inspiration.

[crutkas]

In the 0.25 release. https://github.com/microsoft/PowerToys/releases/tag/v0.25.0