Usare Discourse per creare un blog o una piattaforma di scorrimento stile Reddit, X o Facebook

Sto aprendo questo argomento per documentare il mio percorso mentre cerco di trasformare Discourse in una piattaforma più visiva e a scorrimento continuo, qualcosa di più simile all’esperienza di navigazione offerta da Reddit, X e Facebook.

Userò questo argomento per condividere ciò che provo, cosa funziona, cosa non funziona, i componenti che sto utilizzando e i problemi che incontro. Spero che possa essere utile anche a chiunque altro sia interessato a utilizzare Discourse per qualcosa che vada oltre il layout tradizionale di un forum.

Il punto di partenza per questo progetto è stata la regola 90-9-1.

Suggerisce che nella maggior parte dei social media, dei blog, ecc.:

  • 90% degli utenti naviga principalmente e consuma contenuti.

  • 9% reagisce occasionalmente, mette “mi piace”, condivide o commenta.

  • 1% crea attivamente la maggior parte dei contenuti.

Ovviamente le percentuali esatte variano da comunità a comunità, ma il principio rimane rilevante: la maggior parte dei visitatori sono lettori, non contributor.

Discourse è eccellente nel servire il 9% e l’1%. È costruito attorno a discussioni, risposte e partecipazione attiva. Tuttavia, voglio renderlo altrettanto attraente per il gruppo molto più numeroso che desidera semplicemente aprire il sito e sfogliare contenuti freschi e interessanti.

Cosa sto cercando di costruire

Voglio utilizzare Discourse per creare un feed più visivo e continuo (doom scrolling) simile a quello di Reddit, X o Facebook.

L’esperienza ideale dovrebbe essere qualcosa del genere:

  • Aprire la homepage e vedere immediatamente un feed di argomenti rilevanti.

  • Scorrere continuamente da un argomento all’altro.

  • Anteprima il contenuto dell’argomento senza aprire una pagina separata.

  • Vedere immagini, video ed estratti direttamente nel feed.

  • Mettere “mi piace”, fare un segnaposto o rispondere quando qualcosa cattura la tua attenzione.

  • Spostare automaticamente i contenuti già sfogliati.

  • Tornare in seguito e vedere argomenti nuovi o non ancora visti, anziché la stessa homepage ogni volta.

  • Personalizzare gradualmente il feed utilizzando categorie, tag e argomenti con cui l’utente interagisce.

Alcuni potrebbero chiamarlo “doom scrolling”, ma è anche semplicemente il modo in cui un numero enorme di persone consuma ora i contenuti online. Potrebbero leggere decine di post senza mai commentare, ma sono comunque utenti genuini che generano visualizzazioni, condividono link e potenzialmente tornano ogni giorno.

Perché costruirlo con Discourse?

Discourse fornisce già la maggior parte delle parti difficili:

  • Account e profili utente

  • Categorie e tag

  • Mi piace, segnaposto e notifiche

  • Livelli di fiducia e moderazione

  • Creazione di argomenti e risposte

  • Tracciamento di letti e non letti

  • Argomenti suggeriti e correlati

  • Un sistema maturo di plugin e componenti tematici

Ciò che sembra mancare è un feed progettato principalmente per la scoperta e il consumo passivo. (ovviamente Discourse non è stato progettato per essere così)

Dove sono finora

  1. Ho iniziato con l’ottima tema Redditish di @awesomerobot, che ho dovuto forare in modo da poter modificare vari aspetti, come la rimozione della barra laterale personalizzata. Ho anche modificato molto il CSS per progettarla come volevamo.
  2. Abilitare le Viste Anidrate era un must, poiché copre lo stile necessario per questo tipo di sito.
  3. Ho creato e aggiunto un menu scorrevole in stile YouTube che mostra tutte le categorie e i link personalizzati. Ho usato Link di navigazione superiore personalizzati per personalizzare e aggiungere link.
  4. Una modale di anteprima degli argomenti era un must e ho iniziato a progettarla, ma la leggenda @Don ha costruito una versione migliore che può essere trovata qui
  5. Una barra laterale destra statica e in cache ovunque era un must, quindi ho iniziato con i blocchi della barra laterale destra e poi ho creato un componente tematico per mostrarlo negli argomenti, ecc.
  6. Usando i link di intestazione personalizzati (icone), ho aggiunto un “Crea un post” nell’intestazione per rendere il contenitore più pulito.
  7. Immagini nei post impostate al centro con uno sfondo sfocato per renderle più ordinate (simile a Reddit)
  8. Impostare gli estratti degli argomenti a 150 caratteri e mostrarli tra il titolo e l’immagine sulle schede degli argomenti era un must (simile a Facebook e X)

I prossimi passi sarebbero un feed dedicato che potrebbe:

  1. Iniziare con contenuti recenti di un periodo definito, come i precedenti 14 giorni.

  2. Dare priorità agli argomenti delle categorie e dei tag seguiti dall’utente.

  3. Mescolare argomenti popolari o in tendenza per la scoperta.

  4. Registrare quando un argomento è stato effettivamente visualizzato o sfogliato.

  5. Ridurre la priorità degli argomenti già visualizzati senza nasconderli permanentemente.

  6. Consentire reazioni e risposte dirette dal feed.

Questo non sostituirebbe gli elenchi di argomenti tradizionali o le discussioni. Sarebbe un modo aggiuntivo per scoprire e consumare lo stesso contenuto di Discourse.

Segui il percorso

Continuerò ad aggiornare questo argomento man mano che il progetto si sviluppa, inclusi i componenti che testo, le modifiche che effettuo e gli ostacoli che incontro.

Sarei anche interessato a sentire da chiunque abbia tentato qualcosa di simile, in particolare riguardo a:

  • Se i dati esistenti di tracciamento della lettura potrebbero supportare questo.

  • Come un feed potrebbe funzionare per utenti anonimi e appena registrati.

  • Quanto personalizzazione potrebbe essere raggiunta senza introdurre un algoritmo di raccomandazione complesso.

  • Se le anteprime continue degli argomenti creerebbero problemi di prestazioni significativi.

L’obiettivo è riconoscere che il 90% silenzioso è una parte importante di una comunità e dare loro un’esperienza progettata attorno a come utilizzano effettivamente Internet.

Il sito di test che userò per questo progetto è

https://www.m8wtf.com/

11 Mi Piace

Mi piace molto questa idea, ci sto seguendo. Ho dato un’occhiata molto veloce alla tua demo ed è fantastica! Ci tornerò quando avrò un po’ di tempo libero.

4 Mi Piace

Abbiamo provato a utilizzare la pagina Unified New di Discourse come homepage poiché sembrava offrire esattamente il feed che cercavamo. Con un plugin che rimuove i post da /new quando l’utente scorre oltre la viewport. (@Don è riuscito a farlo funzionare)

La confusione è nata dal fatto che ho sempre testato Discourse utilizzando un account già esistente e connesso, quindi la mia pagina Unified New era sempre piena di post. Non avevo compreso appieno come funzionasse per gli utenti completamente nuovi.

Dopo aver creato un nuovo account di test, abbiamo scoperto che Unified New era completamente vuota, poiché i topic più vecchi non venivano considerati “nuovi” per quell’utente. Ciò significa che al momento non può fornire il feed della homepage popolato che avevamo pianificato.

Wow, grazie mille per il commento e per il feedback positivo. So che non è proprio il tuo genere e che va contro l’idea originale di Discourse.

@don sta lavorando a un nuovo plugin che introduce un nuovo sistema di stile /feed e una homepage. Questo mostra agli utenti i nuovi post effettivi, per poi rimuoverli se un utente scorre oltre (utilizzando il viewport). Se tutti i post sono stati visualizzati, viene reindirizzato a /latest. Questo è un lavoro in corso.

1 Mi Piace

Grazie enormi a @don e al suo nuovo plugin non ancora rilasciato: il feed ora funziona correttamente, così gli utenti vedono sempre contenuti freschi. Tuttavia, ha mantenuto il comportamento delle risposte invariato: non scompaiono al di fuori della viewport.

Gli utenti nuovi, al momento della registrazione, vedono ora tutti i post degli ultimi 14 giorni, ma questo intervallo può essere modificato nell’impostazione “Intervallo di tempo predefinito della pagina principale”.

2 Mi Piace

La prossima voce all’ordine del giorno è la creazione di un componente/plugin per personalizzare il feed, qualcosa come:

Punteggio del feed =

40% interessi
25% freschezza
15% comportamento precedente
10% popolarità del sito
10% casualità/scoperta

quindi un feed apparirebbe così:

WARDOGS Early Access in uscita giovedì
Nuovo aggiornamento PS5 causa strano bug al controller
Qualcuno costruisce uno scooter elettrico da 70 mph
Netflix conferma i nuovi Inbetweeners
Storia WTF di Glasgow
Storia casuale popolare di Cibo e Bevande

Per un nuovo utente, qualcosa come:

25% Videogiochi
15% TV e Film
15% Notizie WTF
15% Tecnologia
10% Cibo e Bevande
10% Sport
10% Auto e Sensazioni forti

Poi, dopo aver sfogliato 30–50 post, il feed inizia ad adattarsi.

O ho pensato di creare un componente in cui, al momento dell’iscrizione, l’utente sceglie i propri interessi, ad esempio le categorie:

Di cosa ti interessa?

:check_box_with_check: Videogiochi
:check_box_with_check: Notizie WTF
:check_box_with_check: Tecnologia
☐ Politica
:check_box_with_check: TV e Film
☐ Sport
:check_box_with_check: Auto e Sensazioni forti
☐ Cibo e Bevande

Ci vorrà tempo e test

1 Mi Piace

Mi piace che su mobile, facendo clic su un argomento, si apre un foglio con un’anteprima e si può scegliere di approfondire o chiuderlo per continuare a scorrere il feed. Ottimo lavoro!

1 Mi Piace

Dipende dal componente tema di @don :wink: Topic Preview Modal

2 Mi Piace

Qual è l’obiettivo di questo percorso? Un tema, un componente o qualcosa di unificato? Un tema con componenti integrati e così via?

È qualcosa che aspettavo da anni. L’interfaccia di Discourse mi ha sempre impedito di usarlo. È… davvero non… all’altezza di quanto Discourse sia eccezionale di per sé.

Ti auguro buona fortuna nel tuo percorso.

La tua demo sembra fantastica su mobile.

1 Mi Piace

Ci sarà una guida :slight_smile: Caricherò su GitHub tutti i componenti che ho realizzato, insieme ai link a quelli che altri hanno già creato o stanno creando. Mi sembrerebbe sbagliato impacchettarli tutti insieme, dato che altri hanno contribuito in modo significativo.

Esattamente. Il backend è fantastico, ed è proprio per questo che uso Discourse per vedere se riesco a ottenere qualcosa di decente che non sia il solito Discourse.

1 Mi Piace

Ci sono alcuni temi che includono componenti. Potresti prenderli in considerazione. E in generale, forse è meglio usare le icone Lucide?

1 Mi Piace

Sembra davvero ben fatto. C’è un theme-creator per decorare l’Op nei post successivi al post dell’Op.

Ok, guardando un altro argomento con risposte, vedo che forse stai già usando il badge TC Author di Don.

Lavoro molto bello.

2 Mi Piace

No, quello è del CSS personalizzato che usavo prima di installare

1 Mi Piace

Qualcosa come Topic List Previews (TLP)?

Un buon esempio qui: https://www.starzen.space/

Non proprio, più cose di backend che di grafica

1 Mi Piace

Ah, ok, questa affermazione mi ha indirizzato verso una certa direzione e se dovessi valutare TLP rispetto ai tuoi altri requisiti:

  • Aprire la homepage e vedere immediatamente un feed di argomenti pertinenti.

    :white_check_mark:

  • Scorrere continuamente da un argomento all’altro.

    :white_check_mark:

  • Anteprima del contenuto dell’argomento senza aprire una pagina separata.

    :white_check_mark: (anche se potrebbe essere più sofisticato - ho lavorato su un fork di Discourse con una versione molto più sofisticata di questa funzione)

  • Vedere immagini, video ed estratti direttamente nel feed.

    2/3 :slight_smile: (ho lavorato su un fork di Discourse con una versione molto più sofisticata di questa funzione che riproduce video in diretta nell’Elenco Argomenti :+1:)

  • Metti “Mi piace”, segnala i segnalibri o rispondi quando qualcosa cattura la tua attenzione.

    :white_check_mark:

  • Spostare automaticamente fuori dalla vista il contenuto già scorrato in precedenza.

    :white_check_mark:

  • Tornare più tardi e vedere argomenti nuovi o non ancora visti, anziché la stessa homepage ogni volta.

    :white_check_mark:

  • Personalizzare gradualmente il feed utilizzando categorie, tag e argomenti con cui l’utente interagisce.

    :cross_mark: non ancora, ma il back-end è pronto.

tra l’altro, questo è già stato sollevato in passato, ad esempio:

Ora li ho letti tutti, ma nessuno l’ha effettivamente fatto.

1 Mi Piace

Ne conosco almeno uno, ma è a sorgente chiuso.