システムの構成

このシステムは

  1. 全体の流れ(コンテンツの構成)を編集するリスト編集
  2. 各画面の要素を個々に編集するカット編集
  3. 最終的な表示を行うプレイヤー
という3つのwebページで構成されます。

コンテ画面(リスト編集) コンテ
このページでシーン/カットの順番と追加廃止を行います。

表示されるリストはbootstrapのアコーディオンパネルで、

  • シーン名を示す文字部部分をクリックするとシーン内のカットを、
  • カット名の文字部部分をクリックするとカットに配置された要素の概要
を表示します。

シーン名を示すパネルには

  • 上下の移動と
  • 削除
ができるボタンが有ります。
またシーンリストの末尾には、新しいシーンを追加するボタンが有ります。
コンテ

カット名を示すパネルには

  • 上下の移動と削除ができるボタン
  • 他のシーンへの移動や
  • エレメント編集画面へ線するボタン
が有ります。

また 各シーンの表示枠の末尾(最終カットの下)には、そのシーンへのカット追加

また、左側のメニューで
  • テンプレートの呼出しと初期化(新規作成の開始)
  • データ読込み/データ書き込み
  • プレイヤーを起動して再生の開始
を行います。
エディット画面(カット編集) エディタ
このページで画面を構成する文字や画像の置き方を設定します。
画面の構成は上から
  1. シーンプロパティ
    • 前のカットから継続された背景、音楽、シーンのタイトルなどの固定エレメントの表示
    • もしくはそのカットからの開始/変更設定を行います。
    • そのシーンから開始か、前のカットからの継続かを示す「そのカットからスタート」チェックボックス
  1. 編集状況を示すモニター
    • クリックした部分の編集項目があるパネルを開きます。
  2. 上部/中央部/下部に分けて各エレメントごとの編集
  3. カットの表示時間など、そのカットのプロパティ編集
が有ります。
左側のメニューは
  • テンプレートの呼出しと初期化(新規作成の開始)
  • データ読込み/データ書き込み
  • プレイヤーを起動して再生の開始
を行います。
スライドショー画面(プレイヤー) プレイヤー
プレイヤー画面は
  • フルスクリーンレイアウトの背景と
  • 各エレメントを配置したレイヤー
の二階層になっています。

各エレメントを配置したレイヤーは

  • 最上部に前後のカットで継続させる文字などを表示するfixエリア
  • 必要に応じて上から書き込んでいくtop/center/bottomの3行
  • BootStropのグリッドシステム(画面幅を12分割するシステム)を使った幅の制御を行います。
これらのエレメントは下表の様な構成になっています。
1 2 3 4 5 6 7 8 9 10 11 12
fix fix_left fix_right
top top_left top_right
center center_left center_right
bottom bottom_left bottom_right
プレイヤーの底辺にはコントロールパネルが有り
  • 右隅の開閉ボタンでパネルを閉じれば、各カットの指定秒数に応じた自動送りを実行
  • 自動送り時間を長めに取っておいて進む/戻すボタンで任意のタイミングで画面切り替え(プレゼン利用)
  • 音楽が設定して有ればボリュームと再生ポイントの調整
が行えます。
作成されるデータ
このスライドの設定には映像コンテンツに使われる絵コンテの様な内容の設定ファイルを使います。

各レコードはエレメント毎の構成になっていて
  • シーン/カット名
  • 扱うデータの種類(固定文/スクロールテキスト/画像...といったタイプ)
  • 表示する位置(使用するエレメント)
  • 文面や画像ファイルなどへのURL
  • エレメント内の位置、サイズ、表示タイミング
などのパラメータで構成されます。

  • 各エレメントのパラメータと内容はカット編集画面で編集し、
  • シーン/カットの順番はコンテ(リスト編集)画面で編集します。


初期値になるテンプレートはコンテ(リスト編集)画面の「テンプレート」ボタンで読み出せます。今の処、
  • 結婚式のエンドロールムービー
  • パワーポイント風のプレゼン資料(作成中)
を用意しています。

編集したデータは
  • リスト編集の「データ書き込み」もしくは
  • カット編集の「確定」
ボタンで皆さんのパソコンにタブ区切りのテキストデータで保存されます。

保存したデータはリスト編集の「データ読込み」で読込み、カットごとのオブジェクトに再構成します。

リスト編集の「プレイヤーで再生」でカットごとのオブジェクトデータをプレイヤーに渡し、再生の準備を行います。