Puragen

Cliente

Puragen

Tipologia

Branding, Illustration, design system, web design

Strumenti

Figma, Illustrator, Photoshop, Chat GPT, Gemini

Sono stato coinvolto in questo progetto per finire il lavoro cominciato da un mio collega che aveva lasciato la compagnia. Sembrava dovessi solo sistemare un paio di cosette, ma mi sono trovato a dover conciliare le visioni di due gruppi di stakeholder con obiettivi diametralmente opposti: da una parte i vertici storici di Puragen (CEO, CMO e Capo Ingegnere), dall'altra Julian, rappresentante del nuovo board di Invica, l'azienda che li aveva appena acquisiti.

Un occhio della testa

Puragen è un'azienda che produce sistemi a base di carbone attivo per depurare acqua, aria e gas. Non so se avete mai visto i filtri industriali, ma sono robe gigantesche, e ridipingerli costa una fortuna. E questo è stato il punto cruciale di tutto il progetto. Il team di Puragen voleva utilizzare il blu cobalto come colore principale, visto che i filtri fisici erano di quel colore e trovare il codice RAL esatto per le vernici industriali era un incubo logistico. Al board di Invica quel blu proprio non piaceva.

Filtriamo anche i colori

Parafrasando Aldo Baglio nel famoso sketch della montagna, ad un certo punto mi sono reso conto che non si poteva ne’ scendere né salire. A uno non piace il blu, gli altri lo vogliono come colore primario.

Più pensavo a come risolvere lo stallo, più mi rendevo conto che c’era qualcosa che non andava: ci stavamo concentrando solo su un colore, quando in realtà avremmo dovuto pensare in maniera più olistica al ruolo della palette all'interno del brand.

Ha perfettamente senso avere il blu in un’azienda che fornisce sistemi di depurazione dell’acqua, ma potevamo sfruttare molto di più il potenziale della palette, usando tre colori per raccontare l'intero processo di filtrazione.

Parlando con gli stakeholder, siamo riusciti a trovare altri due colori che mettevano tutti d’accordo. Abbiamo inserito il Racing green, che con i suoi toni scuri simboleggia l'elemento non filtrato (che si tratti di acqua, aria o gas); nel mezzo c'è il blu, che rappresenta la fase di passaggio della filtrazione; infine, abbiamo un luminoso colore acquamarina che, contrapponendosi al verde scuro, simboleggia l'elemento ormai purificato e pulito.

In questo modo abbiamo accontentato tutti: dal punto di vista di Julian il blu non era più il colore primario, mentre per il team di Puragen mantenerlo come rappresentazione centrale del processo di filtrazione ha reso tutti felici.

Design senza filtri

Risolto l'ostacolo più grande, il resto è stato pura gioia creativa. Avendo finalmente una base solida e l'entusiasmo di tutti gli stakeholder, ho dato vita all'intero sistema visivo. Ho progettato nuove icone, definito lo stile fotografico e creato un set di illustrazioni personalizzate ispirate ai concetti di purificazione, flusso dell'acqua e filtrazione.

Piovono pagine web

Il nuovo brand è piaciuto così tanto che mi è stata affidata immediatamente la creazione del nuovo sito web. Una sfida titanica: dovevamo lanciare oltre 50 pagine in pochissimo tempo, coordinando copywriters, sviluppatori e designer meno esperti nell'utilizzo di Figma.

Forte dell’esperienza con CID (vedi progetto), ho ottimizzato il design system in modo che fosse facilissimo da utilizzare anche per chi non ha grossa esperienza con Figma:

  • Magia responsiva: Ho sfruttato le variabili avanzate di Figma. Ai designer bastava creare il layout per la versione desktop e, con un solo clic, i componenti si riadattavano automaticamente alle griglie mobile.

  • Flusso di lavoro integrato: Ho standardizzato il file di lavoro. Ogni singola tavola includeva il link diretto al documento dei testi, il numero di versione del design e la gerarchia esatta rispetto alla mappa del sito.

I Risultati

L'impatto di questo approccio metodico è stato molto positivo: siamo riusciti a tagliare i tempi di produzione del design di almeno un terzo. Eravamo così veloci a sfornare i layout validati che i copywriter facevano letteralmente fatica a starci dietro! La costruzione delle pagine era stata concordata preventivamente con gli sviluppatori, permettendo loro di esportare e implementare le sezioni in automatico.

Quello che era iniziato come uno scontro diplomatico su una palette di colori, si è trasformato in un trionfo su tutta la linea, perfettamente riassunto dalle parole della mia collega responsabile dell'account:

Quello che era nato come un microsito programmato per il lancio ad aprile si è evoluto in un sito web completo, tradotto in tre lingue. Un lavoro magistrale, complimenti immensi e grazie a tutto il team di Puragen!!!

Non contenti, abbiamo anche sottoposto il framework di Puragen a una sessione di PageSpeed Insights, ottenendo un punteggio di 95/100 su desktop - risultato niente male che conferma come le scelte di design e l'architettura tecnica siano perfettamente bilanciate per massimizzare le performance.


E un risultato personale di cui vado fiero: adesso i filtri sono Racing Green, guardate che belli che sono!

L'impatto di questo approccio metodico è stato devastante in senso positivo: siamo riusciti a tagliare i tempi di produzione del design di almeno un terzo. Eravamo così veloci a sfornare i layout validati che i copywriter facevano letteralmente fatica a starci dietro! La costruzione delle pagine era stata concordata preventivamente con i programmatori, permettendogli di esportare e implementare le sezioni in automatico.

Quello che era iniziato come uno scontro diplomatico su una palette di colori, si è trasformato in un trionfo su tutta la linea, perfettamente riassunto dalle parole della mia collega responsabile dell'account:

"What began as a microsite scheduled for an April launch has evolved into a fully-fledged website, complete with translations into three additional languages. Huge bloody well done and thanks to the whole Puragen team!!!"

Non contenti, abbiamo anche sottoposto il framework di Puragen a una sessione di PageSpeed Insights, ottenendo un punteggio di 95/100 su desktop - risultato niente male che conferma come le scelte di design e l'architettura tecnica siano perfettamente bilanciate per massimizzare le performance.


E un risultato personale di cui vado fiero: adesso i filtri sono Racing Green, guarda che belli che sono!