UI Design Trend 1 – 3d Interface – Gradient – Typo

Nuovi UI Design Trend per il mondo del digitale. Abbiamo raccolto un ampio set di nuove tendenze per siti web e applicazioni mobile e li abbiamo supportati con una varietà di esempi. Divertiti e fatti ispirare!

3D interface (UI Design Trend)

3D Interface - UI Design Trend

Una delle tendenze più interessanti di quest'anno è l'integrazione di grafiche 3D nel design delle interface mobile e web. Applicare questo tipo di grafica al tuo design è piuttosto impegnativo in quanto richiede competenze specifiche, un occhio spiccato per il dettaglio e molto tempo, tuttavia il risultato è  impressionante e gli utenti non passeranno mai senza notarlo.

I rendering 3D spesso appaiono fotorealistici, il che rappresenta un grande vantaggio per la progettazione dell'interfaccia utente. L'uso di questo tipo di grafica può essere molto utile in alcuni casi soprattutto quando il contenuto fotografico di cui hai bisogno è impossibile da ottenere o molto costoso.

Le interface 3D riguardano anche le animazione. L'aggiunta di animazioni 3D al tuo design lo renderà molto attraente. L'esperienza diventa più coinvolgente e le interazione con gli elementi dell'interfaccia più chiare ed efficaci. Il designer può lavorare sulle animazioni di pulsanti, card informative, infografiche, animazioni di preloader e slider di immagini.

Per creare animazione 3D da integrare nel tuo design ti consigliamo vivamente di usare programmi di animazione standard come After effect e Cinema 4D oppure programmi come Principle, Flow o AnimaMate che vi permettono di esportare direttamente il codice da integrare con le vostre app e di cui vi parleremo in seguito...

Gradient (UI Design Trend)

Gradient - UI Design Trend

Chiamati Gradient 2.0 all'interno della comunità di Behance, i gradienti lavorano sulla profondità e sui livelli dell’interfaccia.

I nostri nuovi schermi hanno una fantastica resa dei colori e i designer stanno esplorando i confini dell'accessibilità e dei gradienti nelle interfacce. A differenza degli anni precedenti, i gradienti non dominano solo il primo piano della nostra interfaccia ma sonoutilizzati per:

  • background
  • elementi tipografici
  • sovrapposizioni e fusioni di immagini
  • illustrazioni
  • loghi,
  • icone e altro

Molte app popolari  tra cui Instagram, Spotify e Skype, utilizzano il trend.

Per ottenere un gradiente efficace segui i nostri consigli:

  1. Non esagerare: Il modo migliore per creare un gradiente accattivante è mantenerlo semplice. La maggior parte dei gradienti viene creata utilizzando due colori, quindi cerca di non utilizzare più di tre colori.
  2. Evitare di abbinare colori in conflitto tra loro.
  3. Definisci la sorgente luminosa. Questo ti permettere di definire le aree più chiare e quelle più scure del gradiente.
  4. Segui la forma. Per le aree quadrate o poligonali, è meglio applicare un gradiente lineare. Per le aree arrotondate, i gradienti radiali sono più adatti.
  5. Avere sempre forme separate per il colore di riempimento e il colore sfumato. Ciò ti consentirà di applicare una sfumatura su un colore esistente e di sperimentare con diverse opacità per creare effetti diversi.

Typo (UI Design Trend)

Typo - UI Design Trend

Be bold or go old. Quest’anno la tipografia diventa grande, audace e importante. Più crescono gli schermi degli smartphone, più abbiamo spazio da sfruttare. Possiamo utilizzare composizioni tipografiche, alternando  font bold e perché no font serif per realizzare composizioni grafiche di forte impatto.

Il 2019 è anche l’anno della fluidità. Un font che cambia kerning e passa da thin a extrabold, un back animato, un effetto parallasse sugli elementi della tua homepage, lo stesso logo che cambia forma e dimensione.

L’identità di un brand o di un progetto non è più definita da rigide guideline ma è in continuo divenire. Possiamo sovrapporre gli elementi e giocare con composizioni aperte, le griglie lasciamole al barbecue della domenica...