Spesso, l’ostacolo più grande per avviare una community è “renderla tua”.
Vuoi che il tuo font, il tuo stile corrispondano al tuo brand.
In questo post vorrei illustrare cosa si può ottenere in modo piuttosto semplice utilizzando:
- Discourse MCP - GitHub - discourse/discourse-mcp: MCP client for Discourse sites · GitHub
- Una prova Pro o Business di Discourse
- Un abbonamento a Open AI Codex
Ho scelto Codex perché il recentemente rilasciato GPT-6 Astra è un artista visivo incredibilmente talentuoso. Kimi K3 e Fable sono anch’essi piuttosto forti in questo ambito, ma per questa demo sto usando Astra.
Passo 1 - Genera la chiave API
Vai a: your.site/admin/api/keys/new
Genera una chiave API globale.
Nota sulla sicurezza: conserva questa chiave in un luogo sicuro e valuta la possibilità di revocarla una volta completato il lavoro, poiché fornisce un accesso illimitato al sito.
Passo 2 - Aggiungi Discourse MCP
In questo tutorial sto usando codex:
modifica: ~/.codex/config.toml
[mcp_servers.discourse]
command = "npx"
args = [
"-y",
"@discourse/mcp@latest",
"--toolsets",
"all",
"--allow-writes",
"--site",
"https://figment123.discourse.group",
"--auth_pairs",
'[{"site":"YOUR_SITE","api_key":"YOUR_API_KEY","api_username":"system"}]',
]
(nota: Codex non ti consente di scegliere quali MCP abilitare o disabilitare; tutto ciò che è presente nella configurazione verrà abilitato. Puoi impostare enabled = false per disabilitare temporaneamente un MCP)
Una nota sugli strumenti: il Discourse MCP supporta oltre 140 strumenti e questa configurazione li rende tutti disponibili. I moderni ambienti di esecuzione come Claude e Codex gestiscono senza problemi questa quantità, tuttavia molti ambienti potrebbero avere difficoltà con un numero di strumenti così elevato — ad esempio, Grok build richiederà un filtraggio.
Una volta aggiunto il Discourse MCP, assicurati di verificare che il tuo agente possa accedervi:
Passo 3 - Fornisci al tuo agente gli strumenti di cui ha bisogno per svolgere il lavoro
Un agente avrà prestazioni significativamente migliori se dispone di:
- Occhi, la capacità di vedere il proprio lavoro. (playwright MCP, computer use, ecc.)
- Contesto, il Discourse MCP aiuta, ma lo fa anche il codice sorgente di Discourse
- Generazione di immagini - nel caso in cui servano asset, ecc.
L’app ChatGPT ha un browser integrato, assicurati che lo utilizzi. Assicurati di clonare il codice base discourse/discourse e di avviare il tuo agente dalla directory di Discourse.
Nessuno di questi elementi è obbligatorio, ma averli porterà a risultati significativamente migliori.
Passo 4 - Fornisci al tuo agente intelligenza e un brief chiaro
In questo caso, dato che desidero vedere risultati molto buoni, ho optato per GPT-6 Astra XHIGH.
Successivamente ho scritto un breve brief con la mia IA su cosa desiderassi (un tema per una community in stile New Yorker)
Brief scritto dall'IA
Costruisci The Salon, un tema Discourse raffinato che dimostri quanto radicalmente un cliente possa trasformare l’identità di Discourse. Il riferimento creativo è The New Yorker: un’istituzione editoriale i cui lettori partecipano alla conversazione. Crea un’identità originale, non una replica: nessun logo preso in prestito o caratteri tipografici proprietari non autorizzati. Usa avorio caldo (#F7F4ED), inchiostro quasi nero (#20201E), un rosso editoriale sobrio (#B52B32), linee sottili, ampi spazi bianchi, titoli serif espressivi, testo del corpo serif leggibile e metadati sans-serif compatti. Le illustrazioni monocromatiche dovrebbero aggiungere spirito e carattere. Hai la libertà creativa di reperire, scaricare o generare qualsiasi asset necessario per la demo — font, illustrazioni, fotografia, avatar e icone — utilizzando materiale con licenza appropriata e mantenendo l’attribuzione dove richiesto. Evita card SaaS generiche, pergamene finte e disordine decorativo. Punta a una rivista letteraria contemporanea con una community vivace al suo interno, non a un forum standard con colori diversi.
Sei esplicitamente autorizzato a preparare l’istanza demo con le categorie, gli argomenti, le risposte, i profili di contributori fittizi e i contenuti di supporto necessari per rendere l’esperienza coinvolgente. Preserva i contenuti reali esistenti e mantieni l’attività fittizia chiaramente identificabile come dati di demo. Crea cinque redazioni —The Commons, Arts & Letters, City Life, Science & Ideas, Table Talk—con descrizioni e illustrazioni distintive. Costruisci un forte intestazione THE SALON, una discussione principale curata, titoli secondari e una sezione delle conversazioni più recenti. Inserisci discussioni thoughtful e varie come “Quando è diventato un side hustle ogni hobby?” e “Cosa cambierebbe davvero la tua opinione?”, con post di apertura convincenti, disaccordi sostanziali, risposte brevi, citazioni e immagini ben scelte. Popola abbastanza contenuti da dimostrare densità, scorrimento e navigazione; non usare riempitivi ripetitivi o lasciare schermate importanti vuote. Ogni titolo deve aprire un argomento reale e gli stati di attività, conteggio delle risposte e non letti devono rimanere visibili. Porta l’identità attraverso elenchi di categorie, pagine degli argomenti, ricerca e compositore: i post di apertura dovrebbero sembrare saggi bellissimi impaginati, mentre le risposte devono rimanere conversazioni compatte e utilizzabili. La versione mobile dovrebbe diventare un’esperienza a colonna singola tranquilla e la modalità oscura dovrebbe sembrare altrettanto intenzionale.
Ispeziona la versione di Discourse di destinazione e le API dei temi supportate prima di scegliere i dettagli di implementazione. Preferisci un tema manutenibile e componenti del tema focalizzati; evita patch al core, plugin non necessari, manipolazioni DOM fragili e funzionalità inventate. Rendi la curatela editoriale esplicita e configurabile. Lavora in autonomia su decisioni di design, asset e staging reversibili invece di chiedere approvazione per ogni dettaglio; stabilisci il linguaggio visivo con una homepage rappresentativa e una pagina degli argomenti popolata, poi completa le superfici di supporto. Consegna un tema installabile, i componenti richiesti, una configurazione dei contenuti demo riproducibile, la provenienza degli asset e istruzioni di installazione concise. Verifica il risultato in un’istanza Discourse reale su desktop e mobile, inclusa la navigazione da tastiera, il contrasto, gli stati non letti, la ricerca, la citazione e la composizione. Cattura la stessa community preparata prima e dopo l’applicazione del tema in modo che la trasformazione sia inconfutabile. Lo standard è una dimostrazione pronta per il cliente — non un mockup, non solo una bella homepage, ma una community coerente e funzionante con un senso del luogo completamente diverso.
- consulta il codice sorgente di Discourse se necessario
- https://figment123.discourse.group/ è un sito demo, puoi farci quello che vuoi, guarda i risultati man mano che procedi, abilita il tema
- crea argomenti se necessario
Passo 5 - Un aspetto fantastico!
Un’ora e dieci minuti dopo, Astra Xhigh ha finito.
Un tema ispirato a New Yorker delizioso.
Il tema non è perfetto, ha casi limite; consiglierei un Passo 6 di affinamento, in cui incolli le aree in cui il design è fuori posto e l’agente le corregge. Ma come punto di partenza è assolutamente incredibile che possiamo farlo oggi. Non era possibile un anno fa.
Esempio di affinamento in tempo reale: