Nuovo Spazio Cliente OVH: l'approccio Full-Stack e la User Experience

PayPal, Netflix e recentemente anche WordPress hanno adottato il Javascript Full-Stack. Tutte queste applicazioni utilizzano lo stesso linguaggio per front-end, middleware e database. OVH ha aderito subito a questo movimento: già nel 2013 lo Spazio Cliente OVH Telecom è stato presentato alla conferenza Devoxx France come una delle prime interfacce cliente codificate in AngularJS e Bootstrap – per arrivare al Full-Stack mancava solo il backoffice in Javascript. Come fare per rendere agili applicazioni complesse come lo Spazio Cliente OVH? Quali tecnologie e metodi utilizzare per rendere più efficaci gli sviluppatori, tenendo in considerazione il feedback degli utenti?

Perché il futuro è Full-Stack?

Express.js, AngularJS e Bootstrap sono i tre principali framework utilizzati per riscrivere lo Spazio Cliente OVH. "Queste tecnologie offrono una grande libertà di progettazione, si rallegra Jean-Philippe Blary, sviluppatore nel team UX, ricordando l'esempio dei Popover visualizzati nella sezione "Public Cloud" dello Spazio Cliente OVH. Lo sviluppatore, adesso, può mettersi completamente al servizio della user experience dell'utente". Come molti sviluppatori, prima di unirsi al team di OVH Jean-Philippe ha lavorato presso il Google Web Toolkit. "Le librerie di componenti permettono di risparmiare tempo, ma in cambio bisogna accontentarsi del "look and feel" offerto. Le modifiche possibili sono marginali. I framework che abbiamo scelto sono, invece, come dei coltellini svizzeri, con i quali possiamo sviluppare in maniera quasi identica i modelli proposti".
Nel team UX, la tendenza è adottare l'approccio Full-Stack, in grado di agire su tutti i livelli dell'applicazione. "In qualche modo, è l'equivalente di quello che fa il devops, che associa alle sue competenze di sviluppatore un savoir-faire di amministrazione del sistema", spiega Kevin Bonduelle, che lavora anche alla riscrittura dello Spazio Cliente OVH. Nel settore informatico, la mancanza di manodopera non riguarda tutti i profili. Tuttavia, influisce sui metodi di lavoro e sulle scelte delle tecnologie utilizzate: si tenta in ogni modo di massimizzare l'efficacia del lavoro degli sviluppatori.
"Ci sarà ancora bisogno di sviluppatori specializzati, in quanto alcune tecnologie non possono essere conosciute in maniera superficiale, spiega Kevin. Ma la richiesta sarà minore, perché la tendenza di fondo è la semplificazione dello stack tecnologico delle applicazioni". In queste condizioni, Full-Stack non è più il "mito" di cui molti parlano.
È comunque interessante constatare che il movimento Full-Stack si estende oltre l'universo IT. Ad esempio, KPMG, l'azienda americana produttrice delle batterie di automobili Tesla, avrebbe potuto limitarsi a essere un subappaltatore dei costruttori di automobili ma ha deciso di costruire in autonomia i suoi veicoli. In questo modo, ha scelto di adottare un approccio "Full-Stack", che mira a padroneggiare tutta la catena di produzione dell'innovazione. Solo pochi mesi fa, si parlava ancora di integrazione verticale. Il vocabolario dell'informatica oggi è entrato a far parte del lessico economico... Un segno della sua importanza crescente?

Google Trends evidenzia che l'utilizzo delle tecnologie node.js (in verde), AngularJS (rosso) e bootstrap (viola) ha conosciuto un forte aumento a partire dal 2013.

Spazio Cliente OVH: da una concezione monolitica orientata alla tecnica a una concezione modulare gestita dall'utente

Dopo undici anni di onorato servizio, il "manager v3" è a un passo dal pensionamento, per lasciare il posto allo "Spazio Cliente v6", un'applicazione full Javascript user-friendly. "Una rivoluzione! commenta Jean-Philippe. Il manager v3 era il regno degli sviluppatori di OVH: quando un dipartimento aveva la capacità tecnica di sviluppare una nuova funzionalità, quest'ultima veniva aggiunta nell'interfaccia. Il tasto veniva visualizzato dove c'era spazio, senza preoccuparsi troppo se rispondeva alle reali necessità dei clienti. Inoltre, il manager v3 non era stato progettato per sfruttare i dati comportamentali. Se fosse stato così, grazie ai 40.000 utenti che ogni giorno utilizzavano l'interfaccia, avremmo accumulato una conoscenza immensa su come migliorarla. Oggi, la concezione dell'interfaccia cliente costituisce la missione di un'unica squadra, l'UX, e si concentra sul rapporto utente/professione: analizziamo i bisogni, costruiamo i modelli, eseguiamo test, sviluppiamo, raccogliamo i feedback e adattiamo il prodotto". L'obiettivo del team UX è quello di nascondere la complessità con un'interfaccia semplice: "Se il nostro lavoro non è all'altezza, la punizione è immediata: i clienti intasano con chiamate il supporto clienti, utilizzano direttamente l'API (chi può!) o, più semplicemente, ci lasciano...". OVH calcola l'indice di soddisfazione mensilmente, inviando migliaia di questionari a un gruppo di clienti che hanno utilizzato recentemente lo Spazio Cliente OVH.

Manager v3 e v6: sguardo alle architetture tecniche

La migrazione dal manager v3 al nuovo Spazio Cliente OVH è un grande cantiere, soprattutto perché non si tratta di una vera e propria migrazione, ma di una riscrittura totale di oltre 400 funzionalità macroscopiche, che si declinano in decine di migliaia di possibilità di utilizzo. "L'architettura sottostante è stata completamente ripensata, spiega Kevin. Il manager v3 si basava su un'architettura monolitica in Perl, XML e XSLT, in cui era inserito il database. Qualsiasi modifica, anche grafica, era pericolosa. Inoltre i calcoli erano effettuati dal server, quindi il tempo di caricamento delle pagine era lungo". Il nuovo Spazio Cliente si basa su un'architettura modulare, con un'applicazione Web che utilizza AngularJS e Bootstrap, che richiede una prima API in Node, che a sua volta richiede l'API OVH (all'interno della quale troviamo Perl, GB, Java e Python), che estrae l'informazione dal database. "L’API over API in Node.js, che abbiamo battezzato 2API, è un middleware che funziona come aggregatore dell'API v6. Permette di superare il limite delle sei richieste simultanee dei browser. La visualizzazione di alcune pagine dello Spazio Cliente OVH, per i clienti che hanno attivato più servizi, può richiedere centinaia di richieste. Grazie a questa soluzione le pagine si caricano più velocemente e progressivamente: il caricamento si effettua man mano che l'utente scorre la pagina". Inoltre, le regole di chiamata (REST) e di risposta delle API sono state standardizzate, per consentire futuri miglioramenti tecnologici.
"C'è ancora molta strada prima di raggiungere le performance desiderate per alcune operazioni, in particolare quelle di massa. Ci stiamo lavorando e non escludiamo di rimettere in discussione alcune scelte tecnologiche. L'idea di un'API v7 ha già preso forma".

Il tool City JS permette di paragonare la struttura monolitica dell'architettura del manager v3 a quella, molto più modulare, del manager v6. La base rettangolare bianca rappresenta l'applicazione nella sua interezza, in marrone vengono indicati i distretti (cartelle), in rosso i moduli (namespace), in verde le funzioni anonime e in blu quelle nominative.

Dietro la sfida tecnica se ne nasconde un'altra: far accettare il cambiamento agli utenti. È quello di cui si occupa Anne-Claire Maury, del team UX: "Ci dobbiamo confrontare con un'abitudine molto radicata alla vecchia interfaccia, dovuta alla frequenza di utilizzo - alcuni clienti, in particolare reseller, la utilizzano per molte ore ogni giorno - e al fatto che, nel corso del tempo, ha subìto pochi cambiamenti. L'abitudine può provocare un'avversione al cambiamento: il tempo trascorso a fare propria un'interfaccia, in un contesto professionale, è da considerare come un investimento. È comprensibile che gli utenti oppongano resistenza all'utilizzo di un'altra interfaccia. Il nostro lavoro, che consiste nel rendere la fase di apprendimento più rapida e indolore possibile, è fondamentale. Ed è anche il motivo per cui abbiamo scelto la via del migliormanto continuo, con modifiche progressive".

Massimizzare le segnalazioni degli utenti

Anne-Claire incoraggia gli utenti, per quanto possibile, a esprimere la loro opinione. Ad esempio, allo stand che presidiava durante l'OVH Summit 2015. Lei che ha già invitato diversi gruppi di clienti a Lille per testare le varie sezioni dello Spazio Cliente durante la loro riscrittura, ne è convinta: "Bisogna effettuare più test. In una giornata, con soli cinque partecipanti, siamo in grado di identificare l'85% dei problemi di un'interfaccia". Eseguiti anche da utenti interni, questi test permettono di valutare l'utilizzabilità di un'applicazione, cioè la sua efficienza, la sua efficacia e la soddisfazione ad essa associata. "È l'utente che stabilisce la rilevanza delle nostre proposte". Le segnalazioni provengono anche dal supporto OVH, in cui è nato un nuovo team, incaricato del miglioramento continuo. "Le statistiche, calcolate grazie ai feedback sui motivi delle chiamate, ci servono a definire le priorità del nostro backlog kaizen [lista delle funzionalità e modifiche richieste dagli utenti, NDR]". Alla fine dei test, quando una nuova funzionalità viene implementata, Anne-Claire passa il testimone ai "collaudatori", che si adoperano per correggere i bug incrementando i test funzionali. "La loro mission è di prevedere tutti i casi di utilizzo, dai più comuni ai più improbabili, che i clienti si potrebbero trovare davanti e poi verificare, in fase di pre-produzione, che la nuova funzionalità non provochi danni". Questi test hanno un'importanza fondamentale: "Nella piramide di Maslow rivisitata per descrivere le necessità degli utenti Web, la base è di disporre di un'applicazione affidabile! L'utilizzabilità – su cui attualmente concentriamo i nostri sforzi, e gli aspetti estetici vengono in un secondo momento".

In cantiere: Mobile First e AngularJS 2.0

Appena il nuovo Spazio Cliente OVH avrà sostituito definitivamente il manager v3, una delle priorità del team UX riguarderà la strategia Mobile First da mettere in atto. Anne-Claire commenta: "Sulla vecchia interfaccia, il mobile rappresenta dal 3 al 4% delle connessioni, ma l’interfaccia non si adattata alla perfezione. Sappiamo che oggi ci si connette sempre più spesso da dispositivi mobili piuttosto che dal pc. E il 90% del tempo passato utilizzando il cellulare viene trascorso utilizzando applicazioni. L’equazione è semplice: bisogna essere responsive (almeno compatibili con i dispositivi mobili), adaptive (selezionare le funzionalità da far comparire quando ci si connette da un dispositivo mobile) e, in seguito, proporre un'applicazione. Questo ha senso per alcuni degli usi dello Spazio Cliente OVH, ad esempio, l'ordine o il rinnovo dei domini o il monitoraggio di un server..."
Altra sfida: lanciarsi a capofitto sulle prossime innovazioni tecnologiche. "Abbiamo scelto framework giovani e dinamici, che si evolvono rapidamente, giustifica Jean-Philippe. AngularJS propone già una versione 2.0, molto promettente, soprattutto perché integra un transpiler. Questo ci permetterà di offrire una prima applicazione mobile ibrida (basata sullo stesso codice sorgente del manager Web), e di utilizzare le regole ECMAScript 6, su cui si basano Javascript 2015 e Typescript". Veloce da sviluppare e leggero da eseguire, questo linguaggio ha solo un incoveniente: non è supportato dai browser (cf. tabella qui sotto). "In sintesi, AngularJS 2.0 ci permetterà di offrire le funzionalità di domani nei browser di ieri! E, se proprio dobbiamo scegliere, siamo fermamente convinti che non bisogna frenare l'adozione delle innovazioni a causa dei possibili rischi di incompatibilità con le versioni precedenti dei browser. In quanto attori protagonisti nell'universo Web, abbiamo anche il dovere di spingere gli utenti ad aggiornare i loro browser. Andrà a beneficio di tutti".

La compatibilità di una funzione ECMAScript 6 (let) con i diversi browser, fornita dal sito http://caniuse.com (verde= compatibile; verde chiaro= compatibilità non garantita; rosso= non compatibile)

UX: un team pluridisciplinare, tra Francia e Québec
Il team UX di OVH si divide tra l'Europa e l'America, in cui l'hosting provider ha aperto un ufficio ad aprile 2015. "La nostra presenza in Québec permette di attirare profili del mondo dei videogiochi, spiega Pierre Leroux, VP UX in OVH, in passato produttore di giochi in Ubisoft. Il settore del Gaming era, ed è tuttora, un precursore nell'ambito dei test da parte degli utenti. In OVH cerchiamo di approfittare al massimo di questa esperienza". Inoltre, il team UX è il primo in OVH a riunire figure molto diverse tra loro: ergonomi, sviluppatori, collaudatori, ecc...
Convinti dei vantaggi di infrastrutture leggere e maneggevoli, stiamo sperimentando i vantaggi del telelavoro dando libertà agli sviluppatori: "La nostra mission è fare in modo che i nostri clienti abbiamo l'esperienza più semplice e piacevole possibile. Per raggiungerla, cominciamo concedendo agli sviluppatori un certo grado di libertà nella scelta dei loro strumenti di lavoro. Innovation is Freedom!" riassume Kevin. "Si parla molto di Internet of Things. La nostra vision, è l’Internet of People, costruito da utenti e sviluppatori".