マニュアル キャンセル

Adobe Captivate での SVG の操作

  1. Captivate ユーザーガイド
  2. Captivate の紹介
    1. Adobe Captivate の新機能
    2. Adobe Captivate の必要システム構成
    3. Adobe Captivate アップデート
      1. Adobe Captivate(12.4 アップデート)リリースノート
      2. Adobe Captivate(12.3 アップデート)リリースノート
      3. Adobe Captivate(12.2 アップデート)リリースノート
      4. Adobe Captivate(12.1 アップデート)リリースノート
    4. Adobe Captivate のダウンロード
    5. よくある質問
  3. スライドを追加
    1. Adobe Captivate のスライドナビゲーター
    2. 会話スライドの追加
    3. Adobe Captivate プロジェクトへのキャラクターの追加
    4. スライド上の背景画像を編集
    5. コンテンツブロックとコンポーネントに余白を追加
    6. 長いスクロールプロジェクトの作成
  4. テキストブロックを追加
    1. プロジェクトにテキストを追加
  5. メディアブロックを追加
    1. プロジェクトに画像を追加
    2. プロジェクトにビデオを追加
    3. 引用を追加
    4. プロジェクトに SVG を追加
  6. インタラクティブなコンポーネント
    1. ボタンの追加
    2. 入力フィールドを追加
    3. ラジオボタングループを追加
    4. ドロップダウンの追加
    5. チェックボックスを追加
  7. ウィジェット
    1. カードを追加
    2. タブを追加
    3. 証明書の追加
    4. カルーセルの追加
    5. ホットスポットの追加
    6. ドラッグ&ドロップを追加
    7. タイムラインを追加
    8. クリックして表示を追加
  8. クイズを作成
    1. 多肢選択問題を追加
    2. 正誤形式の質問を追加
    3. 列を一致させる質問を追加
    4. 短い答えの問題を追加
    5. 順序問題を追加
    6. 質問プールとランダム質問スライドを追加
    7. 質問を CSV 形式で読み込む
  9. プロジェクトに音声を追加
    1. 音声を追加
  10. インタラクション
    1. プロジェクトにインタラクションを追加
    2. オーバーレイを使用したインタラクティブビデオの作成
    3. スライドレベルのインタラクションの作成
    4. オブジェクトレベルのインタラクションの作成
  11. アニメーション
    1. プロジェクトにアニメーションを追加
  12. アクセシビリティ
    1. プロジェクトのアクセシビリティを高める
  13. タイムラインのカスタマイズ
    1. Adobe Captivate のタイムラインパネル
  14. 目次および再生バーのカスタマイズ
    1. Adobe Captivate の目次
  15. プロジェクトプロパティを編集
    1. Adobe Captivate の変数
    2. 環境設定
    3. プロジェクト寸法
    4. テーマ
  16. シミュレーションプロジェクトの作成
    1. シミュレーション
  17. プロジェクトのプレビュー
    1. プレビュー
  18. レビュー用にプロジェクトを共有する
    1. 「レビュー用に共有」
  19. プロジェクトのパブリッシュ
    1. プロジェクトをパブリッシュする
  20. Adobe Captivate でプロジェクトをアップグレードする
    1. プロジェクトを最新バージョンにアップグレードする

Adobe Captivate で SVG をプロジェクトに挿入する方法について説明します。

注意:

Adobe Captivate では、テキスト、画像、ボタンなどのコンポーネントを含むテキストや画像ブロックなどのコンテンツブロックを導入しています。 このビデオを再生して、コンテンツブロックとコンポーネントについてご覧ください。

SVG は、画質を損なうことなく拡大および縮小できるベクター画像形式で、アニメーションに対応しています。 Adobe Captivate では、イラスト、アイコン、図やその他のビジュアル要素をプロジェクトに追加するなどの目的で SVG を使用できます。

SVG コンテンツブロックを追加

左側のツールバーで、メディアブロックを追加/SVG を選択します。

SVG コンテンツブロックのプロパティを変更

SVG コンテンツブロックを選択すると、ブロックレベルのプロパティを使用できるようになります。整列と間隔、SVG の置き換え、デザインオプション、コンポーネント、外観などのセクションで使用できるプロパティを変更できます。

  1. ビジュアルプロパティパネルのコンテンツ幅スライダーと横の余白は、「整列と間隔」セクションにリンクされています。スライダーを左側から動かすと左余白の値が変更され、右から動かすと右余白の値が変更されます。 左右の横の余白の値を変更すると、「コンテンツ幅」スライダーに変更がまったく同じように反映されます。

    選択済みコンテンツブロックの上側または下側に余白を追加する場合は、縦の余白の値を変更することで、上の余白と下の余白の値を入力します。

    「高さを自動調整」チェックボックスをオンにすると、SVG コンテンツブロックの高さがスライドに合わせて調整されます。

  2. 「アイコンの数」スライダーを動かして、SVG の数を増減します。 SVG は 4 つまで追加できます。

  3. フォルダーアイコンをクリックして、SVG アイコンを置き換えます。 任意のフォルダーをクリックし、アセットまたはコンピューターから SVG を選択します。

  4. デザインのオプションを選択します。デザインオプションには、SVG コンテンツブロックに適用できるクリアなデザイン要素を備えた事前設定済みレイアウトが表示されます。

    詳細については、「Adobe Captivate のデザインオプション」を参照してください。

  5. 「コンポーネント」セクションでは、次の項目を変更できます。

    • アイコン:このオプションは無効のままです。

    「拡大縮小」スライダーを動かして、縦横比を変えずに SVG のサイズを変更します。 利用可能な幅に SVG を合わせるために拡大または縮小されます。

    • タイトル:SVG のタイトルを追加または削除します。
    • キャプション:SVG のキャプションを追加または削除します。
    • 本文:SVG の本文のテキストを追加または削除します。
    • カード:カードを SVG の周囲に追加するか、その周囲から削除します。
    注意:

    コンポーネントセクションでコンポーネントを整列できます。 コンポーネントにカーソルを合わせ、オプション(左揃え、中央揃え、右揃え)を選択します。

  6. 「外観」セクションの「背景」タブでは、コンテンツブロックレベルで色の設定を変更できます。背景色と境界線を追加し、境界線にシャドウを適用します。単色または、線状 / 放射状のグラデーションを選択するか、画像を背景として追加します。

  7. 「カード」を有効にしている場合は、カードのプロパティ(余白など)を変更することや、半径の値を変更してカードの角を丸めることが可能です。

    「カード」タブで、背景色、境界線、またはシャドウも追加できます。

SVG カードのプロパティを変更

Adobe Captivate では SVG カードを選択して、テキスト、キャプション、カード、外観などのプロパティを変更できます。

  1. コンテンツブロックの SVG カードを選択します。

  2. 「コンポーネント」セクションでは、次の項目を変更できます。

    • アイコン:SVG アイコンを追加または削除します。 「拡大縮小」スライダーを動かして、縦横比を変えずに SVG アイコンのサイズを変更します。 利用可能な幅に SVG を合わせるために拡大または縮小されます。
    • タイトル:カード上の SVG のタイトルを追加または削除します。
    • キャプション:カードの SVG キャプションを追加または削除します。
    • 本文:カードの SVG 本文のテキストを追加または削除します。
    • カード:カードを SVG の周囲に追加するか、その周囲から削除します。
    注意:

    コンポーネントセクションでコンポーネントを整列できます。 コンポーネントにカーソルを合わせ、オプション(左揃え、中央揃え、右揃え)を選択します。

  3. 「カード」を有効にしている場合は、カードのプロパティ(余白など)を変更することや、半径の値を変更してカードの角を丸めることが可能です。

    「カード」タブで、背景色、境界線、またはシャドウも追加できます。

SVG ブロック内のテキストを変更

SVG ブロック内の任意のテキスト(タイトルやキャプションなど)を選択し、ビジュアルプロパティパネルでそのプロパティを変更します。

詳細については、「Adobe Captivate でのテキストの操作」を参照してください。

デフォルトの SVG アイコンを置換

Adobe Captivate を使用すると、SVG アイコンを置き換えて外観を変更できます。

  1. コンテンツブロックの SVG カードを選択します。

  2. デフォルトの SVG アイコンを置き換えた後、その SVG アイコンを選択します。 次に、「アセット」を選択してから、アセットまたはコンピューターから SVG を選択します。

    SVG を選択
    SVG を選択

  3. 「アイコンを置換」をクリックします。

SVG の外観を変更

  1. SVG を選択します。

  2. 「ステート」セクションで「追加」をクリックして、ステートフライアウトを起動します。SVG のカスタムステートを追加します。

    詳細については、「Adobe Captivate のステート」を参照してください。

  3. 「アイコン」セクションでフォルダーアイコンを選択して、アセットまたはコンピューターから SVG を置き換えます。

  4. 「アイコンを反転」セクションで、SVG を水平方向または垂直方向に反転します。

  5. 「外観」セクションで「不透明度」スライダーを動かして、SVG の透明度を増減します。

  6. SVG パスを選択し、「単色」ピッカーから塗りつぶし色を適用して色を変更します。

  7. 「バウンディングボックスでのクリックを有効化」チェックボックスをオンにして、実行時のバウンディングボックス内の SVG と空白部のクリックを可能にします。

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX 2025

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト