動画によって質問と回答をするアプリを書いてみました。SCORM 対応で Moodle の中に置けます(上図)。このアプリはカメラとマイクの制御に WebRTC 技術を利用しています。
カメラやマイクを制御できるブラウザが限られます。例をあげると,iOS と Edge で直接カメラが利用できません。その場合事前に撮影した動画を upload します。
iOSの場合はファイル選択ボタンを押した際に,今から撮影するか既に撮影した動画をアップするか選べます。これは WebRTC を利用するより使いやすいです。
上図はアプリを開いたときの初期画面です。左側に投稿された動画がツリー表示されています。フォルダー(スレッド)を作成して投稿を内容ごとに分けることも可能です。ツリーをクリックすると,その動画が右側のエリアで再生されます。この画面は先生用のもので,左側の上部に,ツリーを編集する「Edit Tree」ボタンや,投稿を締め切る「Open」「Close」のチェックがあります。「Edit Tree」ボタンを押したときの画面を下記にあげます。
それぞれの動画にチェックが入っているのですが,これをはずすと動画は表示されなくなります。データが消去されるわけではありません。再びチェックを入れると表示されます。「Update」を押して編集内容を確定します。
上図は「File Upload」ボタンを押したときの画面です。カメラとマイクを使った録画が動作しないときは,この機能で動画をアップしてください。iOS の場合ファイル選択のボタン押した際に,下図にあるように動画の撮影が可能です。
動画のアップが成功すると”success”とアラート表示があります。アラートを消すと,最初の画面に戻って,今投稿した動画が再生されます(一部静止するブラウザもあるようです)。動画は,この段階ではまだ投稿されていません。サーバーにアップされて,サイズやコーデックの変換が終了したところです。次に「Contribute」タブをクリックします(下図)。
先ほど,投稿した動画が,小さな枠で再生されています。ここに表示されている動画が投稿対象の動画です。とくにスレッドを分けないのであれば「default」のままで,新しくスレッドを作るのであれば記入して,既にあるスレッドに投稿するのであれば,該当のツリーをクリックすると欄にそのスレッド名が記入されます。「submit」を押して投稿します。投稿するとツリーに現れます。「Cancel」を押して最初の画面に戻ります(下図)。新しく現れたツリーの枝をクリックすると動画が再生されます。
続いて,動画を撮影して投稿します。「Take a video」をクリックします。
「Start Recording」ボタンを押して録画を開始します。録画を止めるときは「Stop Recording」ボタンを押します(同じボタンが切り替わります)。「Upload」ボタンを押すとサーバーに動画が送られて変換されます。変換終了後は(上手くいけば),”success”とアラートが表示されます。アラートを消すと,最初の画面に戻って,撮影した動画が再生されます。ファイルをアップするときと同じですが,まだ動画が投稿されたわけではありません。「Contribute」タブに切り替えます。
ちいさな枠にセットされた動画が変わっています(上図)。スレッドを選んで投稿します。録画においては音量がとれない場合が多くて,ヘッドセットを用いた方が録画しやすいです。次に,このコンテンツの作り方を説明します。
上図のサイト(https://kanaike.susi.oita-u.ac.jp/QA/)を表示します。このサイトはとくにブラウザを選びません。利用するには登録が必要なサイトです。ユーザー名とパスワードを入力してログインすると,上図のように自分のユーザー名が「Teacher ID」の欄に記入されます。「New Alias」は 先の「Teacher ID」と Moodle 等の LMS でのユーザー名が異なるときに入力します。これは誰に先生の権限をもたせるか決める際に利用します。欄の下に現在登録されている Alias が表示されていて,上図では friend という別名をもっていることが分かります。「Server」は動画を変換し保存するサーバーです。これはそのまま変更無しで,変更するのは「Title」と「Time Limit」です。動画を投稿する際に,送信できるファイルの大きさの最大値は 200 MB です。制限時間を超える長さのファイルを送っても制限時間でカットされます。短い分にはそのままの長さとなります。「Authoring」ボタンを押すと,コンテンツが作成されそのリンクが表示されます(下図)。
コンテンツ(SCORMファイル)へのリンクをクリックしてダウンロードします。このファイルが SCORM 規格の ZIP ファイルです。これを Moodle に配置します。
動画の一括ダウンロード機能を付けました。上図,左下のボタン「Download All Data」を利用します。クリックするとボタンの右側にリンクが現れます。
リンクをクリックして,ZIPファイルをダウンロードし,ダウンロードしたファイルを展開します。
上図が展開した所ですが,投稿のスレッドがフォルダーとなって,その中にスレッドの動画が入っています。default はスレッドに属していなかった動画のフォルダーです。windows で日本語のフォルダー名が化けるかもしれません。その場合はこの記事を参考にしてください。index.html はビューワー用のHTMLファイルです。index.html をクリックして(ダブルクリックして)ブラウザで開きます。
上図が,ビューワーの画面です。Moodle での表示よりも大きめのサイズで表示されますが,このサイズ(横640 px)が本当の動画のサイズです。チェックボックスはとくに意味がありません。もともと Moodle で表示されていたかどうかを示しているだけです。