Discourseをよりビジュアルで、連続してスクロールできるプラットフォームに変えていくという試みの旅を記録するために、このトピックを始めました。Reddit、X、Facebookが提供する閲覧体験に近づけることを目指しています。
このトピックを通じて、試みること、うまくいったこと、うまくいかなかったこと、使用しているコンポーネント、そして遭遇した問題について共有していきます。また、従来のフォーラムレイアウトを超えた使い方をDiscourseで実現しようとしている方々にも役立つことを願っています。
このプロジェクトの出発点は、90-9-1の法則でした。
これは、ほとんどのソーシャルメディアやブログなどで以下のような傾向があることを示しています。
-
ユーザーの**90%**は主にコンテンツを閲覧・消費しています。
-
**9%**は時々リアクション、いいね、シェア、コメントを行います。
-
**1%**がコンテンツの大部分を能動的に作成しています。
もちろん、コミュニティによって正確な割合は異なりますが、原理は依然として重要です：ほとんどの訪問者は投稿者ではなく、閲覧者です。
Discourseは、9%と1%のユーザーに対応する点で優れています。議論、返信、積極的な参加を軸に構築されているからです。しかし、私は、サイトを開いて興味深い新しいコンテンツを閲覧したいという、はるかに大きなグループの人々にも同じくらい魅力的なプラットフォームにしたいと考えています。
構築しようとしているもの
私はDiscourseを使って、Reddit、X、Facebookのような、よりビジュアルで連続的（ドゥームスクローリング）なフィードを作成したいと考えています。
理想的な体験は、次のようなものです。
-
ホームページを開くと、関連するトピックのフィードがすぐに表示される。
-
トピックから次のトピックへ、連続してスクロールできる。
-
別のページを開かずにトピックの内容をプレビューできる。
-
画像、動画、抜粋をフィード内で直接確認できる。
-
興味を引かれたものにいいね、ブックマーク、返信ができる。
-
スクロールした以前のコンテンツが自動的に画面から消える。
-
後から戻ると、毎回同じホームページではなく、新しい或未読のトピックが表示される。
-
ユーザーが操作するカテゴリ、タグ、トピックを使って、フィードを段階的にパーソナライズできる。
これを「ドゥームスクローリング」と呼ぶ人もいるかもしれませんが、これは単に、現在非常に多くの人がオンラインコンテンツを消費している方法でもあります。彼らはコメントすることなく数十もの投稿を読むかもしれませんが、それでも彼らは本物のユーザーであり、ビュー数を生み、リンクを共有し、毎日戻ってくる可能性があります。
なぜDiscourseで構築するのか？
Discourseには、困難な部分のほとんどがすでに提供されています。
-
ユーザーアカウントとプロフィール
-
カテゴリとタグ
-
いいね、ブックマーク、通知
-
信頼レベルとモデレーション
-
トピック作成と返信
-
既読・未読の追跡
-
おすすめトピックと関連トピック
-
成熟したプラグインとテーマコンポーネントシステム
欠けているように見えるのは、主に発見と受動的な消費を中心に設計されたフィードです。（もちろん、Discourseはそうなるようには設計されていません）
これまでの進捗
- 素晴らしいReddit風テーマ（@awesomerobot氏作）から始めました。カスタムサイドバーの削除など、さまざまな側面を編集できるようにするためにフォークする必要がありました。また、CSSを大幅に編集して、私たちが望むデザインに仕上げました。
- ネストビューの有効化は必須でした。この種のサイトに必要なスタイルをカバーするためです。
- YouTube風のスクロール可能なメニューを作成し、すべてのカテゴリとカスタムリンクを表示するようにしました。リンクのカスタマイズと追加に**カスタムトップナビゲーションリンク**を使用しました。
- トピックプレビューモーダルは必須でした。これを設計し始めましたが、レジェンドの@Don氏がより優れたバージョンを構築してくれました。こちらで見つけることができます
- どこでも静的にキャッシュされた右サイドバーは必須でした。最初は右サイドバーブロックから始め、トピックなどで表示するためのテーマコンポーネントを作成しました。
- カスタムヘッダーリンク（アイコン）を使って、ヘッダーに「投稿を作成」を追加し、コンテナをよりクリーンにしました。
- 投稿の画像は中央に配置し、背景をぼかして整った見た目（Redditに類似）にしました。
- トピックの抜粋を150文字に設定し、トピックカードのタイトルと画像の間に表示することは必須でした（FacebookやXに類似）。
次のステップは、次のような機能を持つ専用のフィードです。
-
定義された期間（例：過去14日間）の最近のコンテンツから始める。
-
ユーザーがフォローしているカテゴリやタグのトピックを優先する。
-
発見のために人気やトレンドのトピックを混ぜる。
-
トピックが実際に閲覧されたか、スクロールで通過されたかの記録を行う。
-
閲覧済みのトピックの優先度を下げつつ、完全に非表示にはしない。
-
フィードから直接リアクションや返信を許可する。
これは従来のトピックリストや議論を置き換えるものではありません。同じDiscourseのコンテンツを発見・消費するための追加の方法となるものです。
旅をフォローする
プロジェクトが進むにつれて、このトピックを更新し続けます。テストするコンポーネント、行う変更、そして遭遇する障害を含みます。
また、同様の試みをされた方々からの意見も聞きたいです。特に以下について。
-
既存の既読追跡データがこれをサポートできるか。
-
アニメイトユーザーや新規登録ユーザーに対して、フィードがどのように機能するか。
-
複雑な推薦アルゴリズムを導入せずに、どの程度のパーソナライズが可能か。
-
連続したトピックプレビューが重大なパフォーマンス問題を引き起こすか。
目標は、沈黙の90%がコミュニティの重要な一部であることを認識し、彼らが実際にインターネットを使っている方法に合わせて設計された体験を提供することです。
このプロジェクトで使用するテストサイトは以下です。
https://www.m8wtf.com/
「いいね！」 11
HAWK
(Hawk)
7
これは本当に良いと思います。フォローしています。デモを少しだけ見てみましたが、素晴らしいですね！時間があるときにまた確認してみます。
「いいね！」 4
Discourse の統合 Newページをホームページとして使用することを試みました。これは、まさに私たちが望んでいたフィードを提供しているように見えたためです。Discourse の統合 New ページをホームページとして使用できますか。ユーザーがビューポートをスクロールして過ぎたときに /new から投稿を削除するプラグインを使用しました。（ @Don がこれを動作させました）
混乱が生じたのは、私が Discourse をテストする際に常に確立されたログイン済みアカウントを使用していたためです。そのため、私の統合 New ページには常に多くの投稿が表示されていました。まったく新しいユーザーにとって、このページがどのように動作するのかを完全に理解していませんでした。
新しいテストアカウントを作成したところ、統合 New が完全に空であることが判明しました。これは、古いトピックがそのユーザーにとって「新しい」とはみなされないためです。つまり、現在では、私たちが計画していたような充実したホームページのフィードを提供することはできません。
わあ、コメントと前向きなフィードバックをくれてありがとう。これがあなたの好みに合わないし、Discourseの本来の用途にも反していることはわかっています。
@don は、新しい /feed スタイルのシステムとホームページを導入する新しいプラグインを開発中です。これにより、ユーザーには実際の新しい投稿が表示され、ユーザーがビューポート内でスクロールして投稿を過ぎると、それらは削除されます。すべての投稿が確認されると、/latest にリダイレクトされます。これは進行中の作業です。
「いいね！」 1
@don と、彼のまだリリースされていない新しいプラグインのおかげで、フィードが正常に動作するようになりました。これにより、ユーザーは常に新しいコンテンツを確認できるようになりました。返信の動作は以前と同じで、ビューポート外に出ても消えません。
新規ユーザーは、アカウント登録後に直近14日間のすべての投稿が表示されるようになりますが、これはトップページのデフォルト期間設定で調整できます。
「いいね！」 2
次の議題は、フィードをパーソナライズするためのコンポーネント/プラグインの作成です。例えば、以下のようなスコアリング方式を想定しています。
フィードスコア =
40% 興味
25% 新しさ
15% 過去の行動履歴
10% サイト内での人気度
10% ランダム性/発見性
これにより、フィードは以下のような見た目になります。
WARDOGS のアーリーアクセスが木曜日に開始
PS5 の新ファームウェアでコントローラーに奇妙なバグが発生
誰かが時速70マイル（約112km/h）の電動キックボードを制作
Netflix が『Inbetweeners』の新作を正式発表
グラスゴーの WTF ニュース
ランダムに選ばれた人気「Food & Drink」記事
新規ユーザーの場合、例えば以下のような初期設定となります。
25% ゲーム
15% TV & 映画
15% WTF ニュース
15% テック
10% Food & Drink
10% スポーツ
10% Wheels & Thrills
その後、30〜50件の投稿をスクロールした時点で、フィードが適応し始めます。
あるいは、サインアップ時に興味（カテゴリ）を選択してもらうコンポーネントを作ることも考えています。
あなたの興味は？
ゲーム
WTF ニュース
テック
☐ 政治
TV & 映画
☐ スポーツ
Wheels & Thrills
☐ Food & Drink
これには時間とテストが必要です
「いいね！」 1
モバイル版では、トピックをタップするとシート形式でそのトピックのプレビューが表示され、さらに詳しく見るか、閉じてフィードに戻るかを選択できるのが気に入っています。いい機能ですね！
「いいね！」 1
これは @don のテーマコンポーネントによるものです 
Topic Preview Modal
「いいね！」 2
Jacobsen
(Jacob)
15
この旅のゴールは何ですか？テーマ、コンポーネント、あるいは何か統一されたものですか？コンポーネントなどがバンドルされたテーマですか？
これは、私が何年も待ち望んでいたようなものです。DiscourseのUXは、これまでいつも私を遠ざけてきました。Discourse自体がどれほど素晴らしいかとは裏腹に、本当に……そうなんです。
あなたの旅に幸運を祈ります。
デモはモバイルでも非常に良く見えます。
「いいね！」 1
ガイドが用意されます 
自分が作成したコンポーネントをすべてGitHubにアップロードし、他の人がすでに作成した（または作成中の）コンポーネントへのリンクも掲載します。他の人たちが大きく貢献しているため、それをまとめて配布するのは気が引けます。
まさにその通りです。バックボーンは素晴らしいので、Discourseを使ってみて、通常のDiscourseとは異なる、それなりの品質のものを達成できるかどうか試してみようと思ったわけです。
「いいね！」 1
Jacobsen
(Jacob)
17
いくつかのテーマではコンポーネントがバンドルされています。それを考慮に入れると良いかもしれません。また、普遍的にlucideアイコンを使うのはどうでしょうか？
「いいね！」 1
Heliosurge
(Dan DeMontmorency)
18
とてもよくできている。
投稿者の投稿後に、その投稿を装飾するための theme-creator がある。
返信のある別のトピックを見てみると、DonさんのTC Authorバッジをすでに使っているようだ。
素晴らしい仕事だ。
「いいね！」 2
いや、それはインストールする前に私が使っていたカスタムCSSです。
「いいね！」 1
なるほど、この発言に導かれて、TLP を他の要件で評価すると以下のようになります：
-
ホームページを開くと、関連するトピックのフィードがすぐに表示される。
-
トピックから次のトピックへ連続してスクロールできる。
-
別のページを開かずにトピックの内容をプレビューできる。
（もう少し洗練されていると良いですね。私はこれのより洗練されたバージョンを持つ Discourse フォークの開発に関わったことがあります）
-
画像、動画、抜粋をフィード内で直接確認できる。
2/3 （私はこれのより洗練されたバージョンを持つ Discourse フォークの開発に関わったことがあり、トピックリストでライブ動画を再生できます 
）
-
何か興味を引かれたら、いいね、ブックマーク、返信ができる。
-
以前スクロールしたコンテンツを自動的に片付ける。
-
後で戻ってきたとき、同じホームページではなく、新しいトピックや未読のトピックが表示される。
-
ユーザーが操作するカテゴリ、タグ、トピックを使用してフィードを段階的にパーソナライズする。
まだ未対応ですが、バックエンドでは対応しています。
ところで、これ以前にも話題に上がっています。例えば：
少なくとも1つは知っていますが、それはクローズドソースです。
