{"id":60,"date":"2010-05-03T15:17:21","date_gmt":"2010-05-03T13:17:21","guid":{"rendered":"https:\/\/alistapart.com\/it\/article\/navigazione-a-faccette\/"},"modified":"2010-05-03T15:17:21","modified_gmt":"2010-05-03T13:17:21","slug":"navigazione-a-faccette","status":"publish","type":"article","link":"https:\/\/alistapart.com\/it\/article\/navigazione-a-faccette\/","title":{"rendered":"Design Pattern: Navigazione a Faccette"},"content":{"rendered":"

Siamo lieti di presentarvi un estratto dal Capitolo 4 di Search Patterns<\/cite><\/a> di Peter Morville e Jeffery Callender (O\u2019Reilly, 2010). \u2014Ed.<\/em><\/p>\n

\n

Navigazione a Faccette<\/h2>\n

Anche chiamata navigazione guidata<\/em> e ricerca a faccette<\/em>, il modello di navigazione a faccette influenza i campi metadata ed i loro valori per fornire agli utenti delle opzioni visibili per chiarire e rifinire le query. La navigazione a faccette \u00e8 probabilmente l’innovazione nella ricerca pi\u00f9 significativa della decade appena passata.<\/a>[2]<\/a><\/sup> \u00c8 caratterizzata da una ricerca integrata ed incrementale e da una esperienza di browsing che permettono agli utenti di iniziare la ricerca con la classica parola chiave, per poi fornirgli una lista di risultati tra cui scorrere. Fornisce inoltre una mappa personalizzata (solitamente a sinistra dei risultati) che fornisce delle idee riguardanti il contenuto e la sua organizzazione, offrendo una variet\u00e0 di utili passi successivi. La navigazione a faccette d\u00e0 prova della sua potenza in questo: mantenendo fede ai principi di progressive disclosure<\/a> e di costruzione incrementale, gli utenti possono formulare l’equivalente di una sofisticata query booleana attraverso una serie di piccoli, semplici step. La navigazione a faccette affronta il bisogno universale di circoscrivere, limitare la quantit\u00e0 di informazione. Di conseguenza, questo schema \u00e8 diventato pressoch\u00e9 onnipresente nell’e-commerce, data la disponibilit\u00e0 di metadati strutturati ed il chiaro valore per il business di una migliore trovabilit\u00e0 dei prodotti. L’utilizzo della navigazione a faccette si sta espandendo rapidamente attraverso una grande ed impressionante variet\u00e0 di contesti e piattaforme. Nel mondo della ricerca, la navigazione a faccette \u00e8 ovunque.<\/p>\n

La Figura 4-19 illustra un’implementazione ben riuscita della navigazione a faccette come modello per l’interazione con i cataloghi di molte biblioteche accademiche. Questo \u00e8 un buon esempio di federated search<\/a> [ricerca federata, ndr<\/em>] nella quale alla sorgente (pi\u00f9 o meno equivalente alla locazione) viene ridotta l’enfasi relativa al soggetto e al formato. L’obiettivo del consorzio \u00e8 quello di mettere in connessione gli studenti e gli accademici con i migliori materiali, senza stare a guardare a che universit\u00e0 appartengono. Questo esempio suggerisce anche delle sfide progettuali. La navigazione a faccette non \u00e8 semplicemente una caratteristica che permette di spuntare gli elementi di una lista. Il successo richiede un’attenzione accurata per i dettagli e la comprensione del vasto array di possibilit\u00e0 offerto dall’interaction design<\/a> [progettazione dell’interazione, ndr<\/em>]. Ad esempio, le biblioteche pubblicano una serie di faccette a scomparsa sulla sinistra. Solo le faccette pi\u00f9 rilevanti (soggetto, formato, locazione) sono aperte. La maggior parte \u00e8 chiusa per default. Ciascuna faccetta aperta rivela solo i primi quattro o cinque valori pi\u00f9 popolati. Questo permette un piccolo ingombro per le faccette che lascia libero molto spazio nello parte principale per i risultati stessi. Il numero di risultati che coincidono con ogni valore (mostrati all’interno di parentesi) \u00e8 un elemento chiave della mappa, cos\u00ec come lo \u00e8 la riformulazione dei termini di ricerca e dei valori selezionati come pile di breadcrumb, che permettono agli utenti di vedere o modificare i loro parametri di ricerca correnti. Questa interfaccia \u00e8 il risultato della ricerca sull’utente, dei test di usabilit\u00e0 e dell’iterative design<\/a> [progettazione iterativa, ndr<\/em>]. Ma non \u00e8 l’unico modo.<\/p>\n

<\/a>[2]<\/a> Marti Hearst ed i suoi collaboratori del progetto Flamenco presso UC Berkeley si meritano una menzione per la loro ricerca pionieristica sulla navigazione a faccette (http:\/\/flamenco.berkeley.edu\/<\/a><\/em>).<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.19 Navigazione a faccette delle Triangle Research Libraries<\/p>\n<\/div>\n

Ad esempio, le applicazioni dipendono da un mix di scented widgets<\/em> [“[…] graphical user interface controls enhanced with embedded visualizations that facilitate navigation in information spaces […] (Controlli grafici dell’interfaccia utente potenziati con visualizzazioni embedded che facilitano la navigazione in spazi di informazione), da: “Scented Widgets: Improving Navigation Cues With Embedded Visualizations”<\/a>, Wesley Willett, Jeffrey Heer, and Maneesh Agrawala, ndr<\/em>] per la visualizzazione e l’interazione con i valori delle faccette e da alcuni selettori di faccette spostati in alto o a destra piuttosto che a sinistra.<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.20 Un insieme variegato di scented widgets<\/p>\n<\/div>\n

Presentare le faccette in alto attira pi\u00f9 attenzione alle possibilit\u00e0 di circoscrizione. Data l’enormit\u00e0 degli insiemi di risultati, questo \u00e8 un metodo efficace per sottolineare la struttura dati e attirare gli utenti verso i filtri. Talvolta, posizionare elementi in alto pu\u00f2 oscurare i risultati e causare confusione, ma pu\u00f2 funzionare bene con le collezioni di immagini come Artist Rising (Figura 4-21) o quando sono necessarie poche faccette. E’ spesso utile permettere una certa flessibilit\u00e0 nel numero di faccette visualizzate. Come mostrato nella Figura 4-22, le faccette adattive permettono ai controlli di uniformarsi al contenuto nel momento in cui gli utenti si spostano tra le categoria ed individuano un dato all’interno delle collezioni attraverso raffinamenti progressivi. Questo potrebbe essere un motivo per evitare di posizionare le faccette in alto. Sebbene siano meno visibili, le faccette possono funzionare anche quando sono piazzate sulla destra, ipotizzando che appaiano chiaramente come controlli piuttosto che come pubblicit\u00e0 e che non vengano tagliati fuori da browser pi\u00f9 piccoli. Quando avete dubbi, fate affidamento sugli standard de facto (lato sinistro) e sottoponete i vari progetti alle ricerche sull’esperienza utente e ai test di usabilit\u00e0.<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.21 La navigazione a faccette mette i metadati sulla mappa<\/p>\n<\/div>\n

\"Screenshot\"<\/p>\n

Fig. 4.22 Le faccette adattive di Amazon<\/p>\n<\/div>\n

In contrasto con la progettazione, relativamente matura, dello spazio per il desktop Web, il mobile \u00e8 una piattaforma in cui gli standard per la navigazione a faccette devono ancora emergere. Pochi progetti di ricerca come FaThumb<\/a>[3]<\/a><\/sup> hanno esplorato le sfide e le possibilit\u00e0 delle interfacce basate sulle faccette per la ricerca su dispositivi mobili. Ovviamente, i piccoli schermi precludono l’utilizzo dei modelli prestabiliti: non c’\u00e8 spazio sufficiente per presentare le faccette ed i valori insieme ai risultati. Sempre tra i pionieri, Amazon \u00e8 tra le prime ad aver progettato un’applicazione mainstream che aggiunge la navigazione a faccette ad una ricerca su dispositivo mobile. Come mostra la Figura 4.23, \u00e8 caratterizzata da un modello iterativo che richiede pi\u00f9 step di quelli che sarebbero ideali, ma \u00e8 un passo nella direzione giusta. Non appena la ricerca su mobile varcher\u00e0 l’abisso, gli utenti si aspetteranno le caratteristiche e le funzionalit\u00e0 a cui sono abituati su desktop e per primissima cosa avranno un assoluto bisogno di circoscrivere i risultati di una ricerca.<\/p>\n

<\/a>[3]<\/a> Un’interfaccia basata sulle faccette per la ricerca su dispositivi mobile. Disponibile su http:\/\/research.microsoft.com\/apps\/pubs\/default.aspx?id=64303<\/a>.<\/em><\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.23 Navigazione a faccette su Amazon mobile<\/p>\n<\/div>\n

Tra le varie piattaforme, ci sono alcune precisazioni ed alcune questioni che vale la pena rivedere. Innanzitutto, abbiamo usato il termine \u201cnavigazione a faccette\u201d piuttosto liberamente. Le definizioni formali delle faccette possono escludere i campi ed i filtri semplici, ma la discriminazione non offre garanzie nella pratica, dal momento che i filtri operano in maniera indipendente e gli utenti possono aggiungerli o rimuoversli in ordine arbitrario in accordo con l’aggiornamento dei risultati.<\/p>\n

D’altro canto, la distinzione tra la navigazione a faccette e la ricerca parametrica \u00e8 rilevante. Nelle applicazioni di ricerca parametrica, gli utenti specificano i loro parametri di ricerca sin dall’inizio, utilizzando una variet\u00e0 di controlli quali i checkbox, i menu a tendina, e gli slider per costruire quella che \u00e8 a tutti gli effetti una query booleana avanzata. Sfortunatamente, \u00e8 difficile per gli utenti settare diversi parametri tutti in una volta, specialmente dal momento che molte combinazioni produrranno zero risultati.<\/p>\n

Oggi, \u00e8 raro vedere ricerche puramente parametriche, ma molte applicazioni tendono pi\u00f9 a quella parte dello spettro di quello che dovrebbero. Per esempio, Snooth non riesce ad indicare il numero di risultati che vanno bene con una ricerca fintanto che l’utente non ha eseguito una ricerca rifinita. Le widget sono decisamente non profumate e l’interfaccia incoraggia gli utenti a modificare pi\u00f9 parametri prima dell’esecuzione della query. E’ una soluzione difficile per le persone ma facile per l’hardware. In altre parole, \u00e8 un infelice compromesso che sacrifica la risposta immediata per ridurre il carico del server.<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.24 Problemi parametrici su Snooth<\/p>\n<\/div>\n

All’estremo opposto, le applicazioni di ricerca in tempo reale come Volkswagen UK (Figura 4-25) aggiornano dinamicamente i risultati, senza aver un bottone submit o senza fare un refresh della pagina. Ci sono dei reali vantaggi con questo modello dinamico, che permettono un’immediata risposta, una minima interruzione e transizioni eleganti. Ma ci sono anche dei costi. L’applicazione di Volkswagen UK impiega del tempo prima di caricarsi e Kayak deve usare un overlay cospicuo (e in qualche modo problematico) per richiamare l’attenzione sui risultati aggiornati. Le applicazioni per ricerche in tempo reale sono come i veicoli ibridi pericolosamente silenziosi. Quando non c’\u00e8 pi\u00f9 il rumore, capiamo che aveva un suo senso. Le transizioni eleganti possono reintrodurre parte delle interruzioni utili, ma, nei casi in cui sia i risultati sia le faccette cambiano simultaneamente, questo diventa rischioso.<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.25 Risposta immediata sul sito Volkswagen UK<\/p>\n<\/div>\n

\"Screenshot\"<\/p>\n

Fig. 4.26 Ricerca in tempo reale su Kayak<\/p>\n<\/div>\n

Ovviamente, fintanto che la progettazione e la tecnologia si evolveranno di pari passo, risolveremo questi problemi nonostante le nuove sfide in cui ci imbatteremo. I processori diventano pi\u00f9 veloci, le persone no. Quindi, dovremmo gestire in maniera molto attenta le transizioni. Nel frattempo, la navigazione a faccette si adatter\u00e0 sicuramente a qualunque contesto e piattaforma, perch\u00e9 il bisogno di circoscrivere le informazioni esiste all’incrocio tra il comportamento e la funzionalit\u00e0.<\/p>\n

Navigazione a faccette<\/h3>\n
\"Screenshot\"<\/p>\n

Fig. 4.27 Il modello di progettazione a navigazione a faccette<\/p>\n<\/div>\n

La navigazione a faccette \u00e8 un signor modello. Il suo sviluppo impatta su tutti gli altri modelli di ricerca e sull’architettura dell’informazione nel suo insieme. Per semplificare ulteriormente, c’\u00e8 il modello Google ed il modello a navigazione a faccette. Scegliere tra questi due \u00e8 una decisione strategica cruciale. Determinare se la navigazione a faccette sia ragionevole e fattibile \u00e8 uno dei primissimi step nella progettazione. L’infrastruttura per la navigazione a faccette pu\u00f2 rendere possibile una relazione pi\u00f9 stretta tra la ricerca ed il browsing. Pu\u00f2 dare forma alla struttura e alla navigazione dell’intero sito o dell’intera applicazione. Cambia anche il modo in cui pensiamo all’auto-completamento e all’algoritmo di visita ottimale. Offre un framework familiare per gestire le risorse della federated search. Inoltre, il suo potere discriminatorio nel chiarire gli intenti e rifinire i risultati pu\u00f2 controbilanciare la necessit\u00e0 della personalizzazione e della ricerca avanzata. Detto ci\u00f2, la navigazione a faccette non funziona dovunque. Per i principianti, \u00e8 un progetto costoso. Le richieste dei software di ricerca e dei server sono considerevoli. In aggiunta a ci\u00f2, l’infrastruttura dei metadati implica sia un investimento iniziale sia una spesa costante. Per queste ed altre ragioni, un semplice modello di ricerca spesso \u00e8 meglio, ma deve spesso essere affiancato da un sistema di ricerca avanzata.<\/p>\n

\"Screenshot\"<\/p>\n

Fig. 4.28 Ricerca avanzata su Genentech<\/p>\n<\/div>\n<\/div>\n

\n

Ricerca Avanzata<\/h2>\n

Concetto relativo, la ricerca avanzata include tutto ci\u00f2 che non \u00e8 incluso nella ricerca semplice. E’ un modello che molti di noi o amano o odiano. Spesso, la ricerca avanzata \u00e8 un rozzo add-on che viene usato raramente e fornisce una scappatoia agli ingegneri e ai designer. Caratteristiche preziose che sono difficili da integrare nell’interfaccia principale possono essere relegate al ghetto e dimenticate. Inoltre, c’\u00e8 molta confusione riguardo il suo scopo. E’ un assemblatore di query user-friendly per novizi o un potente tool per esperti? Molte interfacce cercano di essere (e falliscono) entrambe le cose. Per esempio, non \u00e8 equo supporre che gli utenti che comprendono cosa significhi una \u201cfrase esatta\u201d sappiano anche usare i punti di domanda per specificare tale ricerca? Il problema principale con Boolean non \u00e8 la sintassi, \u00e8 la logica. E anche il linguaggio semplice mostrato in Figura 4-28 \u00e8 molto improbabile che aiuti i pochi novizi che osano avventurarsi nell’intimidatorio reame della ricerca avanzata.<\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

La navigazione a faccette [faceted navigation, emndr\/em] potrebbe essere l’innovazione riguardante le ricerche pi\u00f9 significativa della decade passata. \u00c9 caratterizzata da una ricerca integrata ed incrementale e da un’esperienza di browsing che permette agli utenti di cominciare con la classica ricerca per parole chiave per poi scorrere una lista di risultati. Inoltre, fornisce una mappa fatta su misura che d\u00e0 un’idea del contenuto e della sua organizzazione, offrendo una variet\u00e0 di utili passi successivi. Tenendo fede ai principi di divulgazione progressiva e costruzione incrementale, lascia che gli utenti formulino l’equivalente di una query Booleana attraverso una serie di piccoli semplici step. Imparate come funziona, perch\u00e9 \u00e8 diventata cos\u00ec onnipresente nell’e-commerce e perch\u00e9 non va bene per tutti i siti.<\/p>\n","protected":false},"author":818,"featured_media":7000575,"comment_status":"open","ping_status":"open","template":"","categories":[247,279,16,9],"tags":[],"coauthors":[294,295],"class_list":["post-60","article","type-article","status-publish","has-post-thumbnail","hentry","category-html","category-interaction-design","category-numero-5-4-maggio-2010","category-usabilita"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/article\/60","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/users\/818"}],"replies":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/comments?post=60"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/media\/7000575"}],"wp:attachment":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/media?parent=60"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/categories?post=60"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/tags?post=60"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/coauthors?post=60"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}