Come Lynksen ha dato vita al sito di una complessa piattaforma B2B con Spline

Elecctro sviluppa sistemi software per i servizi automatici, come distributori automatici, colonnine di ricarica per veicoli elettrici e autolavaggi automatizzati. La sua offerta spazia dall’hardware al software e si colloca in un angolo del mercato che storicamente comunica con gli acquirenti B2B attraverso schede tecniche fitte e diagrammi tecnici. La sua missione è modernizzare i servizi automatici con soluzioni intelligenti e connesse.

Elecctro aveva bisogno di un sito web. Ma non di un sito qualsiasi. Di uno capace di trattenere l’attenzione di un acquirente abbastanza a lungo da spiegare davvero cosa fa l’azienda, di distinguerla visivamente da decine di aziende simili e di portare rapidamente i visitatori verso una decisione.

“Dovevano comunicare moltissime informazioni”, racconta Tania, Project Manager di Lynksen, l’agenzia di design digitale chiamata a ricostruire l’esperienza del sito. “Ma volevano anche distinguersi in una nicchia molto tecnica.”

La risposta non era aggiungere contenuti. Era un tipo di interfaccia interattiva completamente diverso.

Una homepage da esplorare, non solo da leggere

L’idea di fondo di Lynksen era semplice solo in apparenza: lasciare che gli utenti esplorassero il sistema, invece di spiegarlo solo a parole.

La homepage è diventata una scena 3D interattiva. Una panoramica spaziale dell’intera famiglia di prodotti di Elecctro, su cui gli utenti possono passare il mouse, cliccare e muoversi al proprio ritmo. Ogni elemento della scena è collegato a una pagina di prodotto dedicata. Il percorso da “che cos’è questo prodotto?” a “sono pronto a parlarne” si è ridotto a pochi clic.

Gli utenti possono andare sulla homepage, vedere tutto, fare un clic ed essere già sulla strada per dare a Elecctro le informazioni di cui ha bisogno.

È stato un cambiamento significativo. La maggior parte dei siti B2B tratta la homepage come un indice. Lynksen ha costruito quella di Elecctro come un ambiente, qualcosa da attraversare invece che da leggere dall’alto in basso.

Perché Spline?

La visione era chiara, ma come realizzarla?

Gli strumenti 3D tradizionali erano esclusi in partenza. La sola curva di apprendimento avrebbe consumato l’intero progetto. E, soprattutto, il team di Elecctro doveva poter gestire il sito dopo il lancio. Questo significava niente pipeline incomprensibili, nessuna dipendenza da artisti specializzati, nessuno strumento che richiedesse mesi di formazione solo per cambiare un asset.

Lynksen ha valutato Spline e ha visto una strada diversa:

• Creare e iterare in un unico ambiente.
• Prototipare le interazioni direttamente nello strumento.
• Consegnare asset pronti per la produzione senza una complessa catena di passaggi.

Siamo passati da un’esperienza quasi nulla a consegnare un progetto completo al primo tentativo.

A renderlo possibile non sono stati solo gli strumenti, ma la community. Prima di scrivere una sola riga di codice, il team di Lynksen ha passato del tempo nella libreria della community di Spline: ha esplorato i remix, ha capito come altri designer affrontavano le interazioni e ha individuato tecniche da adattare per questo progetto.

Avere un posto come la community di Spline, con progetti diversi e la possibilità di remixarli per vedere come le persone hanno affrontato le varie interazioni, ci è stato davvero utile per imparare.

Per Elecctro c’era anche un altro fattore: la longevità.

Volevano una soluzione che il loro team potesse davvero gestire in autonomia dopo il lancio.

Non serve essere particolarmente tecnici per aggiungere un oggetto, creare un’interazione diversa e mantenere il progetto dopo che l’abbiamo consegnato. Per noi è stato un vantaggio fondamentale.

Costruire l’esperienza

Il processo di Lynksen è partito senza alcun movimento.

Wireframe statici. Layout dell’interfaccia piatti. Una gerarchia delle informazioni chiara, definita prima di introdurre una sola animazione. Solo quando la struttura è diventata solida il team ha iniziato ad aggiungere livelli.

“Partiamo sempre dallo statico e poi aggiungiamo l’animazione un livello alla volta”, spiega Tania. “Definiamo gli stati chiave in wireframe e schizzi, e durante l’implementazione ritocchiamo i movimenti della camera, giochiamo con le animazioni e ci assicuriamo che tutto si combini come previsto.”

Questa disciplina ha evitato che il progetto crollasse sotto il peso delle sue stesse ambizioni. Il team ha seguito un principio di design semplice: il movimento sostiene il racconto.

In pratica, questo ha significato:

• Stati hover discreti e micro-interazioni sugli elementi 3D
• Contenuti che si rivelano allo scroll e guidano l’attenzione senza pretenderla
• Transizioni della camera che orientano gli utenti invece di abbagliarli
• Una creatività più espressiva riservata ai momenti secondari (il footer, la pagina 404), dove le piccole sorprese sono un piacere e non una distrazione

La pagina 404 è diventata una delle preferite del team. Costruita interamente in Spline, permette agli utenti di cliccare in giro per scoprire elementi 3D nascosti. Un piccolo easter egg che la maggior parte dei visitatori non troverà mai, ma che il team di Lynksen si è chiaramente divertito a costruire.

“È bello nascondere un piccolo easter egg”, dice Ross. “Se qualcuno lo trova, come designer siamo felicissimi.”

Dettaglio delle icone 3D usate nel menu di navigazione del sito.

I risultati

Il sito ridisegnato è stato lanciato e i numeri si sono mossi subito.

Gli utenti attivi sono cresciuti del 524% e il progetto ha ricevuto 5 premi.

Il sito ha guadagnato 20.000 nuove visualizzazioni e la community del design se n’è accorta.

Quei risultati riflettevano qualcosa che il team aveva costruito di proposito: non solo un sito bello da vedere, ma un sito davvero efficace. Uno che funzionasse per gli acquirenti in cerca di chiarezza e per un team cliente che doveva gestirlo senza uno sviluppatore a tempo pieno sempre disponibile.

Per i team che stanno valutando il 3D

Per i team che si avvicinano per la prima volta al 3D sul web, il consiglio di Tania è semplice: non partite dagli strumenti tradizionali.

Con Spline la curva di apprendimento è gestibile. In pochi giorni, chiunque abbia competenze di design può iniziare. Il nostro team ha prodotto un MVP solido nella prima settimana di utilizzo.

Ross lo vede come un cambiamento più ampio nel modo in cui i team possono affrontare il 3D: invece di mettere insieme più strumenti e flussi di lavoro complessi, i team possono progettare, iterare e consegnare in un unico ambiente, rendendo il 3D interattivo molto più accessibile fin dall’inizio.

Se vuoi lavorare in un unico ambiente senza conoscenze super tecniche e poter consegnare esattamente ciò che vedi, scegli Spline.

Per le agenzie di design che propongono ai clienti esperienze web interattive, il progetto offre una prova convincente: con lo strumento giusto si può passare da zero esperienza a un sito premiato in un solo progetto.

Inizia con Spline

Come Lynksen, le agenzie possono sfruttare Spline per aiutare i clienti a comunicare prodotti complessi con esperienze interattive più facili da capire, più facili da gestire e più memorabili.

Per Elecctro questo ha significato trasformare una piattaforma B2B tecnica in un sito interattivo che chiarisce il prodotto, accelera le decisioni e aiuta il brand a distinguersi in un mercato affollato.

Che tu sia un’agenzia che lavora per un cliente o un team interno, Spline ti aiuta a passare dall’idea alla produzione più velocemente, senza una pipeline 3D complessa né competenze tecniche specialistiche.

Contatta le vendite