User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
Is there any specific reason for windows callendar to have this flashlight-like hover effect?
If anything it seems to me to be distracting by spreading the area of your current mouse position. Is it suppoused to have any benefits over a single box hover, or is it purely decorational?
This effect was made as part of the Microsoft's new design system called Fluent Design.
There are 5 principles to it:
Light: Light controls how user interface interacts with illumination and how it helps the users to avoid distraction.
Depth: Depth brings parallax effect and makes use of layering. This highlights the relationship between objects and elements.
Motion: Motion can be used to show connection, relation, and context between elements and objects.
Material: Material allows to control an element’s texture and change as one interacts with it.
Scale: Scale lets elements and objects to go beyond two dimensions and adapt themselves according to the size of a screen.
In the demo video for the Fluent design they demo that flashlight effect as part of the 'Light' principle - controlling UI depending of the angle and movement of the pointer.
While, personally, I have no attachment to this sort of effect and it provided no usability perks to me or anyone I know in UX fields, it does look snazzy; and it's simply part of Microsoft's Design system.
Sources:
https://fossbytes.com/fluent-design-system-microsoft-windows-10/
PS: I do not work for Microsoft nor have any connections with any employees to conduct any further research or ask questions.
PPS: a fun little link to a similar effect: https://codepen.io/gubb/pen/PdZqKy It works much better with lighter colours for me. Makes more of a contrast with highlighted spotlight vs those around it ('negative space effect almost').
Hope this helps.
