2013年5月6日月曜日

実機で確認してみよう

作業を始める前に・・・
前回から今回までの間にLWFSが最新版になっているのでDLしておきましょう。
(前回までLWFS-win-20130328-1500を使っていました)

自分のOSに合った最新版を選んでください。
https://code.google.com/p/lwfs/downloads/list


追加された機能などについては後々触れていきたいと思います。





では、先ほどLWFSで作ったものをAndroidやiPhoneといった端末で実機確認をしてみましょう。
LWFSで作品を見た時に右上にQRコードが出ていたと思いますが、このままでは見ることが
できません。
(※ローカルで仮想環境を作っているので他の端末からはアクセスできないため)

なので、LWFSで生成されたファイルを他の端末からでも閲覧可能な環境にアップする必要
があります。

生成されたファイルはデスクトップの「LWFS_work_output」フォルダに格納されています。
自分でアップロードできる環境がある方は、このフォルダの中身をアップロードしてみましょう。
LWFS_work_output/html5/list/[作成されたフォルダ名]/にcss,canvas,webglそれぞれの描画用ページがあります。

アップロード環境がない。または面倒だ。という方のために前回作ったLWFを
下記の場所にアップロードしました。

http://lwfs.tamagokobo.com/lwfs_work_output/html5/list/test/index-canvas.html
http://lwfs.tamagokobo.com/lwfs_work_output/html5/list/test/index-webkitcss.html
http://lwfs.tamagokobo.com/lwfs_work_output/html5/list/test/index-webgl.html

各ページの右上にQRコードがあると思います。
これを端末で読み込んでアクセスすると、各描画に対応していれば再生が始まります。
生成されたHTMLに既にスマートフォンで閲覧する際に最適な設定がされているため
スマートフォン確認用のHTMLなどをいちいち用意する必要がありません。
このようにアップロードする手間はありますが、比較的気軽に制作したLWFを実機で
確認することができます。




また、LWFSの閲覧ページにはいくつかの機能があります。
下記のページでは以下のキーでLWFの再生設定を行うことができます


SPACE:リスタート
S:停止、再開
F:コマ送り(Sで停止した場合のみ)
UP/DOWN:フレームレートの変更
D:ステージサイズの変更
ESC:停止(再開不可)

上記の設定を反映した状態で実機確認したい場合は設定を行った後で
ページ上部の(open with current settings)を開いてください。
その設定が反映された状態のページが新しく開きます。そのページのQRコードを読み込むと
その設定が反映された状態で実機確認を行うことができます。
下記のリンクは先ほどのLWFの再生設定を変更したページになります。

http://lwfs.tamagokobo.com/lwfs_work_output/html5/list/test/index-canvas.html?fr=10&fs=1&ds=0.5

フレームレートが落ちて、ステージサイズも半分になっており低スペックの端末でも
先程のものより比較的スムーズに再生されると思います。
このように色々と設定を変えて再生を行うこともできます。




次回はスクリプトを用いて簡単な再生の制御等を行なってみたいと思います。









0 件のコメント:

コメントを投稿