Organizzare il tuo negozio

Le collezioni danno struttura alla tua Shopping App e organizzano i tuoi prodotti. Se la tua app fosse un negozio fisico, le collezioni ne sarebbero le corsie.

Decidono anche che cosa il tuo cliente può raggiungere. Un prodotto agganciato a nessuna collezione esiste comunque nel tuo negozio, e si vende, ma ci si arriva tramite il suo indirizzo diretto: tramite un link che invii, tramite una ricerca, tramite un widget della pagina iniziale. Agganciare ogni prodotto ad almeno una collezione è quindi il primo riflesso, ancora prima di pensare alla tua organizzazione.

Sono flessibili su due fronti. Nel tempo, prima di tutto: una collezione si aggiunge, si cancella, si mostra o si nasconde con un clic, il che rende possibili le collezioni temporanee. Nell'organizzazione, poi: si intersecano, e lo stesso prodotto appartiene a più collezioni insieme.

È quella trasversalità a meritare la tua attenzione quando le crei. Prendi il nostro negozio di decorazione. Un cliente che cerca un oggetto decorativo può ragionare per tre vie diverse: la stanza interessata, il tipo di oggetto, la tendenza del momento. Abbiamo quindi creato nove collezioni distribuite su quelle tre vie:

Per stanza: Camera, Bagno, Cucina

Per tipo di oggetto: Cornici, Vasi, Cuscini

Per tendenza: Big in Japan, Keep it Slow, Words matter

Ogni prodotto appartiene quindi a più collezioni. Ha più possibilità di essere visto, e il cliente ha più possibilità di trovarlo per la strada che gli viene naturale.

A tutto questo si aggiunge una collezione Saldi, che raccoglie i prodotti scontati. Cambia nel tempo, e resta nascosta fuori dal periodo dei saldi.

Vai in Products › Collections. Clicca su Create a collection.

Inserisci poi il titolo, un'immagine di illustrazione e l'ordine di visualizzazione dei prodotti. Il titolo è limitato a 32 caratteri, ed è un vincolo utile: il nome di una corsia si legge in un menu, su uno schermo di telefono, e lì i nomi corti vincono sempre.

Per l'ordine di visualizzazione, la regola è sempre la stessa: chiediti che cosa cerca il tuo cliente.

Vengono proposti sei ordini automatici, a coppie: data di creazione, dal più recente al più vecchio o il contrario, prezzo, dal più basso al più alto o il contrario, e titolo, dalla A alla Z o dalla Z alla A. La settima modalità è manuale.

• La data mette per prime le novità. È la scelta giusta per un negozio di abbigliamento rifornito con regolarità, o per una libreria i cui clienti tornano in cerca di nuove letture.
• Il prezzo crescente va bene per un negozio di alimentari, dove il cliente vuole controllare il suo budget. Il prezzo decrescente serve piuttosto a una collezione di alta gamma, dove il primo articolo dà il livello.
• L'ordine alfabetico è per i cataloghi che si scorrono già sapendo il nome di quello che si vuole: pezzi di ricambio, codici tecnici, vini.
• La modalità manuale ti permette di spingere in cima quello che vuoi vendere per primo, e ti dà il controllo completo sull'aspetto della tua lista.

Quell'ordine appartiene alla collezione, non al negozio. Le tue novità possono quindi essere ordinate per data mentre la tua selezione del mese resta sistemata a mano. È questo che rende sostenibile la modalità manuale: gli ordini automatici si applicano da soli ai prodotti che aggiungi più tardi, la modalità manuale ti chiede di tornarci, quindi riservala alle collezioni che se lo meritano.

Non dimenticare il SEO. Le tue collezioni sono indicizzabili esattamente come le tue schede prodotto. Compila i tag Title e Meta description, e personalizza gli URL con le tue parole chiave.

Una collezione arriva nel menu della tua app in due modi, ed è lì che si decide l'aspetto della tua navigazione.

Da sola. Ogni collezione porta il suo blocco di visibilità nel menu, dove spunti l'opzione che la elenca nel menu e ne scegli il posto. Diventa una voce a tutti gli effetti, alla pari di una sezione. Un negozio con tre corsie le mostra così, e il suo cliente abbraccia tutto il catalogo con un colpo d'occhio.

Raggruppata. La sezione Collection list ne raccoglie diverse sotto un'unica voce. Il riferimento utile: oltre le cinque corsie, il menu ci guadagna a essere raggruppato.

Nel vocabolario dell'e-commerce, quel secondo modo è la distinzione tra categoria e sottocategoria, con la lista che fa da categoria e le collezioni da sottocategorie. Se arrivi da un'altra piattaforma, è il gesto che conosci sotto un altro nome.

Torniamo al negozio di decorazione e alle sue dieci collezioni. Senza raggruppamento, il menu dell'app sarebbe saturo.

Abbiamo quindi creato tre liste, che riprendono le tre vie di ricerca, con tre collezioni ciascuna:

• Stanze: Camera, Bagno, Cucina
• Oggetti: Cornici, Vasi, Cuscini
• Tendenze: Big in Japan, Keep it Slow, Words matter

La collezione Saldi resta fuori da qualsiasi lista: la vogliamo raggiungibile il più direttamente possibile. È una decisione da tenere a mente, mettere ordine non deve mai seppellire quello che deve restare in superficie.

Una lista di collezioni è una sezione della tua Shopping App. Si aggiunge come qualsiasi sezione, da My App › Structure. Clicca su Add a section, poi scegli Collection list.

Dai un titolo alla tua sezione, associale un'immagine e conferma.

Per metterci dentro le tue collezioni, due metodi:

• clicca sull'icona «+» per selezionare le collezioni da includere
• oppure trascina le collezioni direttamente sotto la sezione Collection list

Tre layout, uno dei quali dipende dalla tua modalità di navigazione.

Swipe Submenu mette le tue collezioni in un sottomenu, sotto la navigazione principale dell'app. È disponibile solo nella modalità di navigazione «Swipe», quella in cui si passa da una sezione all'altra facendo scorrere lo schermo in orizzontale. È il layout predefinito del catalogo, ma è legato alla navigazione: sceglilo solo se la tua app adotta quella modalità, mai come semplice ripiego.

Classic presenta le tue corsie in righe, con una piccola miniatura e il nome in grassetto, diverse per schermata. È la postura da elenco: ti va bene quando hai molte corsie, quando il nome conta più dell'immagine, e quando deve funzionare anche senza visual forti. È anche il ripiego naturale degli altri due.

Visual è una vetrina: grandi schede a tutta larghezza, l'immagine della corsia come sfondo e il nome sovrapposto. Sceglilo quando le corsie si scelgono con l'occhio, nella moda, nella decorazione o nell'alimentare.

Un avvertimento su quest'ultimo: esige buoni visual su tutte le tue collezioni. Se alcune non ne hanno, o li hanno scadenti, ripiega su Classic.

La scelta si fa in My App › Structure, dal menu della tua sezione, Edit the design. Classic e Visual valgono per qualsiasi modalità di navigazione. Se la tua app non è in modalità Swipe, il back office disattiva Swipe Submenu e ti propone un link per cambiare il tuo menu.

No, ed è un dettaglio che può contare. Consigliamo di mantenere la coerenza di design in tutta la tua app, ma variare i layout ti permette di segnalare una gerarchia.

Prendi un negozio di alimentari il cui catalogo è organizzato così:

• Alimentari
• Freschi: Frutta, Verdura
• Sfusi: Cereali, Riso & Pasta
• Salute & Bellezza: Cosmetici, Oli essenziali

Qui, certe liste di collezioni non contengono collezioni ma altre liste di collezioni. Ci sono quindi due livelli da distinguere. Applicare un layout diverso al livello 1 e al livello 2 evita che il cliente si perda nell'albero.

Un tag è una parola chiave agganciata a un prodotto, come un contrassegno. Puoi agganciarne diversi allo stesso prodotto.

Servono prima di tutto a ritrovare i tuoi prodotti nel back office. Ma il loro valore principale è altrove: guidano quello che si mostra dal lato del cliente.

• filtrano i widget di lista prodotti della tua pagina iniziale
• alimentano, insieme alle collezioni, il blocco dei prodotti simili delle tue schede prodotto
• alimentano i risultati della sezione di ricerca del tuo negozio

Pensa ai tag come a collezioni secondarie, invisibili nella navigazione ma attive nella visualizzazione. Si costruiscono in genere sulle caratteristiche dei tuoi prodotti: colore, materiale, forma.

Un esempio. In un negozio di abbigliamento, un maglione di lana marrone a collo alto va nella lista di collezioni «Abbigliamento», collezione «Maglioni». Riceve i tag «colloalto», «marrone», «lana».

Ne derivano subito due usi. Per mostrare tutti i tuoi articoli di lana nella pagina iniziale, basta filtrare sul tag «lana». E il maglione può comparire come prodotto complementare sotto un paio di pantaloni marroni.

È la differenza fondamentale con le collezioni: la collezione organizza quello che il cliente sfoglia, il tag organizza quello che tu gli presenti.

Si aggiungono quando crei o modifichi un prodotto. Nel menu di destra della pagina di modifica del prodotto, inserisci i tuoi tag nel campo Tags. Pubblica per confermare.

Due regole di scrittura decidono la salute del tuo vocabolario nel tempo. Un tag si scrive in una parola sola, senza spazi, ed è per questo che l'esempio qui sopra dice «colloalto». E le maiuscole vengono ignorate, lana e Lana sono lo stesso tag, quindi non devi sorvegliare le maiuscole.

Il resto è disciplina, e il back office ti dà lo strumento: sopra il campo, View all tags apre la lista di quelli già presenti nel tuo negozio, con una ricerca e un ordinamento alfabetico o per frequenza d'uso. Prendi l'abitudine di sceglierli da lì invece di riscriverli. Un vocabolario che scivola in lana, lanoso e puralana filtra tre volte meno prodotti di quanti ne esistano, ed è una deriva che scopri dopo duecento schede prodotto.