フルスクリーンで
開くプレイヤーは?

プレイヤーのプロパティを編集してフルスクリーンで開くもの、開かないものがあります

A: BROWSER

ブラウザのフルスクリーンモード

ブラウザのフルスクリーンモード

まずスクリーンは、完全なるフルスクリーンを設定したい。タスクを組んで自動再生を考えたとき、ブラウザはつまずきます。ワンアクションでフルスクリーン表示は出来るのですが。

ブラウザー(chrome、firefoxなど)について自動表示を考えると、スライドショー(例えばSliderPro)やhtml5のvideoタグでフルスクリーン表示をコントロールできるのではないかと期待しますが、現時点では寸前のところで上手くいきません。上図のように、コマンドライン を"fullscreen"で設定しても、縦と横のスクロールバーが表示されてしまいます。街ではこのような状態になっているデジタルサイネージをたまに見かけますが、ここは拘りたいものです。(※この状況は、Windowsのバージョンや使用するブラウザにより挙動が異なります。)

ブラウザのフルスクリーンは、セキュリティ上の問題で、ユーザーがイベント(承諾のクリックの動作後に)を起こすと、四隅にスクロールバーが表示されない完全のフルスクリーンを表示することができます。つまりブラウザでデジタルサイネージを自動化するにはこのワンアクションが必要になります。


B: Touch panel

タッチパネル(ブラウザ)

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

但し、インタラクティブ機能を持ったタッチパネルを考えた場合、html5を使ったスライドショー(SliderProなど)のコンテンツが非常に有効です。html5でこのスライドショーのみを制作し、それをフルスクリーンで表示させます。

尚、このような使用目的の場合はkioskモードを使います。例えばGoogle Chrome kioskモードはGoogleChrome以外の操作を一切無効にしますので、どんなタッチをしても誤操作を招く心配はありません。施設のご案内などで使うにはもってこいの機能ですので、是非チェックしてみてください。

html5 SliderProを使った施設案内DEMO

(画像の右上の角のこのアイコン)をクリックするとフルスクリーンが実行されます

IMPORTANT: kioskモードとkiosk端末は異なります。kioskモードはブラウザなどで一切のキー操作を無効にしますが、【Alt】キー+【Ctrl】キー+【Delete】キーを使って再起動することが可能です。kiosk端末は指定した単一のアプリケーションのみを有効にした設定のアカウントにログインした状態です。他のアカウントへログインするにはパスワードもしくはPINを入力しなければなりません。


C: BROWSER

ブラウザの簡単サイネージ

ブラウザの簡単サイネージ

次に、時間を掛けないで簡単にデジタルサイネージを実現する方法です。ブラウザのchromeの場合、拡張機能の「Simple Image Viewer」を使って静止画のスライドショーを作り上げます。事前にスライドさせたい画像を任意のファルダに入れます。Simple Image Viewerのメニューからそのフォルダを指定し、スライドショーにチェックを入れてインターバルを指定してスタートさせます。後はフルスクリーンをオンにするだけです。

他にもふたつリンクを挙げておきます。スケジュールが組めるのが「Chrome Sign Builder」。開いたTABを次々と開いてスライドショーができるのが「Revolver - Tabs」です。


D: WMP

WINDOWS MEDIA PLAYER

さて、飲食店などのデジタルサイネージは、日々の朝・昼・晩のメニューのルーティーンワークが必要ですから、朝・昼・晩とコンテンツを変更しなければなりませんので、どうしても自動化に拘りたいでしょう。ズバリそれに対応できるのがWindows Media Playerです。

フルスクリーンを自動で表示させることができます。本編ではWindows Media Playerについて説明を進めていきます。このことを最初に知っておけば、かなりの無駄な時間が省けますから、これは大変重要な情報です。データは画像と動画を組み合わせて一つのクリップの動画にします。それを自動実行させるのが一番容易です。

Windows Media Playerはコマンドラインを追加して起動します。詳しくは以下リンクを参照してください。


E: monitor display縦長配置

縦長のモニター

最後に、縦長にディスプレイ(この場合ノートPCです)が立つよう寝かせてみました。画像や動画の場合、方法は単純です。画像は縦長にレイアウトしてデザインしたものを90度回転させた画像で保存します。動画は撮影のとき縦長のレイアウトで撮影します。

html5ではCSSを使って要素を回転させる方法があります。以下記述は90度回転させます。-(マイナス)も使用できます。

css

< style type="text/css" > 
div#object {
transform: rotate(90deg);
}
</style> 

html

<div id="object">
<video width=" " height=" " autoplay controls loop>
<source src=" ">
</video>
</div>

FULL SCREEN PLAYER フルスクリーン・プレイヤ (1/4 learned)

次はコンテンツの画像や動画の編集についてです。アプリケーションも含めてご案内します。