Carte contro liste, come influenzano UX

Due dei modi più comuni per organizzare il contenuto del sito Web in questi giorni è utilizzando le carte e gli elenchi. Ognuno ha i suoi pro e contro. Mentre gli elenchi sono in circolazione fin dai primi giorni del web, il design basato su carte è diventato solo di recente una forza con cui fare i conti e uno che è sempre più una scelta popolare per l'organizzazione dei contenuti.

Le carte e gli elenchi sono modi unici di visualizzazione dei contenuti, il che significa che sono rispettivamente migliori e peggiori per situazioni specifiche. La chiave per i web designer, ovviamente, è capire quando l'uso preciso di ciascuno offre agli utenti un'esperienza utente migliore. Le risposte potrebbero sorprenderti e farti guardare ai principi del design in modo un po 'diverso.

Qui, esploriamo quando è appropriato nel web design utilizzare le carte rispetto alle liste e viceversa.

Cos'è una carta? Cos'è una lista?

Per aiutarci a capire quando usare una carta o una lista è più appropriato per gli scopi di UX, ci aiuta molto a capire prima cosa è e cosa fa ciascuno (o dovrebbe fare).

Una carta è un contenitore che mostra vari bit di informazioni correlate, da cui gli utenti possono ottenere ancora più informazioni. Mentre è ancora un prodotto di design piatto, è più correttamente classificato come Flat Design 2.0 poiché di solito ha effetti 3D leggeri come ombre esterne per indicare la possibilità di fare clic. Effetti 3D come quella funzione di profondità visiva come significante per gli utenti, dicendo loro che possono fare clic per ulteriori informazioni.

È interessante notare che c'è una dicotomia con una carta, dal momento che di solito assomiglia a una vera carta da gioco sia per forma che per dimensione. Questo è indicativo del snouomorfismo scaduto, in cui gli elementi grafici erano simili a oggetti reali.

Un elenco è una pagina in cui vengono utilizzati i criteri di ricerca o le abitudini di navigazione dell'utente. La pagina dell'elenco contiene essenzialmente un certo numero di voci o voci candidate. Pertanto, un elenco deve facilitare una scansione oculare efficiente e rapida per UX corretta. Questa è una distinzione importante che ci aiuta a differenziare quando una lista è più appropriata di una carta, in termini di usabilità.

Quando usare le carte

Ora che conosciamo le principali differenze tra le carte e gli elenchi, è più facile per noi sapere con sicurezza quando l'uso di ciascuno è appropriato nel web design.

Per informazioni sulla navigazione (al contrario della ricerca)

Le carte rendono difficile o addirittura impossibile agli utenti di discernere facilmente l'importanza della classifica dei contenuti. Ad esempio, le carte non forniscono informazioni ovvie sull'ordine in cui il contenuto dovrebbe essere visualizzato su una pagina poiché il contorno / i bordi delle carte sembrano tutti simili. Certamente, la ricerca di base per il tracciamento degli occhi suggerisce sempre che gli utenti iniziano prima con il contenuto in alto a sinistra di una pagina, ma gli elenchi rendono più intuitivo per gli utenti seguire questo fondamentale modo di assorbire i contenuti online.

Ecco perché utilizzare le schede per sfogliare grandi collezioni, come quelle su Pinterest, per esempio, è l'ideale. Quando stai sfogliando i risultati di ricerca su Pinterest, invece di determinare in che ordine visualizzarlo, lo scorrimento infinito dei risultati basati sulle carte rende la navigazione attraente, divertente e facile. Ogni volta che vedi qualcosa di interessante, puoi immediatamente fare clic sulla carta per maggiori informazioni. È una gratificazione immediata.

Per raggruppamenti di oggetti diversi

A seconda dell'applicazione o del programma che stai utilizzando, alla fine ne incontrerai uno con una dashboard che utilizza la progettazione basata su schede per semplificare la distinzione tra vari tipi di contenuti. Questo è un esempio della forza delle carte per consentire rapidamente agli utenti di identificare i diversi tipi di contenuti che stanno gestendo.

Poiché le carte utilizzano i bordi per stabilire i limiti visivi, sono ideali quando si tratta di raggruppare elementi disparati.

Quando usare le liste

Le liste possono essere un po 'più semplici delle carte, forse perché sono state utilizzate più a lungo nel web design. Di conseguenza, tende a essere più facile determinare quando usarli bene.

Per una scansione oculare efficiente

Gli elenchi sono preferiti quando gli utenti devono cercare rapidamente qualcosa che desiderano su un sito, come quando stanno esaminando la pagina dei risultati di ricerca dopo aver inserito i termini di ricerca. Gli elenchi sono verticali e in cui un elemento si trova su una riga sopra l'aiuto successivo per focalizzare gli occhi dell'utente molto meglio delle carte, poiché le liste sono fisse mentre le carte non siedono in posizioni fisse nelle file.

Per schermi più piccoli

In poche parole, le carte occupano molto più spazio sullo schermo. Ciò rende problematico il loro utilizzo su dispositivi mobili e alcuni tablet perché costringe gli utenti a scorrere verso il basso sulla pagina per vedere più scelte prima rispetto a quando vengono utilizzati gli elenchi. Poiché gli elementi di una lista si limitano a righe brevi per tutta la lunghezza di una pagina, gli utenti possono vedere più scelte senza dover fare affidamento sulla memoria a breve termine (che quelli che guardano a un disegno basato sulla carta dovrebbero fare quando iniziano a scorrere verso il basso per vedere più elementi).

Non appena il tuo design richiede che gli utenti ricordino le scelte più in alto sullo schermo, inizieranno ad incontrarsi carico cognitivo , che danneggia UX. Carico cognitivo significa che il tuo cervello deve lavorare di più per ricordare qualcosa mentre sta ancora elaborando nuove informazioni aggiuntive. Ciò a sua volta porta a rallentare la velocità delle attività e, potenzialmente, completare l'abbandono di un'attività dell'utente.

Nell'app App store del mio smartphone, le categorie di app sono organizzate in un elenco ordinato e verticale che visualizza otto elementi su una sola pagina, senza che io debba preoccuparmi di dover scorrere verso il basso per vedere di più e ricordare le scelte precedenti. Se questo fosse stato fatto in un layout con le carte molto più grandi, sarei stato in grado di vedere solo alcune scelte al massimo, ostacolando il mio UX.