Webサイトをデザインしたことがある、もしくは単にWebサーフィンをしていたかに関わらず、ライトボックスをおそらく見たことがあると思います。ライトボックスは、例えば写真画像やビデオのWebサイトで、Webページの背景を暗くし、写真やビデオを表示するためによく使われています。
Storyline360のライトボックス機能も同様に機能します。ライトボックスに表示する内容をトリガーで呼び出すと、呼び出したスライドが、淡色表示されている今のスライドの上にポップアップウィンドウで表示されます。次のサンプルをご覧ください。
ライトボックスを使うと、現在のスライドから移動することなく、学習者に補足内容を表示でき、学習者はコースの位置を気にする必要がなくなります。ライトボックスは、参照や外部リソースへのリンクなどに特に役立ちます。また、ナビゲーションの説明、目次、コース全体で利用するその他のサポート画面にも最適です。
では、Storyline 360コースにライトボックスを追加して、この強力な機能のメリットを学習者が享受できるようにする方法をご覧ください。
ライトボックスはStoryline360でどのように機能するのか？
Storyline 360では、任意のスライド（または一連の連続スライド）をトリガーしてライトボックスで呼び出すことができます。非常にシンプルに設定できるようにするために、ライトボックスのサイズ、配置、外観は、事前定義されています。ライトボックスには、学習者がライトボックスウィンドウを閉じることができる「×」ボタンが含まれます。これらの機能により、一貫したユーザーエクスペリエンスをすばやく簡単に作成できます。しかしトレードオフとして、これらのライトボックスの外観などの設定をカスタマイズすることはできません。
もしライトボックスコンテンツのサイズ、配置、外観をより細かく制御したり、カスタマイズしたい場合は、スライドレイヤーを使用して独自の疑似ライトボックス効果を作成できます。
TIPS：ライトボックスで表示する内容をデザインする時は、大きさに注意してください。ライトボックスで表示すると、呼び出したスライドのオブジェクト（テキスト、ボタン、画像など）のスケールは、元のスライドサイズの約75％になります。
ライトボックストリガー
ライトボックスで表示するコンテンツスライドを作成したら、次にライトボックスで表示するトリガーを追加する必要があります。トリガーウィザードのアクションメニューの下のドロップダウンメニューからライトボックスオプションを選択できます。
ライトボックスオプションを選択したら、対象スライドを指定します。
スライドドロップダウンメニューから、ライトボックスに表示するスライドを選択します。
一連の連続スライドをライトボックスに表示する場合、それらのスライド群を独自のシーンに配置する方が簡単です。そうすれば、スライドドロップダウンからそのシーンの最初のスライドを選択し、[Use navigation controls]ボックスをオンにするだけで、学習者はライトボックス化されたそのシーン内のスライド群を前後に移動できます。独自のナビゲーションボタンを使用することもできますが、学習者は、Storylineのデフォルトのナビゲーションコントロールが見やすく使いやすいと感じるかもしれません。
TIPS：デフォルトのプレイヤーナビゲーションコントロールを使用する場合は、逆に学習者が混乱しないようにライトボックス内で表示するスライドからスライド上のカスタムナビゲーションボタンを必ず削除してください。
ライトボックスに表示するスライドを選択したら、トリガータイミングを指定します。
タイミングドロップダウンメニューから、ニーズに合ったオプションを選択します。下記の例は、ユーザーがクリックした時です。
次に、関連オブジェクトを選択します。例えば、以下の例では、ユーザーが[Previous(前へ)]ボタンをクリックすると、スライド1.3をライトボックスで開くことになります。
上記のようにStoryline 360のデフォルトナビゲーションボタンをユーザーがクリックするとライトボックスをトリガーさせることもできます。またライトボックスは、スライドレイヤー上のボタンなどのオブジェクトからも開くようにトリガーすることもできます。
最後に、特定の条件が満たされた時だけライトボックスをトリガーすることもできます。例えば、次の例のように、スライド上のすべてのボタンをクリックした時にのみ学習者がライトボックスを表示できるようにできます。
上記のように、トリガーにConditions（条件）を追加することで、条件指定できます。
トリガー条件については、チュートリアル「Adding Conditions」をご覧ください。
※ Storyline 360の基本操作を日本語で紹介しております。
「Chapter4 インタラクティブな仕組み」でトリガーについてご紹介しています。
コースプレイヤーへのライトボックスの追加
ライトボックスをあるスライドで利用できるようするには今までご紹介した方法で設定できますが、コース全体でライトボックスを表示するにはどうすればよいでしょうか。
問題ありません！Storylineには、追加タブとしてコースプレイヤーにライトボックスを追加できる機能もあります。方法は次のとおりです。
プレイヤーのプロパティから、[Features(機能)]タブを選択します。
[Player Tabs]セクションで、[新規追加(白紙のアイコン)]をクリックします。
トリガーウィザードパネルで、名前フィールドに新しいタブの名前を入力します。例えば、連絡先情報を含むスライドの場合は「Contact(連絡先)」と入力します。この名前は、プレイヤーに表示する名前です。したがって、学習者が分かるような名前を入力してください。
トリガーウィザードパネルのActionフィールドで、ライトボックストリガーを選択し、開きたいスライドを選択します。
今までの方法と同じようにライトボックスをトリガーするための条件も指定できます。
新しいタブの情報の入力が終了したら、[OK]をクリックします。Storylineプレイヤーのプレビューに、新しく追加された「Contact(連絡先)」タブが表示されます。
ライトボックスが正しく機能していることを確認するには、プロジェクトをプレビューして、コースプレイヤーに新しく追加されたタブをクリックするだけです。
リソース
ライトボックスを包括的に検討することで、ライトボックスを使用するための新しいアイデアが得られたと思います。さらに多くのライトボックスデザインのインスピレーションについては、次の役立つリソースを確認してください。
ライトボックスを試してみたいけれど、もしStoryline 360をお持ちでない場合は、Articulate 360の30日間の無料トライアルをお試しいただけます。ご登録にクレジットカードは必要ありません！！
株式会社ディーシェは日本におけるArticulate製品の販売代理店です