sono Claudio e lavoro come UX Lead presso Canonical, editore di Ubuntu. Questo è il mio primo post qui su Meta Discourse, ma tutti noi utilizziamo Discourse per il forum della community dei nostri siti web e prodotti presso Canonical.
Qualche tempo fa abbiamo esplorato come potrebbe apparire Discourse quando è incluso nel dominio principale di un sito web esistente, invece che in un sottodominio (ad esempio, passando da ‘discourse.ubuntu.com’ a ‘ubuntu.com/discourse’).
Utilizzare il sito web di primo livello invece di un sottodominio richiederebbe necessariamente di modificare la navigazione di Discourse, le sue interazioni e l’aspetto generale (look & feel) per essere integrato in modo coerente e fluido. Siamo consapevoli che si tratta di un lavoro di esplorazione che interesserebbe diverse parti dell’UX esistente, ma abbiamo pensato di condividerlo comunque con voi e, eventualmente, discutere se alcune di queste modifiche possano essere interessanti o costituire una proposta valida (forse come modello?) anche per l’upstream.
Dal punto di vista dello stile, utilizza il nostro framework CSS open-source Vanilla e i suoi componenti.
Pubblicherò tutti i visual qui, rispondendo a questa introduzione iniziale.
Fateci sapere cosa ne pensate; saremmo disponibili a discuterne ulteriormente o in modo più dettagliato.
Nella nostra proposta, abbiamo rimosso il menu a hamburger incluso di default in Discourse e utilizzato un componente di navigazione laterale come punto di accesso principale per tutte le pagine. Il motivo è che integrare Discourse nella navigazione esistente del sito richiede coerenza con la struttura attuale del sito. In questo modo, possiamo anche mostrare agli utenti tutte le pagine e gli argomenti disponibili direttamente in un unico componente di navigazione, sempre visibile.
La funzionalità di ricerca è integrata nella navigazione globale del sito e includerebbe anche i risultati di ricerca da Discourse. Poiché ciò potrebbe richiedere modifiche significative sia al front-end che al back-end, il campo di input per la ricerca potrebbe essere spostato all’interno delle pagine di Discourse per funzionare in modo autonomo.
Quando gli utenti accedono, viene visualizzato il pulsante di invito all’azione “Nuovo argomento”, così come la voce “Account” nella navigazione laterale a sinistra.
Invece di esporre tutti insieme “Ultime”, “Nuove”, “Non lette”, “Top”, “Categorie” e “Segnalibri” nella parte superiore della pagina, possiamo collocare le categorie nella navigazione laterale e il resto in un menu a tendina, dove gli utenti possono selezionare la visualizzazione dei contenuti che preferiscono.
Abbiamo riorganizzato la tabella nella visualizzazione di tutti gli argomenti. Le categorie vengono mostrate tramite etichette colorate cliccabili che permettono di accedere direttamente a un argomento specifico. L’immagine del profilo degli utenti e i gruppi di utenti multipli sono visivamente compressi per risparmiare spazio. Risposte, visualizzazioni e attività rimangono visibili.
All’interno di un argomento o categoria, viene visualizzato il pulsante di azione per l’opzione “Segui”. Con un menu a tendina, gli utenti possono decidere il livello di notifiche che desiderano ricevere. La nostra proposta mostra l’etichetta nel menu a tendina in modo che gli utenti possano facilmente comprendere la propria iscrizione a quell’argomento.
Selezionando ‘In alto’ dal menu in alto della vista, gli utenti possono decidere quale parte del tempo visualizzare tramite il menu a tendina ‘tutto il tempo’.
Quando l’utente è connesso, la foto del profilo e le informazioni vengono visualizzate in alto. Nella pagina “Chi siamo”, le pagine secondarie si espandono nella navigazione laterale mentre “Tutti gli argomenti” si contrae. Se l’utente non è connesso, la pagina “Chi siamo” è la stessa, ma non mostra il profilo in alto né “account”.
Gli elementi del menu orizzontale in Discourse sono inclusi nella barra di navigazione laterale; “Riepilogo - Attività - Notifiche - Messaggi - Badge - Preferenze”. Gli elementi del menu delle sottopagine si apriranno sotto quello principale corrispondente, ad esempio: Attività > Tutti, Argomento, Risposte, Bozze, Mi piace, Segnalibri.
Fateci sapere cosa ne pensate; saremmo disponibili a discuterne ulteriormente o in modo più dettagliato.
Le cose vanno bene. Ma il menu laterale sinistro si fonde visivamente con il contenuto principale. Vedi se riesci a separarlo come su Stack Overflow, ad esempio. Forse lo sfondo, l’indentazione, il colore. Ci sono molte opzioni.
Ho notato che da quando abbiamo lavorato su questo, Discourse ha modificato le icone delle notifiche/seguite (ora sono molto più chiare, devo dire), quindi dobbiamo aggiornare di conseguenza questa parte.
Sentiti libero di caricare il tuo tema su Theme Creator!
Mi farebbe piacere esplorarlo e darti un feedback su come si percepisce. Ci sono diverse parti dell’interfaccia utente nascoste che dovresti probabilmente esaminare, come l’interfaccia per la segnalazione e quella per i segnalibri, e così via.
Sembra ottimo! Una cosa che non vedo rappresentata qui sono le notifiche:
Verranno elencate insieme al link “account” nella barra laterale?
Inoltre, presumo che non ci siano piani per utilizzare i tag, dato che non li vedo rappresentati qui… questo era uno dei motivi per cui abbiamo deciso di abbandonare la colonna dedicata alle categorie.
Con la categoria sotto il titolo, siamo in grado di mantenere categorie e tag strettamente associati e allo stesso tempo mantenere la coerenza con il layout del titolo nella parte superiore di ogni pagina dell’argomento (ho anche appena notato che nel tuo design la categoria non viene visualizzata una volta entrati in un argomento, è intenzionale?).
Grazie @sam, daremo un’occhiata alla guida. In effetti, una sorta di prototipo aiuterebbe a evidenziare i problemi e le parti trascurate dell’interfaccia utente attuale.
Grazie per la tua risposta @awesomerobot
Spostando Discourse sotto il dominio principale (non, ad esempio, meta.discourse ma The easiest way to host a Discourse community | Discourse - Civilized Discussion), abbiamo dovuto rimuovere l’immagine dell’utente perché potrebbe entrare in conflitto con quella esistente nel profilo dell’account del sito principale.
Penso che i tag non fossero presenti quando abbiamo esplorato questa soluzione, quindi è qualcosa che dovrà essere incluso in un seguito. Le categorie sotto il titolo sono davvero un ottimo punto.
Grazie a tutti per il vostro feedback, ci aiuterà nel seguito di questi design.
