アスペクト比の画像サイズ

モニターサイズと画像のサイズを合わせる

F: Image size

モニターの画像サイズ

アスペクト比の画像サイズ

自分のPCのモニターサイズを確認します。モニターとして使用する画面サイズは、例えば1024px×768px(XGA)、または1366px×768px(WXGA)、1,920px×1,080px(FHD)などがあります。このサイズとアスペクト比(縦横比)を前提に画像を制作します。

デジタルサイネージで使う画像は、余り重すぎると挙動が不安定になりますので、アスペクト比を前提にサイズや圧縮率をいくつか試してみる必要があります。

蛇足ですが、インタラクティブ機能を持ったタッチパネルが使えるSlider ProはRetina用画像の出し分け対応のjQueryのプラグインです。特筆すべきところはスライダーで表示する画像はモニターサイズによって大・中・小の3サイズが自動で振り分けられるということです。ウェブサイト制作においてこういう流れが起きていることは注目に値します。


G: Application software

編集ソフト

ブラウザを使ったタッチパネル

画像は主にAdobeフォトショップを用いて編集することが殆どです。デジカメの写真は高解像度です。写真をトリミングしてリサイズしてからテキストを効果的に配置してプロモーションを向上させます。表組が必要なモノや文字のレイアウトが精密さを必要とする場合はフォトショップを使って静止画上で行います。

動画のワンシーンから静止画を切り出して、文字や特殊効果を使います。複数枚用意して繋げれば、パラパラ動画の出来上がりです。

IMPORTANT: Adobeフォトショップは高機能で高額なソフトです。操作の習得にも時間を要します。フォトショップに限らず画像処理関係のソフトに精通していなければ、プロの制作会社に任せた方が無難なようです。


H: Cross-media

クロスメディア

画像処理をプロに任すのであれば、ついでにチラシやポスターの版下、ウェブサイト用として使えるものをピックアップして、同時にオーダーすると安価で頼めることになります。

最近のデジカメは解像度が高いので高→低へと効率よく編集を進めていくことで効率化が図れます。印刷用は350dpi(pixel/inch)で制作して出力しますが、デジタルサイネージ用画像との違いは殆ど解像度の違いだけなので、作業効率が良い為です。ウェブ用にリサイズすることも同等に有効です。


I: Animation

動画編集ソフト

photostage

動画については、例えばPhotoStage(無料ダウンロード有り、定価80ドル)のようなスライドショー作成ソフトを使います。探せばフリーウェアでもありそうですが割愛します。PhotoStageは静止画と動画を簡単に繋ぎ合わせて編集したものを、指定するフォーマット(mp4、ogv、webmなど)とサイズをカスタマイズして出力できます。

個人的な主観になりますが、込み入ったデザイン編集はフォトショップに全て任せます。動画編集の方では、動画の不要な部分をカットしたり繋いだり、別の画像と繋いだり、画像の切り替わるときにエフェクトを付けたり、静止画の表示時間を設定する機能が揃っていれば殆ど十分であると思います。PhotoStageの操作は非常に簡単ですから、短時間で習得できます。


J: TEATA全天球画像

全天球画像

RICOH デジタルカメラ THETA S 360°全天球イメージ撮影デバイスは店内撮影などにとても有効です。店内中央にスタンドを配置して、動画もしくは静止画を撮影すると圧倒的なアピールに繋がります。

また、スタンドを固定して例えば人物の配置を動かしてシャッターを切ります。画像をレイヤーで重ねて編集すると面白い画像が加工できます。

店内ムードやレイアウトなどをさらっと紹介したいときに是非ともお奨めしたいアングルです。


EDIT 画像や動画を編集する (2/4 learned)

次はコンテンツを起動させたり終了の命令を出すコマンドラインを案内します。