H5P - リッチコンテンツとアプリケーションの作成・共有
プレゼンテーション、クイズ、インタラクティブ動画、ゲームなどのインタラクティブなHTML5コンテンツタイプをDrupal内で直接作成、共有、再利用できるようにします。
h5p
概要
H5P（HTML5 Package）は、サイト管理者やコンテンツ作成者がリッチでインタラクティブな学習コンテンツを構築できる強力なコンテンツオーサリングフレームワークです。このモジュールはH5PライブラリをDrupal 7と統合し、40種類以上の異なるコンテンツタイプを作成・表示するための完全なソリューションを提供します。
H5Pコンテンツはプログラミング知識不要のビジュアルエディタを使用して作成します。コンテンツタイプには、インタラクティブ動画、コースプレゼンテーション、分岐シナリオ、クイズ、ドラッグ＆ドロップ、穴埋め問題、メモリーゲーム、タイムラインなど多数があります。すべてのコンテンツはモバイルフレンドリーでアクセシブルであり、最新のHTML5技術を使用しています。
このモジュールはH5P Hubをサポートしており、ユーザーはH5P.orgリポジトリから直接コンテンツタイプを閲覧してインストールできます。xAPI（Experience API）をサポートした包括的なユーザートラッキング機能を含み、詳細な分析のためのLearning Record Storeとの統合が可能です。コンテンツは外部サイトに埋め込んだり、再利用のためにダウンロードしたり、H5P対応プラットフォーム間で共有したりできます。
Features
- 40種類以上のコンテンツタイプ（クイズ、プレゼンテーション、動画、ゲームなど）を使用してインタラクティブなHTML5コンテンツを作成
- プログラミング知識不要のビジュアルエディタによるコンテンツ作成
- H5P.orgからコンテンツタイプを閲覧・インストールするためのH5P Hub統合
- ユーザーインタラクションと学習進捗を追跡するためのxAPI（Experience API）サポート
- ダウンロード、埋め込み、H5P Content Hub共有を含むコンテンツ共有機能
- H5Pコンテンツタイプライブラリのインストール、更新、保守のためのライブラリ管理システム
- ライブラリ開発者が再インストールなしで変更をテストできる開発モード
- H5Pコンテンツとユーザースコアのカスタム表示を作成するためのViews統合
- カスタマイズ可能な表示オプション（ダウンロード、埋め込み、著作権ボタン）
- コンテンツタイプの翻訳機能を備えた多言語サポート
Use Cases
インタラクティブなコース教材の作成
H5P Course Presentationを使用して、クイズ、動画、インタラクティブな要素を埋め込んだスライドベースの学習モジュールを構築します。組み込みのxAPIサポートとViews統合を使用して学習者の進捗を追跡し、完了統計を表示します。
評価クイズの作成
H5P Question SetまたはSingle Choice Setコンテンツタイプを使用してクイズを作成します。合格点、リトライオプション、解答表示を設定します。H5Pポイントシステムを使用してユーザースコアを追跡し、Viewsと統合してリーダーボードや進捗レポートを作成します。
インタラクティブ動画学習
H5P Interactive Videoを使用して、動画にクリック可能なホットスポット、質問、ナビゲーションを追加します。学習者は特定のポイントでコンテンツと対話し、理解度確認の質問に答え、選択に基づいて異なるコンテンツに分岐できます。
外部サイトへのコンテンツ埋め込み
H5P設定で埋め込みボタンを有効にして、ユーザーが埋め込みコードをコピーできるようにします。H5Pコンテンツはiframe埋め込みを使用して、外部ウェブサイト、学習管理システム、コンテンツ管理システムに埋め込むことができます。
コンテンツの再利用と共有
ダウンロード機能を有効にして、ユーザーがH5Pコンテンツを.h5pファイルとしてエクスポートできるようにします。これらのファイルは他のH5P対応プラットフォームにアップロードでき、機関やプラットフォーム間でのコンテンツ共有を促進します。
コンテンツタイプの動作カスタマイズ
hook_h5p_semantics_alterを使用して、特定のコンテンツタイプのコンテンツ編集インターフェースを変更します。たとえば、テキストフィールドに追加のHTMLタグを追加したり、hook_h5p_filtered_params_alterを使用して実行時のコンテンツ動作を変更したりできます。
Tips
- コンテンツタイプ開発中は開発モードを有効にして、すべてのライブラリバージョンを表示し、バージョン番号を変更せずにパッチ適用済みライブラリを再インストールできるようにしてください
- Viewsを使用してユーザースコア付きのH5Pコンテンツのカスタムリストを作成し、学習ダッシュボードを構築してください
- hook_h5p_styles_alterを実装して、ライブラリファイルを変更せずにすべてのH5Pコンテンツに一貫したブランディングを適用してください
- cronを設定して、一時的なH5Pファイルを自動的にクリーンアップし、データベースのパフォーマンスを維持してください
- LRSとのxAPI統合を使用して、学習者がコンテンツとどのようにインタラクションしているかの詳細な分析を取得してください
Technical Details
Admin Pages 4
/admin/config/system/h5p
表示オプション、ファイルパス、ライブラリ設定、Hub統合オプションなど、グローバルなH5Pモジュール設定を構成します。
/admin/content/h5p
インストール済みのH5Pライブラリとコンテンツタイプを管理します。ライブラリの表示、アップグレード、削除、制限の設定を行います。
/admin/content/h5p/rebuild
すべてのH5Pコンテンツのキャッシュデータを再構築します。手動でのファイル変更やデータベース修正後に便利です。
/node/add/h5p-content
ビジュアルH5P Editorを使用して新しいH5Pインタラクティブコンテンツを作成します。コンテンツタイプを選択してコンテンツを構成します。
権限 15
Hooks 5
hook_h5p_semantics_alter
ライブラリのセマンティクス定義を変更して、フィールドの追加、ウィジェットの変更、許可されるHTMLタグの修正、特定のライブラリのコンテンツ編集フォームのカスタマイズを行います。
hook_h5p_filtered_params_alter
レンダリング前にH5Pコンテンツパラメータを変更します。クイズコンテキストでリトライボタンを無効にするなど、表示時のコンテンツ動作を変更するのに便利です。
hook_h5p_styles_alter
H5PコンテンツにカスタムCSSスタイルシートを追加します。特定のライブラリまたはすべてのH5Pコンテンツに対してテーマ設定やスタイルの上書きが可能です。
hook_h5p_scripts_alter
H5PコンテンツにカスタムJavaScriptを追加します。特定のライブラリまたはすべてのH5Pコンテンツに対して機能の追加や動作の変更が可能です。
hook_h5p_library_installed
H5Pライブラリがインストールまたは更新されたときにトリガーされます。ライブラリインストール後にカスタムアクションを実行するために使用します。
Troubleshooting 5
H5P Editorサブモジュールが有効になっていることを確認してください。admin/content/h5pでコンテンツタイプライブラリがインストールされていることを確認してください。Hubを使用している場合は、設定でHubの接続を確認してください。新しいライブラリをインストールした後はDrupalのキャッシュをクリアしてください。
filesディレクトリ（sites/default/files/h5p）に適切な書き込み権限があることを確認してください。PHPのアップロード制限（upload_max_filesize、post_max_size）がH5Pパッケージに十分であることを確認してください。
CSS/JS集約キャッシュをクリアしてください。jQueryとjQuery UIが正しく読み込まれていることを確認してください。ブラウザの開発者ツールを使用して、他のモジュールとのJavaScriptの競合をチェックしてください。
特定のライブラリについてadmin/content/h5pの「コンテンツをアップグレード」機能を使用してください。現在編集中のコンテンツがないことを確認してください。特定のアップグレードエラーについてはエラーログを確認してください。
サーバーからのインターネット接続を確認してください。設定でH5P Hubが有効になっていることを確認してください。Hubはh5p.orgへのアウトバウンドHTTPS接続が必要です。
Security Notes 5
- モジュールはXSS攻撃を防ぐためにH5PパッケージのHTMLコンテンツをフィルタリングします。絶対に必要な場合を除き、HTMLフィルタリングを無効にしないでください
- ライブラリにはJavaScriptコードを含めることができるため、「H5Pライブラリの更新」権限は信頼できる管理者のみに制限してください
- 制限付きライブラリ機能を使用して、一般ユーザーが潜在的に危険なコンテンツタイプでコンテンツを作成することを防いでください
- 本番環境にインストールする前に、アップロードされた.h5pファイルを確認してください
- ライブラリホワイトリストはH5Pパッケージに含めることができるファイルタイプを制御します - 慎重に変更してください