Tempistica e facilitazione

Mentre il movimento è basato sul mondo reale, siamo anche un mezzo digitale, che viene fornito con un'aspettativa di velocità e prestazioni.

Esempi

Apri l'app Raccolta WinUI e osserva le Easing Functions in azione

La Raccolta WinUI 3 ti consente di esplorare e sfogliare esempi interattivi di controlli, caratteristiche e funzionalità di WinUI 3. Ottenere l'app da Microsoft Store o ottenere il codice sorgente in GitHub.

Valori di durata dell'animazione standard

WinUI fornisce un set di durate di animazione standard usate in tutti i controlli della piattaforma. È possibile usare queste risorse denominate anche quando si creano animazioni storyboard personalizzate.

Nome della risorsa del tema	Valore
DurataAnimazioneNormaleControllo	250 ms
ControlFastAnimationDuration	167 ms
ControlFasterAnimationDuration	83 ms

Facilitazione nel movimento Fluent

L'attenuazione è un modo per manipolare la velocità di un oggetto mentre viaggia. È la colla che lega tutte le esperienze di movimento Fluent. Anche se estremo, lo smorzamento usato nel sistema aiuta a unificare la sensazione fisica degli oggetti che si muovono nell'intero sistema. Questo è un modo per simulare il mondo reale e rendere gli oggetti in movimento sentirsi come appartengono nel loro ambiente.

Applicare l'attenuazione al movimento

Queste transizioni ti aiuteranno a ottenere un aspetto più naturale e sono il riferimento di base usato per il movimento Fluent.

Veloce fuori, lento dentro

cubic-bezier(0, 0, 0, 1)

Usare per oggetti o interfacce utente che entrano nella scena, navigando o generando.

Una volta sulla scena, l'oggetto incontra un attrito estremo, che rallenta l'oggetto fino a fermarlo. L'impressione risultante è che l'oggetto proviene da una lunga distanza ed è entrato a una velocità estrema, oppure ritorna rapidamente a uno stato di quiete.

Anche se è preceduto da un momento di inattività, la velocità dell'oggetto in ingresso ha l'effetto di sentirsi veloce e reattivo.

Rallenta, entra velocemente

cubic-bezier(1 , 0 , 1 , 1)

Usare per l'interfaccia utente o per gli oggetti che escono dalla scena.

Gli oggetti diventano alimentati e guadagnano slancio fino a raggiungere la velocità di fuga. La sensazione risultante è che l'oggetto stia cercando di uscire dalla strada dell'utente per far spazio al nuovo contenuto.

Articoli correlati

• Panoramica del movimento
• Fluent Design - Animazione
• Direzionalità e gravità