Fincs

講座 / 講座概要ページ(受講者ビュー)

講座 / 講座概要ページ(受講者ビュー)

本ページは 2 段構成。上段が biz/CS 向け(ユーザー提示可)、下段(## 🔧 実装詳細 以降)が dev 向け。biz/CS がユーザーへ提示・転用してよいのは上段のみ。

概要

講座のエントリーポイントとなる講座トップ画面。受講者・未受講者・講師が講座 URL にアクセスした時に最初に表示される画面で、タブ切替で各機能(概要・トーク・コンテンツ・受講者一覧)に導線を出す。

主な使い方:

  • 受講者: 入会済みの講座を開いてトーク・コンテンツ・概要を閲覧
  • 未受講者: マーケティング情報(タイトル・説明・サムネイル・講師情報・料金プラン)を見て入会を検討(./join.md へ進む)
  • メイン講師 / サブ講師: 自講座の運営確認、受講者一覧確認(../plan-management/ で管理操作)

タブ構成:

  • 概要: 講座のマーケティング情報・講師情報・料金プラン・受講者数 等(既定タブ)
  • トーク: トークルーム一覧と発言(受講者以上、../talk/
  • コンテンツ: 動画・記事・ライブ等のコンテンツ受講(受講者以上、../contents/
  • 受講者: 入会受講者一覧(メイン講師のみ表示)

URL クエリパラメータでタブを直接指定して開くこともできる(外部リンクからの導線)。受講者・講師の場合のみ、コンテンツ再生の認可情報がブラウザに発行される(未契約者にはコンテンツ本体は配信されない)。

📝 レビュー観点(draft 段階の記述ヒント、完成時に削除):

  • 目的: 講座のエントリーポイント。タブ(概要 / トーク / コンテンツ / 受講者)で各機能へ導線
  • 誰が使うか: 受講者(中身を閲覧)/ 未受講者(マーケティング情報のみ)/ メイン講師・サブ講師(運営)
  • どこで使うか: /plan/{plan_id} 直接アクセス、検索流入、マイ講座一覧からの遷移
  • 隣接機能との関係: 入会フロー(./join.md)/ コンテンツ受講(../contents/)/ トーク(../talk/)/ 講師の運用(../plan-management/edit.md
  • CS 問い合わせで頻発する論点: 「タブが見えない」「受講者一覧が見えない」「未受講で何が見えるか」
  • [本機能特有] タブ可否の権限差分: 受講者一覧タブはメイン講師のみ表示
  • [本機能特有] 動画 / コンテンツ配信の認可: 受講者・講師には CloudFront 署名付き Cookie が発行されコンテンツの再生が許可される
  • [本機能特有] 初期タブ決定: URL パラメータで指定なしの場合は「概要」タブを既定表示

利用シナリオ

シナリオ 1: 受講者が講座にアクセスして概要を確認

入会済みの受講者がマイ講座一覧から講座を選んで講座トップ画面を開く。既定で「概要」タブが表示され、講座のタイトル・説明・最新の活動状況等を確認できる。トーク・コンテンツ・受講者管理画面へはタブ切替で遷移。

シナリオ 2: 未受講者がマーケティング情報を見て入会を検討

未受講者が SNS 等のリンクから講座 URL に直接アクセス。「概要」タブのマーケティング情報(タイトル・説明・サムネイル・講師情報・料金プラン)が表示される。トーク・コンテンツの中身は未契約のため見られないが、入会フローへの導線(./join.md)から手続きに進める。

シナリオ 3: 講師が自講座を確認

メイン講師が自講座を開くと、概要・トーク・コンテンツに加えて「受講者」タブが表示される。受講者タブで入会者一覧の確認、トーク・コンテンツタブで投稿・受講状況を運営目線で確認できる。

シナリオ 4: 外部リンクからタブ指定で直接アクセス

メールやチャットの共有リンクから「講座のトークを直接開きたい」「料金プランを見せたい」等の用途で URL クエリにタブ指定をつけて開く導線。指定されたタブが既定で開かれる。

よくある失敗ケース

  • 存在しない講座 ID へのアクセス: 該当講座が見つからない扱いで、トップ画面は表示されない
  • 非公開講座への未受講者アクセス: 非公開講座は未受講者には見えない
  • 契約期限切れ後のコンテンツ再生: 契約期限が切れると再生に必要な認可情報が無効化され、コンテンツの本体配信が止まる

📝 レビュー観点:

  • 受講者が初めて講座にアクセスする例(既定タブ)
  • 未受講者が講座を発見してマーケティング情報を見る例
  • メイン講師が運営として自講座を確認する例(受講者一覧タブ表示)
  • URL クエリでタブ指定して直接アクセスする例(外部リンクからの導線)

権限別仕様

権限定義は ../user-roles.md 参照。用語は ../terminology.md

講座権限軸

操作 未受講者 受講者 サブ講師 メイン講師
講座トップ画面の表示 ○(公開講座のみ)
概要タブ閲覧
トークタブ閲覧 ×(要確認)
コンテンツタブ閲覧 ×(要確認)
受講者一覧タブ表示 × × ×
動画 / コンテンツの再生 ×
非公開講座へのアクセス × ○(契約者)

横断軸

操作 運営アドミン テストユーザー 投稿禁止
講座トップ画面の閲覧 (運営アドミン経由) (通常と同じ) (通常と同じ)

📝 レビュー観点:

  • 未受講者がトーク / コンテンツタブを開いた時の挙動(タブ自体は見える / 中身は弾かれる、要確認)
  • 非公開講座(isPrivate=true)への未受講者アクセス時の挙動
  • 「契約終了済みユーザー」(過去入会者)の閲覧可否
  • サブ講師が受講者一覧タブを見られるかは要確認(実装上は isOwner フラグでメイン講師のみ)

機能詳細(ふるまい)

タブ構成と初期表示

  • 概要 / トーク / コンテンツ / 受講者 の 4 タブで構成
  • URL でタブ指定がない場合は「概要」が既定で開く
  • URL クエリパラメータでタブを直接指定可能(外部リンクからの導線)
  • 「受講者」タブはメイン講師のみ表示

タブを切り替えても、一度開いたタブは内部的にマウントされ続けるため、再訪時に高速で表示が戻る。

講座詳細情報

「概要」タブで表示される項目:

  • 講座タイトル・説明文
  • サムネイル画像
  • 講師情報(メイン講師のプロフィール、サブ講師の有無)
  • 料金プラン一覧(複数の料金プランがある場合は選択肢として表示、./contract.md
  • 受講者数(運用設定で非表示にすることも可能)
  • お知らせ・最新コンテンツ等

未受講者にはマーケティング目的の項目が中心、受講者・講師には運用に必要な情報が追加で見える形になる。

コンテンツ閲覧の認可

動画・画像等のコンテンツの本体配信は、講座の入会者・講師にのみ認可される:

  • 講座トップ画面を開いた時点で認可情報がブラウザに発行される(受講者・講師の場合のみ)
  • 認可情報には有効期限があり、長時間放置するとコンテンツ再生不可になる(再アクセスで再発行)
  • 未受講者には認可情報が発行されないため、コンテンツ本体は配信されない

表示差分

主な表示差分:

項目 未受講者 受講者 サブ講師 メイン講師
概要タブ
トーク・コンテンツ閲覧 ×
受講者一覧タブ × × ×
入会導線(料金プラン選択 → 入会) (契約変更で表示) × ×
講師の運用導線(../plan-management/ × ×

📝 レビュー観点:

  • 入力 → 処理 → 出力: タブ切替時の遅延マウント挙動(初回マウント後はマウントしっぱなし)
  • エッジケース: 非公開講座のアクセス時、契約期限切れユーザー、未確定入会者
  • エラー表示: 存在しない講座 ID へのアクセス時の挙動
  • [本機能特有] OGP / SEO: タブごとに OGP 情報が切り替わる(外部 SNS シェア時の表示)
  • [本機能特有] noindex: 非公開講座は検索エンジンからインデックスされない

admin 操作

できる操作

運営アドミンによる講座管理操作の主なもの(詳細は ../admin/plan.md):

  • 講座作成・更新・削除: 運営アドミンが新規講座の登録、既存講座の編集、削除を実行
  • 公開状態の変更: 講座を公開 / 非公開に切り替え
  • メイン講師の講座への紐付け: どのユーザーがメイン講師となるかを設定
  • 講座設定(運用ポリシー)の変更: 受講者数の表示有無、動画ダウンロード可否、領収書通知メール 等の各種設定
  • 入会条件の登録: 入会フローで提示する規約・契約書面類の登録

実装されていない / 不明

  • 不適切講座の強制非公開化(緊急対応用 UI): 公開状態切替で代替可能だが、強制非公開専用の経路は別途要検討

📝 レビュー観点:

  • 運営アドミンによる講座強制非公開化の手段
  • 不適切講座への対応経路

品質 / 約束事項

  • 応答性: 講座詳細取得は同期処理で即時表示。未読バッジは非同期で追従取得(表示はブロックしない)
  • 信頼性: コンテンツ再生に必要な認可情報は契約・講師判定に基づき発行。未受講者にはコンテンツ本体は配信されない。タブ遷移は一度開いたタブの内部状態を保持してパフォーマンスを最適化
  • 制限値: 表示項目の制限値は ../plan-management/edit.md 参照
  • データ保持: 講座本体は論理削除運用。退会者の入会履歴は契約データとして保持(./contract.md

📝 レビュー観点:

  • 応答性: タブ切替の体感速度、未読バッジ反映タイミング
  • [本機能特有] CloudFront 署名 Cookie: 受講者・講師にのみ発行、有効期限後はコンテンツ再生不可
  • 検索エンジン上での講座露出(SEO)

変更履歴(リリースノート候補)

v2.29.2: 2026-05-01(PSD 初版)

  • [PSD 追加] 本ドキュメント初版作成。v2.29.2 時点の実装を起こし。機能追加・変更は含まない

📝 レビュー観点:

  • 過去の主要変更(受講者一覧タブ追加 / OGP 切替対応 等)があれば追記候補

関連ドキュメント


このページの内容を AI に質問しますか?
関連 spec を自動抽出して ChatGPT / Claude などに渡せます。
AI Prompt で開く →