Un e-commerce culturale che unisce libri, dischi, corsi e tanto altro

Analisi

Analisi e strategia: unire due mondi in un’unica esperienza digitale

Il progetto è partito da un lavoro di analisi approfondita sul sito di SpazioBK, non solo perché rappresentava la base digitale più strutturata delle due realtà, ma perché offriva l’occasione di distinguere con chiarezza ciò che funzionava da ciò che, nel tempo, aveva perso efficacia. In vista della fusione con VolumeVolume, era fondamentale capire quali contenuti e quali voci di navigazione meritassero priorità e quali, invece, potessero fare un passo indietro o essere riposizionati in modo più strategico.

Data-Driven Design: analisi del comportamento e modelli mentali degli utenti

Attraverso dati quantitativi e qualitativi, mappe di calore e session recording, abbiamo analizzato come le persone cercavano libri, come si muovevano tra categorie e filtri e dove incontravano frizioni nell’esperienza. Parallelamente abbiamo studiato il mondo dei dischi e della musica, analizzando i principali competitor di VolumeVolume per allineare aspettative di mercato e modelli mentali degli utenti.

Questo doppio livello di analisi ci ha permesso di individuare punti di contatto tra i due ambiti e progettare una struttura comune, capace di funzionare per contenuti diversi mantenendo coerenza nei flussi. La strategia UX si è basata su un principio chiave: offrire esperienze diverse per tipologia di prodotto, ma percorsi riconoscibili e familiari per l’utente.

Una navigazione orientata al business, funzionale e flessibile

In parallelo al lavoro sui filtri, l’analisi delle performance delle pagine e dei percorsi di navigazione ha guidato la progettazione della nuova architettura del sito VolumeBK. Non si trattava di riprogettare le navigazioni esistenti di SpazioBK o VolumeVolume, ma di sintetizzarle in un’unica struttura capace di rappresentare la nuova realtà, dando priorità alle aree di business e riducendo al minimo le voci non strategiche.

Lo studio dei contenuti meno consultati, insieme all’analisi del mondo dischi e musica, ha portato a una navigazione più essenziale, focalizzata su libri, dischi ed eventi, supportata da spazi progettati per adattarsi ai diversi momenti dell’anno e alle esigenze commerciali. In questo contesto nasce la sezione “In evidenza”, pensata come strumento editoriale e di business, in grado di valorizzare prodotti, iniziative o contenuti specifici, come le gift card nel periodo natalizio o un concerto in programma.

Accanto alle aree principali prende forma anche la sezione “Esplorazioni”, uno spazio trasversale che ha una duplice funzione: alleggerire la navigazione principale e, allo stesso tempo, raccontare l’identità ibrida di VolumeBK. Qui libri e musica si incontrano in percorsi tematici condivisi, creando un punto di contatto tra le due anime del progetto e offrendo all’utente un’esperienza di scoperta guidata, più editoriale e meno didascalica.

UI

Un’estetica riconoscibile, ma funzionale

La UI di VolumeBK, sviluppata in collaborazione con Lorenzo Cravero, parte da elementi visivi storici di SpazioBK, come il formato quadrato delle immagini, integrandoli con la nuova identità del brand per costruire un’interfaccia fresca e contemporanea.

Un’attenzione specifica è stata dedicata anche alla UI dei filtri, rendendo più esplicite le aree di interazione e più leggibili gli stati. Il design accompagna l’utente nella ricerca, riducendo ambiguità visive e rafforzando la comprensione delle azioni possibili.

Gerarchia visiva e chiarezza: l’architettura dell’informazione nelle card

Particolare attenzione è stata dedicata alle card di prodotto, progettate come un sistema flessibile capace di adattarsi a libri, dischi, eventi, corsi e a tutte le categorie dell’ecommerce. Ogni card organizza le informazioni in modo chiaro e gerarchico, aiutando l’utente a comprendere immediatamente la tipologia di contenuto e la sua collocazione semantica nel catalogo.

Il design razionale delle card contrasta volutamente con l’anima più espressiva dell’interfaccia, creando equilibrio tra usabilità, identità e carattere visivo.

WooCommerce

Il sistema di ricerca json: velocità e precisione strategica

A differenza della ricerca tradizionale di WordPress che interroga il database ad ogni ricerca, questo sistema utilizza un’architettura basata su un file json statico e compresso. I dati di oltre 12.000 prodotti vengono elaborati, filtrati e salvati in questo indice dedicato per rendere l’esperienza utente istantanea e fluida.

1. ottimizzazione dei dati a monte

Il vero valore aggiunto risiede nella preparazione del dato. Il file json non è una semplice copia del database, ma un indice selettivo costruito per massimizzare la rilevanza fin dalla sorgente:

• selezione dei campi pertinenti: una funzione agisce come un filtro che estrae informazioni solo dai campi più significativi di ogni prodotto come titolo, descrizione e disponibilità, eliminando i dati irrilevanti;
• keyword manuali: il sistema include un campo specifico a disposizione di chi gestisce il sito per inserire sinonimi, varianti o termini in modo da fornire un assist editoriale alla ricerca;
• aggregazione delle tassonomie: il motore aggrega automaticamente i nomi di autori, editori, lingue e generi (scansionando oltre 20 tassonomie diverse) in un unico profilo testuale per ogni prodotto;
• pulizia e sanitizzazione: i testi vengono ripuliti da tag html, entità residue e codici, garantendo che il motore lavori solo su testo puro;

2. funzionalità avanzate del motore di ricerca

• logica di matching and: il sistema mostra solo i risultati che contengono tutte le parole cercate, riducendo drasticamente i risultati non pertinenti;
• intelligenza morfologica: il motore gestisce le variazioni della lingua italiana, comprendendo singolari, plurali e irregolarità (come libro/libri o uomo/uomini) grazie a regole di normalizzazione dedicate.
• scoring dinamico: ogni risultato riceve un punteggio di rilevanza; i match nel titolo o all’inizio della stringa ottengono una priorità maggiore per apparire per primi;
• gestione dello stock: i prodotti disponibili (in stock) vengono mostrati sistematicamente prima di quelli esauriti, ottimizzando l’efficacia commerciale della ricerca;

3. vantaggi per l’e-commerce

• performance elevate: il sistema riduce il carico sul database e garantisce tempi di risposta minimi grazie a una cache a due livelli e alla compressione dei file;
• esperienza utente migliorata: i suggerimenti appaiono istantaneamente durante la digitazione e il sistema supporta la navigazione completa da tastiera tramite frecce e invio;
• scalabilità e gestione: la generazione dei dati avviene in batch per non sovraccaricare il server e il sistema si aggiorna automaticamente ogni volta che un prodotto viene modificato;

Sviluppo WooCommerce e ottimizzazione dei Core Web Vitals

Abbiamo ottimizzato il sito affinché sia estremamente veloce al primo impatto, garantendo che i contenuti principali (come le copertine dei libri) appaiano quasi istantaneamente. Tecnicamente, questo si traduce in un eccellente punteggio di LCP (Largest Contentful Paint), fondamentale per catturare subito l’attenzione dell’utente e migliorare il posizionamento del negozio sui motori di ricerca.

Un altro punto di forza è la stabilità visiva: navigando tra i prodotti, il layout non subisce spostamenti improvvisi. Abbiamo lavorato per azzerare il CLS (Cumulative Layout Shift), evitando che bottoni o testi si muovano mentre la pagina sta caricando. Questo garantisce un’esperienza d’acquisto sicura e professionale, eliminando il rischio di clic involontari durante la consultazione del catalogo.

Infine, il sito brilla per la sua reattività ai comandi: ogni interazione, dal clic sui filtri all’aggiunta al carrello, riceve una risposta immediata. Ottimizzando il parametro INP (Interaction to Next Paint), abbiamo ridotto al minimo i tempi di attesa del browser, rendendo l’esplorazione tra libri, dischi e corsi fluida e piacevole come una visita dal vivo nello store fisico.

Infrastruttura e hosting: la potenza di Kinsta

Per sostenere un catalogo di oltre 12.000 referenze e picchi di traffico legati ad eventi e lanci editoriali, abbiamo scelto Kinsta come partner per l’hosting. L’infrastruttura basata su Google Cloud Platform e l’integrazione nativa di Edge Caching e CDN permettono di servire i contenuti statici con una latenza minima. Questo setup garantisce un TTFB (Time to First Byte) estremamente basso, offrendo al backend di WooCommerce la velocità necessaria per gestire carrelli complessi e transazioni sicure senza rallentamenti, anche durante le operazioni di aggiornamento massivo dell’indice di ricerca.