Volkswagen Group Services GmbH colma il divario di comunicazione tra progettazione e ingegneria grazie a Figma e FigJam

Volkswagen Group Services, una società del Gruppo Volkswagen con sede a Wolfsburg, in Germania, offre una vasta gamma di servizi ai marchi Volkswagen, dalla Ricerca e Sviluppo (R&D) agli acquisti. Il team di Business Development Services ha una missione altamente strategica: creare nuovi modelli di business, tradurli in prodotti e prepararli per l'ingresso in nuovi mercati.

Progetti complessi come questo richiedono una profonda collaborazione tra team multidisciplinari, e non è semplice riuscire ad allineare tutti sulla stessa visione. C'era un altro ostacolo: Volkswagen Group Services aveva iniziato da poco a sperimentare una maggiore flessibilità per quanto riguarda orari e luoghi di lavoro.

Così, all'inizio di un progetto importante, hanno voluto individuare un nuovo modo di collaborare che permettesse di evitare le solite criticità che affliggono lo sviluppo dei prodotti. Con Figma e FigJam, ci sono riusciti.

Figma e FigJam colmano il divario comunicativo tra progettazione > ingegneria

Volkswagen Group Services ha intrapreso la missione di creare una piattaforma customer-to-customer per aiutare le persone ad affittare spazi di stoccaggio. L'idea era quella di creare un marketplace in cui gli utenti potessero sia pubblicare spazi di stoccaggio disponibili, sia cercare soluzioni di deposito in tutto il paese.

"Il nostro obiettivo è creare una rete globale per imprese di tutti i settori, la cui creazione di valore dipenda dalla logistica". – Stefanos Tsoutis, Venture Builder and Business Mentor at Worage, Volkswagen Group Services.

Ma prima era necessario progettare e realizzare un MVP per la nuova piattaforma, definendo al contempo gli elementi del brand e il modello di business principale. Questo progetto ha richiesto contributi significativi da parte dei team di design, esperienza utente, esperienza cliente e ingegneria.

"L'obiettivo era creare da zero un modello di business e un prodotto scalabili, affermare un brand sul mercato, lanciare un MVP e iterare continuamente sia il prodotto che il modello di business." – Simon Elvers, Intrapreneur and Product Owner @Worage, Volkswagen Group Services.

Con così tante persone coinvolte, commettere errori sarebbe stato facile e correggerli dispendioso. Volkswagen Group Services doveva gestire alla perfezione l'handoff tra i team di design e di ingegneria.

Il team di design ha creato un prototipo dell'applicazione in Figma, includendo un sistema di progettazione, dettagliate pagine e animazioni. Hanno inoltre mappato meticolosamente ogni operazione e condizione che influisce sul flusso, fornendo una guida visiva per sviluppatori, designer e stakeholder.

“La sfida consisteva nel creare una visualizzazione dell'applicazione e una visione comune di come la piattaforma avrebbe funzionato in termini di flusso, trasferimento dei dati e garanzia della qualità.” – Hendrik Surma, Lead Software Architect at Worage, Volkswagen Group Services.

È stato un ottimo inizio, ma i responsabili del progetto avevano bisogno di un modo per schematizzare le idee iniziali tra i vari team e raccogliere feedback. E per farlo, avevano bisogno di una comunicazione diretta ed efficace tra diverse sedi. La lavagna collaborativa online di Figma, FigJam, ha risolto il problema, collegando in modo fluido le schermate con gli utenti in diverse sedi. Gli ingegneri hanno potuto fornire il proprio contributo fin dalle fasi iniziali, identificando le sfide operative che avrebbero influito sulla funzionalità, così da poter collaborare alla ricerca di soluzioni. Questa stretta collaborazione ha permesso di prevenire una serie di problemi.

Utilizzare FigJam insieme a Figma ha anche introdotto modi innovativi per visualizzare il design del prodotto. Il team ha documentato flussi utente complessi in FigJam, collegandoli ai file master, alle pagine e alle cornici di Figma; questo ha permesso ai diversi team di comprendere facilmente i flussi e accedere a ulteriori dettagli.

“La visualizzazione ottenuta tramite FigJam e Figma ha svolto un ruolo cruciale nell'allineare designer, sviluppatori, responsabili di prodotto e stakeholder, favorendo una comprensione condivisa delle complessità del progetto.” – Laura Lake, Product Designer in a leading role at Worage, Volkswagen Group Services.

Superare il divario tra ingegneria e comunicazione

La combinazione tra la rappresentazione visiva delle interazioni del prodotto e la documentazione integrata permette agli ingegneri di comprendere con precisione come le informazioni si spostino tra le diverse sorgenti dati e le destinazioni. Ciò ha permesso loro di ottimizzare i processi e ridurre al minimo le richieste al server, mantenendo bassi i costi operativi.

I designer hanno utilizzato le visualizzazioni anche per costruire un'esperienza utente coerente e curata nei minimi dettagli. Potevano vedere quali interazioni venivano attivate dalle diversi inviti all'azione per individuare eventuali schermate mancanti e identificare rapidamente le aree da perfezionare.

Anche il team di gestione progetto ne ha beneficiato. In genere, il monitoraggio di alto livello della gestione progetti di Volkswagen Group Services era solo un punto di riferimento: le persone dovevano interpretare accuratamente le attività e poi capire dove trovare contesto e risorse. Grazie al plugin JIRA per Figma (Atlassian Suite Integration), il team di Volkswagen Group Services ha potuto associare i ticket di gestione progetto direttamente alle relative schermate e funzioni. Ha rappresentato un vero e proprio salto di qualità per l'efficienza.

In precedenza, i link delle schermate dovevano essere copiati manualmente nei ticket JIRA, rendendo il processo ripetitivo per gli sviluppatori, che dovevano passare continuamente da JIRA a Figma e VS Code. Grazie alla nuova integrazione di JIRA, tutte le informazioni necessarie erano a portata di mano. Tale soluzione ha consentito ai responsabili di prodotto, ai tecnici e ai responsabili del progetto di supervisionare con semplicità lo stato dei singoli elementi, snellendo ulteriormente la gestione progetto.

Le visualizzazioni hanno offerto ai responsabili di prodotto una via preferenziale per valutare rapidamente quali aspetti del prodotto sviluppare per primi. In generale, questo approccio integrato si è rivelato migliore rispetto all'uso di strumenti frammentati. Le visualizzazioni hanno offerto ai team un metodo intuitivo per affinare la visione e trasmettere ogni dettaglio a chiunque fosse impegnato nella realizzazione di Worage.

Dev Mode ottimizza il passaggio agli sviluppatori

Molte delle sfide nel passaggio dal design allo sviluppo sono state risolte nel 2023 con l'introduzione di Dev Mode di Figma: uno spazio all'interno della piattaforma con funzionalità che aiutano designer e sviluppatori a tradurre i progetti in codice più velocemente. Dispone un playground per componenti che consente al team di ingegneria di Volkswagen Group Services di visualizzarli in anteprima insieme alle varianti prima dello sviluppo, eliminando ogni incertezza sul relativo comportamento.

Nella sezione delle risorse, gli sviluppatori di Volkswagen Group Services possono scaricare facilmente icone, immagini e video per le relative schermate, eliminando la necessità di scambiare pacchetti di file aggiuntivi. Questo approccio centralizza ogni risorsa, rendendo le schermate e le pagine pronte per lo sviluppo una fonte di verità definitiva sia per i designer che per gli sviluppatori.

Il team di Volkswagen Group Services ha riscontrato che la nuova modalità di confronto ha ridotto i bug in fase di sviluppo, mostrando chiaramente le modifiche apportate alle schermate: questo ha eliminato dubbi e sovraccarico cognitivo per il team di sviluppo, garantendo in ultima analisi un risparmio di tempo. Inoltre, la possibilità di estrarre il codice degli elementi in vari linguaggi ha semplificato l'ispezione e l'implementazione per il team di sviluppo, risparmiando tempo e riducendo gli errori.

Complessivamente, Volkswagen Group Services ha riscontrato che la Dev Mode ha favorito la collaborazione, riducendo significativamente gli attriti nei passaggi tra progettisti e sviluppatori.

“Utilizziamo la collaborazione come uno strumento per innovare e aggiungere valore alle nostre idee. E Figma abilita senza soluzione di continuità quella collaborazione all'interno del nostro team. È una configurazione davvero fantastica!" – Parth Pandya, Product Designer e Figma Advocate presso Volkswagen Group Services.

Sviluppare la visione di Worage con Figma.

Il progetto Worage è già a buon punto e sta per supportare le piccole imprese nel trovare lo spazio di stoccaggio necessario. Il lancio è previsto per la fine del 2024.

“La chiarezza nei poteri decisionali e il feedback costante possono avere un impatto misurabile sui nostri KPI di esperienza cliente. La combinazione di Figma e FigJam ci ha aiutato a comunicare meglio con tutti gli stakeholder fin dall'inizio del processo di design. Questo allineamento ha permesso di creare un prodotto di qualità superiore e incentrato sul cliente, aiutandoci a passare alla fase di produzione in modo più rapido ed economico", afferma Sandra Schaus, Lead UX Expert presso Volkswagen Group Services.