マニュアル キャンセル

Adobe Captivate プロジェクトへのボタンコンポーネントの追加

Adobe Captivate プロジェクトでボタンを追加および設定する方法について説明します。

注意:

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

新しくなった Adobe Captivate のボタンは、学習者のクリックにより、プロジェクト内のさまざまなアクション、ビヘイビアーまたはナビゲーションをトリガーできる、インタラクティブな要素です。 ボタンにより、ユーザーエンゲージメントを強化し、インタラクションを提供し、コースの資料を通じて学習者をガイドできます。  

ボタンのデザインでは、スタイルと色を適用してボタンの外観をカスタマイズしたり、ボタンにアクションを追加したりできます。

ボタンコンテンツブロックを追加

左側のツールバーのインタラクティブコンポーネントを追加/ボタンを選択して、ボタンコンテンツブロックを追加します。

ボタンの追加
ボタンの追加

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

Adobe Captivate では、ボタンコンテンツブロックを追加して、その外観、色などを変更できます。

  1. ビジュアルプロパティパネルで、整列および間隔セクションを展開します。

    コンテンツ幅スライダーと横の余白は、「整列と間隔」セクションにリンクされています。スライダーを左側から動かすと左余白の値が変更され、右から動かすと右余白の値が変更されます。 左右の横の余白の値を変更すると、同じ変更がコンテンツ幅スライダーに反映されます。

    選択したコンテンツブロックの上側または下側に余白を追加する場合は、縦の余白の値を変更して、上の余白と下の余白の値を入力します。 Adobe Captivate のコンテンツブロック内の余白
    に関する詳細をご覧ください。

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

    このチェックボックスをオンにすると、スライドの高さに合わせてコンテンツブロックが調整されます。 コンテンツは中央に配置され、余白が上下に追加されます。 コンテンツブロックの高さがスライドの高さより低く、コンテンツをスライドに合わせて調整したい場合は、チェックボックスをオンにしてください。

    複数のコンテンツブロックを使用している場合(例えば、コンテンツブロックが 2 つあり、コンテンツブロックの合計の高さがスライドの高さより低い場合)、コンテンツブロックのチェックボックスをオンにすると、コンテンツブロック間でスペースが分割されます。 

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

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

  3. 「コンポーネント」セクションのコンテンツブロックに表示するボタンの数を選択します。スライダーを動かしてボタンをさらに追加します。ボタンコンポーネントを追加して複数のボタンを追加する場合、均一なレイアウトで水平にボタンを配置できます。

    ボタンコンポーネント内にはボタンを 10 個まで追加できます。 これは、「目次および再生バー」を無効にし、カスタムナビゲーションボタンまたはダウンロードボタンを追加する際に、カスタム再生バーを作成するのに役立ちます。 以下に複数のボタンの例を示します。

     

    これは、ボタンコンポーネント内にボタンを 10 個まで追加する方法を示す画像です

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

  5. 「カード」を選択した場合は、「カード」セクションで、カードのいずれかの角または四隅に角丸の半径を追加できます。また、背景色の追加やカードへの境界線の追加、カードの境界線へのシャドウの適用などができます。

    これは、ボタンコンポーネントのカードプロパティを変更する方法を示す画像です
    カードプロパティを変更する

ボタンの外観を変更する

ボタンの外観を変更し、クリックまたはマウスポインターを置いたときの動作を決定します。

  1. コンテンツブロック内のボタンを選択します。

  2. 右ツールバーのビジュアルプロパティパネルで、不透明度スライダーを動かして、ボタンの透明度を増減します。

  3. 任意のデザインオプションを選択します。デザインオプションは、ボタンに適用する、よりクリーンなデザイン要素を備えた事前設定されたレイアウトを表示します。

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

  4. 「ステート」セクションで「表示」をクリックして、ステートフライアウトを起動します。ボタンの標準仕様のステート(ホバー、閲覧済み、選択済み、無効)を構成します。 無効になっているステートがある場合は、そのステートを右クリックして「有効化」を選択します。

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

  5. 「外観」セクションで、「シェイプ」タブを選択して、背景に色を追加し、境界線を追加して、ボタンにシャドウを追加します。 境界線を適用するときに、いずれかのキャップの(「バット」「ラウンド」「突起」)を選択します。

    シェイプ

  6. 同様に、「テキスト」タブで、フォントファミリー、色、その他のプロパティを変更します。

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

  7. 「アイコン」タブで、アイコントグルを有効にします。

    ボタンのラベルを変更したり、ラベルの横にアイコンを追加したりできます。 フォルダーアイコンを選択し、アセットまたはコンピューターからアイコンを変更します。

  8. 「単色」チェックボックスを選択し、アイコンの色を追加します。アイコンに境界線を追加するには、「境界線」を選択して境界線を適用します。境界線の太さを変更し、境界線の先端のキャップ(「バット」「ラウンド」「突起」)を指定します。

  9. アイコンのサイズを「小」「中」、または「大」から選択します。次に、ボタンのアイコンの位置を選択します。 次のいずれかを選択します。

    • 左揃え
    • 上揃え
    • 右揃え
    • 下揃え
  10. ボタンに対するアイコンのオフセットを選択します。 「デフォルト」「広い」、または「狭い」を選択します。オフセットでは、アイコンとボタンの端または境界線との間にスペースを追加します。

  11. 「アイコンを反転」セクションで、「水平反転」または「垂直反転」を選択して、学習者がアイコンをクリックしたときにアイコンが選択したモードに反転するようにします。

  12. 「報告」セクションで、クイズを LMS に含める場合は、「解答を報告」チェックボックスを選択します。Captivate のスコアリング可能な各ユニットには、一意のインタラクション ID が自動的に割り当てられます。 このインタラクション ID により、LMS によるデータ追跡が可能になります。

ボタンにインタラクションを追加

ボタンをデザインした後、操作を追加できます。 右側のツールバーのインタラクションパネルからインタラクションを追加できます。

  1. ボタンにアクションまたはインタラクションを追加するには、ボタンを選択して、右側のパネルで「インタラクション」を選択します。次にURL またはファイルを開くなどのアクションを割り当てます。プロジェクトのプレビューでは、学習者がボタンをクリックすると URL が開きます。

    インタラクション作成の詳細については、「インタラクション」を参照してください。

    ボタンにアクションを追加
    ボタンにアクションを追加

  2. 変更内容を保存するには「完了」をクリックします。インタラクションパネルにインタラクションが表示されます。

ビデオを見る

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

新規ユーザーの場合