Fluent Design System: differenze tra le versioni

Versione delle 22:58, 7 mar 2021

Versione delle 01:07, 7 mag 2021

Riga 19:

=== Profondità ===

L'aggiunta di profondità utilizza l' asse Z e consente la differenziazione del contenuto tramite la stratificazione. La profondità viene presentata tramite ombre esterne e stratificazione con profondità Z<ref>{{Cita news|url=https://www.windowscentral.com/microsoft-shows-plans-z-depth-layering-wave-2-fluent-design|titolo=Microsoft shows off 'Z-depth layering' 3D feature in its Fluent Design System|opera=Windows Central|accesso=22 dicembre 2017}}</ref><ref>{{Cita news|url=https://www.vrfocus.com/2017/05/microsoft-reveal-z-depth-layering-for-windows-10-mixed-reality-devices/|titolo=Microsoft Reveal Z-Depth Layering for Windows 10 Mixed Reality Devices|opera=VRFocus|accesso=22 dicembre 2017|lingua=en}}</ref>. Ciò è particolarmente evidente nell'app di Office riprogettata nel 2019.

=== Motion ===

Riga 48:

==== Acrilico ====

Nuove icone con materiali acrilici sono state create per i programmi Microsoft, a partire dalle app di Office e dal Microsoft Edge basato su Chromium nel 2018 e nel 2019, rispettivamente<ref>{{Cita web|url=https://medium.com/microsoft-design/redesigning-the-office-app-icons-to-embrace-a-new-world-of-work-91d72608ee8f|titolo=Redesigning the Office App Icons to Embrace a New World of Work|data=29 novembre 2018|sito=Medium|accesso=19 aprile 2020}}</ref><ref>{{Cita news|url=https://www.theverge.com/2019/11/2/20944341/microsoft-edge-chromium-browser-logo-icon-wave-surf-new|titolo=Microsoft unveils new Edge browser logo that no longer looks like Internet Explorer|data=2 novembre 2019|opera=The Verge|accesso=19 aprile 2020}}</ref>. Versioni preliminari delle icone finali sono state individuate nel video "Meet the New icons for Office 365"<ref>{{Cita web|url=https://youtube.com/YplAU5myNP4|titolo=Meet the new icons for Office 365|data=29 novembre 2018|accesso=19 aprile 2020}}</ref>,   prima che ne venissero individuate altre quando Windows 10X<ref>{{Cita web|url=https://youtube.com/dmaioTs0NH8|titolo=#MicrosoftEvent Live|data=2 ottobre 2019|accesso=19 aprile 2020}}</ref> è stato presentato, prima di essere ufficialmente rivelato il 12 dicembre 2019<ref>{{Cita web|url=https://medium.com/microsoft-design/the-ripple-effect-expanding-our-icon-design-system-74b4d916b7a4|titolo=The Icon Kaleidoscope|data=12 dicembre 2019|sito=Medium|accesso=19 aprile 2020}}</ref>. Queste icone hanno iniziato ad apparire tramite gli aggiornamenti di Microsoft Store per quelle app, a cominciare da Posta e Calendario<ref>{{Cita web|url=https://medium.com/microsoft-design/iconic-icons-designing-the-world-of-windows-5e70e25e5416|titolo=Iconic Icons: Designing the World of Windows|data=20 febbraio 2020|sito=Medium|accesso=19 aprile 2020}}</ref><ref>{{Cita news|url=https://www.theverge.com/2020/2/20/21145157/microsoft-windows-10-new-icons-modern-release-update-apps|titolo=Microsoft rolls out colorful new Windows 10 icons|data=20 febbraio 2020|opera=The Verge|accesso=19 aprile 2020}}</ref>.

[[File:Microsoft Defender 2020 Fluent Design icon.png|alt=Icona di Microsoft Defender 2020: un esempio di Fluent Design|miniatura|170x170px|Icona di Microsoft Defender 2020: un esempio di Fluent Design]]

Il materiale acrilico crea un effetto traslucido e sfocato con un leggero effetto di disturbo. È possibile creare una gerarchia visiva utilizzando diverse opacità. Ad esempio, in un'app, le superfici dei contenuti primari sono spesso opache (ad eccezione dei widget o delle app leggere come Calcolatrice ), un riquadro secondario può avere uno sfondo acrilico all'80% e il riquadro terziario può avere uno sfondo acrilico del 60%. L'acrilico di sfondo sfuma tutti gli elementi dietro il materiale acrilico attivo. L'acrilico in-app sfoca i contenuti all'interno dell'app<ref>{{Cita web|url=https://docs.microsoft.com/windows/uwp/design/style/acrylic|titolo=Acrylic material - UWP app developer|cognome=mijacobs|sito=docs.microsoft.com|lingua=en|accesso=22 dicembre 2017}}</ref>.

Riga 57:

=== Scala ===

Le app si adattano a diversi fattori di forma , dimensioni di visualizzazione e da 0D a 3D. Gli elementi si adattano alle dimensioni dello schermo e sono disponibili in più dimensioni.   controlli coscienti sono anche classificati all'interno di Scale (ad es. Barre di scorrimento e input che si adattano a diversi metodi di invocazione)

==Note==