Animazioni nelle interfacce web

Il design delle interfacce web dei siti è in continua evoluzione, spinta dall’utilizzo di dispositivi sempre più potenti anche su dispositivi portatili e da utenti sempre più evoluti.

Grazie a questa tendenza gli sviluppatori hanno a disposizione nuovi strumenti per aumentare il coinvolgimento degli utenti. Se negli ultimi anni minimalismo e aspetto flat l’hanno fatta da padrone sembrerebbe che la maturità offerta dagli strumenti di programmazione come HTML5 ad esempio possano ora consentire ai professionisti di UI e UX di incrementare esponenzialmente l’esperienza d’uso del proprio target di riferimento.

Per animazioni non invasive intendo riferirmi a tutte quelle forme di movimento che, in modo minimale ed elegante, attraggono e guidano l’utente nella comprensione dei contenuti presenti all’interno di una pagina. Tali animazioni possono avvenire in maniera periodica o a seguito di interazione con il mouse, ad esempio al passaggio dello stesso o all’esecuzione di un click.

Tali animazioni sono sempre più facili da realizzare grazie alla potenza dei più recenti linguaggi di programmazione web come dicevamo HTML5, CSs, Javascript che ne consentono la visualizzazione su tutti i dispositivi senza dover aggiungere pesanti plugin non installati di default sui browser.

Animare il logo di un'interfaccia web

L’utilizzo nelle interfacce web

L’attività di sviluppo di un’interfaccia web è uno dei compiti del web design che identifica e realizza gli elementi che devono essere resi interattivi, segui il link se desideri approfondire i nostri servizi di web design.

Esempi classici sono movimenti del menu al passaggio del mouse che possono grazie al proprio movimento aiutare a capire l’organizzazione informativa dei contenuti presenti nel sito ed essere dei veri e propri Move-to-action nei confronti dell’utente spingendolo quindi ad interagire con il sito stesso.

Risparmiare spazio nelle interfacce web

Le animazioni consentono inoltre di risparmiare spazio all’interno delle nostre pagine web migliorandone l’organizzazione, l’elemento da animare potrebbe infatti attivarsi e ridimensionarsi solamente  se richiesto dall’utente, tecnica già utilizzata all’interno di siti web di produttori dl’auto o di tecnologia.

Favorire la memorizzazione

Questa animazioni possono inoltre essere utilizzate all’interno di un sito web per aiutare la memorizzazione di un brand, come avveniva e avviene ad esempio con i font dei videogiochi,  allo stesso modo l’animazione di un logo può aiutare a fissare lo stesso nella mente del visitatori.

Un esempio di animazione realizzata per aiutare la memorizzazione di un logo è quella da noi realizzata per il nuovo logotipo di Historian Gallery