Del novissimo sito Ensoul, e del dare facciate contro il muro come criterio di lavoro.
Il nostro precedente sito buffo, diciamocela tutta, funzionava benissimo.
Era un lavoro di copy e di gusto più che di tecnica, fatto in due ore e che ci ha portato il 25% di fatturato in più. Ma per quanto fosse divertente e non convenzionale, non poteva durare per sempre: anche le barzellette più belle, ripetute cento volte, stufano.
Un’agenzia dovrebbe fare il proprio sito web per far capire a potenziali clienti ed investitori prima di tutto chi è, come lavora, cosa fa, cosa sogna, e sì, certo, anche i risultati raggiunti.
Contesto
Il 2020 ed il 2021 ci hanno visto crescere, nell’aggregato, di un 40% nel fatturato e di un 50% nel personale. Le aziende a cui ci rivolgiamo non sono più le stesse — siamo cresciuti: il linguaggio, un po’ a malincuore, doveva cambiare: va bene essere buffi ed anticonvenzionali, ma nel momento in cui i clienti che ti si accostano non ti conoscono pensano che tu sia un buontempone e non un professionista. E chi lavora con noi sa che siamo quadrati e precisi.
“Il primo errore della comunicazione è pensare che sia avvenuta” (G.B.Shaw)
Restiamo, certo, una microimpresa, ma siamo cambiati, e vogliamo cambiare campionato, ed aprirci ad altri mercati: abbiamo dei fissi mensili sempre più alti da pagare, progetti di sviluppo economico ed il sito buffo non può rispondere ad ogni bisogno. Rendetevi conto: “progetti di sviluppo economico” già rappresenta un’astrazione che solo due anni fa non avremmo mai immaginato. Il momento di “sto fermo a rana ed aspetto che arrivino i clienti consistenti da soli col passaparola” è finito, come è finita la nostra pubertà aziendale: l’azienda costa, l’elefante vuole due quintali di fieno al giorno, tocca cambiare modo di pensare.
La crescita dell’azienda e l’arrivo di nuovi cervelli, per contro, portano maggiore consapevolezza non solo nelle tecnologie, ma anche negli obiettivi, nei metodi. Ed è bello vedere che tutti spingono per una prosperità comune.
Il primo seme del sito nuovo nasce proprio durante i giorni più duri della pandemia: le richieste di lavoro — specialmente per gli e-commerce — si moltiplicano, ma i possibili clienti rispondono ai lead dei nostri partner con un sorrisetto: ok, simpatici-ha-ha, ma quanto solidi? In più anche il mondo è cambiato: un sito internet — specie nel senso brochureware — è oramai una tecnologia vecchia di vent’anni — altro che nuove tecnologie. Onesti onesti: per quanto cerchiamo di tenerci al passo con i tempi sono proprio le novità che si sono spostate altrove, nel ramo AI e virtualizzazioni, al netto del framework javascript modaiolo che stai usando.
Il nostro sito “ufficiale” è una roba inguardabile, sembra quello di uno studio di ingegneria termoidraulica. È invecchiato male.
Il 10 marzo 2021 OVH mi fa, in anticipo di un giorno, il regalo di compleanno facendo andare a fuoco la maggior parte dei server dei nostri clienti, compreso il nostro. Bastavano le candeline, eh, non serviva fare le cose in grande. Lo prendo come un segno.
Aprile 2021
In una delle prime riunioni “di persona” post-pandemiche in ufficio, a fine aprile, riunisco Elena, la nostra art director, e Matteo, il nostro frontend più skillato in JavaScript, e espongo loro le mie idee. Dopo due settimane Elena torna con un layout molto bello e moderno, con una tipografia che mi piace moltissimo. Lo guardo e lo riguardo, mentre Matteo lo fa danzare con curtains.js all’interno del solito plesso WordPress + Barba.js: bello, certo, ma per bello e moderno che sia non può bastare. Ma loro non c’entrano.
La verità è che la colpa è nostra, dell’azienda: è che per fare un sito davvero bello occorrono, oltre ai bei testi, belle immagini, e bei video, e noi non ne abbiamo, nel senso che non possiamo basare la nostra intera immagine sulle creatività dei nostri clienti, è fuorviante: noi non siamo i divani di Moroso, non siamo il parco di BAM, e forse come azienda verticale di sviluppo quello che possiamo mostrare non è nulla di così significativo da vedere per chi non sia un nerd come noi. O meglio.
Ci penso ancora e mi rendo conto che dei plusvalori chiaramente avvertibili dalle persone sono la user interaction e la user experience. Video dei siti, in soldoni, non delle jpg. E non li vedo quasi mai da nessuna parte: strano, vero? Solo grandi jpg colorate, qualche gif buffa, basta. Video. Segno e metto via.
Maggio 2021
Comincio intanto a prendere nota di cosa NON voglio nel sito.
- la maggior parte dei siti mobile fa schifo, ma schifo vero. Siti gradassissimi sul desktop che sul mobile sembrano interminabili fettuccine di contenuti illeggibili impilati male. Ed HELLO, forse il mobile nel 2022 SERVE MOLTO. Dovreste averlo capito. L’intero mondo dei siti internet spesso è solo “squidgy”, strizzato dentro uno spazio angusto. Siti che come li apri il processore del computer comincia a soffiare come un drago impermalito ed il cellulare si scarica come con la torcia accesa. Per animare le foto per un puro vezzo consumi l’equivalente di una centrale sovietica prebellica. E il web, gente, consuma e quindi inquina.
- I nomi dei clienti: continuo a pensarci, i nomi dei clienti in prima pagina mi fanno venire la difterite. È un modo molto molto semplice per far capire il tuo pedigree, certo, ma lo trovo sempre più simile a qualcuno che, volendo qualificarsi come partner, ti mandi le foto degli altri amanti che ha avuto prima di te, o quando le band mi mandavano i loro curriculum con scritto “ha aperto ai Bluvertigo”. Oooh, ora sì’ che sono impressionato. La vostra musica deve essere davvero buona se avete aperto ai Bluvertigo alla sagra del tortello, certo.
Esagero, lo so, ma un po’ vi toccherà darmi ragione. Se i nomi dei clienti dovranno apparire, sarà perché sarà contestuale alla spiegazione di un progetto super bello, non devono sembrare trofei di caccia impagliati come spesso accade. Ha senso se risolvi il problema di qualcuno in un tuo contesto produttivo e lo esemplifichi. Dopo un certo livello se devi mettere avanti i nomi dei clienti togli luce a te stesso. - Nel sito dell’agenzia NON metteremo la terribile “pagina dello staff con le foto buffe”. Forse con eccessiva severità la chiamo “la pagina dei morti”, simili alle pagine dei necrologi dei giornali: gente costretta a fare le facce buffe che magari si odia ed ha la gastrite (più grande è l’agenzia più è probabile). Se ci dovrà essere la nostra foto, non sarà didascalica. Infatti appariremo solo nel gioco sotto forma di icone (previo consenso dei diretti interessati).
- Testi, testi, testi: tutti quanti i siti hanno oceani, valanghe di testi. Testi motivazionali. Testi daichecelafaisti. Filosofia del lavoro non richiesta. Ti chiedo come lavoro mi scrivi poesie sulle falene. Ti chiedo che servizi mi dai e mi metti la citazione di Pepe Mujica. Mi immagino chiamare l’idraulico con la casa allagata e lui mi risponde con un haiku. E noi guardiamo sempre meno siti e sempre più chat e social. ASPÈ QUESTA COSA PORTA DA QUALCHE PARTE. SEGNA.
Giugno 2021
Chiedo a Matteo di provare a simulare un sistema di chat. L’idea è quella di avere una specie di chatbot. Matteo si inventa un mini framework javascript a manina santa che sembra funzionare anche bene, con risposte che variano sulle medesime domande. Ci gioco un paio di settimane: tecnicamente bello, il chatbot è freddo, freddissimo. Mi immagino un utente che, volendo capire cosa facciamo in pochi click, passi 15 minuti a conversare con il mio umorismo di patate e leggere bolle prima di arrivare ad un risultato di ricerca come si deve. La gente si rompe molto prima. L’idea del chatbot non è male, ma va semplificata, contestualizzata. Elena, con infinita pazienza, trova una reference simile ma lo stile è troppo brutalista per me.
Giulio guarda il tutto, e si ricorda della sua intenzione di fare un dev game, un gioco dove il protagonista è uno sviluppatore. Da buon egocentrico alzo il livello: non solo il gioco di gestire un freelance, ma una intera agenzia. L’esempio perfetto è quello dello Unicorn Startup Simulator di Toggl, per certi versi più semplice, per altri molto più bello. Ed io guardo l’interfaccia del gioco, come è collocata nella pagina, e rumino, e rumino.
E se fosse una provocazione? un sito solo mobile?
Luglio 2021
Proviamo la forma ridotta e fa funzionare bene la chat, ma far allargare le modali su desktop a schermo pieno rende il risultato confusionario. Provo a mettere un video fullscreen come background alla chat: il risultato non cambia. È il nostro sito con sotto le creatività e le interfacce dei clienti. Per quanto proviamo a fare una interfaccia minimale, qualunque nostra icona sembra sovrapposta rispetto alle grafiche dei clienti, che ovviamente non si parlano una con l’altra. Non ci siamo.
Buttiamo via il video fullscreen. Olè.
E comunque una versione solo testuale dell’interfaccia = noia accecante. Mi annoio io che lo navigo, che per la solita ragione de “l’occhio del padrone” dovrei vederlo bellissimo. È una palla mortale.
Accenno a Matteo che semplificheremo la chat: è un peccato, il suo meccanismo è molto buono. È un downgrade notevole: mi fa presente che gli ci vorrà un giorno solo per “pulire” un po’ il codice. Dovrà farlo molte altre volte.
Per ora la grafica sono grandi campiture di bianco con dei puntini di background. Ingegneria, portami via. No buono. Più tolgo e più mi viene da togliere. Elena guarda il tutto perplessa, combattuta se dirmi “non funziona” o invece “non funziona”.
Settembre 2021
Le emoji sono parte del nostro paesaggio quotidiano oramai. E icone, hm. Se dobbiamo fare qualcosa forse vorrei qualcosa che non sia scontato con le faccine buffe di Messenger o gli sticker. Mi viene in mente quando anni prima ero andato a Berlino ed avevo visto l’Humboldt-box Museum, decorato con pittogrammi che sembravano pitture rupestri. Ecco, vorrei fare icone del genere, penso: qualcosa che non siano le solite emoji fiacche ma qualcosa di più particolare. Qualcosa che possa capire anche un uomo primitivo, in teoria, in maniera non verbale. Coinvolgo a questo punto Luca Malisan nel progetto: conosco Luca da anni, dall’epoca in cui io facevo il grafico ed ero magro e lui faceva il programmatore ed era grasso — ora i ruoli ed i pesi si sono invertiti. Luca è un illustratore con un portfolio che scànsati (Dragonero, Bonelli, Glenàt e mille altri) ed un grafico 3D spettacolare che abbiamo fomentato a lavorare in three.js. Ma qui necca three.js — pesa molto, e per fare una icona solamente è fuori luogo.
Lo scroll nella prima schermata è relativamente corto, quindi non possiamo usare Scrolltrigger di GSAP per attivarle quando ci si passa sopra: decidiamo che — su mobile — l’animazione andrà “a prescindere” ogni tot secondi. Comunque sono quello che volevo.
I testi prendono forma. Non hanno la dirompente buffezza della landing page ma sono sempre molto Ensoul. Limitiamo le tempistiche a 30 secondi per video e dare il tempo alla gente di leggere. Già, mettiamo anche una progress bar che sembra quella delle stories di Instagram. È un modello di User Interface molto diffuso, perché no.
A differenza di Instagram però le lasciamo sul fondo, più facili da cliccare con una sola mano.
Sotto abbiamo replicato anche un hamburger menu spostabile già fatto su Ghiti, ma più lo guardo e più mi sembra una scelta poco coraggiosa, tipo “ehi guarda, ho fatto una navigazione fica ed innovativa MA ora torno al brutto che so”. Faccio agli sviluppatori “raga togliamolo”. Mugugni & Mugugni.
Tra le truppe serpeggia il dubbio: “Fulvio non sa più dove sta andando, gira a vuoto”. Non è vero, ma non è nemmeno del tutto falso: loro lo fanno per il bene dell’azienda e so che sono preoccupati per una buona ragione, perché vorrebbero vederne un termine. Ma questa volta è un po’ un make it or break it; non mi posso accontentare della solita minestra scaldata: devo giocarci, devo sbagliare. Ci perderemo i soldi che ci perderemo.
Ottobre 2021
I video: bene ecco, ora casca l’asino, pensa dentro di sé Romanin senza far trapelare alle truppe il suo cruccio. Abbiamo lavorato per mesi, siamo arrivati fin qua facendo decine di migliaia di righe di codice e siamo da capo a dodici. Mi faccio dare da un paio di clienti i loro video reel ma no, sembrano presi in prestito, tipo le foto che compri con la cornice: non sono cose nostre. Decido alla fine che i video saranno animazioni dai lavori. Per fortuna siamo bravini con le animazioni, ed è facile scegliere cose da utilizzare. Il problema è farli: il capture dei video non solo non è semplice, ma dobbiamo inventarci un sistema per farlo in maniera fluida.
Per fortuna Matteo ha il cappello a cilindro traboccante di conigli e si inventa questo, che condivido volentieri con voi.
var gsapScript = document.createElement(‘script’);
gsapScript.type = ‘text/javascript’;
gsapScript.src = ‘https://cdn.jsdelivr.net/combine/npm/gsap@3.7.1,npm/gsap@3.8.0/dist/ScrollToPlugin.min.js';
gsapScript.onload = () => {
gsap.to(window, { scrollTo: { y: document.body.offsetHeight }, duration: 15, delay: 2, ease: ‘linear’ })
}
document.head.appendChild(gsapScript);
Queste poche righe di codice, incollate nella console di Chrome, fanno scorrere lo schermo in maniera costante (e con velocità regolabile). Ora non sembra più che lo schermo sia trascinato da un trattore.
Trascorro due giorni filati a registrare video e a tagliarli. Dopo anni riapro After Effects e mi commuovo come un bisonte.
Ma i video, di nuovo, come?
Fullscreen, no. Pesanti, faticosi, servono in due formati.
Video orizzontali = piccolissimi su mobile.
Video verticali = invadenti su desktop.
Quadrati: quadrati è un buon compromesso. Abbastanza alto da poter essere leggibile su mobile, e su desktop gli facciamo prendere metà schermo, mantenendo la chat al centro. È un buon compromesso: diamo un po’ di ombrettina alle chat bubbles di sfondo e visivamente torna. Facciamo un po’ di test spostando in giro le progress bar ma alla fine le lasciamo lì a metà, così che non si veda il punto di giunzione tra video e testo accanto.
Troviamo un fallback: il video sarà sempre quadrato — se il monitor sarà tanto grande il video resterà quadrato. Per capirci:
Iniziamo a lavorare anche sulle gestures: tap per fermare lo scroll, swipe per procedere al prossimo video. Da mobile è un piacere usarlo.
Comincio a pensare che sì, bello tutto, ma questo sito dovrà essere anche in inglese, che sennò. Ok, chiedo di mettere anche una versione inglese, e traduco i testi. Ma dove metto il cambio lingua, ora?
I ragazzi ce la mettono tutta per arginare la mia follia. Le discussioni proseguono ogni giorno, ognuno ci mette del suo. A volte il confronto non è privo di attriti, ma è questo che sta rendendo non solo il sito bello, ma di tutti, un progetto realmente corale.
Novembre 2021
È il 5 novembre e sono agli stati generali della Lingua Friulana, nel palazzo della provincia. Sono lì perché Ensoul segue l’ARLeF, l’agenzia regionale per la lingua friulana, ed ha lavorato al bellissimo progetto Ghiti per incentivare il bilinguismo nei bambini, che tante soddisfazioni ci sta regalando, oltre che a partecipare alla traduzione par furlan di WordPress e Telegram. Siamo molto attivi e presenti nel portare la lingua friulana verso le tecnologie inform-
-mi trovo a fare facepalm nel mezzo della riunione: bello il sito in inglese, Romanin, ma se non lo fate voi par furlan, chi? Me agne?
Chiedo al mio vecchio compagno d’armi musicali Ferdinando Passone, già Passion dei DLH posse, mio antico gruppo rap, di tradurre tutti i testi — solo il gioco sono 1400 linee di traduzione, in un furlan migliore del mio.
Cominciano ad emergere due problemi: se i colori tuttobbianco non vanno bene e le icone sono belle ma mancano loro qualcosa, la mancanza di un punto dove mettere un selettore delle lingue è grave. E metterlo senza snaturare il tutto è pressoché impossibile. Tocca fare una specie di splash page iniziale, dove mettere almeno un’immagine. Il cane si morde la coda: noi non abbiamo una immagine ad hoc da mettere lì.
Il codice va di nuovo ripulito, i colori mancano, la foto manca, a questo punto comincio a pensare anche io che questo sito non uscirà mai. Ed io che volevo farlo uscire prima di Natale. Tsk.
Il deus ex machina tuona dall’Olimpo con il nome poco friulano — ma in realtà gemonese — di Francesco Marongiu. Conosco Francesco di fama da un decennio, ma non ho mai avuto occasione di lavorare con lui. È un fotografo di moda molto quotato — ha fatto la nuova immagine dell’Inter con Nike, per dire, insieme a quella bella gente di The Solo House, e quando gli racconto, non senza un filo di malinconia, dove ci stiamo insabbiando, sento distintamente un rumore di turbina di jet che si avvia. Ho avuto il piacere, in questi anni, di lavorare con molti professionisti di fama nazionale ed internazionale, ma con Francesco è la prima volta che sono letteralmente travolto dalla quantità di idee e di suggerimenti che mi dà: per la prima volta in vita mia devo dire “no, aspé, meno, fammici riflettere, devo digerire quanto mi hai girato”. Tra le decine di input che mi invia, uno mi accende una lampadina:
è una bellissima reference di James Turrell. La mia testa ribalta lo “schermo” in fondo nella forma dello smartphone che abbiamo sul sito. Dalla mia testa esce una scritta CLIC! in Bodoni grassetto a 96 punti. Ecco la quadra.
Comincio a lavorare sui colori, ed appare il rosa, e sono io a sceglierlo: anni fa, se mi aveste detto che il mio sito corporate sarebbe stato rosa vi avrei aizzàto contro i cani. Ma è il 2021 (quasi 2022), oramai. Uso un fiore fotografato da Francesco per i test di ingombro. Non è male, penso. La moglie di un mio collaboratore entra in ufficio e fa “che cos’è quel fiore, UNA LAPIDE?”.
Ok, urge un piano b.
Francesco mi trascina nuovamente nel suo vortice di idee: mentre io scopro come rendere più accattivanti e colorate le icone animandole in After Effects, lui seleziona, briga, fa, trova la modella giusta, fa lo styling, fa una prova in photoshop per vedere lo styling dei vestiti sulla modella. Se potesse pedalare per illuminare lui la stanza a suon di dinamo, lo farebbe.
Giulio e Davide ottimizzano il gioco: lavoriamo ancora con i nuovi colori per semplificare l’interfaccia. Il gioco fa molto ridere. È molto Ensoul. Elena mi guida a trovare i colori giusti, anche per le icone: non più il rosso accecante di prima, ma un blu petrolio molto fine. Useremo le nostre facce nel gioco: lì ha senso.
Manca solo la foto.
Dicembre 2021
8 dicembre. Shooting time! riunisco tutta l’agenzia a Martignacco dove faremo le fotografie.
Boomeristicamente, per una volta, mi sento veramente a capo di un’agenzia di comunicazione. Mi auto-schiaffeggio: torna sulla terra, Romanin. Tu fai lo sviluppatore web. Il concept della modella che si specchia nella tecnologia l’hai anche pensato tu con Francesco, ma plàcati.
Lo shooting è divertente, la modella e la MUA sono bravissime, e Francesco si prodiga anche di fare esperimenti in light painting (che sono disponibili in NFT per chi potesse essere interessato). Nel giro di poche ore Francesco mi manda le foto. Mia moglie mi vede sorridere per la prima volta dal matrimonio.
Facciamo i test, sono felice: il 15 dicembre è confermato il lancio.
È venerdì 10 dicembre quando Beatrice fa il QA e mi dice “ma è normale che i video non si vedano su iPhone?”.
Non abbiamo fatto abbastanza debug. No, meglio; non l’abbiamo proprio provato su iPhone fino ad allora. Pazzia. Mille incubi affollano la mia testa rotonda: è molto probabile che tutto il sistema per i video che abbiamo architettato in questi mesi possa avere problemi su iPhone, che, com’è noto, ha policies di sicurezza molto più strette. Un intero sito improvvisamente muto su iPhone. “Questo sito è meglio su mobile, MA NON SU IPHONE”.
Beh sì, mi pare un ottimo biglietto da visita con le agenzie internazionali.
Passo un weekend ruminando e mugugnando: lunedì mattina al kickoff Matteo mi dice solamente “ahia!”. E io piango lagrime amarasche. Dopo un’ora riappare: ha dato un calcio al sito come Fonzie ed ora funziona anche su iPhone.
“Ma che davero?” dico io, citando Steve Jobs.
Davero sì. Troviamo addirittura il tempo di implementare in extremis il dark mode, e di spendere due giorni di sviluppo su Lighthouse e su nginx per migliorarne la performance fino a farlo funzionare su un Alcatel del 1918.
Dopo la pubblicazione, quando mi arrivano i primi complimenti, le prime offerte di microcorrezione ai testi par furlan, e tutto comincia a girare, guardo per un attimo la montagna di lavoro che abbiamo scalato, con tutta la bella gente che ci ha aiutato (ciao Beatrice Peterchiutto, Manuel Maggio, Andrea Zini, i ragazzi di Mabiloft e di Belka, le sempre maggiche Nama) e contribuito al tutto e anche se non vinceremo nessun premio (e invece poi ne ha vinti sei, tra cui un Honorable Mention degli Awwwards, un Site of the Week sul Digital Design Awards, uno Special Kudos del CSSDA con tre premi aggiuntivi per UX, UI e Innovazione) la sensazione di avere fatto qualcosa di fuori dagli schemi c’è, è forte e non posso che esserne grato a tutti. E certo, non ha la fresca immediatezza della landing gggiovane. Ma è una foto più nuova, e più vera, di cosa siamo diventati e cosa vogliamo diventare. Da qui, finalmente, vedo il futuro che desidero.
Ah certo, lo davo per scontato. Ma il sito è qui: https://ensoul.it/. :)
