Hai dato un occhiata alle gallerie di siti web negli ultimi tempi? Ne hai trovato qualcuno che ti ha colpito in modo particolare? Ci sono vetrine che ti fanno capire come, ogni anno, il mondo del web design cambi ed introduca nuovi progetti creativi ed idee sempre più innovative dalle quali puoi trarre ispirazione per i tuoi prossimi progetti.
Nell’ultimo articolo che ho scritto per Webhouse ho parlato dei trends, cioè di tendenze sulle tecniche più utilizzate nel 2018 e dalla lista che vi presento, questi trend sono confermati. In particolare ho notato un utilizzo sempre più frequente di elementi audio nei progetti che diventano sempre più accattivanti e che migliorano l’esperienza visiva ed emozionale del sito stesso se vengono utilizzati in modo corretto.
Mi sono soffermata in particolare sulla lista pubblicata da Awwards che è uno dei siti web più importanti nella selezione dei migliori siti web al mondo. Sono tutti siti web degni di nota, ma io ne ho scelti 10, quelli che più mi hanno colpito per semplicità, tecnica di design e innovazione.
Sei pronto per questa nuova lista del 2018? Eccola qui!
#1 – IFLY50
Prima di cliccare sul link, alza il volume del tuo computer e preparati a questo viaggio mentale e virtuale nei posti più belli del mondo. Vivrai un’esperienza unica, ammirerai posti che non hai mai visitato e ti sembrerà quasi viaggiare realmente! Avrai anche la possibilità di scegliere i tuoi 5 luoghi preferiti e alla fine di partecipare ad un concorso che ti fa vincere 2 biglietti per viaggiare in un luogo meraviglioso del mondo. Realizzato per il 50 Anniversario di Ifly KLM Magazine, il sito web ti mostra 50 luoghi mozzafiato in giro per il mondo e quindi 50 motivi per viaggiare. Tutto è perfetto: immagini, suoni, musica, animazioni.
Da segnalare: tutto.
#2 – BUDDHA PIZZA
Sito web e-commerce di una pizzeria moldava realizzato in maniera semplice e con effetti ed animazioni molto accattivanti. Nella homepage viene utilizzata la tecnica parallasse: al movimento del mouse si muovono gli occhi della fetta di pizza. Le illustrazioni sono molto simpatiche e belle e fanno venir voglia di comprare la pizza che è descritta molto bene nella sezione successiva. Cliccando su ogni pizza trovi tutte le informazioni necessarie: ingredienti, prezzo ed un’ottima galleria con slider che ti da l’idea di quello che mangerai. Hai anche la possibilità di comprare la pizza cliccando sul tuo alimento preferito.
Da segnalare: illustrazioni, animazioni.
#3 – LEGEND BY BERTOLETTI
Marchio produttore di biciclette, “Legend by Bartoletti” è un sito ricco di contenuti ed è realizzato in maniera semplice ed esauriente. La parte più importante del sito web è rappresentata dalla collezione delle biciclette che può essere filtrata in base al modello; ogni modello ha un’immagine molto bella. Cliccando sull’immagine si accede ad una pagina molto esauriente con tutte le informazioni sul modello scelto: galleria, scheda tecnica, colori e particolari passando da una sezione all’altra con uno scrolling pagina molto bello. C’è anche un configuratore per poter realizzare la bicicletta dei tuoi sogni, solo però dopo esserti registrato al sito.
Da segnalare: usabilità, semplicità
#4 – DAUCY
Sito web di ricette che mi ha colpito per la capacità di combinare diverse animazioni che nel loro insieme danno un tocco magico al sito web. Tutto il sito web si presenta suddiviso in due parti: scrollando la pagina, nella parte destra c’è la scheda con le informazioni e gli ingredienti della ricetta, nella parte sinistra un particolare del piatto della ricetta che man mano che scrolli si rimpicciolisce ( effetto zoom al contrario, dal dettaglio all’immagine intera), mostrando il piatto nella sua interezza. Molto bello e da evidenziare è anche l’effetto colore: ogni ricetta ha un suo colore particolare a seconda dell’ingrediente più importante del piatto presentato con un effetto particolare poiché la parte sinistra è leggermente diversa nella gradazione da quella di destra.
Da segnalare: colori, animazioni.
#5 – STUDIO OUAM
Sito web di un’agenzia di illustrazione, packaging e branding molto interessante per i colori, gli effetti e le animazioni. Il sito web combina illustrazioni e pattern in maniera efficare, catturando l’attenzione dell’utente. Molto bella è la galleria portfolio realizzata con immagini e colori combinati in maniera perfetta. Cliccando su ogni lavoro puoi accedere ad un’ulteriore pagina che descrive in maniera dettagliata come è stato sviluppato e progettato il sito web, con dettagli ed animazioni accattivanti. Da segnalare il menù che al passaggio del mouse taglia la voce di menù che si apre ed al centro compare una descrizione più dettagliata della voce della pagina che hai cliccato. Un bell’effetto da tenere in considerazione per tuoi progetti, non credi?
Da segnalare: patterns, immagini e colori.
#6 – NIKE CORTEZ
Sito Web realizzato per il 50° Anniversario di Nike Cortez, realizzato da AW LAB noto marchio sportivo. Molto bello è il video in homepage con una sequenza di immagini che scorrono e con sopra una serie di numeri che spiegano in modo dettagliato le creazioni di Cortez per Nike. Cliccando sul numero, si apre una pagina molto bella con tutti i dettagli della creazione ed una serie di immagini con effetti molto belli e mai visti sino ad ora come quella dell’immagine che si muove con un effetto “shake”. Anche qui il colore è, insieme agli effetti animati, la parte più accattivante del sito web: ad ogni collezione è associato un colore che viene poi trasformato in gradiente perfetto all’interno della pagina descrittiva.
Da segnalare: colori, gradienti, animazioni.
#7 – MITSUGUTA KAHASKI
“Dinner for Five” è il sito web di Mitsugu Kahaski, visual designer di Tokio, specializzato nella realizzazione di progetti visuali realizzati con la tecnologia JavaScript e appassionato di design minimale e di tipografia moderna. Infatti, particolare è la sua homepage che si apre con una scritta in inglese realizzata con un font tipografica calligrafico molto bello.
Scrollando l’homepage sopraggiunge agli occhi una galleria minimale dei suoi lavori. Puoi notare subito gli effetti molto accattivanti e il suo aspetto minimale sia nel colore che nella descrizione dei suoi lavori. Tutti i suoi progetti rispecchiano la sua filosofia, “Dinner for Five”: lo sviluppo di un brand si realizza allo stesso modo di quando ci si diletta nel cucinare toccando tutti i 5 sensi: tatto, gusto, olfatto, udito e vista.
Da segnalare: design minimale, tipografia.
#8 – SONS OF GALLIPOLI
Sons of Gallipoli è insieme ad “Ifly50” il sito web che mi ha maggiormente colpito in questa lista. È un sito particolare, una sorta di documentario che racconta la storia di Gallipoli, in particolare degli eroi caduti in guerra attraverso gli occhi delle loro madri. Molto bella la realizzazione della mappa che ti permettere di conoscere la sua posizione strategica e geografica sullo stretto di Dardanelli. Inoltre lungo la mappa trovi dei segnaposto animati che ti permettono di cliccare su alcuni punti strategici. Si apre una pagina che spiega il luogo e mette in evidenza delle immagini che raccontano la guerra e gli avvenimenti. Molto bella è anche la realizzazione della storia per capitoli. Ogni capitolo contiene una audio video che racconta la storia attraverso la voce delle mamme che hanno dovuto mandare i propri figli in guerra. Tutto è fatto in modo preciso anche la realizzazione di “spinners” che mostrano il tempo di durata del racconto del capitolo. Infine da menzionare il menù molto particolare che è realizzato sulla sinistra e si estende in orizzontale quando il mouse passa sulla voce del menu stesso allo stesso modo di un mega menù verticale.
Da segnalare: tutto.
#9 – SPECIES IN PIECES
Progetto creato per una mostra che racconta lo studio di 30 specie di animali purtroppo in via di estinzione e quindi letteralmente la loro sopravvivenza è “ridotta in pezzi”.
Sito web interattivo che comincia con una introduzione molto bella realizzata con poligoni ed un colore rosso molto intenso. Cliccando sulla parola “esplora”, la scritta introduttiva si trasforma con gli stessi poligoni, nella prima specie di animale in via di estinzione. La pagina è al tempo stesso semplice ma molto bella con uno sfondo in background che che è scelto non a caso e con due pulsanti che ti permettono di aprire una pagina che descrive quante specie esistono e di avere tutte le informazioni sull’esistenza della specie stessa. L’altro pulsante ti permette di aprire un’altra pagina che ti da la possibilità di scaricare un’immagine in wallpaper da usare per il proprio computer.
Molto bello il passaggio interattivo ed animato da una specie all’altra, i colori scelti e l’illustrazione delle specie in esame. Complimenti a Brian James.
Da segnalare: illustrazioni, interazione, animazione.
#10 –TEATR LALKA
Il Teatro Lalka di Varsavia si presenta con un design particolare per il tipo di servizio che offre. Questo sito web è realizzato con una serie di animazioni che lo rendono speciale. L’homepage è molto bella perché si apre con la cascata di personaggi realizzati con illustrazioni straordinarie. I personaggi si muovono in base al movimento del puntatore del mouse. Cliccando sulla marionetta realizza un’azione particolare che può essere un movimento o un suono. A fondo pagina c’è un menù chiamato “Repertorio” che mostra gli spettacoli in corso: cliccandoci sopra si apre la pagina con le informazioni sullo spettacolo. Molto bello è il menù filtrabile sia nel design che nell’usabilità che permette di inserire alcuni filtri come l’età o il tipo di evento. Anche il menù generale è molto bello: provate a cliccarci sopra per vedere cosa succede.
Da segnalare: illustrazioni, animazioni.
Quale sito web ti ha colpito in modo particolare? Dopo aver visitato questa lista di siti web proveniente da tutto il mondo sarai più ricco di idee e ti saranno venute alla mente molte altre possibilità per i tuoi progetti. La curiosità ti spingerà oltre i tuoi limiti e ne uscirai più ricco o perlomeno più curioso di scoprire nuove tecniche di web design che potrai utilizzare per i prossimi siti web.
Ovviamente questa è solo una piccola lista, ci saranno tanti altri siti web degni e meritevoli di nota. Se ne conosci altri di questo tipo scrivilo pure nei commenti.
