EDI

Sviluppo di un nuovo sito per l’azienda italiana di effetti speciali EDI.

copertina_website_EDI
CopywritingUX + UI + coding
Condividilo!

Obiettivi

Rifacimento del sito web in un’ottica più contemporanea e fresca con priorità a far emergere la grande esperienza di EDI nel settore degli effetti visivi. Unito all’esigenza di comunicare in modo più evidente l’atmosfera che si vive ogni giorno nello studio e la sua struttura lavorativa così da attrarre nuovi talenti.

Metodo

Il primo step è consistito nell’intervistare in loco i dipendenti più senior, alcuni dei talenti più giovani appena entrati nel mondo di EDI, il reparto di comunicazione interno e uno dei fondatori. In seguito, grazie al materiale raccolto, abbiamo potuto procedere con la struttura della UX del sito e dei diversi wireframe per poi passare allo studio della UI e del TOV da mantenere nelle varie pagine. Il lavoro si è poi concluso con lo sviluppo del sito a partire da una base WordPress.

Risultato

Il sito ora è facilmente navigabile sia da possibili talenti futuri che da clienti italiani ed esteri. Emerge in modo più evidente la grande competenza di EDI nel campo degli effetti visivi e l’atmosfera dinamica che si vive al suo interno. I progetti e le diverse reel sono visualizzabili in modo più di impatto.

UX/UI 

EDI è una realtà che si sta ampliando sempre di più, basti pensare che è diventata uno dei fornitori di Marvel. Dalle interviste svolte con diversi componenti del team, è emersa come necessità primaria quella di realizzare un sito che raccontasse questa ascesa di EDI rendendola una realtà attrattiva sia per clienti italiani ed esteri (per i quali è stata implementata l’opzione bilingue) sia per futuri talenti. Abbiamo quindi studiato i diversi needs degli utenti e strutturato i possibili flussi per soddisfare ciascuna esigenza. 

A livello di UI invece, non essendoci un brand manual, abbiamo creato i contenuti di grafica solamente a partire dal colore rosso del logo e dalla font in uso. Poi, per rendere più dinamico il sito e trasportare l’utente nel mondo dei VFX, abbiamo inserito diverse animazioni a seconda della necessità: scroll sfumato in home page, gallery di immagini in 3D, pop-up in over e sfondo in parallasse per citarne alcune.

Coding

Per la creazione del nuovo sito di Effetti Digitali Italiani abbiamo utilizzato le migliori tecnologie. Come base è stato scelto WordPress, piattaforma già utilizzata per il vecchio sito, che permette di facilitare la gestione dei contenuti. Sono poi stati studiati alcuni dettagli che permettono di dare dinamicità al sito, come per esempio animazioni di entrata, effetti in parallasse, animazioni allo scroll, frasi simpatiche in hero nella homepage, caroselli ed effetti in puro CSS. È stata poi implementata una libreria di smooth scrolling che permette di avere un effetto di scroll più accattivante.

Dal momento che EDI possiede un grande numero di progetti sviluppati, abbiamo anche creato uno strumento di import iniziale in bulk a partire da un CSV per velocizzare il processo di data entry. È stato poi implementato un meccanismo di filtraggio dinamico senza ricaricamento della pagina su tipologia di progetto, filtri customizzabili e timeline. È stata inoltre curata l’accessibilità delle ricerche, implementando delle alternative per tastiera alla navigazione visuale pensata in fase di UI.

Il sito è stato poi reso bilingue tramite WPML, standard utilizzato spesso nella gestione di WordPress multilingua, e ottimizzato tramite plugin SEO e di ottimizzazione cache.

Copywriting

Grazie alle informazioni raccolte durante le interviste, è stato sin da subito chiaro l’intento di strutturare il TOV del sito in modo scherzoso e ironico così da ben rappresentare l’attitude di chi lavora in EDI. Per questo, i diversi titoli sono stati strutturati in modo non solo informativo ma anche divertente prendendo spunto da citazioni di film e serie TV. Inoltre, in home page sono stati inseriti dei piccoli easter egg scherzosi per incentivare l’utente a scorrere la pagina.

Riferimenti di progetto

Scopri gli altri progetti

copertina_website_mesharea1
MeshArea
copertina_website_kaleidos
Kaleidos
stereoscopio_V3
T-Care
copertina_website_Checksig
CheckSig
copertina_social_Fluidnet
Fluidnet
copertina_web_Humanitas
Humanitas
Torna su