コンテンツ制作ガイド

(1)

1

コンテンツ制作ガイド

株式会社トヨタデジタルクルーズ

for SCORM 1.2

(2)

2 改訂履歴

版数

発行年月日

変更内容

1.0 2011/03/01

初版作成

1.1 2011/04/28

コンテンツ修正時の識別子の取り扱い注意事項について追記。

利用者の想定環境と対応するウィンドウサイズ区分（およびCaptiavteプロジェクトサイズ）に

ついて追記。

1.2 2012/08/08

社名変更に伴う修正

1.3 2014/03/01

サービスロゴ変更に伴う修正

(3)

3 パワーポイントからのSCORMコンテンツ制作

P.6 … パワーポイントからのＳＣＯＲＭコンテンツ制作の流れ

P.7 … ＳＣＯＲＭコンテンツで推奨される構成（章立て・受講の流れ）

P.8-17 … テンプレートファイルの作成方法

P.8 … ①プロジェクトの作成

P.9-14 … ②プロジェクトの環境設定（１）-（６）

P.15 … ③スキンエディターの設定

P.16 … ④マスタースライドの作成

P.17 … ⑤まとめ

P.18-35 … ＳＣＯＲＭコンテンツの作成

P.19 … ①テンプレートファイルの指定

P.20 … ②パワーポイントファイルの取り込み

P.21 … ③取り込んだスライドに音声を追加

P.22 … ④各オブジェクトのタイムライン調整

P.23-27 …

⑤クイズ作成（１）-（５）

P.28 … ⑥クイズ環境設定（マニフェスト）

P.29-32 …

⑦パブリッシュ（単一ＳＣＯ），（複数ＳＣＯ）（Adobe Multi SCO Packager 2）

P.33-34 …

⑧補足（単一ＳＣＯ/複数ＳＣＯの違いについて）

P.35 … ⑨コンテンツ修正時の注意点

P.36-43 … ＳＣＯＲＭコンテンツのD.e-Learning登録前準備

P.37-38 …

①レッスン情報の更新

P.39-41 …

②ＰＤＦ資料の登録方法について

P.42-43 …

③メニュー・目次の変更

P.44-45 … （参考）利用者の想定環境と推奨ウィンドウサイズ設定について

4 注意事項

本書は、D.e-Learningにてコンテンツを動作させるための初期設定や

コンテンツの出力方法のみをまとめた参考資料になります。

そのため、基本的なAdobe Captivate、Adobe Multi SCO Packager 2の

利用方法に関しては明記しておりません。

製品ヘルプ等をご参照の上ご利用いただきますよう予めご了承ください。

また、本書の内容や本書を使用して作成されたコンテンツについて、

弊社は一切の責任を持たず、これらに関するサポートも行いません。

本書に関するご質問も受けかねます。

(5)

5

(6)

6 パワーポイントからのSCORMコンテンツ制作の流れ

弊社eラーニングシステム（D.e-Learning）にて動作可能なSCORMコンテンツをAdobe Captivateを用いて制作するにあたり，

このガイドラインに沿った設定を行ってください。

SCORMコンテンツ制作の流れとしては、次の通りです。

プロジェクトの環境設定

Captivateテンプレート作成

スキンエディターの設定

マスタースライドの作成

Captivateテンプレート完成

PPTファイルの取り込み

SCORMコンテンツ作成

音声追加、タイムライン調整、クイズ作成

パブリッシュ（単一SCO、複数SCO）

SCORMコンテンツ完成

テンプレート読み込み

(7)

7 SCORMコンテンツで推奨される構成（章立て・受講の流れ）

D.e-Learningでは，複数のSCORMコンテンツを章立てして，1つのコンテンツを構成することが出来ます。

代表例として，PowerPointで作成したスライドを学習スライドとして閲覧し，その後，理解度確認テストを行うパターンについて

下図に示します。各章の構成をうまく切り分けることで，完了基準を明確に扱うことが出来ます。（詳細については後述参照）

第１章：学習スライド（閲覧のみ）

受講開始

第２章：理解度確認テスト

受講終了

・・・

完了基準：スライドビューのみ（全てのスライドを閲覧すれば完了）完了基準：クイズ結果のみ（クイズ結果が合格条件を満たしていれば完了）

・・・

Captivateのテンプレート作成については、大きく分けて、この2パターン分を用意しておくと、効率的なコンテンツ制作を行うことが出来ます。

[例]

(8)

8 テンプレートファイルの作成方法 ①プロジェクトの作成

①Adobe Captivate 5 を起動後， [プロジェクトテンプレート] をクリックします。 ②利用者の動作環境により，以下のように推奨されるテンプレートが異なります。設定後，[OK]ボタンをクリックします。（ⅰ） PCの画面解像度XGA（1024 x 768）以上・・・[660 x 495] （ⅱ） PCの画面解像度SXGA（1280 x 1024）以上・・・[808 x 606] ③Adobe Captivate 5 で[プロジェクトテンプレート] が作成されます。

(9)

9 テンプレートファイルの作成方法 ②プロジェクトの環境設定（１）

①メニューより，[編集]→[環境設定] をクリックします。 ②[開始および終了]をクリックします。 ③[プロジェクト開始のオプション：]の[自動再生]に，チェックが入っていますので，チェックを外します。

重要

(10)

10 テンプレートファイルの作成方法 ②プロジェクトの環境設定（２）

①[報告]をクリックします。 ②[このプロジェクトの報告を有効にする]にチェックを入れます。

重要

(11)

11 テンプレートファイルの作成方法 ②プロジェクトの環境設定（３）

重要

報告データを選択：の設定では、1SCOあたりの完了基準を設定します。 p.6にありますように、コンテンツ用途により、推奨される設定内容が異なります。（詳細については次ページをご参照ください。）

学習スライド（閲覧のみ）

理解度確認テスト

完了基準：スライドビューのみ（全てのスライドを閲覧すれば完了）完了基準：クイズ結果のみ（クイズ結果が合格条件を満たしていれば完了）

・・・

(12)

12 テンプレートファイルの作成方法 ②プロジェクトの環境設定（４）

重要

報告データを選択説明クイズ結果のみクイズ結果がカテゴリの[クイズ]→[合格/不合格]で設定された値を満たしていた場合，当該SCO分が完了になります。クイズ結果とスライドビューユーザがスライドを[スライドビューの完了]で設定されたパーセント分閲覧し，かつクイズ結果がカテゴリの[クイズ]→[合格/不合格]で設定された値を満たしていた場合，当該SCO分が完了になります。ユーザアクセスのみユーザが該当コンテンツを開いた際に，当該SCO分が完了になります。スライドビューのみユーザがスライドを[スライドビューの完了]で設定されたパーセント分閲覧した際に，当該SCO分が完了になります。

※テスト用コンテンツ作成時

推奨設定

※ Adobe Acrobat Connect Proは利用出来ません。

※閲覧のみのコンテンツ作成時

推奨設定

(13)

13 テンプレートファイルの作成方法 ②プロジェクトの環境設定（５）

重要

①[LMSカスタマイズ設定…]をクリックします。 ②[再開用データを送信しない]にチェックを入れます。

(14)

14 テンプレートファイルの作成方法 ②プロジェクトの環境設定（６）

重要

このスライドにて，これまで実施した一通りの設定内容について再確認します。 ※コンテンツの用途により設定が異なります。

(15)

15 テンプレートファイルの作成方法 ③スキンエディターの設定

重要

②[再生コントロールを表示]のチェックを外します。コンテンツ下部に表示される再生コントロールは便利な反面，コンテンツ内で自由に操作が可能なため，理解度確認テストのようにクイズを含むコンテンツについては，非表示もしくは，機能制限することを推奨します。再生コントローラを非表示に設定する方法は以下の通りです。 ③[枠線を表示]のチェックを外します。以上で再生コントローラを非表示にすることができます。 ①メニューの[プロジェクト]より[スキンエディター]を選択します。

(16)

16 テンプレートファイルの作成方法 ④マスタースライドの作成

重要

①マスタースライドのタブをクリックします。マスタースライドを作成しておくと，各スライドの情報と組み合わせることにより，効率的なコンテンツ作成が出来ます。マスタースライドクイズ結果画面（マスタースライドなし）クイズ結果画面（マスタースライドあり）マスタースライドを選択

(17)

17 テンプレートファイルの作成方法 ⑤まとめ

重要

学習スライド（閲覧のみ）と理解度確認テストの画面イメージ（推奨設定）は，次の通りとなります。学習スライド（閲覧のみ）理解度確認テスト再生コントロール表示再生コントロール非表示 ※クイズを含むコンテンツを制作する際の基本方針として， [スキップ]・[戻る]など，出題の順序通りに受講させることがあり，不必要なものについては画面上表示させないことが推奨されます。

(18)

18 SCORMコンテンツの作成作業の流れ

弊社eラーニングシステム（D.e-Learning）にて動作可能なSCORMコンテンツをAdobe Captivateを用いて制作するにあたり、

このガイドラインに沿った設定を行ってください。

ここからは、Captivateテンプレートを用いたSCORMコンテンツ作成の流れについて説明します。

プロジェクトの環境設定

Captivateテンプレート作成

スキンエディターの設定

マスタースライドの作成

Captivateテンプレート完成

PPTファイルの取り込み

SCORMコンテンツ作成

音声追加、タイムライン調整、クイズ作成

パブリッシュ（単一SCO、複数SCO）

SCORMコンテンツ完成

テンプレート読み込み

(19)

19 SCORMコンテンツの作成 ①テンプレートファイルの指定

①Adobe Captivate 5 を起動後， [テンプレートから] をクリックします。 ②Captivateのテンプレートファイル[*.cptl]を選択し，[開く]をクリックします。 ③テンプレートファイルが正しく取り込まれ，別のファイル名として作成されていることを確認します。 [名称未設定1.cptx]

(20)

20 SCORMコンテンツの作成 ②パワーポイントファイルの取り込み

①メニューの[挿入]より [PowerPoint スライド]を選択します。 ②テンプレートのどのスライドの後に，パワーポイントのスライドを挿入するかを指定します。 ③パワーポイントのファイルを選択し，[開く]をクリックします。 ④取り込み対象とするスライドには，[含める]にチェックを入れます。スライドの指定が完了しましたら，[OK]ボタンをクリックします。 ⑤変換後，対象スライドが取り込まれていることを確認します。

(21)

21 SCORMコンテンツの作成 ③取り込んだスライドに音声を追加

①スライドのタイムラインを選択し，右クリックします。 [音声]→[読み込み]をクリックします。 ③音声が追加されていることを確認します。 ②音声ファイルを選択し，[開く]を選択します。

(22)

22 SCORMコンテンツの作成 ④各オブジェクトのタイムライン調整

①取り込んだスライドに，ボタンなどオブジェクトを追加する場合，

効果的な演出が出来るよう，タイムラインにて各オブジェクトが有効となるタイミングを調整します。

(23)

23 SCORMコンテンツの作成 ⑤クイズ作成（１）質問形式について

採点のみ対応となります。

D.e-Learningで動作検証済みの質問形式は，以下の通りとさせていただきます。

重要

ランダム質問も対応しています。

※ランダム質問であるため，解答結果CSVの内容も

ランダムに出題された結果であることをご了承ください。

(24)

24 SCORMコンテンツの作成 ⑤クイズ作成（２）画面の表示項目

重要

① ①[クリア][戻る][スキップ]のボタンを選択し，キーボードの[Delete]キーを押下してください。 ②表示される確認ダイアログで[OK]をクリックしてください。 ③[クイズを復習]のボタンを選択し，キーボードの[Delete]キーを押下してください。 ④表示される確認ダイアログで[OK]をクリックしてください。 ②・④ ③ クイズを作成する際には[クリア][戻る][スキップ]ボタンの削除，クイズ結果スライドから[クイズを復習]を削除します。

(25)

25

①[クリア][戻る][スキップ]のチェックが外れた状態となっていることを確認してください。 ②[制限時間]にチェックを入れないで下さい。また、[無制限]にもチェックを入れないでください。 ※無制限にチェックが入っている場合，正解するまでクイズが終了しません。そのため，初回解答結果は全問正解という状態になります。 ③1SCOあたり，複数のクイズがあるコンテンツを作成する場合，必ずインタラクションIDは出題順に[文字列]で昇順となっていることを確認してください。

SCORMコンテンツの作成 ⑤クイズ作成（３）クイズプロパティ

重要

前ページの作業を行うと，クイズプロパティは以下の設定となります。 ① ② ② ③

(26)

26 SCORMコンテンツの作成 ⑤クイズ作成（４）点数

重要

各質問スライドを追加後，点数に関しては，1SCOあたりの点数合計が100点になるように設定してください。

(27)

27 SCORMコンテンツの作成 ⑤クイズ作成（５）質問プール

重要

①メニューの[クイズ]より[質問プールマネージャー] を選択します。 ②[プール1]をダブルクリックし，名称を半角英数字を入力してください。デフォルトの状態[プール1]でパブリッシュを実行すると，コンテンツデータが文字化けしてしまいますので、必ず上記項目には，半角英数字を入力してください。質問プールを使用する際には，以下の点にご注意ください。

(28)

28 SCORMコンテンツの作成 ⑥クイズ環境設定（マニフェスト）

重要

パブリッシュを行う前に，以下の点について確認し，必要あれば修正してください。 ② ③ ④ ①メニューの[クイズ]より[クイズの環境設定] を選択します。 ②[マニフェスト…]をクリックします。 ③識別子に半角英数字を入力します。複数SCOで構成されるコンテンツを作成する場合，他のコンテンツと識別子が重複しないように注意してください。 ※ここで入力した値が，初回/最終解答結果 CSVの日程として出力されます。 ④タイトルを入力します。ここで入力されたタイトルが，D.e-Learningの目次で表示されます。

(29)

29 SCORMコンテンツの作成 ⑦パブリッシュ（単一SCO）

重要

①コンテンツを保存する際には，プロジェクトのタイトルを半角英数字で入力します。 ※プロジェクトのタイトルは必ず半角英数字で入力してください。コンテンツが文字化けします。 ① ② ⑧ ②[音質:]横の青字のリンクをクリックします。 ③[ビットレート]にて，適切なビットレートを設定します。※1 ④[OK]をクリックし，音声設定を閉じます。 ⑤[Flash（SWF）サイズと品質]横の青字のリンクをクリックします。 ⑥[Bmp]，[JPEG]の値に適切な設定を行います。※1 ⑦出力オプションの[Zipファイル]にチェックを入れます。 ⑧[パブリッシュ]をクリックします。 ③ ※1 D.e-Learningではコンテンツアップロード時のzipファイルは，

上限50MB

になります。そのため，ファイルサイズを調整する必要があります。高音質な音声を利用している場合は，③の音声ビットレート設定を変更し，ファイルサイズを調整してください。高画質な画像を利用している場合は，⑥のスライドの画質設定を変更し，ファイルサイズを調整してください。その上で，zipファイル時のファイルサイズが50MB以内になるように設定してください。 ⑤ ⑦ ④ ⑥ ⑦

(30)

30 SCORMコンテンツの作成 ⑦パブリッシュ（複数SCO）

重要

複数SCO対応（章立てされた）コンテンツを作成するには，以下の手順をふむ必要があります。

複数SCOの一括パブリッシュ（ Adobe Multi SCO Packager 2 使用）

単一SCOのコンテンツ作成

※単一SCOのコンテンツ設定に関しては前述の設定をご参照ください。

複数SCOコンテンツ作成開始

複数SCOコンテンツ作成完了

(31)

31 SCORMコンテンツの作成 ⑦パブリッシュ（複数SCO）

重要

①Adobe eLearning Suite2 付属の

Adobe Multi SCO Packager 2を起動します。 ②

③ ③ ④ ②[識別子]に任意の英数字を入力します。 ※識別子は必ず英数字で入力してください。コンテンツが文字化けします。 ③[タイトル]に任意の文字を入力します。この[タイトル]がD.e-Learningの目次の最上部のタイトルになります。 ④[OK]ボタンをクリックしてください。

(32)

32 SCORMコンテンツの作成 ⑦パブリッシュ（複数SCO）

重要

⑤[+]ボタンをクリックします。 ⑥ダイアログから，作成したSCORMコンテンツを複数選択し，[開く]ボタンをクリックします。 ⑦一覧に表示されたコンテンツが希望通りの順番になるよう[ ][ ]にて選択します。 ⑧[ ]ボタンをクリックします。 ⑨[プロジェクトのタイトル]を英数字で入力し，[パブリッシュ]ボタンをクリックします。 ⑩SCORMパッケージが作成されました! というメッセージダイアログが表示されれば複数SCOコンテンツの完成です。 ⑥ ⑨ ⑩ ⑦ ⑤ ⑦

(33)

33 SCORMコンテンツの作成 ⑧補足（単一/複数SCOの違いについて）

重要

単一SCOで構成されているコンテンツの場合は，1SCOが完了になると，D.e-Learningの進度率は 100%になります。また，たとえば4SCOで構成されているコンテンツの場合，1SCOが完了になると，D.e-Learningの進度率は4分の1として 25% ずつ上がります。単一SCOで構成される場合 4SCOで構成される場合

(34)

34 SCORMコンテンツの作成 ⑧補足（単一/複数SCOの違いについて）

重要

複数SCOの場合単一SCOの場合 Adobe Captivate Adobe Multi SCO Packager

単一SCOコンテンツのメニュー複数SCOコンテンツのメニュー

目次のタイトルは単一SCOもしくは複数SCOによって，目次での表示内容の参照元が異なります。以下の該当箇所を確認の上，設定してください。

(35)

35 SCORMコンテンツの作成 ⑨補足（コンテンツ修正時の注意点）

重要

単一SCO・複数SCOのどちらにおいても，コンテンツを修正される際には，修正前コンテンツの識別子（パブリッシュ後）と必ず同じ値となるように設定してください。複数SCOにおける識別子の並び順については変更できます。識別子の値の不整合が生ずると，受講時にシステムエラーが表示され、受講することができなくなります。 ※どうしても識別子を変更する必要がある場合には，別のレッスン（新規レッスン）として取り扱ってください。識別子タイトル SCO_ID1 第１章・・・ SCO_ID2 第２章・・・ SCO_ID3 第３章・・・コンテンツ修正前の識別子識別子タイトル SCO_ID1 第１章・・・ SCO_ID2A 第２章・・・ SCO_ID3 第３章・・・コンテンツ修正後の識別子（誤設定の例）

(36)

36 SCORMコンテンツのD.e-Learning登録前準備

重要

ここまでの手順で作成されたSCORMコンテンツを，D.e-Learning上で動作させるための手順について説明します。

単一SCO/複数SCOで，それぞれ設定内容が異なる点にご注意ください。

また，コンテンツに対してPDF資料などを登録することも可能ですので，ここで合わせて説明します。

レッスン情報の更新（画面サイズ・SCO数の設定）

コンテンツへの資料の登録（学習ガイド・資料室）

メニュー・目次のカスタマイズファイルへの差し替え

D.e-Learning登録前準備開始

D.e-Learning登録前準備完了

コンテンツファイルアップロード

・・・コンテンツへの資料の登録が必要な場合，ご参照ください

(37)

37 SCORMコンテンツのD.e-Learning登録前準備 ①レッスン情報の更新

重要

①D.e-Learningの管理者画面より [レッスン管理]→[レッスン照会]をクリックします。 ① ② ②対象のレッスンを検索し，レッスン名のリンクをクリックします。 ③利用者の動作環境により，以下のように推奨されるウィンドウサイズ区分が異なります。（ⅰ） PCの画面解像度XGA[1024 x 768]以上・・・[800 x 674] （ⅱ） PCの画面解像度SXGA[1280 x 1024]以上・・・[1024 x 768]

(38)

38 SCORMコンテンツのD.e-Learning登録前準備 ①レッスン情報の更新

重要

④ ④対象のレッスンを検索し，日程数のリンクをクリックします。前ページに続いて，日程数の更新も行います。 ⑤ ⑥ ⑤[合計SCO数]に，今回作成するSCORMコンテンツのSCO数の合計値を入力します。 ⑥[設定]ボタンをクリックします。

(39)

39 SCORMコンテンツのD.e-Learning登録前準備 ②PDF資料の登録方法

①D.e-Learningの管理者画面より [レッスン管理]→[レッスン照会]をクリックします。 ① ② ②対象のレッスンを検索し，レッスン名のリンクをクリックします。 ③レッスン更新画面にて，[学習ガイド]と[資料]にチェックを入れ，[更新ボタン]をクリックします。これでレッスンにボタンを表示させることができます。

(40)

40

次に，SCORMコンテンツに学習ガイド・資料室のボタンを設け，PDFファイルを紐付けるには，以下の作業が必要となります。

SCORMコンテンツのD.e-Learning登録前準備 ②PDF資料の登録方法

単一SCOの場合のフォルダ構成（例）複数SCOの場合のフォルダ構成（例）単一SCOデータ学習ガイド資料室 <HTML> <HEAD>

<TITLE>PDF</TITLE> </HEAD> <HTML> <BODY bgcolor="#ffffff"> </BODY> </HTML> PDFファイル名学習ガイド資料室・コンテンツ内に指定のHTML，PDFを配置すること ※ ・D.e-Learningにて，対象レッスンのボタンを表示させる設定をすること ④PDFファイルを用意し，資料室からのリンク先の場合は，data.html（上記HTML参照）また，学習ガイドからのリンク先の場合は， start.html（上記HTML参照）を用意します。また，同一ディレクトリにPDFファイルを配置します。 ⑤コンテンツが左図のフォルダ構成となるように docsフォルダを配置します。 ※弊社イントラネットホームページ（http://www.d-cruise.tns.ne.jp/）内、D.e-Learning サービスサイトからダウンロード頂けます。

(41)

41 SCORMコンテンツのD.e-Learning登録前準備 ②PDF資料の登録方法

⑥正しくパスの先に，前ページの④・⑤で指定したhtmlファイルが設定されていると，画面にPDFファイルを読み込むことができます。

(42)

42 SCORMコンテンツのD.e-Learning登録前準備 ③メニュー・目次の変更

重要

単一SCOの場合のボタン配置（例）複数SCOの場合のボタン配置（例）・・・ 1SCO目・・・ 2SCO目以降・・・最終SCO 目次画面（例） ①D.e-Learningにおいて，レッスン受講時の各画面にて上図例のように表示させるための手順を説明します。まず，パブリッシュ済みの[zip]ファイルを解凍します。

(43)

43 SCORMコンテンツのD.e-Learning登録前準備 ③メニュー・目次の変更

重要

②コンテンツが左図のフォルダ構成になるように弊社指定の_customizeフォルダとimageフォルダ※ を追加します。 ③青枠内のファイルを全て選択した上で，右クリックより[圧縮]→[zip]を選択し，再度zip ファイルに圧縮します。単一SCOの場合のフォルダ構成（例）複数SCOの場合のフォルダ構成（例） Captivateより出力されたSCORMコンテンツ

Adobe Multi SCO Packager 2 より出力されたSCORMコンテンツ

単一SCOデータ ※弊社イントラネットホームページ

（http://www.d-cruise.tns.ne.jp/）内、D.e-Learning サービスサイトからダウンロード頂けます。

(44)

44 （参考）利用者をXGA（1024×768）以上と想定したサイズ設定

（1） actbrainのウインドウサイズ区分について（2） Captivateでの解像度について [ウインドウサイズ区分]にて[800×674]を選択します。 [660px×495px] を設定します。 800px 674px 660px 495px ※実際は+30px （再生バー部分）

表示イメージ（SXGA 1280×1024）

表示イメージ（XGA 1024×768）

重要

(45)

45 重要

（参考）利用者をSXGA（1280×1024）以上と想定したサイズ設定

（1） actbrainのウインドウサイズ区分について（2） Captivateでの解像度について [ウインドウサイズ区分]にて[1024×768]を選択します。 [808px×606px] を設定します。 1024px 768px 808px 606px ※実際は+30px （再生バー部分）

表示イメージ（SXGA 1280×1024）

(46)

46 本マニュアルに関して

本マニュアルはパナソニックインフォメーションシステムズ株式会社の許諾を受け、株式会社トヨタデジタルクルーズが編纂したものです。