================================================================================ sLMS 使い方ガイド ================================================================================ 目次 ---- 1. はじめに(システム概要) 2. セットアップ手順 3. 管理者ガイド 4. ユーザー(受講者)ガイド ================================================================================ 1. はじめに(システム概要) ================================================================================ sLMS は Vimeo 動画を使った順番制の学習管理システム(LMS)です。 管理者がコースとレッスンを作成し、ユーザーに受講権限を付与すると、 ユーザーは順番にレッスン動画を視聴して学習を進められます。 主な特徴: - Vimeo 動画による動画配信 - レッスンの順番制ロック(前のレッスン完了で次が解放) - 視聴進捗の自動追跡(早送り・スキップ検出あり) - 課題提出機能(URL 提出方式) - OTP(ワンタイムパスワード)によるログイン対応 - Web ベースの管理パネル テスト用アカウント: メールアドレス: test@example.com パスワード: password123 権限: 管理者 ================================================================================ 2. セットアップ手順 ================================================================================ 動作要件: - PHP 8.0 以上 - SQLite3 拡張(PHP に標準搭載) ── 初回セットアップ ── (1) データベースを初期化する php init_db.php → private/db/app.sqlite にデータベースファイルが作成されます。 (2) サンプルデータを投入する php seed.php → テストユーザー、サンプルコース(3件)、レッスン(5件)、 受講登録(1件)が作成されます。 (3) 開発サーバーを起動する php -S localhost:8080 -t public → ブラウザで http://localhost:8080 にアクセスしてください。 ── CLI ツール ── ・受講権限の付与(コマンドライン): php admin_grant.php <メールアドレス> <コースID> 例: php admin_grant.php user@example.com 1 ※ Web 管理パネルからも同じ操作ができます。 ── メール設定 ── OTP メールは開発時にはファイルに記録されます。 OTP コードは以下のファイルで確認できます: private/db/mail.log 本番環境では private/config.php の MAIL_DRIVER を 'mail' に変更すると PHP の mail() 関数でメール送信されます。 ================================================================================ 3. 管理者ガイド ================================================================================ 管理パネルへのアクセス: URL: http://localhost:8080/admin/ ※ ログイン後、ナビバー右上の「管理パネル」ボタンからもアクセスできます。 ※ 管理者権限のないユーザーがアクセスすると 403 エラーになります。 ── 3.1 ダッシュボード (/admin/) ── 管理パネルのトップページです。以下の情報が表示されます: ・統計カード: 総ユーザー数、総コース数、総受講登録数、総課題提出数 ・最近のユーザー登録(直近5件) ・最近の課題提出(直近5件) ── 3.2 コース管理 (/admin/courses.php) ── コースの作成・編集・削除を行います。 【コースを作成する】 1. ページ上部の「新しいコースを作成」フォームに入力する - タイトル(必須) - 価格(円) - 説明 - 公開する(チェックボックス) 2. 「作成」ボタンをクリックする 【コースを編集する】 1. コース一覧の「編集」リンクをクリックする 2. フォームに既存の値が読み込まれるので修正する 3. 「更新」ボタンをクリックする 【コースを削除する】 1. コース一覧の「削除」ボタンをクリックする 2. 確認ダイアログで「OK」をクリックする ※ レッスンが存在するコースは削除できません。 先にレッスンを削除してからコースを削除してください。 【レッスン数のリンク】 レッスン数の列はリンクになっており、クリックするとそのコースの レッスン管理ページに遷移します。 ── 3.3 レッスン管理 (/admin/lessons.php) ── レッスンの作成・編集・削除を行います。 【コースで絞り込む】 ページ上部のドロップダウンでコースを選択すると、 そのコースのレッスンのみ表示されます。 【レッスンを作成する】 1. フォームに入力する - コース(必須): ドロップダウンから選択 - タイトル(必須) - 順序: レッスンの表示順(1, 2, 3...) - 説明 - Vimeo ID: Vimeo 動画の ID(例: 76979871) - 動画の長さ(秒): 完了判定に使用される値 - 公開する(チェックボックス) 2. 「作成」ボタンをクリックする 【Vimeo ID の確認方法】 Vimeo の動画 URL が https://vimeo.com/76979871 の場合、 76979871 が Vimeo ID です。 【順序について】 レッスンの順序(sort_order)は学習の進行順序を決めます。 順序 1 のレッスンは常にアクセス可能で、 順序 N のレッスンは順序 N-1 のレッスンを完了すると解放されます。 【レッスンを削除する】 削除すると関連する視聴進捗データと課題提出データも削除されます。 ── 3.4 ユーザー管理 (/admin/users.php) ── 登録済みユーザーの一覧表示と管理を行います。 【管理者権限の付与/剥奪】 ・「管理者にする」をクリック → そのユーザーに管理者権限を付与 ・「権限剥奪」をクリック → そのユーザーの管理者権限を解除 ※ 自分自身の管理者権限は変更できません(誤操作防止)。 【ユーザーの削除】 「削除」ボタンをクリックすると、そのユーザーと関連する すべてのデータ(受講登録、視聴進捗、課題提出、OTP)が削除されます。 ※ 自分自身は削除できません。 【受講コース数のリンク】 受講コース数の列はリンクになっており、クリックするとそのユーザーの 受講登録一覧に遷移します。 ── 3.5 受講登録管理 (/admin/enrollments.php) ── ユーザーへのコース受講権限の付与と取消を行います。 (CLI の admin_grant.php と同じ機能の Web 版です) 【受講登録を追加する】 1. ドロップダウンからユーザーとコースを選択する 2. 「登録を追加」ボタンをクリックする ※ 既に登録済みの組み合わせはエラーになります。 【受講登録を取り消す】 一覧の「取消」ボタンをクリックする。 【絞り込み】 ユーザーまたはコースのドロップダウンで一覧を絞り込めます。 ── 3.6 課題提出管理 (/admin/submissions.php) ── ユーザーが提出した課題の確認とステータス変更を行います。 【ステータスの種類】 - 未レビュー (submitted): 提出直後の初期状態 - レビュー済み (reviewed): 確認済みだが判定はまだ - 承認 (approved): 合格 - 却下 (rejected): 不合格(再提出が必要) 【ステータスを変更する】 一覧のステータス列のドロップダウンを変更すると即座に保存されます。 【フィルタータブ】 ページ上部のタブ(すべて / 未レビュー / レビュー済み / 承認 / 却下) で絞り込み表示ができます。各タブには件数が表示されます。 ── 3.7 管理パネルの共通機能 ── ・サイドバー: 左側のサイドバーから全管理ページに移動できます。 現在のページはブランドカラー(紫)でハイライトされます。 ・「サイトに戻る」: サイドバー下部のリンクでユーザー側サイトに戻れます。 ・フラッシュメッセージ: 操作成功/エラー時に画面上部にメッセージが 表示されます(4秒後に自動的に消えます)。 ・削除確認: 削除ボタンをクリックすると確認ダイアログが表示されます。 ================================================================================ 4. ユーザー(受講者)ガイド ================================================================================ ── 4.1 アカウント登録 ── 1. トップページ右上の「新規登録」をクリックする 2. メールアドレス、パスワード(8文字以上)、パスワード確認を入力する 3. 「アカウントを作成」をクリックする → 自動的にログインされ、マイラーニングページに移動します。 ── 4.2 ログイン ── sLMS には 2 つのログイン方法があります。 【パスワードでログイン】 1. ログインページでメールアドレスを入力し「続ける」をクリック 2. パスワードを入力し「ログイン」をクリック 【OTP(ワンタイムパスワード)でログイン】 1. ログインページでメールアドレスを入力し「続ける」をクリック 2. 「コードを使ってログイン(OTP)」をクリック 3. メールに届いた 6 桁のコードを入力する ※ コードの有効期限は 10 分です。 ※ 5 回間違えるとそのコードは無効になります。 ※ 開発環境では private/db/mail.log にコードが記録されます。 ── 4.3 コースを見つける ── ・トップページ: 注目コースが表示されています。 ・コース一覧ページ: ナビバーの「コース一覧」をクリックすると 公開中の全コースが一覧表示されます。 ・コースカードにはタイトル、説明、価格、レッスン数が表示されます。 ── 4.4 コース詳細を見る ── コースカードをクリックするとコース詳細ページに移動します。 以下の情報が確認できます: ・コース概要(レッスン数、総時間など) ・カリキュラム(レッスン一覧) - 各レッスンのタイトルと時間 - ロック状態のアイコン表示 ・受講登録済みの場合は「学習を続ける」ボタンが表示されます。 ※ コースの受講には管理者による受講登録が必要です。 ── 4.5 レッスンを視聴する ── 受講登録済みのコースのレッスンを視聴できます。 【レッスンページの構成】 ・上部: コース名と全体進捗バー ・中央: Vimeo 動画プレイヤー ・動画下部: レッスン概要、進捗バー、課題提出フォーム ・右サイドバー: コース内の全レッスン一覧 【視聴進捗の仕組み】 ・動画を再生すると 10 秒ごとに自動的に進捗が記録されます。 ・ブラウザを閉じても進捗は保存されており、次回は前回の続きから 再生が始まります。 ・進捗バーにパーセンテージが表示されます。 【レッスンの完了条件】 以下の 2 つの条件を両方満たすとレッスンが「完了」になります: - 動画の 90% 以上の位置まで再生した - 動画の総時間の 80% 以上を実際に視聴した ※ 早送りやスキップは実視聴時間に含まれません。 【レッスンの解放(順番制ロック)】 ・コースの最初のレッスンは常にアクセスできます。 ・2 番目以降のレッスンは、直前のレッスンを完了すると解放されます。 ・ロックされたレッスンにアクセスしようとすると、 コース詳細ページにリダイレクトされます。 ・サイドバーのアイコン表示: - チェックマーク(緑): 完了済み - 塗りつぶし丸(紫): 現在視聴中 - 空の丸: 解放済み(未完了) - ロックアイコン: まだ解放されていない ── 4.6 課題を提出する ── レッスンを完了すると、動画下部に「課題提出」フォームが表示されます。 1. 課題の URL を入力する(https://... 形式) 2. 「提出する」ボタンをクリックする → 「提出済み」と表示されます。 ※ 提出後のステータスは管理者が確認・変更します。 ※ レッスン完了前は課題提出フォームは表示されません。 ── 4.7 マイラーニング ── ナビバーの「マイラーニング」をクリックすると、 受講中のコース一覧が表示されます。 【表示される情報】 ・連続学習記録: 毎日学習を続けた日数(ストリーク) ・週間カレンダー: 今週の学習状況 ・受講中コースカード: - コースタイトル - 完了レッスン数 / 全レッスン数 - 進捗バー(パーセンテージ) コースカードをクリックするとコース詳細ページに移動します。 ── 4.8 アカウント設定 ── ナビバー右上のアバターアイコンまたは歯車アイコンをクリックすると アカウント設定ページに移動します。 【パスワードの変更】 1. 現在のパスワードを入力する 2. 新しいパスワードを入力する(8文字以上) 3. 新しいパスワード(確認)を入力する 4. 「パスワードを変更」ボタンをクリックする 【メールアドレス】 現在のメールアドレスが表示されます(変更不可)。 【多要素認証(MFA)】 現在は準備中です(将来的に実装予定)。 ================================================================================ 付録: ファイル構成一覧 ================================================================================ sLMS/ ├── public/ Web公開ディレクトリ │ ├── index.php トップページ │ ├── login.php ログイン │ ├── register.php ユーザー登録 │ ├── otp.php OTP認証 │ ├── logout.php ログアウト │ ├── courses.php コース一覧 │ ├── course.php コース詳細 │ ├── lesson.php レッスン視聴 │ ├── my-learning.php マイラーニング │ ├── settings.php アカウント設定 │ ├── api/ │ │ ├── progress.php 視聴進捗API │ │ ├── submit.php 課題提出API │ │ └── otp-send.php OTP送信API │ ├── admin/ │ │ ├── index.php 管理ダッシュボード │ │ ├── courses.php コース管理 │ │ ├── lessons.php レッスン管理 │ │ ├── users.php ユーザー管理 │ │ ├── enrollments.php 受講登録管理 │ │ └── submissions.php 課題提出管理 │ └── assets/ │ ├── css/style.css カスタムCSS │ └── js/ │ ├── app.js 汎用JS │ ├── vimeo-tracker.js Vimeo進捗追跡 │ └── admin.js 管理画面用JS ├── private/ 非公開ディレクトリ │ ├── config.php 設定定数 │ ├── database.php DB接続・テーブル定義 │ ├── auth.php 認証関数 │ ├── bootstrap.php 共通初期化処理 │ ├── db/ │ │ ├── app.sqlite SQLiteデータベース │ │ └── mail.log OTPメールログ │ └── templates/ │ ├── header.php ヘッダー・ナビゲーション │ ├── footer.php フッター │ ├── admin_header.php 管理画面ヘッダー │ └── admin_footer.php 管理画面フッター ├── init_db.php DB初期化スクリプト ├── seed.php サンプルデータ投入 └── admin_grant.php 受講権限付与CLIツール ================================================================================