swfをhtml5に変換「swf2js」を使用してみた
2017/12/22
こんばんは。えいたです。
スマートフォン時代に突入し、Flashをサポートから外すブラウザも出てきました。
その結果、Flashゲームを楽しむことができないユーザが増えています。
Flashゲームができない = 当サイトの根幹に関係する
何とかしなければ・・・。
ネットで調べていると「swf2js」に出会いました。
swf2jsとは
家永稔之氏が制作したJavaScript製FlashPlayerです。
swfをHTML5に動的出力できる優れものです。
HTML5に変換することで、Flashが非対応のブラウザでも閲覧することができます。
つまり、スマートフォンからでもFlashゲームを遊べる時代になりました!
導入前の確認
さっそく、「swf2js」を導入することにしました。
swf2jsのダウンロードはこちら(外部サイト)から可能です。
使い方も記載されているので、参考にしました。
僕が制作したゲームを用いて、試験を行ったので結果を公開します。
制作環境
Macromedia Flash Professional 8
ActionScript 2.0
swf2jsのバージョン
0.77
ブラウザ
Internet Explorer 11
Safari
試験結果
7種類のゲーム(2017年5月制作)について、試験をしました。
OK
ハイアンドロー、○×ゲーム、じゃんけん、ネガティブアウト
NG
カーキャッチ、イライラ棒、塗り絵
考察
なぜ、NGになったのか?その理由を考察します。
プログラムで色を変更できない
塗り絵は色を変更する箇所に透明のボタンを配置することで対応しています。
ボタンを押したときにプログラムで色を指定して背景を着色します。
ハイアンドローはゲームとしては動作していますが、正解・不正解時の文字の色が切り替わらないです。
こちらもプログラムで色を切り替えている部分なので、該当したと感じています。
シンボルが呼び出せない
ゲームにおいて、最初から全てのシンボル(部品)を配置している訳ではありません。
ゲームの進捗具合でシンボルを呼び出す必要があります。
カーキャッチの場合は、車をプログラムで呼び出しています。
車が出現しないということは、呼び出す部分に原因があることは明らかです。
同様にイライラ棒についても、棒が出現しないです。
ネガティブアウトについてはシンボルを呼び出すことに成功しています。
違いはrootで呼び出していないことですが、サンプル数が少ないので何とも言えないですね。
さいごに
NG理由以上に「swf2js」は夢のあるツールと思います。
既存のswfをHTMLの改修のみでそのまま使えるなんて信じられますか?
僕はIT企業に勤めていますが、制作方法すら思い浮かびません。
そして、最高の収穫は正常に動作したゲームが存在したことです。
正常に動作したゲームについて、こちらで公開しています。
全てのゲームが動作しなくても、スマートフォンのユーザに対してゲームを提供できます。
僕にとって喜ばしいことであり、家永稔之氏に感謝です。