マニュアル キャンセル

Adobe Captivate プロジェクトへの Web オブジェクトの挿入

  1. Captivate ユーザーガイド
  2. Captivate の紹介
    1. Adobe Captivate の新機能
    2. Adobe Captivate の必要システム構成
    3. Adobe Captivate のダウンロード
    4. Adobe Captivate (2019 release) アップデート 5 の新機能
    5. Adobe Captivate (2019 release) アップデート 2 の新機能
    6. Adobe Captivate 11.8.1 リリースノート
    7. Adobe Captivate 11.8 リリースノート
    8. Adobe Captivate リリースノート
    9. Adobe Captivate Draft の必要システム構成とダウンロード手順
    10. Adobe Captivate でのレスポンシブプロジェクトのデザイン
  3. プロジェクトの作成
    1. Adobe Captivate での各種プロジェクトの作成
    2. Adobe Captivate のプロジェクトのサイズをカスタマイズする方法
    3. Adobe Captivate でのレスポンシブプロジェクトのデザイン
    4. バーチャルリアリティ(VR)プロジェクトの作成
    5. Adobe Captivate のレスポンシブテキストを操作する
    6. Adobe Captivate におけるテーマの操作
    7. レスポンシブプロジェクトでビュー固有のプロパティを適用する方法
    8. Adobe Captivate プロジェクトのバックアップファイルを作成する方法
    9. アセットパネル
    10. Captivate での分岐および強制ナビゲーションの作成
    11. ステージ上の画像の置き換え
  4. オブジェクトの追加と管理
    1. Adobe Captivate におけるマルチステートのオブジェクトの使用
    2. オブジェクトエフェクト
    3. Adobe Captivate プロジェクトへの Web オブジェクトの挿入
    4. Adobe Captivate におけるオブジェクトスタイルを操作する
    5. Adobe Captivate でオブジェクトを回転させる方法
    6. ピクセル単位でのオブジェクトのサイズおよび位置の変更
    7. メインオプションツールバーを使用してオブジェクトを管理する方法
    8. スライド内のオブジェクトをマージする方法
    9. ライブラリ内のオブジェクトを管理する方法
    10. Adobe Captivate でオブジェクトをグループ化する方法
    11. 詳細なインタラクションパネルを使用したオブジェクト情報の編集
    12. Adobe Captivate でオブジェクトをコピー、貼り付け、複製する方法
    13. オブジェクトの表示を制御する
    14. Adobe Captivate でオブジェクトの表示順序を変更する方法
    15. オブジェクトへのシャドウの適用
    16. Adobe Captivate でオブジェクトを整列させる方法
    17. Adobe Captivate のオブジェクトにリフレクションを追加する方法
    18. Captivate プロジェクトにアセットをインポートする
  5. スライド
    1. Adobe Captivate プロジェクトにスライドを追加する
    2. Adobe Captivate プロジェクトにおけるスライドの編集
    3. Adobe Captivate プロジェクトのスライドを削除する方法
    4. Adobe Captivate でスライドの順序を変更する方法
    5. Adobe Captivate でスライドプロパティを設定する
    6. Adobe Captivate でスライドメモを音声ファイルに追加および変換する
    7. Adobe Captivate でナレッジチェックスライドを設定する
    8. Adobe Captivate でスライドトランジションを追加する方法
    9. Adobe Captivate でマスタースライドを使用する方法
    10. Adobe Captivate のスライドをロックする方法
    11. Adobe Captivate のプロジェクトでスライドを非表示にする方法とスライドを除外する方法
    12. Adobe Captivate でスライドのグループ化とグループ化の解除を行う方法
  6. タイムラインとグリッド
    1. ルーラーとガイドを使用する
    2. Adobe Captivate でのグリッドを操作する
    3. タイムラインの操作
    4. Adobe Captivate におけるショートカットキー
    5. フィルムストリップの操作
    6. Adobe Captivate のワークスペースをカスタマイズする方法
    7. Adobe Captivate ライブラリの使用方法
    8. Adobe Captivate で「分岐」パネルを使用する方法
  7. クイズを作成
    1. Adobe Captivateプロジェクトに質問スライドを挿入する
    2. Adobe Captivate でのクイズ環境設定の設定
    3. 学習者がすべてのクイズ応答を同時に提出する方法
    4. Adobe Captivate を使った質問スライドの設定方法
    5. Adobe Captivate でランダム質問スライドを使用する
    6. ユーザーがクイズに戻ることができるようにする方法
    7. CSV 形式ファイルから質問を読み込む
    8. GIFT 形式ファイルから質問をインポート
    9. Adobe Captivate 内にプレテストを挿入する方法
  8. オーディオ
    1. Adobe Captivate プロジェクトへの音声の挿入方法
    2. Adobe Captivate で音声をプレビューする方法
    3. Adobe Captivate での音声ファイルの編集方法
    4. Adobe Captivate でオーディオの詳細を表示する
    5. オーディオ録音環境設定の設定とオーディオの録音
    6. Adobe Captivate から音声を書き出す方法
  9. ビデオ
    1. スライドビデオ
    2. Adobe Captivate でイベントビデオを操作する
    3. Adobe Captivate におけるイベントと同期ビデオの違い
  10. インタラクティブなオブジェクト
    1. Adobe Captivate プロジェクトへのインタラクティブボタンの追加
    2. Adobe Captivate でクリックボックスを作成する
    3. Adobe Captivate でテキスト入力ボックスを追加する
    4. ボックスとボタンに音声を追加する方法
    5. Adobe Captivate のボックスとボタンに JavaScript を追加する方法
  11. インタラクション
    1. Adobe Captivate を使用した学習インタラクションの作成
    2. Adobe Captivate でのドラッグ&ドロップインタラクションの作成
    3. Adobe Captivate でウィジェットとインタラクションを設定する方法
    4. ウィジェットで Adobe Captivate の変数を使用する
    5. Adobe Captivate でのウィジェットのプロパティの設定
    6. Adobe Captivate で静的ウィジェット、インタラクティブウィジェット、および質問ウィジェットを作成する方法
    7. Adobe Captivate プロジェクトにウィジェットを追加する方法
  12. 非インタラクティブなオブジェクト
    1. スマートシェイプの作成と編集
    2. Captivate でのテキストキャプションの編集と作成
    3. Captivate での画像およびロールオーバー画像の使用方法
    4. Adobe Captivate でスマートシェイプをカスタマイズする方法
    5. Adobe Captivate でズーム領域を作成する方法
    6. 非インタラクティブなオブジェクトに音声を設定する方法
    7. Adobe Captivate でロールオーバースライドレットを作成する方法
    8. Adobe Captivate でロールオーバーキャプションを作成する方法
    9. Adobe Captivate でマウスのプロパティを変更する
    10. Adobe Captivate でのハイライトボックスの使用
    11. Adobe Captivate でスウォッチを操作する
    12. 非インタラクティブオブジェクトのサイズと位置の変更
    13. Adobe Captivate プロジェクトにアニメーションを追加する
  13. 詳細な編集とプロジェクトのレビュー
    1. Adobe Captivate のプロジェクトをリンクする方法
    2. コンテンツの読み込み、書き出し、削除
    3. スキン
    4. Adobe Captivate でアクセシブルプロジェクトを作成する
    5. Adobe Captivate で目次を作成する
    6. Adobe Captivate プロジェクトのサイズを変更する
    7. プロジェクトとその環境設定
    8. Adobe Captivate でプロジェクトをプレビューする方法
  14. 変数および高度なアクション
    1. Adobe Captivate の変数
    2. Adobe Captivate でユーザー定義変数を作成する方法
    3. Adobe Captivate の高度なアクション
    4. Adobe Captivate プロジェクトの共有アクション
    5. ユーザー定義変数を Adobe Captivate で編集または削除する方法
    6. イベントに高度なアクションを割り当てるには
  15. プロジェクトの記録
    1. インタラクティブビデオの作成
    2. Captivate による自動記録と手動記録
    3. Adobe Captivate の録画設定を変更する
    4. Adobe Captivate でのビデオデモンストレーションの記録
    5. Adobe Captivate でソフトウェアシミュレーションを記録する方法
    6. 録音を一時停止する方法
  16. プロジェクトをパブリッシュ
    1. レスポンシブプロジェクトのプレビューとパブリッシュ
    2. Adobe Captivate Prime にプロジェクトを公開する
    3. Adobe Captivate で HTML5 ファイルとしてプロジェクトをパブリッシュする
    4. 実行ファイルとしてのプロジェクトのパブリッシュ
    5. Adobe Captivate で MP4 ファイルとしてプロジェクトをパブリッシュする
    6. Adobe Captivate で公開設定を設定する
    7. Adobe Captivate での Adobe Fonts の使用
    8. 内部サーバーへのクイズ結果の報告
  17. Adobe Captivate と他のアプリケーションとの連携
    1. Captivate での PowerPoint プレゼンテーションの読み込みと編集
    2. Adobe Captivate プロジェクトの学習管理システムへのアップロード
    3. Adobe Captivate の共通 JavaScript インターフェイスについて学習する
    4. Adobe Captivate プロジェクトを Microsoft Word 形式でパブリッシュする方法
    5. Captivate で Adobe Connect を使用する方法
    6. Captivate のプロジェクトを RoboHelp のオンラインヘルプシステムに追加する方法
    7. Adobe Multi-SCORM Packager を使用して複数の SCO をパッケージ化する方法
  18. Adobe Captivate でトラブルシューティングを行う
    1. Adobe Captivate、Adobe FrameMaker、Adobe RoboHelp の最新バージョンにおける既知の問題および制限事項を解決します。
    2. MacOS ビッグ Sur (macOS 11) の Captivate 用初期ビルド (2019 リリース)
    3. デバイスで VR コンテンツが再生されない問題の Hotfix
    4. デバイスでライブプレビュー向けの SSL 設定を行う
    5. macOS Catalina における Captivate (2019 release) のライセンス認証の問題
    6. Captivate のレスポンシブコースが、ブラウザーで自動的に再生されない
    7. Adobe Captivate (2019 release) でのアセットパネルの問題
    8. Adobe Captivate のインストール中にエラー 103 が発生する
    9. Captivate プロジェクトのプレビュー時の問題

 

概要

ネイティブの HTML5 Web オブジェクトをスライドに挿入するには、大きいボタンバーでオブジェクト/ Web をクリックします。プロパティインスペクターの「アドレス」フィールドにオブジェクトの URL を入力すると、オブジェクトコンテナに Web ページが表示されます。

Web オブジェクトの作成

次のように、ツールバーでオブジェクト/Web を選択します。

ツールバーからの Web オブジェクトダイアログの選択
ツールバーからの Web オブジェクトダイアログの選択

Web オブジェクトの URL を「アドレス」フィールドに入力します。また、OAM、pdf、 svg 、zip ファイルを参照するには、「アドレス」フィールドの横にあるフォルダーアイコンをクリックします。

Web オブジェクトの挿入
Web オブジェクトの挿入

次に説明するように、その他のオプションを選択します。

自動読み込み

オブジェクトを自動的に出力に読み込む場合は、このオプションを選択します。デフォルトでは、Web オブジェクトを作成する際にこのオプションは選択されたままになります。編集モードでは、オブジェクトを読み込んだ後、オブジェクトにマウスを移動すると、コンテンツが表示されます。

このオプションを有効にしてもコンテンツが表示されない場合は、このフォーラムのスレッドを参照してください。

Web オブジェクトをスライドに表示するには、次のオプションを選択します。

境界

Web オブジェクトの境界を表示する場合は、このオプションを選択します。

スクロール

Web オブジェクトコンテナにスクロールバーを表示する場合は、この オプション を選択します。

アニメーションを読み込み

Web オブジェクト内のアニメーションを読み込む場合は、このオプションを選択します。

Web オブジェクトを新しいブラウザーウィンドウで表示する場合は、次のオプションを選択します。

デフォルト

デフォルトのブラウザー設定で Web オブジェクトを表示する場合は、この オプション を選択します。

フルスクリーン

Web オブジェクトをフルスクリーンで表示する場合は、この オプション を選択します。

カスタム

定義した幅と高さに収まるように Web オブジェクトを表示する場合は、このオプションを選択します。

pdf ファイル、zip ファイルなど、オブジェクトを挿入する場合は、pdf、zip、または svg の各ファイルを Web サーバーに配置し、ファイルの URL を使用することをお勧めします。

例えば、オブジェクト を Web サーバーに配置して、次のように URL を使用します。

  • pdf:localhost:8012/<filename>.pdf
  • svg :localhost:8012/<filename>.svg

スライドをプレビューすると、オブジェクトが出力に表示されます。

pdf および svg オブジェクトの埋め込み
pdf および svg オブジェクトの埋め込み

YouTube ビデオが読み込まれない

YouTube ウィジェットを挿入した後、パブリッシュしてもビデオが再生されない場合は、ウィジェットを更新してください。

詳しくは、SWF 出力における YouTube ウィジェットの問題を参照してください。

埋め込みコードのサポート

コードを埋め込む」オプションをクリックすると 、 ビデオファイル、 ストリーミング ビデオへのリンクなど、Web オブジェクトを埋め込むことができます。埋め込みコードは、次のように URL 領域に貼り付けることができます。

埋め込みコードのサポート
埋め込みコードのサポート

例えば、次の埋め込みコードを貼り付けると、モバイルビューで埋め込みビデオを表示できます。

<iframe width="560" height="315" src="https://www.youtube.com/embed/_VW-KBt0Sbk" frameborder="0" allowfullscreen></iframe>
注意:

プロジェクトをパブリッシュまたはプレビューした後にエラーメッセージが表示される場合、オブジェクトをフレームに表示できません。詳しくは、このフォーラム投稿を参照してください。

YouTube ビデオのレスポンシブスライドへの埋め込み
YouTube ビデオのレスポンシブスライドへの埋め込み

埋め込んだビデオの高さと幅は、Web オブジェクトコンテナのサイズを調整することで変更できます。ビデオの幅は Web オブジェクトコンテナの幅に従って変更されます。高さは縦横比に従って変更されます。

ビデオは iframe タグを使用せずに埋め込むこともできますが、タグを使用することをお勧めします。オブジェクトと埋め込みタグは、次のように使用できます。

<object data=" https://www.youtube.com/embed/_VW-KBt0Sbk " width="560" height="315"></object>
<embed width="420" height="315" src=" https://www.youtube.com/embed/_VW-KBt0Sbk "></embed>

Adobe Captivate で Web オブジェクトを使用する際の考慮事項

Adobe Captivate では Web オブジェクトと HTML5 アニメーションが(他のシェイプと重ねて表示する場合)常に一番上に表示される

この HTML5 の問題を回避するには、次の操作を実行します。

  1. Captivate インストールフォルダーで、AdobeCaptivate.ini ファイルを開きます。
  2. 次のように、UseWidget7 の値が 1 になるようにファイルを編集します。
    UseWidget7=1
  3. Adobe Captivate を閉じて再起動します。 

Web オブジェクトを一番上または一番下に配置できるようになり、HTML5 で正しく表示されるようになります。 

注意:

この回避策は HTML5 のパブリッシュオプション、静的ページ、静的アニメーション のみに適用できます。

保護されている LMS(https)で Web オブジェクトに埋め込んだ保護されていない(http)ページが起動されないことがある

https で保護されている LMS 環境では、保護されていない(Web オブジェクト内の)http の Web サイトを参照しようとしても起動しません。

http ベースの Captivate プレビューサーバーではコンテンツを正常に起動できます。ただし、https ベースの SCORM クラウドや Captivate Prime の LMS ではコンテンツを起動できません。

クリックジャッキングが使用されている Web サイトが Web オブジェクトでサポートされない

クリックジャッキングは安全性を脅かすため、Captivate では別の Web サイトへのリダイレクトはサポートしません。

注意:

Web サイトによっては別のページやウィンドウで開けない場合があります。サイトが Web オブジェクトでサポートされるかどうかをテストするには 、 iframe を使用して単純な HTML ページを作成し、URL が機能するかどうか確認します。機能する場合は  、 Web オブジェクトでも機能します。

クリックジャッキングについて詳しくは、Wikipedia のクリックジャッキングに関するページを参照してください。

サンプルプロジェクトのダウンロード

Captivate で魅力的な学習コンテンツを作成する方法の詳細については、次のプロジェクトをダウンロードします。

アドビのロゴ

アカウントにログイン