動かしてみよう

まずは解答したLWFSのフォルダを開き「start.js」をコマンドプロンプトで実行しましょう。
「start.js」を右クリックすると「コマンドプロンプトで開く」という項目があると思いますので
そちらからでも大丈夫です。
※start.jsを実行しても反応がない場合はLWFS\.a.start.batを実行してみてください

そうすると、デスクトップに下記のフォルダが作られると思います。
「LWFS_work」(作業フォルダ)　
「LWFS_work_output」(出力フォルダ)

基本的には「LWFS_work」フォルダにファイルを置いて作業をする感じになります。

また、ブラウザが立ち上がりLWFSのページが開くと思います。
こちらがプレビュー画面になります。
※chromeかfirefox以外のブラウザが立ち上がる場合デフォルトのブラウザを
　どちらに設定するか、LWFSのURLをコピーして開いてください。

---

ではまず、試しになにか適当に動くものを作ってみましょう。
まず、「LWFS_work」フォルダに「test」フォルダを作ってみましょう。
そして、Flashを開き「test」フォルダの中に「test.fla」というファイル名で保存しましょう。
これでひとまず準備は完了です。


あとはFlashで制作を進めていくのですが、下記の制限があるので注意しましょう。

・シェイプ（ベクターグラフィック）は使えません。

基本的に全て画像（ラスターグラフィック）のみ使用して制作していきます。
というわけで、画像のみを使用して何か適当なアニメーションを作ってみましょう。

基本的に、ムービークリップもグラフィックインスタンスも使えますが
画像自体に傾斜をかけるのはNGです。

あと、ムービークリップのフィルタは透明度のみ設定することができます。

着色などは使用することができません。

---

そんなわけでこんな感じのFlashを作ってみました

これをLWFにしたいと思います、まずはFlashのコマンドから「コマンドの実行」を選びます

(※LWF_Publishが表示されている場合はそれを選んでください)

コマンドの実行選択後、LWFSを解凍したフォルダにいき

LWFS\.a\lwfs\lib\LWF_Publish.jsfl

を実行してください。

実行すると色々出てくると思いますが、LWFデータに書き出す際の設定と違うので
必要なパブリッシュ設定にしましたよー。 & リンケージ名がついてないので自動でつけましたよー
という警告が大半なので大丈夫です。

パブリッシュが成功するとtestフォルダ内にswfファイルとbitmapを格納したフォルダが作られます。

また、LWFSに下記のような感じでリストが追加されると思います。

追加されない場合はLWFSのページの左上にある「force to update all」を押してください。

リスト内の「canvas」や「webkitcss」や「webgl」を押すとそれぞれの描画方法で

閲覧することができます。

こんな感じでLWFを制作していくことになります。

次回はもう少しLWFSについて詳しく書きたいと思います。

※LWFSの動作を止めたい場合は「stop.js」をstart.jsと同じ要領で実行してください。

---

このページの説明だけではわかりにくかった場合はこちらのスライドも参考にしてみてください。

GREE-Fsite from technicaldesign

---

今回使ったflaファイルはコチラ