ViewletBuilder6
Professional

Users Guide

日本語ユーザーズガイド

Page1

ViewletBuilder6UsersGuide

改訂版

July-2011

お読みくださいこのユーザーズガイドに記載の情報は変更することがあります。その際、予告のないこともあります。
特に記述のない場合、このユーザーズガイドで使用するデータの名称、画像の情報などは解説の便宜上、架空のものを使用している箇所もあります。それらは実在する名称等とは関係ありません。
本ガイドでは、ビューレットビルダー６の画面を使用して図を掲載し、機能を説明しています。
。（平成 20 年 7 月 11 日現在）
本書のいかなる部分も、その目的や形態（複写や記録、電子的・物理的な全ての手段を含
む）がどのようなものであっても、株式会社ウェブデモの書面による許諾を受けることなく複製または譲渡をすることを禁じます。ただし著作権法上のお客様の権利を制限するものではありません。
Microsoft®、Windows®は米国 Microsoft Corporation の米国およびその他の国における登録商標です。
Windows®の正式名称は Microsoft Windows Operating System です。

ViewletBuilder®は Qarbon, Inc. の登録商標です。

その他本書に記載の会社名、製品名およびサービス名等は各社の商標または登録商標です。

©2010 Webdemo Inc.

Page2

All rights reserved.

ViewletBuilder6UsersGuide

July-2011

目次
お読みください ······················································································· 2
Welcome to ViewletBuilder6 ···································································· 7
ガイドの表記について ·············································································· 9システム概要 ······················································································ 11
ソフトウェアのダウンロード ······································································ 11
ライセンス認証 ···················································································· 12
認証 ······················································································································· 12
認証の解除 ·············································································································· 14

インターフェース ··················································································· 16
起動画面 ················································································································· 16
プロジェクト編集時のインターフェース ·············································································· 17
タブ表示 ·················································································································· 19［ブラウザ］タブ ··································································································· 21［サムネイル］タブ ······························································································· 24［タイムライン］タブ ······························································································ 26［スタイルシート］タブ ···························································································· 29［スライドメモ］タブ ······························································································· 35

ビューレットビルダー６の基本設定····························································· 36
基本設定の保存 ········································································································ 40

Viewlet の製作手順の基本 ····································································· 41
新規プロジェクトの作成 ·········································································· 42［プロジェクト新規作成］パネル ······················································································· 43
スクリーンショットプロジェクト ························································································· 44
画像プロジェクト ········································································································· 57
ブランクプロジェクト····································································································· 59

カーソルの軌跡···················································································· 60
カーソルスタイル ········································································································ 64

メッセージオブジェクト ············································································ 65
吹き出し ·················································································································· 65
メモ ························································································································ 66
テキストボックス ········································································································· 67
メッセージオブジェクトの編集 ························································································· 67
メッセージオブジェクトのプロパティ ·················································································· 70
メッセージオブジェクトのタイミング ·················································································· 71
プロパティからの調整 ·························································································· 71［タイムライン］タブ内での調整 ················································································ 73
Page3

ViewletBuilder6UsersGuide

July-2011スライドの編集····················································································· 74
スライドの複製 ·········································································································· 74
新たなスライドの追加 ·································································································· 74
白紙スライドの追加 ····························································································· 74
スクリーンショットスライドの追加 ············································································· 75
画像スライドの追加 ····························································································· 75
スライドのプロパティ···································································································· 76
スライドカラーの変更 ··································································································· 77
スライドの背景画像 ···································································································· 78
スライドの移動 ·········································································································· 80
プロジェクトのリサイズ ································································································· 83
プロジェクトのトリミング ································································································ 85

サウンド ····························································································· 87
スライドのサウンド ······························································································ 87
オブジェクトのサウンド ························································································· 88
サウンドの録音 ·········································································································· 89
サウンドファイルの再生 ························································································ 90
サウンドファイルの削除 ························································································ 91
サウンドのエクスポート························································································· 91

画像オブジェクト··················································································· 92
画像の挿入 ·············································································································· 92
画像の編集 ·············································································································· 92
プロパティ ················································································································ 94

形状オブジェクト··················································································· 96
形状の編集 ·············································································································· 99
色の吸着 ··············································································································· 101
プロパティ ·············································································································· 102

画像と形状のタイミング ········································································· 103
プロパティからの調整 ································································································ 103
画像オブジェクトのタイミング ················································································ 103
形状オブジェクトのタイミング ················································································ 103［タイムライン］タブ内での調整 ····················································································· 105
タイミングリンク ········································································································ 107
タイミングリンクの追加 ······················································································· 107
タイミングリンクの解除 ······················································································· 108

ボタンオブジェクト ················································································ 110
ボタンの配置 ·········································································································· 110
プロパティ ·············································································································· 110
ボタンの編集 ·········································································································· 111
Page4

ViewletBuilder6UsersGuide

July-2011

イベントとアクション ·············································································· 112
イベントとアクションの一覧 ·························································································· 112
スライドのイベント ····························································································· 113
形状オブジェクトのイベント ·················································································· 114
画像オブジェクトのイベント ·················································································· 115
アクション ··············································································································· 116
順序の変更 ····································································································· 117
アクションの編集 ······························································································ 117
アクションの削除 ······························································································ 117

ハイパーリンク ···················································································· 118
メッセージのハイパーリンク（テキストリンク） ····························································· 118

インタラクティブゾーン ··········································································· 120
スライドに含まれるインタラクティブゾーンの数 ·························································· 121
サウンドの付加 ································································································ 121
応答メッセージオブジェクト ·················································································· 122
イベントとアクション ··························································································· 123
スコアリング ···································································································· 124
クリック範囲型クイズゾーン ························································································· 125
配置 ·············································································································· 125
クリック範囲のプロパティ ···················································································· 126
クリック範囲の編集 ··························································································· 128
クイズオブジェクトの削除 ···················································································· 128
テキスト入力型クイズゾーン ························································································ 129
配置 ·············································································································· 129
クイズゾーンの編集 ··························································································· 130
クイズオブジェクトの削除 ···················································································· 131
キー入力型クイズゾーン ···························································································· 132
配置 ·············································································································· 132
キーストロークの定義 ························································································ 132
選択型クイズゾーン ·································································································· 133
配置 ·············································································································· 133
選択肢の追加 ·································································································· 134
選択肢の削除 ·································································································· 134
正否の設定 ····································································································· 134
選択肢のメッセージオブジェクトの編集 ··································································· 134
解答確定のボタンオブジェクトの編集 ····································································· 135
クイズゾーンの削除 ··························································································· 136
チェックボックスのスタイル ·················································································· 137
一時停止ゾーンの挿入 ······················································································ 139
一時停止ゾーンの削除 ······················································································ 139
Page5

ViewletBuilder6UsersGuide

July-2011

辞書・スペルチェック ············································································· 140
検索と置き換え ··················································································· 142
印刷とレイアウト·················································································· 144
レイアウト ··············································································································· 144
印刷 ····················································································································· 146

エクスポート ······················································································· 147
インポート·························································································· 150
プロジェクトのプロパティ ········································································ 153［Viewlet プロフィール］ ······························································································ 154［音質］ ·················································································································· 155［画質］ ·················································································································· 156［タイミング］ ············································································································ 157［Viewlet オプション］ ································································································· 158［スコアリング オプション］ ·························································································· 159［パッケージング］ ····································································································· 161［言語］ ·················································································································· 162［Flash］ ················································································································· 163［ViewletSkin］ ········································································································· 165［HTML フレーム］ ···································································································· 166
プロジェクトのプロパティを保存する··············································································· 167

Viewlet のプレビュー ············································································ 168
Viewlet のパブリッシュ ·········································································· 170
ロケーションの選択 ··································································································· 171
レポートのオプション ································································································· 172
パブリッシュの完了 ··································································································· 173
Viewlet の閲覧 ········································································································ 173

ビューレットビルダー６プロジェクトを構築するファイル ···································· 174
各種サービスのご案内·········································································· 175
セミナー ················································································································· 175
トレーニング ············································································································ 175
ムービー制作サービス ······························································································· 175
ビューレットビルダー・サポートデスク ············································································· 176
最新情報 ··············································································································· 176
動画マニュアル.com ································································································· 176

Page6

ViewletBuilder6UsersGuide

July-2011

Welcome to ViewletBuilder6より詳しい情報をお求めの場合は巻末の「各種サービスのご案内」の項をご覧になりお問
い合わせください。

Page7

ViewletBuilder6UsersGuide

July-2011

Page8ViewletBuilder6UsersGuide

July-2011

ガイドの表記について
名称［］で囲まれています。
メニュー名、パネルタイトル、ボタン名、フィールド名、ツールチップなど。
例：［プロジェクトのプロパティ］パネル、［OK］ボタン、［新規作成...］メニューコマンドメニューバーからのコマンド選択を次のように記述します。
例：メニューバーから［編集］→［基本設定...］を選択します。
メニューバーの［編集］をクリックして表示された項目の中から［基本設定...］を選択する、という操作を表します。

マウス操作
ポイント
マウスカーソルをあてる動作。
クリック（あるいは､シングルクリック）
マウスのボタンを押して、すぐに離す動作。
ダブルクリック
マウスのボタンをすばやく２回クリックする動作。
ドラッグ
マウスのボタンを押したまま移動する動作。
ドラッグ・アンド・ドロップ
マウスのボタンを押したまま移動し、適所でマウスボタンを離す動作。

キーボード・キー入力
プラスの記号でキー操作の組み合わせを表します。
例：［Shift］＋［Ctrl］キー［Shift］キーを押しながら［Ctrl］キーを押すことを表します。

Page9

ViewletBuilder6UsersGuide

July-2011

ガイド
操作のポイント、コツなど情報を説明しています。
注意すべき点のあるときに説明しています。
操作方法や準備のように便利な情報を説明しています。

その他の表記について
上記以外の表記については、本書内でその都度説明しています。
リンクについて
本書の電子文書（PDF）では、参照語句はリンクが定義されています。クリックすると関連項目のタイトルにジャンプします。

Page10ViewletBuilder6UsersGuide

July-2011

システム概要
ビューレットビルダー６に必要な機能とスペックは次の通りです。
基本スペック■OS：Windows98／98SE／NT／2000／XP／Vista■CPU：Intel PⅢ以上、AMD K6５５０MHz 以上■メモリ：512MB 以上（1GB 推奨）■解像度：800×600 以上
ビデオボード：16bit 色以上■入力フォーマット
画像フォーマット：PNG／GIF／JPG／BMP／TIFF
音声フォーマット：WAV／MP3／AU／Aif／RAW■出力フォーマット
動画フォーマット：Flash8

SWF ファイル

印刷・画像フォーマット：PDF／JPEG／TIFF／BMP／PNG

ソフトウェアのダウンロード
ビューレットビルダー６の最新バージョンは、株式会社ウェブデモのサイト内にあります。
ダウンロードしてご利用ください。
ビューレットビルダー６のページ：http://www.webdemo.co.jp/vb5/

Page11

ViewletBuilder6UsersGuide

July-2011ライセンス認証
ダウンロードしたビューレットビルダー６プロフェッショナルエディションをインストー
ルするとそれぞれ全ての機能を使用することができます。
ただし、体験版でコンパイルされたムービーには透かしのロゴマークが貼られます。
透かしマークのない Viewlet を作成するにはライセンスを購入し、認証を行なう必要があります。

認証
オンラインでの認証方法です。
ビューレットビルダー６を起動します。
メニュー画面から［ライセンス認証...］をクリックします。
この項目が［ライセンス認証解除...］（Licensed）となっている場合はライセンス
認証が完了しています。

Page12

ViewletBuilder6UsersGuide

July-2011［ViewletBuilder6 アクティベーション］パネルが表示されます。
ここからはパネルの指示に従って操作します。

ライセンスコードは半角英数字になっています。入力は正確に行ないます。

［次へ＞］ボタンをクリックして進みます。
Qarbon 社認証サーバーへ接続されて認証が行なわれます。
認証が正常に完了すると次のようなパネルが表示されます。

セキュリティの観点から上図では表示されていたデータを伏せるよう加工しています。実際はここに登録者の入力した情報が表示されています。

［終了］ボタンをクリックします。
認証が完了しました。

Page13ViewletBuilder6UsersGuide

July-2011

認証の解除解除方法です。
ビューレットビルダー６を起動します。
メニュー画面の［ライセンス認証解除...］をクリックします。

この項目が［ライセンス認証...］（Unlicensed）となっている場合はライセンスが認証されていません。

［ViewletBuilder6 認証解除］パネルが表示されます。

セキュリティの観点から上図および次ページの図では表示されていたデータを伏せるよう加工しています。実際はここに登録されていた情報が表示されています。

Page14ViewletBuilder6UsersGuide

July-2011

［次へ＞］ボタンをクリックします。
Qarbon 社認証サーバーへ接続されて認証の解除が行なわれます。
解除手続きが正常に完了すると次のようなパネルが表示されます。

［終了］ボタンをクリックします。

Page15ViewletBuilder6UsersGuide

July-2011

インターフェース
起動画面
ビューレットビルダー６を起動すると、次のような画面が表示されます。

上図はライセンス認証が完了している場合の画面となっております。

タイトルバー

メニューバー

Page16

ViewletBuilder6UsersGuide

July-2011プロジェクト編集時のインターフェース
ボタンコマンドツールバー
メニューバーの下にあるボタンアイコンのバー。

連動ツールバー
プロジェクトを開くと表示されるツールバー。コマンドに連動してさまざまなボタンアイ
コンが表示されます。

オブジェクトツールバー
スライド上にオブジェクトを配置するコマンドのボタンアイコンです。

Page17

ViewletBuilder6UsersGuide

July-2011スライドビュー
右側の中段の広いスペースです。
スライドにオブジェクトを追加し、編集する領域です。（下図は白紙のスライドです）

Page18ViewletBuilder6UsersGuide

July-2011タブ表示
スライドビューの左側および下部に表示されています。
［ブラウザ］、［サムネイル］、［スタイルシート］、［アウトプット］、［タイムライン］、［スライドメモ］の 6 種類があります。

表示させるには、メニューバーの［表示］から選択してチェックマークをオンにします。

Page19ViewletBuilder6UsersGuide

July-2011タブ表示の解除表示されているタブのタイトルの右端にある×マークをクリックします。

タブ表示の最小化と最大化
タブの右上に配置されている最小化または、最大化ボタンをクリックします。

左のタブ表示と下のタブ表示を最小化するとスライドビューがさらに広がります。

Page20ViewletBuilder6UsersGuide

July-2011［ブラウザ］タブ
Viewlet を作成する上でリソースの管理・組織化に有効な機能です。Viewlet のリストを表示することもできます。ビューレットビルダー６を終了することなくフォルダやファイルの管理を行なうことができます。
メニューバーから［表示］→［ブラウザ］を選択してチェックマークをオンにします。
［ブラウザ］タブが表示されます。タブ名をクリックすると最前面に表示されます。

この［ブラウザ］タブに表示されるのはフォルダへのショートカットです。このとき下段に表示されるのは実際のファイルです。ファイルのショートカットではありません。ご注意ください。

Page21

ViewletBuilder6UsersGuide

July-2011参照フォルダの追加
緑色の＋マーク［追加...］アイコンをクリックします。
ドロップダウンリストからメニューを選択します。

参照するフォルダを選択します。
フォルダへのショートカットが追加されます。

Page22

ViewletBuilder6UsersGuide

July-2011参照フォルダの解除参照しているフォルダを選択して赤色の×マーク［削除...］アイコンをクリックします。

ファイルの削除
下段に表示されているファイルから削除するものを選択します。
この操作で削除されたファイルはコンピュータから完全に削除されます。
十分に確認したのち、慎重に作業を行なってください。

赤色の×マーク［削除...］アイコンをクリックします。

Page23ViewletBuilder6UsersGuide

July-2011［サムネイル］タブ
開いているプロジェクトの全スライドが一覧として表示されています。
メニューバーから［表示］→［サムネイル］を選択してチェックマークをオンにします。
［サムネイル］タブが表示されます。タブ名をクリックすると最前面に表示されます。

Page24ViewletBuilder6UsersGuide

July-2011サムネイルの拡大と縮小
タブの上部にあるボタンで、サムネイルの縮小率を変更することができます。また、サムネイルを最新の状態にするための［サムネイルを再表示］、［全てのサムネイルを再表示］
ボタンがあります。

スライドの操作
スライドの追加位置を指示したり、削除するスライドを選択したりすることができます。
ドラッグ・アンド・ドロップでスライドの順番を変更することもできます。
また、選択したスライド上で右ボタンをクリックしてショートカットメニューから各種の操作を行なうことができます。
複数のスライドを選択して同時に同じ内容の処理を施すことができます。
スライドの情報アイコン
スライドの下には、含まれるオブジェクトがアイコンで表示されています。カーソルを当
てるとツールチップが表示されます。

Page25ViewletBuilder6UsersGuide

July-2011［タイムライン］タブ
タイムラインに沿ってスライドやオブジェクトをデザインすることができます。スライドのプレビューを行なうこともできます。
メニューバーから［表示］→［タイムライン］を選択してチェックマークをオンにします。
［タイムライン］タブが表示されます。タブ名をクリックすると最前面に表示されます。

タブの上部左側には、スライド数・スライド全体の再生秒数とスライド毎のタイム・スラ
イドの表示時間の調整スピンボタン・タイムラインの縮尺スピンボタン・タイムラインの表示切り替えのアイコンが並んでいます。
右側には、スライド間の移動アイコンが４種とプレビューのボタンがあります。

Page26

ViewletBuilder6UsersGuide

July-2011レイヤ
スライドのオブジェクトは［タイムライン］タブにレイヤ表示されています。

三角形のマークをクリックしてレイヤ表示の展開と折りたたみを切り替えることができます。

レイヤの表示と非表示
目のマークのアイコンをクリックして表示／非表示を切り替えます。

レイヤのロックと解除
レイヤごとに編集を制限するには鍵マークのアイコンをクリックして閉じた状態にします。
制限を解除するときもクリックして鍵マークが開いた状態にします。

Page27

ViewletBuilder6UsersGuide

July-2011

オブジェクトの位置
オブジェクトの順番や位置を調整することができます。
変更するオブジェクトを選択します。
マウスの右ボタンをクリックしてショートカットメニューから［重ね順］または［揃える］を選択して配置の場所を指示します。
オブジェクトの動作
レイヤごとにオブジェクトの動作タイミングや表示時間を示す長方形のバーがあります。
長方形のエッジにポイントすると両方向矢印のカーソルに変化します。これをドラッグして動作を調整することができます。

タイミングリンク
オブジェクト間の相互関係を定義しておくことができます。ビューレットビルダー６で新しく追加された機能です。
操作方法については、「タイミングリンク」の項をご参照ください。
レイヤの削除レイヤを選択します。
キーボードの［Delete］キーを押します。
他の方法：マウスの右ボタンをクリックしてショートカットメニューから［削除］を選択します。

Page28ViewletBuilder6UsersGuide

July-2011［スタイルシート］タブ
オブジェクトの特性をスタイルシートと呼ばれるテンプレートとして定義することができます。定義した内容はオブジェクトやスライドなどに反映させることができます。
メニューバーから［表示］→［スタイルシート］を選択して、チェックマークをオンにします。
［スタイルシート］タブが表示されます。タブ名をクリックすると最前面に表示されます。

［default］
デフォルトのスタイルシートです。ドロップダウンリストから選択します。削除することはできません。

Page29ViewletBuilder6UsersGuide

July-2011

［新規スタイルシート］
ユーザーが任意に登録するスタイルシートです。
タブの上部にある［新規スタイルシート］アイコンをクリックします。

［スタイルシート］パネルが表示されます。

スタイルシートの［名前：］を入力します。
必要であれば［パスワード保護］チェックボックスをオンにしてパスワードを入力します。
パスワードの管理には十分注意してください。

［OK］ボタンをクリックします。

Page30ViewletBuilder6UsersGuide

July-2011［スタイルシート名の変更］
スタイルシートの名称およびパスワードを変更することができます。
デフォルトのスタイルシートは名称を変更することができません。
パスワード保護されているスタイルシートの名称を変更するには、パスワードを入力する必要があります。

スタイルとして定義する内容
オブジェクト

プロパティ

スライド

背景色

吹き出し
メモ
正解メッセージ
未解答のメッセージ
丌正解メッセージ
質問用テキスト

メッセージスタイル
背景色
テキストのプロパティ（フォント、サイズ、スタイル、配置、色）

選択肢用テキスト
列のテキスト欄のテキスト
テキストフィールドスタイル
ラジオボタン スタイル
質問用コメント??

チェックボックス スタイル
コンボボックス スタイル
レイティング スタイル

テキストボックス

テキストのプロパティ（フォント、サイズ、スタイル、配置、色）ボタン

ボタンスタイル

クリック範囲

クリック範囲の変更

Page31

ViewletBuilder6UsersGuide

July-2011プロジェクト全体に反映
プロジェクトに含まれる全スライドに選択されているスタイルが適用されます。
［スタイルシート］タブ内のスタイルのリストから基にするオブジェクトの種類を選択します。
必要に応じて、スタイルの内容を編集しておきます。
［スタイルシート］タブの［スタイルシートをプロジェクトに適用する］アイコンをクリックします。

他の方法：右ボタンをクリックしてショートカットメニューから［スタイル
シートをプロジェクトに適用する］を選択します。

［OK］ボタンをクリックします。

Page32

ViewletBuilder6UsersGuide

July-2011スライドへの反映
選択しているスライドにのみスタイルを適用することができます。
スタイルシートタブ内のスタイルのリストから基にするオブジェクトの種類を選択します。
必要に応じて、スタイルの内容を編集しておきます。
［スタイルシートの設定に変更する］アイコンをクリックします。

スタイルシートへ登録変更されているオブジェクトのスタイルをスタイルシートへ登録することができます。
スライド上のオブジェクトを選択して［スタイルシート］タブの［選択内容でスタイル
シートを上書きする］アイコンをクリックします。

Page33ViewletBuilder6UsersGuide

July-2011

スタイルシートの削除［スタイルシート］タブの［スタイルシート：］ドロップダウンリストから削除するスタイルシートを選択します。
［スタイルシートを削除］アイコンをクリックします。

Page34ViewletBuilder6UsersGuide

July-2011［スライドメモ］タブ
スライドメモとは、実際にはスライドに表示させない注釈を書き込んでおくための機能です。複数のスタッフで編集する場合のメモにも便利です。
メニューバーから［表示］→［スライドメモ］を選択して、チェックマークをオンにします。
［スライドメモ］タブが表示されます。タブ名をクリックすると最前面に表示されます。

スライドを選択してメモを入力します。
スライドメモはスライド１枚に対してひとつずつ用意されています。
スライドメモの印刷
メニューバーから［ファイル］→［印刷のレイアウト...］を選択します。
［印刷レイアウト］タブが表示されます。
［オプション］欄で［スライドメモ］チェックボックスをオンにすると、印刷時にその内容を加えることができます。

Page35ViewletBuilder6UsersGuide

July-2011

ビューレットビルダー６の基本設定
言語の選択、録音時のカウントダウン、スペルチェック、プロキシ情報、ログファイル、
バックアップ、Java に関する設定を行ないます。
メニューバーから［編集］→［基本設定…］を選択します。
［基本設定］パネルが表示されます。

［一般］タブ［基本設定］パネルの［一般］タブを選択します。
［言語］欄：ドロップダウンリストからビューレットビルダー６で使用する言語オプションを選択します。
デフォルトとして OS と同じ言語が選択されています。
［録音］欄：ビューレットビルダー６で音声の録音を行なう際、カウントダウンします。

Page36

ViewletBuilder6UsersGuide

July-2011

［スペル］タブ［基本設定］パネルの［スペル］タブを選択します。

ドロップダウンリストからスペルチェックに使用する辞書を選択します。
必要に応じてオプションを選択します。
［プロキシ］タブ［基本設定］パネルの［proxy］タブを選択します。

プロキシオプションを選択して、プロキシ情報を入力します。

Page37

ViewletBuilder6UsersGuide

July-2011

［ロギング］タブ［基本設定］パネルの［ロギング］タブを選択します。

［レポート：］：ドロップダウンリストからオプションを選択します。
アウトプットウィンドウの内容をいったん消去するには［アウトプットウィンドウをクリアする］ボタンをクリックします。
［ログファイル］欄：アウトプットウィンドウに表示される内容をファイルに保存するためのオプションです。
［有効］チェックボックスをオンにすると、［ファイル：］で指定したファイルに記録されます。
［最大サイズ］ボックスでは、ログファイルのサイズの上限を設定します。
ログファイルをいったん削除するには［ログファイルをクリアする］ボタンをクリックします。

Page38ViewletBuilder6UsersGuide

July-2011［バックアップ］タブ［基本設定］パネルの［バックアップ］タブを選択します。

［バックアップファイルの保存］欄：プロジェクト（.qvp）ファイルのバックアップ保存に関するオプション設定です。
［自動保存］欄：指定された間隔で自動的にプロジェクトファイルのバックアップ保存を行ないます。

Page39ViewletBuilder6UsersGuide

July-2011［アドバンス］タブJava に関するオプション設定です。
［基本設定］パネルの［アドバンス］タブを選択します。

［Java の設定を変更する］ボタンをクリックします。

［メモリ］欄：メモリの使用領域を指定することができます。

基本設定の保存
設定の変更を有効にするには［OK］ボタンをクリックします。

Page40ViewletBuilder6UsersGuide

July-2011

Viewlet の製作手順の基本
シナリオ作成ムービーのストーリーを決める＜ポイント＞◎わかりやすく・簡潔にまとめて◎１ムービーにつき１ストーリー

シミュレーション：キャプチャの前に操作の流れを繰り返し確認しましょう。

［プロジェクトの新規作成］へ

キャプチャ操作

カーソルパスサウンド・音声
吹き出し・メモ・テキスト・クイズ＜ポイント＞◎動作のタイミングは？
◎フォント・色は？

ボタン

編集作業

編集中はこまめに保存しましょう。
タイムライン・全体のスピードの調整
イベントとアクション

コンパイルの設定

製作者情報入力
プレイバーの設定・s kinの選択
プレローダー・吹き出しのフェード効果
スコアの設定設定後はいったん保存しましょう。

パブリッシュ
出力先選択
パスワード設定の有無
L MS 利用完成
配布・配信へPage41

ViewletBuilder6UsersGuide＜形式＞◎html◎exe◎vvl◎hqx◎S WF （F las h形式）◎.js （L MS ファイル）

July-2011新規プロジェクトの作成
メニュー画面から［新規プロジェクト］をクリックします。

他の方法：ボタンコマンドツールバーの［新規作成...］アイコンをクリックします。

［プロジェクト新規作成］パネルが表示されます。（次ページの図を参照）

Page42

ViewletBuilder6UsersGuide

July-2011

［プロジェクト新規作成］パネル

ビューレットビルダー６プロフェッショナルエディションでは、3 つの方法が準備されています。
［スクリーンショットプロジェクト］［画像プロジェクト］［ブランクプロジェクト］
ビューレットビルダー６エンタープライズエディションでは、上記３種に加えて次のさらに３つの方法でプロジェクトを作成することができます。
［PowerPoint プロジェクト］［クイズプロジェクト］［調査プロジェクト］

この３つの方法については、「ビューレットビルダー６エンタープライズエディ
ション日本語ユーザーズガイド」で説明しています。

Page43ViewletBuilder6UsersGuide

July-2011

スクリーンショットプロジェクト
他のアプリケーションの動作をキャプチャしてスクリーンショットプロジェクトを作成します。
左側のナビゲーションメニューから［スクリーンショットプロジェクト］を選択します。

［スライドサイズ］欄
キャプチャする範囲を上図ドロップダウンリストの 6 種類から選択します。
［カスタム］［スタンダード］［アプリケーション］［エリア］［ウィンドウ］［フルスクリーン］

Page44ViewletBuilder6UsersGuide

July-2011

［カスタム - キャプチャ領域の幅・高さを変更］
任意のサイズでキャプチャの範囲を指示することができます。

［幅：］、［高さ：］の数値をキーボードから入力するかまたは、スピンボタンで指示します。
［スタンダード - 登録サイズから選択］［スタンダード］を選択すると、登録されているスライドサイズが下段にドロップダウン
リストで表示されます。ここから適当なものを選択します。

必要であれば、緑色の＋マーク［サイズを登録］アイコンをクリックして、新たにサイズを登録することができます。削除するときは選択したあと赤い×マーク［登録サイズの削除］アイコンをクリックします。

Page45ViewletBuilder6UsersGuide

July-2011

［アプリケーション - 起動中のアプリケーションをキャプチャする］［アプリケーション］を選択すると起動中のアプリケーション一覧から選択してキャプチャを始めることができます。

下段に表示されるドロップダウンリストから該当するアプリケーションを選択します。
［アプリケーションのリサイズ：］チェックボックスをオンにしてサイズを指示すると、
アプリケーションのウィンドウサイズを同時に変更することができます。
［エリア - キャプチャ領域をスクリーンから手動で指定する］

スクリーン上のキャプチャする範囲の対角２点をドラッグ・アンド・ドロップで指示します。

Page46

ViewletBuilder6UsersGuide

July-2011

［ウィンドウ - キャプチャするウィンドウを手動選択］

アプリケーションの一部を囲んで赤色の枠が自動表示されます。その領域のひとつをクリックして選択します。
［フルスクリーン - 全画面でキャプチャする］
スクリーン全体をキャプチャします。

下段に表示されるドロップダウンリストからモニターの解像度を選択します。

Page47

ViewletBuilder6UsersGuide

July-2011［キャプチャモード］欄［スマートキャプチャ - 全ての変化を自動でキャプチャする］
キャプチャする領域に変化のあるとき、ビューレットビルダー６が自動的にキャプチャを行ないます。
アプリケーションの操作に専念してキャプチャを進行することができます。
［マニュアルキャプチャ - ホットキーを使用してキャプチャする］
任意のタイミングでホットキーを押してキャプチャします。

Page48ViewletBuilder6UsersGuide

July-2011［オプション...］ボタン［キャプチャモード］欄のドロップダウンリストの下にあります。

クリックすると［キャプチャ オプション］パネルが表示されます。（下図参照）［キャプチャ オプション］パネル
キャプチャ機能に関する各種設定パネルです。

Page49ViewletBuilder6UsersGuide

July-2011［ホットキー］タブ
キャプチャに関する指示に使用するホットキーは任意のキーに割り当てることができます。
（前図を参照）
それぞれの項目のボタンをクリックして新しく割り当てるキーを押します。
アプリケーションのショートカットキーと重複しないものを選択してください。

［フィードバック］タブ［トレイアイコン点滅］チェックボックスをオンにすると、キャプチャ動作中、タスクバーの通知領域にビューレットビルダー６のアイコンが表示されます。
［トレイアイコンを隠す］チェックボックスをオンにすると、前述のビューレットビル
ダー６のアイコンが表示されません。
［サウンド再生］欄：キャプチャ時のサウンドの有無を指示します。

Page50ViewletBuilder6UsersGuide

July-2011［その他一般］タブ
スライドに自動付加する項目を選択します。

［オプション］タブ

Page51

ViewletBuilder6UsersGuide

July-2011［アドバンス］タブ
マウスの移動時のキャプチャの回数を一秒間あたりの数値で指示します。
また、クリックからキャプチャまでの時間を取ることで、スマートキャプチャのタイミングを指示します。

Page52

ViewletBuilder6UsersGuide

July-2011

スクリーンショットの開始
スライドサイズとキャプチャモードを選択して［OK］ボタンをクリックします。（下図のオプション内容は一例です）

Page53ViewletBuilder6UsersGuide

July-2011

スクリーン上にメモが表示されます。キャプチャする範囲をメモの内容に従って選択ある
いは指示します。（下図はスライドサイズ［ウィンドウ］での例です）［スライドサイズ］で［フルスクリーン］を選択しているときは、メモは表示されません。
このとき、範囲の選択をしないで操作をキャンセルするには、右ボタンをクリックするか、キーボードの［ESC］キーを押します。プロジェクトは作成されず
ビューレットビルダー６の起動画面に戻ります。

スクリーンショットが開始します。
通知領域のトレイアイコンにマウスカーソルをあてるとそれまでにキャプチャした回数の情報が表示されます。

Page54ViewletBuilder6UsersGuide

July-2011

キャプチャ中のオプション変更
スクリーンショットの操作中にオプションの変更を行なうことができます。
タスクバーの通知領域に表示されているビューレットビルダー６のアイコンをクリックします。
スクリーンショットが一時停止して［キャプチャ状況］パネルが表示されます。

水色の下向き矢印［最大化］アイコンをクリックします。
［キャプチャ状況］パネルが広がり、［キャプチャオプション］パネルと同様の内容に［状態］タブが加わって表示されます。

Page55ViewletBuilder6UsersGuide

July-2011

キャプチャの再開とキャンセル
キャプチャを再開するには［キャプチャ状況］パネルの緑色の［続ける］アイコンをクリックします。

キャプチャを取りやめてスライドの作成も行なわない場合は赤色の×マーク［キャンセル］
アイコンをクリックします。
スクリーンショットの終了
スクリーンショットを終了すると、プロジェクトとしてキャプチャされたスライドがスラ
イドビューに表示されます。
赤色の四角［停止］アイコンをクリックします。
［キャプチャセッションの読み込み中］パネルが表示されます。

Page56

ViewletBuilder6UsersGuide

July-2011画像プロジェクト
既存の画像を利用してプロジェクトを作成します。
サポートされるイメージ形式は jpeg、gif、tiff、jpg、png と bmp です。イメージは背景画像としてスライドに配置されます。
［プロジェクト新規作成］パネルのナビゲーションメニューから［画像プロジェクト］を選択します。

［スライドサイズ］欄
作成するスライドサイズを選択します。
［カスタム］と［スタンダード］の２種類があります。

Page57

ViewletBuilder6UsersGuide

July-2011

［画像の選択］欄
スライドに取り込む画像を選択します。

緑色の＋マーク［追加］アイコンで画像ファイルを選択します。
右側に画像がプレビューされます。
プレビューの下にあるアイコンは画像の回転を行なうためのものです。
順序の変更には、水色の矢印［上へ］あるいは［下へ］アイコンを使用します。
削除するには、ファイル名を選択して赤い×マーク［削除］アイコンをクリックします。
プロジェクトを開いたあとも、スライドの順序の変更、削除やスライドの追加などは行なうことができます。

［OK］ボタンをクリックします。
画像を取り込んだスライドが作成されてプロジェクトとして開きます。

Page58ViewletBuilder6UsersGuide

July-2011ブランクプロジェクト
白紙のスライドからプロジェクトを開始します。
［プロジェクト新規作成］パネルのナビゲーションメニューから［ブランクプロジェクト］
を選択します。

［スライドサイズ］欄
キャプチャの領域の指定方法を選択します。
［カスタム］と［スタンダード］の２種類があります。
［スライドカウント］欄
プロジェクト開始時の白紙のスライドの枚数を指示します。
プロジェクトを開始後もスライドの追加および削除が可能です。
プロジェクトを開いたときの画面構成は「インターフェース」の項をご参照ください。

Page59ViewletBuilder6UsersGuide

July-2011カーソルの軌跡
ビューレットビルダーでは、キャプチャすると同時にカーソルの軌跡はスライドに取り込まれます。カーソルの動きにしたがって色分けされています。
これらは、編集可能です。

カーソルの挿入
カーソルの取り込まれていないスライドに新たにカーソルを挿入するには、オブジェクト
ツールバーの［カーソルの挿入］アイコンをクリックします。

カーソルパスが配置されているスライドで［カーソルの挿入］アイコンをクリック
すると、既存のカーソルが削除されます。

緑色の円

そのスライドでのカーソルの最初の位置を示しています。
ドラッグ・アンド・ドロップで移動することができます。移動すると前のスライドのカー
ソルの最終地点（赤色の円）が一致するように自動的に変更されます。
赤色の円

そのスライドでのカーソルの移動先を示しています。
ドラッグ・アンド・ドロップで移動することができます。移動すると次のスライドでのカーソルの開始位置（緑色の円）が一致するように自動的に変更されます。

Page60ViewletBuilder6UsersGuide

July-2011カーソルのパス（軌跡）
円と円の間の点線はカーソルの軌跡を示しています。

パス形状の変更
カーソルのパスは直線または曲線の２種類から選択することができます。
カーソルを選択します。
連動ツールバーの［カーソルパスを直線にする］アイコンをクリックします。

他の方法：カーソルの円の位置で右ボタンをクリックしてショートカットメ
ニューから［カーソルパスを直線にする］あるいは［カーソルパスを曲線にする］
を選択します。
プロジェクト全体のカーソルのパスを一括して変更するには［カーソルパスを直線にする-全てのスライド］あるいは［カーソルパスを曲線にする-全てのスライド］
を選択します。

青色の円
緑色と赤色の円の間のカーソルの軌跡上にあって、カーソル形状が変化する位置を示しています。
ドラッグ・アンド・ドロップで移動することができます。

Page61

ViewletBuilder6UsersGuide

July-2011

ポイントの追加
カーソルがポイントする位置を追加することができます。
追加する位置の直前のカーソルあるいはカーソルポイントを選択します。
連動ツールバーの［カーソルパスのポイントを追加］アイコンをクリックします。

次のような赤色のポイントが挿入されます。

他の方法：選択したカーソルあるいはポイントの位置で右ボタンをクリックしてショートカットメニューから［カーソルパスのポイントを追加］を選択します。

クリックの追加
クリックの動作を追加することができます。
連動ツールバーの［カーソルパスにクリックを追加］アイコンをクリックします。

タイムラインのカーソルパスのレイヤに、クリックのマークが挿入されます。

その他のオブジェクトと同様に移動などの編集を行なうことができます。

Page62

ViewletBuilder6UsersGuide

July-2011カーソルポイントの削除
カーソルのパス上のポイントを削除するには、ポイントを選択して右ボタンのショート
カットメニューから［削除］を選択します。
他の方法：ポイントを選択してボタンコマンドツールバーの［削除］アイコンをクリックします。あるいは、ポイントを選択してキーボードの［Delete］
キーを押します。

クリックの削除
タイムライン上にあるクリックのマークの位置で右ボタンをクリックしてショートカット
メニューから［削除］を選択します。
カーソルパスの削除
オブジェクトツールバーの［カーソルの挿入］アイコンをクリックしてオフにします。

カーソルが軌跡とともに削除されます。

Page63ViewletBuilder6UsersGuide

July-2011カーソルスタイル
ビューレットビルダー６には標準的なカーソル形状がライブラリとして準備されています。
ライブラリを参照して簡単にカーソルの形状を変更することができます。
カーソル形状の変更
カーソルを選択します。
連動ツールバーの［カーソルスタイル...］をクリックします。

他の方法：カーソル上で右ボタンをクリックしてショートカットメニューから［カーソルスタイル...］を選択します。

［カーソルスタイル］パネルが表示されます。

［カーソルのスタイルを選択］欄で形状を選択します。
［OK］ボタンをクリックすると、カーソルが変更されてパネルが閉じます。
新しいカーソルスタイルの追加
キャプチャの際に取り込まれた（ライブラリに未登録の）新しいカーソルを保存することができます。
未登録のカーソルを選択します。
連動ツールバーの［カーソルスタイル...］をクリックします。

他の方法：未登録のカーソル上で右ボタンのショートカットメニューから［カーソルスタイル...］を選択します。

［カーソルスタイル］パネルが表示され、自動的に新しいカーソルが登録されます。
［OK］ボタンをクリックするとパネルが閉じます。

Page64ViewletBuilder6UsersGuide

July-2011

メッセージオブジェクト
メッセージには「吹き出し」、「メモ」、「テキストボックス」があります。
ビューレットビルダー６ではひとつのスライドに複数のメッセージを追加することができます。またそれらのメッセージをどのようなタイミングで表示するのかを個々に制御することもできます。

吹き出し
このタイプのメッセージオブジェクトはスライドの特定の部分を指示するのに便利です。
文字を表示することができます。

吹き出しの挿入オブジェクトツールバーの［吹き出しの挿入］アイコンをクリックします。

配置する場所をクリックします。吹き出しが表示されます。

吹き出しの編集
テキストの入力
吹き出しをダブルクリックします。
他の方法：吹き出しの上で右ボタンをクリックしてショートカットメニューから［メッセージの編集...］を選択します。

カーソルが点滅したら文字を入力します。
右ボタンのショートカットメニューで、フォント、文字色、サイズ、ハイパーリンクなどを指示することができます。

Page65ViewletBuilder6UsersGuide

July-2011背景色の変更
吹き出しを選択します。
連動ツールバーの［背景色］アイコンをクリックします。

他の方法：吹き出しの上で右ボタンをクリックしてショートカットメニューから［背景色...］を選択します。

［背景色］パネルが表示されます。
パレットから任意の色を選択します。
［OK］ボタンをクリックすると吹き出しの背景色が変更されてパネルが閉じます。

メモ
閲覧者に内容を説明する場合や解説などに表示すると便利です。

メモの挿入
オブジェクトツールバーの［メモの挿入］アイコンをクリックします。

メモが表示されます。

Page66

ViewletBuilder6UsersGuide

July-2011

メモの編集テキストの入力
吹き出しのテキスト入力方法と同様の手順で行ないます。
背景色の変更メモを選択します。
吹き出しの背景色の変更方法と同様の手順です。

テキストボックス
スライド上に文字列を表示するためのオブジェクトです。スライドに対して直接文字を書き込んだような効果のオブジェクトです。

テキストボックスの挿入
オブジェクトツールバーの［テキストボックスの挿入］アイコンをクリックします。

配置する場所をクリックします。
テキストボックスが表示されます。
テキストボックスの編集
吹き出し、メモのテキスト入力方法と同様の手順で行ないます。

メッセージオブジェクトの編集
サイズの変更メッセージオブジェクトを選択します。
ハンドルをドラッグ・アンド・ドロップして大きさを変更します。

Page67

ViewletBuilder6UsersGuide

July-2011

移動
メッセージオブジェクトを選択します。
カーソルをあてると手の形状になります。ドラッグ・アンド・ドロップで移動します。
メッセージオブジェクトの削除メッセージオブジェクトを選択します。
キーボードの［Delete］キーを押します。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。あるいは、オブジェクトの上で右ボタンをクリックしてショートカットメ
ニューから［削除］を選択します。

メッセージタイプの変更
メッセージは形状を変更することができます。

メッセージオブジェクトを選択します。
連動ツールバーの［メッセージタイプ...］アイコンをクリックします。

他の方法：メッセージオブジェクトの上で右ボタンをクリックしてショート
カットメニューから［メッセージタイプ...］を選択します。

［メッセージタイプ］パネルが表示されます。（上図参照）［メッセージスタイルの選択：］のドロップダウンリストからスタイルを選択します。
［メッセージタイプを選択：］欄でタイプを選択します。
［OK］ボタンをクリックするとパネルが閉じて形状が適用されます。

Page68ViewletBuilder6UsersGuide

July-2011

スタイルシートのメッセージオブジェクトへの適用
スタイルシートを利用してメッセージオブジェクトのスタイルを簡単に変更することができます。
メッセージオブジェクトを選択します。
「スライドへの反映」の項をご参照ください。
スタイルシートに登録されている内容がオブジェクトに反映されます。

Page69ViewletBuilder6UsersGuide

July-2011

メッセージオブジェクトのプロパティ
プロパティの変更
メッセージオブジェクトを選択します。
連動ツールバーの［メッセージのプロパティ...］アイコンをクリックします。

他の方法：メッセージオブジェクトを右ボタンでクリックしてショートカット
メニューから［メッセージのプロパティ...］を選択します。

［メッセージのプロパティ］パネルが表示されます。

［名前］欄：オブジェクトの名前です。
複数のオブジェクトを配置するときはわかりやすい名前をつけておくと便利です。

Page70ViewletBuilder6UsersGuide

July-2011

メッセージオブジェクトのタイミング
オブジェクトはそのスライドに表示させる時間を指示することができます。これをタイミングと呼びます。プロパティを設定する方法と［タイムライン］タブ上で設定する方法があります。

プロパティからの調整メッセージオブジェクトを選択します。
連動ツールバーの［メッセージのプロパティ...］アイコンをクリックします。

他の方法：メッセージオブジェクトを右ボタンでクリックしてショートカット
メニューから［メッセージのプロパティ...］を選択します。

［メッセージのプロパティ］パネルが表示されます。

［タイミング］欄でドロップダウンリストからオプションを選択します。
［タイミング手動設定］［スライドの最後まで］［読み取り速度］
設定を終えたら［OK］ボタンをクリックします。

Page71

ViewletBuilder6UsersGuide

July-2011

［タイミング手動設定］
オブジェクトの表示時間を制作者が指示します。

スライド上にオブジェクトを表示する［開始時間］と［表示時間］秒数をキーボードから入力するかあるいは、スピンボタンで変更します。
スライドが表示されてからそのオブジェクトが表示されるまでの秒差を［開始時間］とします。

［スライドの最後まで］

スライド上にオブジェクトを表示し始める［開始時間］を指示します。オブジェクトは次のスライドに移行するまでの間表示され続けます。
［読み取り速度］

スライド上にオブジェクトを表示し始める［開始時間］を指示します。メッセージオブ
ジェクトに含まれる文字の量に応じて自動的に表示時間が設定されます。

Page72

ViewletBuilder6UsersGuide

July-2011［タイムライン］タブ内での調整
スライドビュー下の［タイムライン］タブのタブ名をクリックして最前面に表示します。

オレンジ色の長方形は選択されているオブジェクトの表示時間を示しています。
ドラッグ・アンド・ドロップで移動してタイミングを変更したり、長方形の長さを調節することで表示時間を変更したりすることができます。

Page73ViewletBuilder6UsersGuide

July-2011スライドの編集
スライドの複製
スライドビューに表示されているスライドを簡単に複製することができます。
キーボードの［Ctrl］＋［D］キーを押します。
複製されたスライドが挿入されます。
他の方法：サムネイルビューで複製するスライドを選択して、連動ツールバーの［スライドの複製］アイコンをクリックします。

新たなスライドの追加
既存プロジェクトに対して異なるタイプのスライドを自由に挿入することができます。
スライドの挿入は新規作成と同じ３つの方法のうちいずれでも可能です。
いずれの方法でも選択しているスライドのすぐ後に新しいスライドが挿入されます。スライドは挿入後に順番を変更することもできます。

白紙スライドの追加
既存のスライドを選択します。
ボタンコマンドツールバーの［スライドの挿入］アイコンをクリックします。

白紙のスライドが一枚、挿入されます。

Page74ViewletBuilder6UsersGuide

July-2011

スクリーンショットスライドの追加
既存のスライドを選択します。
ボタンコマンドツールバーの［新しいスクリーンショットの挿入］アイコンをクリックします。
［スクリーンショットの挿入］パネルが表示されます。

新規作成のスクリーンショットをキャプチャするときと同様の手順でキャプチャ
します。

キャプチャを終了すると開いているプロジェクトにスライドとして挿入されます。

画像スライドの追加
既存のスライドを選択します。
ボタンコマンドツールバーの［画像スライドを挿入...］アイコンをクリックします。

［インポートする画像の選択］パネルが表示されます。
新規作成の画像スライドとして作成する場合と同様の手順で画像を選択します。

［OK］ボタンをクリックするとスライドが挿入されます。

Page75ViewletBuilder6UsersGuide

July-2011スライドのプロパティ
スライドプロパティの編集
プロパティは必要に応じて編集することが可能です。
サムネイルビューでスライドを選択します。
連動ツールバーの［スライドのプロパティ...］アイコンをクリックします。

他の方法：スライド上で右ボタンをクリックしてショートカットメニューから［スライドのプロパティ...］を選択します。

［スライドのプロパティ］パネルが表示されます。

［名前］欄：スライドの名前です。
［表示時間］欄：スライドの表示されている時間を秒単位で指示します。
［オプション］欄：［目次に含める］チェックボックスをオンにすると、ムービーの目次としてスライドの名前が使用されます。

Page76

ViewletBuilder6UsersGuide

July-2011スライドカラーの変更
スライドの背景色を変更することができます。画像やオブジェクトの後ろの色です。
サムネイルビューでスライドを選択します。
連動ツールバーの［背景色］アイコンをクリックします。

他の方法：右ボタンをクリックしてショートカットメニューから［背景色］を選択します。

［背景色］パネルが表示されます。

カラーをパレットから選択するかあるいは、RGB の数値などを指示します。
［OK］ボタンをクリックすると適用されます。
カスタムカラー
パレットで選択しているカラーあるいは、RGB の数値を調整したカラーをカスタムカ
ラーとして登録しておくことができます。
［現在のカラーをカスタムカラーに登録］アイコンをクリックします。［カスタム］
欄にカラーが追加されます。
カスタムカラーを削除するには［一番左のカスタムカラーを削除する］アイコンをクリックします。

Page77

ViewletBuilder6UsersGuide

July-2011スライドの背景画像
スライドの背景に画像を埋め込むことができます。配置のパターンも選択することができます。
背景画像の埋め込み
サムネイルビューでスライドを選択します。
連動ツールバーの［背景の編集...］アイコンをクリックします。

他の方法：スライドの上で右ボタンをクリックしてショートカットメニューから［背景の編集...］を選択します。

［背景フレーム］パネルが表示されます。

［フレーム：］：画像ファイルを選択します。
［レイアウト：］欄：画像の配置パターンを選択します。
［OK］ボタンをクリックするとスライドに画像が配置されてパネルが閉じます。

Page78ViewletBuilder6UsersGuide

July-2011背景フレームの削除
サムネイルビューでスライドを選択します。
連動ツールバーの［背景の編集...］アイコンをクリックします。

他の方法：スライドの上で右ボタンをクリックしてショートカットメニューから［背景の編集...］を選択します。

［背景フレーム］パネルが表示されます。

赤色の×マーク［背景を取り除く］アイコンをクリックします。
［OK］ボタンをクリックすると画像がスライドから取り消されます。

Page79ViewletBuilder6UsersGuide

July-2011スライドの移動
ドラッグ・アンド・ドロップ
サムネイルタブをクリックします。サムネイルビューが最前面に表示されます。
スライドのサムネイルをドラッグして移動先でドロップします。
切り取りと貼付けのコマンド
サムネイルビューで移動するスライドを選択します。
ボタンコマンドツールバーの［切り取り］アイコンをクリックします。

他の方法：移動するスライドを右ボタンでクリックしてショートカット
メニューから［切り取り］を選択します。

スライドが切り取られます。
切り取りをすぐに元に戻すには、ボタンコマンドツールバーの［元に戻す］アイ

コンをクリックします。切り取りの操作は、十分に確認してから行ってください。

サムネイルビューで移動先のひとつ前のスライドを選択します。
ボタンコマンドツールバーの［貼付け］アイコンをクリックします。

他の方法：移動先のひとつ前のスライドを右ボタンでクリックしてショート
カットメニューの［貼り付け］を選択します。

Page80ViewletBuilder6UsersGuide

July-2011スライドの削除
ひとつのスライドの削除
サムネイルビューでスライドを選択します。
ボタンコマンドツールバーの［削除］アイコンをクリックします。

他の方法：サムネイルの上で右ボタンをクリックしてショートカットメニューから［削除］を選択します。あるいは、キーボードの［Delete］キーを押します。

［削除］パネルが表示されます。

確認して［はい］ボタンをクリックします。
削除を取りやめる場合には［いいえ］ボタンをクリックします。
複数スライドの一括削除
サムネイルタブをクリックします。サムネイルビューが最前面に表示されます。
削除する複数のスライドを選択します。
ドラッグしながら対角を選択して囲まれた複数のスライドを選択します。
キーボードの［Ctrl］キーを押しながらクリックしてひとつずつ追加選択することもできます。

上記の「ひとつのスライドの削除」と同様の手順で削除します。

Page81

ViewletBuilder6UsersGuide

July-2011スライドの非表示
削除するのではなくプレビューやコンパイルなどの際にスライドを含めず表示させない方法です。必要なときに再び表示させる設定に戻すことができ便利です。
スライドの表示／非表示の切り替え
サムネイルビューでスライドを選択します。
連動ツールバーの［スライドを表示］アイコンあるいは、［スライドを隠す］アイ

コンをクリックします。
隠す設定になっているスライドはサムネイルの左下に×マークが表示されています。また、
サムネイルは半透明になっています。

隠す設定にされているスライドは、プレビューの際には表示されません。サウン
ドが含まれている場合も再生されません。コンパイルにも含まれません。スライド
数のカウントには含まれます。

Page82

ViewletBuilder6UsersGuide

July-2011プロジェクトのリサイズ
ファイルサイズを小さくする、表示サイズを小さくする、大きくするためにプロジェクト
自身のサイズを変更することができます。便利な機能ですが、一度変更すると取消ができませんので、元ファイルのバックアップをとり作業することをお勧めします。
プロジェクトメニューからプロジェクトのリサイズを選択します。

Page83ViewletBuilder6UsersGuide

July-2011

リサイズウィンドウ

新しいプロジェクトサイズ

リサイズしたい幅

高さをピクセル単位で入力します。

縦横比を固定するにチェックを入れると縦横比率が固定されてリサイズされます。

スケール

チェックした項目はリサイズ時に同時にスケールが変更されます。

テキスト、吹き出し等は、リサイズ前の大きさ、フォントサイズが維持されます。

Page84ViewletBuilder6UsersGuide

July-2011プロジェクトのトリミング
プロジェクトの一部を切り取り、トリミングする機能です。便利な機能ですが、一度変更
すると取消ができませんので、元ファイルのバックアップをとり作業することをお勧めします。

Page85ViewletBuilder6UsersGuide

July-2011

トリミングの操作

プロジェクトウィンドウに表示された赤枠の境界線をマウスでドラッグして削除したい領域まで移動します。赤く表示された部分がトリミング（削除）されます。
領域が確定したら「トリミングを適用をクリックします。
中止をする場合は「トリミングを中止」をクリックします。
幅

高さを確認して領域を確定します。
トリミングはすべてのスライドで一括処理されます。カーソルの位置、吹き出し等がトリミングされる領域に入らないように注意して行いましょう。

Page86

ViewletBuilder6UsersGuide

July-2011

サウンド
ビューレットビルダー６ではスライドやオブジェクトにサウンドを加えることができます。

スライドのサウンド
サムネイルビューからスライドを選択します。
連動ツールバーの［スライドにサウンドを挿入する...］アイコンをクリックします。

［サウンド］パネルが表示されます。

［サウンドファイル...］フォルダアイコンをクリックして既存のサウンドファイルを選択します。
サポートされているサウンドデータのファイル形式は、MP3、RAW、AIF、
WAV および AU になります。

［OK］ボタンをクリックします。
サウンドが挿入されると、サムネイルの下部にサウンドマークが表示されます。

Page87

ViewletBuilder6UsersGuide

July-2011

オブジェクトのサウンド
ビューレットビルダー６では、メッセージや形状のオブジェクトごとにサウンドファイルを定義することができます。表示と同時に再生させることができます。
サウンドの挿入
スライドに配置されているオブジェクトを選択します。
吹き出しの場合は、［吹き出しにサウンドを挿入する...］連動ツールバーのアイコンをクリックします。
オブジェクトの種類別にアイコンが準備されており、する...］、［メモにサウンドを挿入［テキストボックスにサウンドを挿入する...］、［形状にサウンドを挿入する...］が選択されているオブジェクトに応じて表示されています。

［サウンド］パネルが表示されます。

［サウンドファイル...］フォルダアイコンをクリックして既存のサウンドファイルを選択します。
［OK］ボタンをクリックします。
オブジェクトの右下にサウンドのマークが表示されます。（コンパイル後の Viewlet では
表示されません）

Page88ViewletBuilder6UsersGuide

July-2011

サウンドの録音
ビューレットビルダー６では音声の録音が可能です。MP3 形式を使用しています。
録音にはサウンドカードが必要です。

サムネイルビューからスライドまたは、スライドビューからオブジェクトをクリックして選択します。
［サウンド］パネルを表示します。（下図はオブジェクトの［サウンド］パネルです）
スライドの［サウンド］パネルの表示方法は、「スライドのサウンド」の項を、
オブジェクトの［サウンド］パネルの表示方法は、「オブジェクトのサウンド」の項をご参照ください。

赤色の円［録音］ボタンをクリックします。

カウントダウンが始まります。
カウントダウンの秒数設定については、「ビューレットビルダー６の基本設定」の項をご参照ください。

Page89ViewletBuilder6UsersGuide

July-2011カウントダウンに続いてマイクを通して音声を入力します。

録音を終了するには赤色の四角形［停止］ボタンをクリックします。
［OK］ボタンをクリックします。

サウンドファイルの再生
サウンドを含むスライドまたは、オブジェクトを選択します。
［サウンド］パネルを表示します。（下図はスライドの［サウンド］パネルです）
スライドの［サウンド］パネルの表示方法は、「スライドのサウンド」の項を、
オブジェクトの［サウンド］パネルの表示方法は、「オブジェクトのサウンド」の項をご参照ください。

緑色の矢印［再生］ボタンをクリックします。

Page90ViewletBuilder6UsersGuide

July-2011

サウンドファイルの削除
削除したいサウンドを含むスライドまたは、オブジェクトを選択します。
［サウンド］パネルを表示します。（下図はスライドの［サウンド］パネルです）
スライドの［サウンド］パネルの表示方法は、「スライドのサウンド」の項を、
オブジェクトの［サウンド］パネルの表示方法は、「オブジェクトのサウンド」の項をご参照ください。

赤色の×［サウンドを削除］アイコンをクリックします。
［OK］ボタンをクリックします。

サウンドのエクスポート
サウンドをプロジェクト外にファイルとして出力することができます。
メニューバーから［ファイル］→［エクスポート］→［サウンド...］を選択します。
［サウンドのエクスポート］パネルが表示されます。

サウンドを含むスライドを指示するため［スライド］欄でオプションを選択します。
［エクスポート］ボタンをクリックします。
保存先を指示します。

サウンドのエクスポートは、MP3、RAW、AIF、WAV、

AU 形式がサポートされています。

Page91

ViewletBuilder6UsersGuide

July-2011

画像オブジェクト
スライド上にイメージを複数配置させることができます。ビューレットビルダー６では、JPEG、GIF、TIFF、JPG、TIF、PNG および BMP の画像ファイル形式がサポートされています。これらにはイベントを定義することもできます。

画像の挿入
オブジェクトツールバーの［画像の挿入］アイコンをクリックします。

［画像の挿入］パネルが表示されます。
ブラウザで画像ファイルを選択します。
［開く］ボタンをクリックするとスライドの中心に画像オブジェクトが表示されます。

画像の編集［画像のプロパティ］パネルで数値を変更する方法もあります。

画像の移動
スライド上の画像オブジェクトをクリックして選択します。
ドラッグ・アンド・ドロップで画像を移動します。このときカーソルは手の形に変わります。

サイズの変更スライド上の画像オブジェクトをクリックして選択します。
ハンドルをドラッグ・アンド・ドロップして画像の大きさを変えます。このときカーソル
は両方向矢印に変わります。

Page92

ViewletBuilder6UsersGuide

July-2011

画像の透過率
スライド上の画像オブジェクトをクリックして選択します。
連動ツールバーの［丌透明度（％）］欄に値を入力します。スピンボタンで変更することもできます。

画像の重ね順
スライド上の画像オブジェクトを右ボタンでクリックしてショートカットメニューの［重ね順］から移動させたい場所へのコマンドを選択します。
画像の削除
スライド上の画像オブジェクトをクリックして選択します。
キーボードの［Delete］キーを押します。
他の方法：右ボタンをクリックしてショートカットメニューから［削除］を選択します。あるいは、ボタンコマンドツールバーの［削除］アイコンをクリッ

クします。

Page93ViewletBuilder6UsersGuide

July-2011プロパティ
スライド上の画像オブジェクトを選択します。
連動ツールバーの［画像プロパティ...］アイコンをクリックします。

他の方法：スライド上の画像オブジェクトを右ボタンでクリックしてショート
カットメニューから［画像プロパティ...］を選択します。

［画像のプロパティ］パネルが表示されます。

［名前］：画像オブジェクトの名前です。
［ロケーションとサイズ］：位置と大きさを数値で指示することができます。
［タイミング］：「画像オブジェクトのタイミング」の項をご参照ください。
［OK］ボタンをクリックすると適用されてパネルが閉じます。

Page94ViewletBuilder6UsersGuide

July-2011

「イベントとアクション」の項をご参照ください。

Page95ViewletBuilder6UsersGuide

July-2011

形状オブジェクト
長方形、楕円形、多角形などを作成してオブジェクトとしてスライド上に配置することができます。これらにはイベントを定義することもできます。
オブジェクトツールバーの［形状の挿入］アイコンをクリックします。

連動ツールバーに下図のようなアイコンが表示されます。

形状オブジェクトの作成ツールには、［長方形ツール］［楕円ツール］［フリーハンドツール］［多角形ツール］
があります。

Page96

ViewletBuilder6UsersGuide

July-2011

長方形ツール
正方形・長方形のオブジェクトを作成します。
オブジェクトツールバーの［形状の挿入］アイコンをクリックします。

続いて連動ツールバーの［長方形ツール］アイコンをクリックします。

十字カーソルを対角にドラッグ・アンド・ドロップして長方形を作成します。

キーボードの［Shift］キーを押しながらドラッグ・アンド・ドロップすると正方形を作成します。

楕円ツール
円形・楕円形のオブジェクトを作成します。
オブジェクトツールバーの続いて連動ツールバーの［形状の挿入］アイコンをクリックします。
［楕円ツール］アイコンをクリックします。

十字カーソルをドラッグ・アンド・ドロップして楕円形を作成します。

キーボードの［Shift］キーを押しながらドラッグ・アンド・ドロップすると円を作成します。

Page97

ViewletBuilder6UsersGuide

July-2011フリーハンドツール
丌規則な形状のオブジェクトを作成します。
オブジェクトツールバーの続いて連動ツールバーの［形状の挿入］アイコンをクリックします。
［フリーハンドツール］アイコンをクリックします。

投げ縄カーソルをドラッグして自由な形状を作成します。

カーソルをドロップした場所から始点へつながれて閉じた形状が作成されます。

多角形ツールオブジェクトツールバーの［形状の挿入］アイコンをクリックします。

続いて連動ツールバーの［多角形ツール］アイコンをクリックします。

投げ縄カーソルでスライド上をクリックします。

クリックした箇所に頂点が作られます。
続けて頂点となる箇所をクリックしていきます。
キーボードの［Shift］キーを押しながらクリックすると４５°で線を置きます。

Page98ViewletBuilder6UsersGuide

July-2011

多角形の閉じ方
始点の位置にカーソルを置くと、投げ縄カーソルの右下に［。］が表示されます。
ここでクリックすると多角形が閉じられます。

他の方法：ダブルクリックするとその箇所から始点へとつながれて閉じた多角形が作成されます。または、キーボードの［Enter］キーを押すとその箇所から始点へとつながれて閉じた多角形が作成されます。

形状の編集
移動
スライド上の形状オブジェクトをクリックして選択します。
ドラッグ・アンド・ドロップで形状を移動します。このときカーソルは手の形に変わります。

［形状のプロパティ］パネルで数値を変更する方法もあります。

Page99ViewletBuilder6UsersGuide

July-2011サイズの変更
スライド上の形状オブジェクトをクリックして選択します。
ハンドルをドラッグ・アンド・ドロップして形状の大きさを変えます。このときカーソル
は両方向矢印に変化しています。

キーボードの［Shift］キーを押しながらドラッグ・アンド・ドロップすると
幅：高さの比率を固定したまま大きさを変えることができます。

形状の重ね順
スライド上の形状オブジェクトを右ボタンでクリックしてショートカットメニューの［重ね順］から移動させたい場所へのコマンドを選択します。
形状の削除
スライド上の形状オブジェクトをクリックして選択します。
キーボードの［Delete］キーを押します。
他の方法：右ボタンをクリックしてショートカットメニューから［削除］を選択します。あるいは、ボタンコマンドツールバーの［削除］アイコンをクリッ

クします。

Page100

ViewletBuilder6UsersGuide

July-2011

色の吸着
スタイルシートの変更や適用などを行なわずに簡単にオブジェクトから他のオブジェクト
へ個々のスタイルをコピーする機能です。
基にするオブジェクトを選択します。

ボタンコマンドツールバーの［色の吸着］アイコンをクリックしてオンにします。

色の吸着機能はアイコンがオンになっている間有効です。

カーソルがに変わります。

他のオブジェクトをクリックします。

オブジェクトの色が変更されます。

この作業を終えるには［色の吸着］アイコンをオフにします。
Page101

ViewletBuilder6UsersGuide

July-2011プロパティ
スライド上の形状オブジェクトを選択します。
連動ツールバーの［形状のプロパティ...］アイコンをクリックします。

他の方法：スライド上の形状オブジェクトを右ボタンでクリックしてショート
カットメニューから［形状のプロパティ...］を選択します。

［形状のプロパティ］パネルが表示されます。

［名前］：形状オブジェクトの名前です。
［ロケーションとサイズ］：位置と大きさを数値で指示することができます。
［タイミング］：「形状オブジェクトのタイミング」の項をご参照ください。
［OK］ボタンをクリックすると適用されてパネルが閉じます。

Page102

ViewletBuilder6UsersGuide

July-2011

画像と形状のタイミング
オブジェクトをスライドに表示させるタイミングと時間を調整します。プロパティを設定する方法と［タイムライン］タブ上で設定する方法があります。

プロパティからの調整
画像オブジェクトのタイミング
スライド上の画像オブジェクトを選択します。
連動ツールバーの［画像プロパティ...］アイコンをクリックします。

他の方法：スライド上の画像オブジェクトを右ボタンでクリックしてショート
カットメニューから［画像プロパティ...］を選択します。

［画像のプロパティ］パネルが表示されます。
詳細は次ページをご参照ください。

形状オブジェクトのタイミング
スライド上の形状オブジェクトを選択します。
連動ツールバーの［形状のプロパティ...］アイコンをクリックします。

他の方法：スライド上の形状オブジェクトを右ボタンでクリックしてショート
カットメニューから［形状のプロパティ...］を選択します。

［形状のプロパティ］パネルが表示されます。
詳細は次ページをご参照ください。

Page103ViewletBuilder6UsersGuide

July-2011

［タイミング］欄でドロップダウンリストからオプションを選択します。
［タイミング手動設定］
オブジェクトの表示時間を制作者が指示します。

スライド上にオブジェクトを表示する［開始時間］と［表示時間］の秒数をキーボードから入力するかあるいは、スピンボタンで変更します。
スライドが表示されてからそのオブジェクトが表示されるまでの秒差を［開始時間］とします。

［スライドの最後まで］
スライド上にオブジェクトを表示し始める［開始時間］を指示します。オブジェクトは次のスライドに移行するまでの間、表示され続けます。

Page104

ViewletBuilder6UsersGuide

July-2011［タイムライン］タブ内での調整
スライドビュー下の［タイムライン］タブをクリックして最前面に表示します。
スライド上のオブジェクトを選択します。
オレンジ色の長方形は選択されているオブジェクトの表示時間を示しています。
ドラッグ・アンド・ドロップで移動してタイミングを変更したり、長方形の長さを調節することで表示時間を変更したりすることができます。

Page105

ViewletBuilder6UsersGuide

July-2011

複数オブジェクトの調整
スライド上のオブジェクトのひとつをクリックして選択します。続けて［Ctrl］キーを押しながら他のオブジェクトをクリックして選択に追加します。

他の方法：オブジェクトの上で右ボタンをクリックしてショートカットメ
ニューから［タイミング］を選択してオプションを選択します。

［同じ開始時間］：選択されたオブジェクトを同時にスライド上に表示させます。
［同じ終了時間］：選択されたオブジェクトをスライド上から同時に非表示にします。
［同じ開始 終了時間］：同時に表示し同時に非表示にします。
［スライド終了まで表示する］：スライドの終わりまで表示させます。
［シークエンス時間］：選択した順番でひとつずつ表示・非表示していきます。

Page106

ViewletBuilder6UsersGuide

July-2011タイミングリンク
オブジェクトの表示のタイミングを相互関係で定義しておくことができます。タイムライ
ン上の異なる２つのオブジェクトが連結されることによって、一方が変更された場合に、その関係性を維持したまま他方の要素が更新されます。

タイミングリンクの追加
スライド上の２つのオブジェクトを選択します。
このときの選択順序は重要です。注意してください。

タイムラインの右側にある、［タイミングリンクの追加...］アイコンをクリックします。

［タイミングリンク］パネルが表示されます。

Page107

ViewletBuilder6UsersGuide

July-2011［リンクタイプ：］フィールド
タイミングリンクの方法には次の４種類があります。

タイミングリンクのタイプを選択します。
［エンドからスタートへ］：はじめに選択されたオブジェクトの動作終了後に続けて２番目に選択されたオブジェクトを動作します。
［スタートからエンドへ］：２番目に選択されたオブジェクトの動作終了後に続けてはじめに選択されたオブジェクトを動作します。
［スタートを一致］：はじめに選択されたオブジェクトの動作開始時に２番目に選択されたオブジェクトの動作開始時を合わせます。
［エンドを一致］：はじめに選択されたオブジェクトの動作終了時と２番目に選択されたオブジェクトの動作終了時を合わせます。
［OK］ボタンをクリックします。
指示されたオブジェクトの表示時間とタイミングが変更されます。
タイムライン上のオレンジの長方形の位置が変化します。（下図は、その一例です）

タイミングルールを手動に切り替えるためにメッセージが表示されることがあります。

タイミングリンクの解除
解除したいオブジェクトを選択します。
タイムラインの右側にある

Page108［タイミングリンクを取り除く］をクリックします。

ViewletBuilder6UsersGuide

July-2011

Page109

ViewletBuilder6UsersGuide

July-2011

ボタンオブジェクト
ボタンオブジェクトは閲覧者と Viewlet の間の対話性を拡張するのに有効な要素です。

ボタンの配置
オブジェクトツールバーの［ボタンの挿入］アイコンをクリックします。

デフォルトスタイルのボタンオブジェクトがスライド上に配置されます。

プロパティ
スライド上のボタンオブジェクトを選択します。
連動ツールバーの［ボタンのプロパティ...］アイコンをクリックします。

［ボタンのプロパティ］パネルが表示されます。

［名前］欄の［テキスト：］フィールド：入力した文字列がボタン内に表示されます。
［ロケーションとサイズ］欄：表示する位置とサイズを指示します。
数値で指示することができるので、別のスライドと位置を揃えるときなどに便利です。

［タイミング］欄：ボタンの表示時間を調整します。
［OK］ボタンをクリックするとパネルが閉じて適用されます。

Page110ViewletBuilder6UsersGuide

July-2011

ボタンの編集
ボタンのタイプ
スライド上のボタンオブジェクトを選択します。
連動ツールバーの［ボタンスタイル...］アイコンをクリックします。

［ボタン スタイル］パネルが表示されます。

スタイルを選択します。
［OK］ボタンをクリックするとパネルが閉じて適用されます。
移動
スライド上のボタンオブジェクトを選択します。
ドラッグ・アンド・ドロップでボタンを移動します。カーソルは手の形に変わります。
サイズの変更スライド上のボタンオブジェクトを選択します。
ハンドルをドラッグ・アンド・ドロップしてボタンの大きさを変えます。このときカーソ
ルは両方向矢印に変化しています。
削除
スライド上のボタンオブジェクトを選択します。
キーボードの［Delete］キーを押します。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。

Page111ViewletBuilder6UsersGuide

July-2011

イベントとアクション
ビューレットビルダー６では、スライドの進行や閲覧者の動作に合わせてスライドやオブジェクトなどの動きを指示することができます。

イベントとアクションの一覧
イベントとアクションはオプションとして用意されています。以下はその種類です。
イベント

イベントの種類

アクション（全イベントに共通）

クリック時
ハイパーリンクのイベント
ロールオーバークリック時
画像のイベント
ロールオーバー

スライドに移動ロールアウト

スライドを移動クリック時

スライドのリピート

実行前

ウェブページを開く

実行後

Viewletを再生

キーアクション

Viewletを一時停止

実行前

Email To

実行後

JavaScript

キーアクション

オブジェクトを表示する

正解の時

オブジェクトを隠す

未解答時

サウンドの再生タイムアウト時

ムービー再生形状のイベント
ボタンのイベント
スライドのイベント（クイズゾーンなし）

スライドのイベント（クイズゾーンあり）

不正解の時

全て

スコア表示

最後のスライド以外全て 解答を判定する
最初

サブミット・スコア

2番目

ムービーを閉じる

3番目
最後
残り

Page112ViewletBuilder6UsersGuide

July-2011スライドのイベント
サムネイルビューでスライドを選択します。
連動ツールバーの［イベント...］アイコンをクリックします。

［スライドのイベント］パネルが表示されます。

［実行前］タブ：スライドのロードのあとに指示するアクションです。
［実行後］タブ：スライドが切り替わる前のアクションです。
［キーアクション］タブ：指示したキーを閲覧者が押したときのアクションです。

Page113

ViewletBuilder6UsersGuide

July-2011

形状オブジェクトのイベント
スライド上の形状オブジェクトを選択します。
連動ツールバーの［イベント...］アイコンをクリックします。

［形状のイベント］パネルが表示されます。

［クリック時］タブ：閲覧者が形状オブジェクトをクリックした時のアクションです。
［ロールオーバー］タブ：閲覧者がマウスカーソルを形状オブジェクトの上に置いたときのアクションです。
［ロールアウト］タブ：閲覧者がマウスカーソルを形状オブジェクトから離したときのアクションです。

Page114ViewletBuilder6UsersGuide

July-2011

画像オブジェクトのイベント
スライド上の画像オブジェクトを選択します。
連動ツールバーの［イベント...］アイコンをクリックします。

［画像のイベント］パネルが表示されます。

［クリック時］タブ：閲覧者が画像オブジェクトをクリックした時のアクションです。
［ロールオーバー］タブ：閲覧者がマウスカーソルを画像オブジェクトの上に置いたときのアクションです。
［ロールアウト］タブ：閲覧者がマウスカーソルを画像オブジェクトから離したときのアクションです。

Page115

ViewletBuilder6UsersGuide

July-2011

アクション
イベントに対する動作内容を指示します。
前述のイベントのパネルで、イベントのタブを選択します。
緑色の＋マーク［追加］アイコンをクリックします。
［アクション］パネルが表示されます。

［アクションタイプ］ドロップダウンリストからアクションを選択します。
アクションの種類に応じて下段にオプションが表示されます。
必要な項目の値を入力します。
［OK］ボタンをクリックするとパネルが閉じて適用されます。

Page116ViewletBuilder6UsersGuide

July-2011

順序の変更ひとつのスライドまたはオブジェクトに対して複数指示しているアクションはその順序を変更することができます。
イベントのタブで水色の△［上へ］アイコンでアクションを上の順番へ移動します。下へ移動するには水色の▽［下へ］アイコンをクリックします。

［OK］ボタンをクリックするとパネルが閉じて適用されます。

アクションの編集
イベントのタブ内で内容を変更したいアクションを選択して鉛筆マーク［変更］アイコンをクリックします。
［アクション］パネルが表示されます。
［アクションタイプ：］やオプションなどを変更します。
［OK］ボタンをクリックするとパネルが閉じて適用されます。

アクションの削除
イベントのタブ内でアクションを選択します。
赤色の×マーク［削除］アイコンをクリックします。
アクションが削除されます。
［OK］ボタンをクリックするとパネルが閉じて適用されます。

Page117

ViewletBuilder6UsersGuide

July-2011ハイパーリンク
ビューレットビルダー６では、文字列の部分を選択してハイパーリンクを設定することができます。
この他のオブジェクトに関するハイパーリンクはイベントとアクションで設定することができます。

メッセージのハイパーリンク（テキストリンク）
テキストボックス内の文字列に対してハイパーリンクを設定することができます。
リンクに使用する文字列を選択します。

連動ツールバーの［ハイパーリンク...］アイコンをクリックします。

［ハイパーリンク］パネルが表示されます。

定義するイベントのタブを選択します。
緑色の＋マーク［追加］アイコンをクリックします。

Page118

ViewletBuilder6UsersGuide

July-2011［アクション］パネルが表示されます。
［アクションタイプ］ドロップダウンリストから［ウェブページを開く］を選択します。
［URL］フィールドに URL を入力します。

［ウィンドウサイズ］と必要な［Windows オプション］を選択します。
［OK］ボタンをクリックするとパネルが閉じて適用されます。
ハイパーリンクの指示されている文字列には青色の下線（デフォルトのスタイ
ル）が引かれます。文字のスタイルは連動ツールバーや右ボタンのショートカット
メニューから変更することができます。

Page119

ViewletBuilder6UsersGuide

July-2011インタラクティブゾーン
動画コンテンツでの対話性は閲覧者の興味を惹きつけ、関心を維持するのに大切です。
ビューレットビルダー６の重要な特徴であるインタラクティブな動画を用いることによってトレーニング、マーケティング、リサーチなどにおいて必要になる情報をあつめることもできます。
インタラクティブゾーンの種類
一時停止ゾーン
このゾーンを挿入されたスライドで一時停止します。スライドの右下部に三角形の一時停止マークが表示されます。Viewlet 最盛時はこの一時停止マークは表示されず、閲覧者からは見えません。
クリック範囲型クイズゾーン
スライドの一部にクリックするための領域を配置します。たとえば閲覧者が画面上をクリックして解答するとき、その正否を判別するのにクリック範囲を配置しておきます。
テキスト型クイズゾーン
閲覧者がテキスト入力フィールドに解答を入力するタイプのクイズゾーンです。
キー入力型クイズゾーン
閲覧者のキー入力から正否を判別する形式のクイズゾーンです。
選択型クイズゾーン
選択肢から正解を選ぶ形式のクイズゾーンです。

Page120

ViewletBuilder6UsersGuide

July-2011スライドに含まれるインタラクティブゾーンの数
インタラクティブゾーンはその特性上ひとつのスライドにつきいずれかの種類をひとつ配置します。
重ねて配置しようとすると［警告］パネルが表示されます。

オプションを選択することでインタラクティブゾーンを置き換えることができます。また、
新しいスライドとして挿入することもできます。

サウンドの付加
ゾーンのオブジェクトにはサウンドを付加することもできます。
「サウンド」の項をご参照ください。

Page121

ViewletBuilder6UsersGuide

July-2011

応答メッセージオブジェクト
インタラクティブゾーンを作成するときは、閲覧者の解答に対しての応答を準備します。
たとえば、正解したときのメッセージオブジェクトや、丌正解を知らせるメッセージオブ
ジェクトなどです。アクションの組み合わせによって閲覧者をリンクから誘導することなどもできます。
クイズゾーンを挿入すると解答欄などのほかに応答に使用するメッセージオブジェクトが２または３種配置されます。

応答のメッセージオブジェクトは他のメッセージオブジェクトと同様にテキストのスタイ
ル、メッセージのタイプを編集することが可能です。
「メッセージオブジェクトの編集」の項をご参照ください。

緑色のメッセージオブジェクト：正解のとき表示されます。
ライム色のメッセージオブジェクト：解答が丌完全な場合に表示されます。解答を入力していないときあるいは、選択していないときなどです。
赤色のメッセージオブジェクト：丌正解の場合に表示されます。
応答オブジェクトの削除
スライドの応答オブジェクトを選択します。
キーボードから［Delete］キーをクリックします。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。

あるいは、ショートカットメニューから［削除］を選択します。
削除の対象となったオブジェクトによっては、同時にスライド内のクイズオブジェ
クト全体を削除するものがあります。

Page122

ViewletBuilder6UsersGuide

July-2011

イベントとアクション
クイズゾーンにイベントとアクションを定義することもできます。
クイズゾーンを含んでいるスライドを選択します。
連動ツールバーの［イベント...］アイコンをクリックします。

［スライドのイベント］パネルが表示されます。

イベントのタブを選択します。
緑色の＋マーク［追加］アイコンをクリックします。
［アクション］パネルが表示されます。
アクションを選択してオプションを設定します。
［OK］ボタンをクリックします。

Page123

ViewletBuilder6UsersGuide

July-2011スコアリング
インタラクティブゾーンでは閲覧者の入力、解答に対して制限時間を設けたり、得点を設定したりすることが可能です。
スコア設定
クイズゾーンを含むスライドを選択します。
連動ツールバーの［スコア設定...］アイコンをクリックします。

［スコア］パネルが表示されます。

［得点］欄：正解に対する配点を設定します。
［解答回数］欄：解答を許される回数の上限を設定します。これに達すると丌正解とします。
［再解答を許可する］チェックボックス：Viewlet を連続して再生したとき、同じクイズに対して再び解答することができるようにするにはこれをオンにします。
［時間］欄：解答までの制限時間です。チェックボックスをオンにすると制限時間内に解答しない場合丌正解となります。
［OK］ボタンをクリックすると適用されてパネルが閉じます。

Page124

ViewletBuilder6UsersGuide

July-2011

クリック範囲型クイズゾーン
スライドの一部に配置される、閲覧者のクリックによって動作する領域です。この領域を閲覧者がクリックしたとき正解となります。

・クリックの領域を示すオブジェクト
・２つの応答メッセージオブジェクト
以上のものが含まれます。

配置
クイズゾーンを配置するスライドを選択します。
オブジェクトツールバーの［挿入 クリック範囲型クイズ］アイコンをクリックします。

デフォルトのクリック範囲と 3 種類の応答メッセージオブジェクトがスライド中央に配置されます。
応答のメッセージオブジェクトは他のメッセージオブジェクトと同様にテキス
トのスタイル、メッセージのタイプを編集することが可能です。

Page125

ViewletBuilder6UsersGuide

July-2011

クリック範囲のプロパティ
Viewlet として再生されたときのクリック範囲の背景色、丌透明度、境界線の色と線の太さをそれぞれ状況別に変更することができます。
クリック範囲をダブルクリックします。
他の方法：クリック範囲を選択して連動ツールバーの［クリック範囲の変更...］アイコンをクリックします。あるいは、クリック範囲を右ボタンでクリック
してショートカットメニューから［クリック範囲の変更...］を選択します。

［クリック範囲］パネルが表示されます。

［ノーマル］欄：下記２つの状態以外での見え方。
［ロールオーバー］欄：クリック範囲に閲覧者のマウスカーソルが載っている状態での見え方。
［選択状態］欄：閲覧者がクリック範囲をクリックしたときの見え方。
［ダブルクリックで選択する］チェックボックス：閲覧者が回答するときシングルクリッ
クではなくダブルクリックを使用します。

Page126

ViewletBuilder6UsersGuide

July-2011

［背景色］［背景色］アイコンをクリックします。
［背景色］カラーパレットが表示されます。

カラーを選択します。
［OK］ボタンをクリックすると背景色として適用されてパネルが閉じます。
［不透明度］

丌透明を１００として丌透明度を入力します。
［境界線］

境界線の太さを入力します。
単位は pixel です。

［境界線色］アイコンをクリックします。
［境界線色］カラーパレットが表示されます。
カラーを選択します。
［OK］ボタンをクリックすると適用してパネルを閉じます。

Page127

ViewletBuilder6UsersGuide

July-2011

クリック範囲の編集
移動
スライド内のクリック範囲を選択します。
ドラッグ・アンド・ドロップでクリック範囲を移動します。このときカーソルは手の形に変わります。
サイズ変更
スライド内のクリック範囲を選択します。
ハンドルをドラッグ・アンド・ドロップしてクリック範囲の大きさを変えます。このときカーソルは両方向矢印に変化しています。

クイズオブジェクトの削除
スライド内のクリック範囲を選択します。
キーボードの［Delete］キーを押します。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。あるいは、クリック範囲の上で右ボタンをクリックしてショートカットメ
ニューから［削除］を選択します。

クイズオブジェクト全体が削除されます。

Page128

ViewletBuilder6UsersGuide

July-2011

テキスト入力型クイズゾーン
閲覧者が解答欄に文字列を入力する形式のインタラクティブゾーンです。

・テキストを入力するフィールド・３つの応答メッセージオブジェクト
以上のものが含まれます。

配置
クイズゾーンを配置するスライドを選択します。
オブジェクトツールバーの［挿入 テキスト型クイズ］アイコンをクリックします。

デフォルトのテキスト入力フィールドと 3 種類の応答メッセージオブジェクトがスライド中央に配置されます。

Page129

ViewletBuilder6UsersGuide

July-2011

クイズゾーンの編集
テキスト入力フィールドの編集
テキスト入力フィールドをダブルクリックします。
他の方法：テキスト入力フィールドを選択して連動ツールバーの［正解の編集...］アイコンをクリックします。
あるいは、テキスト入力フィールドの上で右ボタンをクリックしてショートカット
メニューから［正解の編集...］を選択します。

［変更 テキストフィールド］パネルが表示されます。

［正解］フィールド：正解を入力します。
複数の正解を用意するには、改行して入力します。

［確定キー：］：閲覧者が解答の入力を確定するための動作をドロップダウンリストから選択します。
日本語入力システムの変換機能で使用するキーと重複しないようにします。
［確定キー：］ドロップダウンリストで［None］を選択したときは、入力を確定するためにボタンオブジェクトなどを追加しておきます。
ボタンオブジェクトの［クリック時］のイベントに［解答を判定する］アクションを定義しておきます。これで閲覧者の解答の正否が判定されます。

［大文字小文字を区別する］：正解が固有名詞などの場合区別する必要があります。
［右端で折り返す］：入力された内容がテキスト入力フィールドの長さよりも長くなった
場合に右端で折り返して表示させるにはこのチェックボックスをオンにします。
［入力文字列を伏せ字にする］：閲覧者がテキストフィールドに入力した文字をパスワー
ド入力の際のように伏せ字にする機能です。

Page130

ViewletBuilder6UsersGuide

July-2011

テキスト入力フィールドの移動
スライド内のテキスト入力フィールドを選択します。
ドラッグ・アンド・ドロップでテキスト入力フィールドを移動します。このときカーソル
は手の形に変わります。
サイズ変更
スライド内のテキスト入力フィールドを選択します。
ハンドルをドラッグ・アンド・ドロップしてテキスト入力フィールドの大きさを変えます。
このときカーソルは両方向矢印に変化しています。

クイズオブジェクトの削除
スライド内のテキスト入力フィールドを選択します。
キーボードの［Delete］キーをクリックします。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。あるいは、テキスト入力フィールドの上で右ボタンをクリックしてショー
トカットメニューから［削除］を選択します。

クイズオブジェクト全体が削除されます。

Page131

ViewletBuilder6UsersGuide

July-2011

キー入力型クイズゾーン
指定されたキーを閲覧者が押したかどうかを判定することができます。

・キーストロークオブジェクト
・解答に対する３つの応答のメッセージオブジェクト
以上のものが含まれます。

配置
クイズゾーンを配置するスライドを選択します。
オブジェクトツールバーの［挿入 キー入力型クイズ］アイコンをクリックします。

キーストロークと３つの応答メッセージのオブジェクトがスライド中央に配置されます。

キーストロークの定義
キー入力型クイズゾーンを含むスライドを選択します。
連動ツールバーの［キーストローク定義...］アイコンをクリックします。

他の方法：右ボタンをクリックしてショートカットメニューから［キーストローク定義...］選択します。

［キーストローク定義］パネルが表示されます。（下図参照）［定義...］ボタンをクリックします。
［何かキーを押してください。］の文字が点滅します。

キーボードから任意のキーを押します。
シングルキーおよび組み合わせでの定義が可能です。
［OK］ボタンをクリックすると確定してパネルを閉じます。
Page132

ViewletBuilder6UsersGuide

July-2011

選択型クイズゾーン
選択肢のあるクイズ形式のインタラクティブゾーンです。

・問いのためのメッセージオブジェクト
・解答のための選択肢とチェックボックス
・解答を確定するためのボタンオブジェクト
・３つの応答メッセージオブジェクト
以上のものが含まれます。

配置
クイズゾーンを配置するスライドを選択します。
オブジェクトツールバーの［挿入 選択型クイズ］アイコンを選択します。

メッセージオブジェクトとチェックボックス、ボタンオブジェクト、応答メッセージのオ
ブジェクトがスライド中央に配置されます。
質問のメッセージオブジェクトの編集
質問のメッセージオブジェクトをダブルクリックします。
他の方法：右ボタンでクリックしてショートカットメニューから［メッセージ
編集...］を選択します。

メッセージ内のカーソルが点滅します。
メッセージを編集します。
完了したら、オブジェクトの外側でクリックして選択を解除します。

Page133

ViewletBuilder6UsersGuide

July-2011

選択肢の追加
スライド内の選択肢オブジェクトのひとつを選択します。
連動ツールバーの［選択肢を追加］アイコンをクリックします。

スライド内に新しく選択肢オブジェクトが配置されます。

選択肢の削除
選択肢オブジェクトを選択します。
キーボードの［Delete］キーをクリックします。
他の方法：ボタンコマンドツールバーの［削除］アイコンをクリックします。あるいは、選択肢オブジェクトの上で右ボタンをクリックしてショート
カットメニューから［削除］を選択します。

選択肢オブジェクトが削除されます。

正否の設定
正解に設定する選択肢のチェックボックスをダブルクリックします。
チェックマークが表示されます。

チェックマークを取り消すには、ダブルクリックします。
連動ツールバーの［正解の編集...］アイコンをクリックすることでも正否の設定を切り替えることができます。

複数の正解正解とする選択肢全てに上記と同様の方法でチェックマークを表示させます。

選択肢のメッセージオブジェクトの編集
質問のメッセージオブジェクトの編集方法と同様です。

Page134

ViewletBuilder6UsersGuide

July-2011

解答確定のボタンオブジェクトの編集
スライド内の解答のボタンオブジェクトを選択します。

連動ツールバーの［ボタンのプロパティ...］アイコンをクリックします。

他の方法：ボタンオブジェクトをダブルクリックします。
あるいは、ボタンオブジェクトの上で右ボタンをクリックしてショートカットメ
ニューから［ボタンのプロパティ...］を選択します。

［ボタンのプロパティ］パネルが表示されます。

［名前：］フィールド：オブジェクトの名前です。
［テキスト：］フィールド：実際にオブジェクトに表示される文字列です。
［OK］ボタンをクリックすると適用されてパネルが閉じます。
ボタンのスタイルやイベントとアクションについては、「ボタンオブジェクトの編集」の項をご参照ください。

Page135

ViewletBuilder6UsersGuide

July-2011

クイズゾーンの削除
スライド内の質問や選択肢のすべてを削除するには、オブジェクトツールバーの［挿入 選択型クイズ］アイコンを選択します。
［警告］パネルが表示されます。

［取り消す］オプションを選択します。
［OK］ボタンをクリックするとスライド内のクイズ全体が削除されます。

Page136

ViewletBuilder6UsersGuide

July-2011

チェックボックスのスタイル
チェックボックスのスタイルを変更することができます。
チェックボックスを右ボタンでクリックしてショートカットメニューから［チェックボッ
クスのスタイル］を選択します。

［チェックボックススタイル...］［チェックボックス

Page137

スタイル］パネルが表示されます。

ViewletBuilder6UsersGuide

July-2011

スタイルを選択します。
［OK］ボタンをクリックします。
ラジオボタンのオブジェクトがスライド上に配置されます。

正否の設定はラジオボタンのダブルクリックで行います。

Page138

ViewletBuilder6UsersGuide

July-2011一時停止ゾーン
Viewlet の再生を中断させるために使用します。
たとえば、閲覧者がハイパーリンクをクリックする必要のあるときなどに画面を停止させておきます。

一時停止ゾーンの挿入
オブジェクトツールバーの［挿入 一時停止］アイコンをクリックします。

赤色の三角形がスライドの右下に表示されます。

この三角形の表示されたスライドの箇所で再生が一旦停止します。
Viewlet ではこの三角形は表示されません。

一時停止ゾーンの削除
オブジェクトツールバーの［挿入 一時停止］アイコンをクリックします。

［警告］パネルが表示されます。

［取り消す］オプションを選択します。
［OK］ボタンをクリックすると一時停止マークが取り消されます。

Page139

ViewletBuilder6UsersGuide

July-2011

辞書・スペルチェック
ビューレットビルダー６には辞書とスペルチェック機能があります。
入力された内容を辞書によってチェックし、スペルの間違いがあると思われる場合に強調表示します。
辞書の設定
メニューバーから［編集］→［基本設定...］を選択します。
［基本設定］パネルが表示されます。
［スペル］タブをクリックします。

ドロップダウンリストから言語を選択します。
必要なオプションのチェックボックスをオンにします。
［OK］ボタンをクリックするとパネルが閉じて適用されます。
スペルチェック機能
メニューバーから［表示］→［スペルチェック］を選択して、オンにします。
スライド上のテキストにスペルミスがあるとき、赤色の波線が単語の下部に表示されます。
スペルチェックを行なわないときは、［スペルチェック］をオフにします。

Page140

ViewletBuilder6UsersGuide

July-2011

スペルミスの修正と辞書登録
赤色の波線の表示されているテキストを右ボタンでクリックしてショートカットメニューからオプションを選択します。
オプションと方法は次の通りです。
［（スペルミスの内容）を置き換える］：このオプションをポイントすると置換候補が表示されます。選択すると置換されます。置換候補は学習して辞書に登録されたものが表示されています。
［全ての（スペルミスの内容）を置き換える］：他の同じ単語を置換候補から選択した単語で一括して置き換えます。
［全てを無視（スペルミスの内容）］：赤色の波線で表示されているスペルのままで他の同じ単語も波線を非表示にします。
［学習（スペルミスの内容）］：現在のスペルを辞書に登録します。

Page141

ViewletBuilder6UsersGuide

July-2011

検索と置き換え
ボタンコマンドツールバーの［検索と置き換え...］ボタンをクリックします。

検索［検索と置き換え］パネルが表示されます。
［検索］タブをクリックします。

［テキスト］欄：検索文字列を入力します。
［大文字小文字の区別］オプション：英数字の大文字と小文字を区別して検索するには、
このチェックボックスをオンにします。
［ディレクション］欄：検索をする方向を選択します。
［スライド］欄：検索の範囲をスライド単位で指定します。

Page142

ViewletBuilder6UsersGuide

July-2011

置換［検索と置き換え］パネルの［置換］タブをクリックします。

［テキスト］欄：検索文字列を入力します。
［置き換える］欄：検索した文字列と置き換えるための文字列を入力します。
［大文字小文字の区別］オプション、［ディレクション］欄、［スライド］欄の指定方法は［検索］タブのものと同様です。

［全て置き換える］ボタン：指定の文字列で検索、一括置換します。
［置き換え］ボタン：検索した文字列を置き換えます。
［次を検索］ボタン：置き換えないで次を検索します。

Page143

ViewletBuilder6UsersGuide

July-2011

印刷とレイアウト
スライドの内容を用紙に印刷することが可能です。そのためのレイアウトを指示することができます。

レイアウト
メニューバーから［ファイル］→［印刷のレイアウト...］を選択します。
［印刷レイアウト］パネルが表示されます。

［タイトル］：ヘッダーに記載するプロジェクトのタイトルになります。
［レイアウト］欄：印刷したときに一枚の用紙上に配置するスライドの向きや枚数を指示します。
プレビューがパネル右側に表示されます。

Page144

ViewletBuilder6UsersGuide

July-2011［非表示スライド］：［スライドを隠す］設定にされているスライドも印刷します。
［スライドタイトル］：個々のスライドのタイトルを印刷します。
［スライドメモ］：個々のスライドに付加されているメモがある場合に印刷します。
［カーソル］：カーソルを印刷します。
［カーソルパス］：スライドに含まれるカーソルの軌跡を印刷します。
［ページ番号］：用紙にページ番号を印刷します。スライドの枚数ではありません。
［現在のスライド］：スライドビューに表示されている現在のスライドを印刷します。
［from］、［to］：印刷するスライドの範囲を指定します。
［全てのスライド］：プロジェクトのスライドをすべて印刷します。
［OK］ボタン：設定を保存して［印刷レイアウト］パネルを閉じます。
［印刷］ボタン：設定を保存して［印刷レイアウト］パネルを閉じます。続いて［印刷］
パネルが表示されます。

Page145

ViewletBuilder6UsersGuide

July-2011

印刷
ボタンコマンドツールバーの［印刷...］アイコンをクリックします。

［印刷］パネルが表示されます。

［印刷］ボタンをクリックすると印刷を開始します。
［印刷のレイアウト］パネルで設定した内容が印刷されます。

Page146

ViewletBuilder6UsersGuide

July-2011

エクスポート
ビューレットビルダー６には以下のエクスポートオプションが準備されています。
・XML 形式での出力
・サウンドの出力・PDF 出力
・画像の出力XML ファイルの出力
メニューバーから［ファイル］→［エクスポート］→［テキスト（キャプション）...］を選択します。
ファイルの保存先を選択します。ファイル名を入力します。
［保存する］ボタンをクリックします。
メッセージオブジェクトに含まれるテキストが出力されます。
サウンドの出力
ビューレットビルダー６のプログラムのフォルダ以外の場所に保存先を作成しておきます。
メニューバーから［ファイル］→［エクスポート］→［サウンド...］を選択します。
［サウンドのエクスポート］パネルが表示されます。

サウンドを含むスライドを選択します。
［エクスポート］ボタンをクリックします。
ファイルの保存先を選択します。ファイル名を入力します。
［保存する］ボタンをクリックします。

Page147

ViewletBuilder6UsersGuide

July-2011

PDF 形式で出力
メニューバーから［ファイル］→［エクスポート］→［PDF...］を選択します。
［PDF 形式でエクスポート］パネルが表示されます。

［スライドタイトル］：スライドの名前が PDF のページ毎に表示されます。
［ページ NO］：PDF にページ番号が表示されます。
［エクスポート］ボタンをクリックします。
ファイルの保存先を選択します。ファイル名を入力します。
［保存する］ボタンをクリックします。

Page148

ViewletBuilder6UsersGuide

July-2011画像ファイルの出力
スライドを画像ファイルとして出力することができます。
メニューバーから［ファイル］→［エクスポート］→［スライドの画像...］を選択します。
［スライドを画像として出力］パネルが表示されます。

［ファイル名（+連番）］：ファイル名を入力します。複数スライドのあるときは自動的にこのファイル名の後に連番を振って作成されます。
［ファイル拡張子］：ドロップダウンリストでファイル形式としての拡張子を選択します。
ここで［JPG］を選択した場合［品質］オプションのドロップダウンリストから適切な JPG 形式のレベルを選択することができます。

［スライドタイトル］：出力された画像にスライドの名前が表示されます。
［html 形式の追加］：画像の出力に加えて html 形式でスライド全体の画像を出力します。
プロジェクトのパブリッシュとは異なります。

［スライド］欄：出力するスライドの範囲を指示します。
［エクスポート］ボタンをクリックします。
ファイルの保存先を選択します。ファイル名を入力します。
［保存する］ボタンをクリックします。

Page149

ViewletBuilder6UsersGuide

July-2011インポート
ビューレットビルダー６には以下のインポートオプションが装備されています。
・スライドのインポート
・テキストのインポート
他のプロジェクトからのインポート
メニューバーから［ファイル］→［インポート］→［スライドのインポート...］を選択します。
［スライドのインポート］パネルが表示されます。

［ブラウズ］ボタンをクリックしてプロジェクトファイルを選択します。

解像度の違うプロジェクトの設定
サイズの違うプロジェクトをインポートする場合はインポート先、もしくはインポートするスライドサイズに合わせてリサイズします。

Page150

ViewletBuilder6UsersGuide

July-2011

。
複数のスライドを選択するときは［Ctrl］キーを押しながらスライド名をクリックします。

［OK］ボタンをクリックします。

Page151

ViewletBuilder6UsersGuide

July-2011

XML ファイルのインポート
エクスポートした XML ファイルのキャプションを別の言語に翻訳して取り込むなどの作
業に大変便利です。
この機能を有効に使用するためには、スライドに含まれるメッセージオブジェクトがインポートしようとする XML の内容と一致している必要があります。

メニューバーから［ファイル］→［インポート］→［テキスト（キャプション）のイン
ポート...］を選択します。
XML ファイルを選択して［開く］ボタンをクリックします。

Page152

ViewletBuilder6UsersGuide

July-2011プロジェクトのプロパティ
Viewlet の作成に必要な各種項目の設定を行ないます。
プロパティは、新しいプロジェクトの作成時にも反映させることができます。
ボタンコマンドツールバーの［プロジェクトのプロパティ...］アイコンをクリックします。
［プロジェクトのプロパティ］パネルが表示されます。

このパネルでは、以下の 11 項目を確認・設定することができます。これらはパネル左のナビゲーションメニューから選択することで編集が可能です。
［Viewlet プロファイル］［音質］［タイミング］［Viewlet オプション］［画質］［スコアリングオプション］ ［パッケージング］［言語］［Flash］［HTML フレーム］

Page153［Viewlet Skin］

ViewletBuilder6UsersGuide

July-2011［Viewlet プロフィール］
パブリッシュによって Viewlet に保存される内容です。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［Viewlet プロファ
イル］を選択します。

それぞれは空欄でも登録可能です。

Page154

ViewletBuilder6UsersGuide

July-2011

［音質］
作成される Viewlet の音質を選択します。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［音質］を選択します。

Page155

ViewletBuilder6UsersGuide

July-2011

［画質］
作成される Viewlet の画質を選択します。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［画質］を選択します。

Page156

ViewletBuilder6UsersGuide

July-2011

［タイミング］
表示時間に関する設定を行ないます。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［タイミング］
を選択します。

［タイミングリンク］欄：［タイミングリンクを維持］チェックボックスをオンにすると、スライドが編集された場合でもタイミングリンクの定義を維持させることができます。

Page157

ViewletBuilder6UsersGuide

July-2011［Viewlet オプション］
Viewlet の作成に必要なオプションを設定します。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［Viewlet オプション］を選択します。

［ログインオプション］欄［ログイン機能を付加する］：Viewlet を再生する前にログインプロンプトを表示します。
［Viewlet パスワード］：［ログイン機能を付加する］オプションがオンに設定されている場合、閲覧者はパスワードを入力してムービーを再生します。（下図は一例です）

Viewlet のログインプロンプトでは［ユーザー名］入力フィールドも表示されますがこれは任意です。1 文字以上入力します。

Page158

ViewletBuilder6UsersGuide

July-2011［スコアリング オプション］
得点と合否の判定に必要なオプションを設定します。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［スコアリングオプ
ション］を選択します。

［スコアオプション］欄［回答：合格設定％］：何％問題を正解すると合格になるのかを設定します。
［リピートを許可する］：Viewlet の終りにスコア表示したときに［リピート］ボタンを表示します。スコア表示しない場合も Viewlet の最初に戻るためのボタンを有効にします。
（下図はスコア表示の一例です）

Page159

ViewletBuilder6UsersGuide

July-2011

［制限時間に達した場合の Viewlet アクション］
解答の制限時間の設定がある場合、それを超えたときの Viewlet のアクションを指示することができます。

Page160

ViewletBuilder6UsersGuide

July-2011

［パッケージング］
配布可能な Viewlet の作成に関する設定です。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［パッケージング］
を選択します。

［スタンドアロン プロジェクタ］欄：配布に適している実行形式ファイルを選択します。
これらのファイルは Viewlet のパブリッシュ時に作成されます。
［フルスクリーンで実行］チェックボックス：フルスクリーン表示のムービーを作成するにはこれをオンにします。
［zip 形式ファイルの作成］チェックボックス：Viewlet ファイルのコピーを作成することができます。

Page161

ViewletBuilder6UsersGuide

July-2011

［言語］［プロジェクトのプロパティ］パネルのナビゲーションメニューの［言語］を選択します。

パブリッシュ時に付加される項目のテキストをここで編集することができます。編集可能な箇所は下図の通りです。

Page162

ViewletBuilder6UsersGuide

July-2011［Flash］［プロジェクトのプロパティ］パネルのナビゲーションメニューから［Flash］を選択します。

［ウェブページに倍率をフィットさせる］：閲覧者の使用するブラウザの大きさに合わせて Viewlet の表示倍率が変わります。
［圧縮ムービー］：ファイルサイズをより小さくします。
［Flash の右クリックメニューを簡略化する］：右ボタンをクリックしたときに表示されるショートカットメニューの項目を減らします。
［ループ再生］：スライドが終了すると始めに戻り自動再生を繰り返します。
［メッセージのフェード効果］：メッセージオブジェクトの表示と非表示の際にフェード処理を施します。
［ローカルアクセスモード］：Viewlet からローカルのファイルにアクセスすることができます。

Page163

ViewletBuilder6UsersGuide

July-2011［プレローダー］欄：プレローダーは、Viewlet をロードする間に処理の経過状況をプロ
グレスバーで画面上に表示させるアニメーションです。
［アニメーション］欄：Viewlet 本編の始めと終わりに別のアニメーションを付加する機能です。あらかじめ用意された SWF ファイルを選択します。

Page164

ViewletBuilder6UsersGuide

July-2011［ViewletSkin］
Viewlet を表示するデザインスキンを選択することができます。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［ViewletSkin］を選択します。

Page165

ViewletBuilder6UsersGuide

July-2011

［HTML フレーム］
Viewlet の HTML フレームを編集することができます。
［プロジェクトのプロパティ］パネルのナビゲーションメニューから［THML フレーム］
を選択します。

［パブリッシュで使用される HTML フレームを選択］：ドロップダウンリストからデフォルトのフレームを選択します。
HTML フレームの追加
ドロップダウンリストの右にある緑色の＋マーク［HTML フレームを追加］アイコンをクリックします。
名前の変更
ドロップダウンリストの右の鉛筆マーク［HTML フレーム名の変更］アイコンをクリックします。

Page166

ViewletBuilder6UsersGuide

July-2011

HTML フレームの削除
ドロップダウンリストで選択して右端の赤色の×マーク［HTML フレームの削除］アイコンをクリックします。確認のパネルが表示されます。
ファイルの追加
縦に並んでいるアイコンから緑色の＋マーク［追加］アイコンをクリックします。
表示されるメニューから追加するファイルを選択します。
コーディング［ファイル］欄でファイル名をダブルクリックします。
［リソースプロパティ］パネルで編集することができます。
リソースの削除［ファイル］欄でファイルを選択します。
縦に並んでいるアイコンから赤色の×マーク［削除］アイコンをクリックします。
削除されます。
ファイルを削除する前に確認してください。削除すると元に戻せません。

プロジェクトのプロパティを保存する［プロジェクトのプロパティ］パネルの全てのオプションを設定・確認して［OK］ボタ
ンをクリックします。
また、初期設定として以降同じ内容を使用するには、［基本の設定値として保存する］ボ
タンをクリックします。

Page167

ViewletBuilder6UsersGuide

July-2011

Viewlet のプレビュー
プレビュー

アイコンの右側の▼をクリックします。

プルダウンメニューが表示されます。

Page168

ViewletBuilder6UsersGuide

July-2011［現在のスライドのプレビュー］
スライドビューに表示されているスライドのみをプレビューします。
［現在のスライドからプレビュー］
スライドビューに表示されているスライドから終りのスライドまでをプレビューします。
［全てのプレビュー］
プロジェクト全体をプレビューします。
［ブラウザでプレビュー］
プロジェクト全体が SWF 形式にコンパイルされブラウザで表示されます。
パブリッシュは行ないません。

Page169

ViewletBuilder6UsersGuide

July-2011

Viewlet のパブリッシュ
閲覧するためのムービーを作成することをパブリッシュと呼びます。
プロジェクトを開きます。
ボタンコマンドツールバーの［Viewlet のパブリッシュ...］アイコンをクリックします。

［Viewlet のパブリッシュ］パネルが表示されます。

パブリッシュの保存先は以下のような方法で変更・追加・取り消しが可能です。
保存場所の追加・変更［ローカルを追加

ネットワークフォルダ］ボタンおよび［FTP を追加

サーバー］ボタンで中央のリストにロケーションを追加することができます。
リストの順序リストの項目を選択し、水色の上下方向［上へ］、［下へ］アイコンで調整します。

Page170

ViewletBuilder6UsersGuide

July-2011リストの変更
リストから項目を選択し、鉛筆マーク［変更］アイコンをクリックします。
［フォルダ］パネルが表示されます。

［フォルダ名］、［パス］を変更します。
ロケーションの削除
リストからロケーションを選択して赤色の×マーク［削除］アイコンをクリックします。
［警告］パネルが表示されます。

確認して［はい］ボタンをクリックします。

ロケーションの選択［次へ＞］ボタンをクリックします。

Page171

ViewletBuilder6UsersGuide

July-2011

レポートのオプション

プルダウンリストから［None］を選択します。
ViewletCentral に関する項目は日本ではサポートしておりません。ご了承ください。

［次へ＞］ボタンをクリックします。
コンパイルが開始されます。

Page172

ViewletBuilder6UsersGuide

July-2011パブリッシュの完了
Viewlet の保存されているフォルダのパスが表示されます。

［表示］ボタン：パブリッシュされた Viewlet を再生します。
［ブラウズ］ボタン：パブリッシュの保存先のフォルダを開きます。

Viewlet の閲覧
パブリッシュされているプロジェクトは、保存先のフォルダ内の HTML ファイルをダブ
ルクリックすることで Viewlet を再生することができます。ビューレットビルダー６を起動する必要はありません。

Page173

ViewletBuilder6UsersGuide

July-2011

ビューレットビルダー６プロジェクトを構築するファイル
本ガイドの本文中に説明のなかったファイルのうち主なものはつぎの 4 種類になります。
.qvp（ファイル）スクリーンショット、出力イメージ、音声など全てを含むソースファイルです。
このファイルは、ビューレットビルダーの内部でプロジェクトとして開かれます。
.qvq.BAK（ファイル）
プロジェクトのバックアップ・ソースファイルです.swf（ファイル）フラッシュプレイヤー（5.0 以上）のプラグインを含んでいるブラウザまたは、フラッシュ（5.0 以上）のスタンドアロンのプレーヤによって再生可能な形式にコンパイルされた Viewlet ファイルです。
_viewlet_swf.html（ファイル）
プロジェクトがコンパイルされるときに作成される HTML ファイルです。このファイル
は、作成された.swf ファイルを埋め込みブラウザに表示するために使用されます。
FlashTag.js（ファイル）
JScript Script File。Java スクリプトファイルです。

Page174

ViewletBuilder6UsersGuide

July-2011各種サービスのご案内
セミナー
株式会社ウェブデモは、無料セミナーを開催してお客様の Viewlet 活用をより有益に有意義にしていただこうと考えております。
開催日程・会場などについては、随時弊社ウェブサイトで発表しています。
http://www.webdemo.co.jp/
予約の必要な場合があります。ご確認の上ご参加くださいますようお願い申し上げます。

また弊社発行のメールマガジンでもお知らせしています。
最新情報・得する情報満載のメールマガジン登録は上記サイト内で承っております。

トレーニングビューレットビルダー６の操作方法を株式会社ウェブデモのスタッフから学べるトレーニ
ングはご要望に応じて有償にて承ります。
株式会社ウェブデモ
電話：（代表）0467-58-0365

ムービー制作サービス
インタラクティブな Flash 形式のコンテンツを短期間・低コストにて作成いたします。
e-ラーニング、社内マニュアル、動画プロモーションに最適です。
インターネットでの配信、CD-ROM での配布が可能です。
お客様のニーズに沿った制作を承ります。お気軽にご相談ください。
株式会社ウェブデモ
電話：（代表）0467-58-0365

Page175

ViewletBuilder6UsersGuide

July-2011

ビューレットビルダー・サポートデスク
株式会社ウェブデモでは、ビューレットビルダー６の操作に関するご質問などを承っております。
受付時間帯：
月

E-mail：

火

水

木

金

土日

祝祭日

夏季休業
年末年始休業午

午前 10 時から

前

午前 12 時までサポート業務は午

午後 1 時から行なっておりません。

後

午後 6 時まで

help@webdemo.jp

無記名、承諾なきデータ添付などの問い合わせメールにはお答えできない場合があります。

最新情報
ビューレットビルダー６の最新情報はこちらで確認できます。
http://www.webdemo.co.jp/vb5/

動画マニュアル.com
仕事で使う定番パソコンソフト、フリーソフト、インターネット活用法、さらに日常生活での便利ノウハウまで、皆様のちょっとした疑問に、わかりやすい解説付きムービーでお答えする本格的、実用的な動画ポータルサイトです。
http://www.dougamanual.com/
こちらからビューレットビルダーの操作方法のムービーを見ることができます。
制作のヒントにどうぞご活用ください。

Page176

ViewletBuilder6UsersGuide

July-2011

ビューレットビルダー６ユーザーズガイド

西暦 200８年 7 月１１日初版発行
西暦 200９年９月１日改訂版発行
西暦 2010 年４月５日改訂版発行

発行
株式会社ウェブデモ
代表取締役 川崎実知郎〒253-0043

神奈川県茅ヶ崎市元町 4-27 井上ビル２F

http://www.webdemo.co.jp/
電話：（代表）0467-58-0365

Page177

ファクス：（代表）0467-58-0505

ViewletBuilder6UsersGuide

July-2011