Microsoft-ui-xaml: Proposal: Dialog Smoke Update

Created on 10 Jun 2019  ·  4Comments  ·  Source: microsoft/microsoft-ui-xaml

Proposal: Update Dialog's smoke layer to be always black based color

Summary

Windows design evaluated the color of light theme's smoke layer (it is white). It is a little harsh on eyes and also goes against the wish to make the light theme less "white" (per user feedback). The white background also make the app look like it is hang (Win32 app model). Fabric also uses this model where their smoke is smoke (instead of a fog).

Rationale

Addressing problems that exist today, such as:

  • Looks and feels like the unresponsive state / disabled state where an app hangs like Office apps do in their (Not responding) state
  • The white on white of dialogs has less contrast (the dialog does not pop as much in terms of contrast)
  • All of the white pixels on screen can be a bit blinding.
  • To match elevation story, the background should get darker and the foreground surfaces should be brighter.

Scope

| Capability| Priority |
|:--|:-|
| Developers are able to use WinUI2.2* package and without any work, get the new Windows visual style. | Must |
| Developers and end users experience control update that feel coherent with the same controls used by Fabric, Edge, and Xbox. | Should |

*Timing here is not a commitment, but to follow the release cycle. Just using the next version #.

Design details and visuals

This impacts only ContentDialog
Visual Comp

New values to use:

000000 at 30% opacity for both dark/light theme

Important Notes

  • Note: Updated color value is being requested to be checked with Edge team.

Open Questions

area-DesignDiscussion area-UIDesign feature proposal needs-winui-3 team-Controls

Most helpful comment

807 Ensure that the elevation shadows are still visible on the darker background. Fading to lighter colour does feel unresponsive

All 4 comments

807 Ensure that the elevation shadows are still visible on the darker background. Fading to lighter colour does feel unresponsive

807 Ensure that the elevation shadows are still visible on the darker background. Fading to lighter colour does feel unresponsive

@mdtauk , it is still visible but might be less noticeable. It is OK, though, because the smoke is another method for indicating depth.

Status update: Reviewed with WinUI team and there was no immediate concern with the design's plan here. (Waiting for updated smoke color from design team.)

Status update:

Updated color value was provided by the design team.

000000 at 30% opacity for both dark/light theme

Was this page helpful?
0 / 5 - 0 ratings