あけましておめでとうございます、鴨田です。
今年一本目のアシアルブログの投稿になります。
今年もどうぞよろしくお願いいたします。
さて、昨年末に弊社で開発を行った案件として、
FlashコンテンツのiOS/Androidアプリ移植というのがありました。
Flashの移植では、いろいろと手法はあると思いますが、
今回は純粋にネイティブアプリに移植しました。
開発手法の選定や開発中の試行錯誤について、お話ししたいと思います。
手法の決定に関して
まず、元のFLAファイルが一つだけではなく、
複数のFLAファイルに分かれていたこと、
元のFLAファイルが存在しないコンテンツが存在していた、
ActionScriptがそもそも2.0だった、などのことから、
Abobe AIR for iOS/Androidを使うことはありませんでした。
いろいろな情報を集めた限りでは、
AIRで出来るのであれば、AIRを使うのがいいのかなと思います。
その次に考えたことは、CreateJSを使うことです。
弊社でも実績があるため、結構有力な方法として考えていました。
試しにいくつかのコンテンツでCreateJSを使用して、
HTML5に書き出してみました。
結果として、うまくいくコンテンツもあれば、
オブジェクト数が多すぎて、アプリ内のWebViewではもちろんのこと、
Androidの標準ブラウザにおいても、
処理が重すぎてまともに動作しないものもありました。
(PCのブラウザではサクサク動くのに・・・)
ということで、最終的にはネイティブアプリで作成することとしました。
ネイティブアプリで使う素材を準備する
まず、元のFLASHのメニュー部分などは、画角が合わないため、
スマートフォン端末用にレイアウトの組み直しと、
一部デザインの修正を行いました。
単純にムービーを再生するだけのコンテンツに関しては、
「Swivel」という、SWFを動画変換できるフリーソフトを使用して、
H264書き出しを行いました。
ActionScriptまで読み取って変換してくれるいいソフトです。
あとは、タップ時などにアニメーションを行うというのが、
元になったコンテンツで主に使用されるアクションだったので、
Flashから各オブジェクトを連番PNGの形で書き出して、
ものによってはスプライト化、あるいは、ムービー化しました。
ネイティブアプリで実装する
前述したように、基本的にはオブジェクトがアニメーションするというのが、
アプリのコンテンツに共通した内容であったため、
連番PNGあるいはスプライト画像を使用して、
パラパラアニメーションを行うというのが主な実装内容でした。
これだけを聞くとすぐに実装できそうです。
事実、iOSでは特に問題なく、実装が完了したのですが、
Androidに関しては、OSバージョン、機種依存の問題が多々あり、
思うように実装が進みませんでした。
そのほとんどはAndroidのバグなので、
実装方法が悪いというわけでもなく、
どうにかこうにかやり過ごしましたが、
いろいろと煮え湯を飲まされました。
特に悩まされたこととして、
VideoViewとSurfaceViewの重なり順がおかしくなる、
というのがあるのですが、結局解決しなかったため、
重ならないようにレイアウト変更を行うことで避けたりしました。
FlashのiOS/Androidへの移植関連で検索しても、最近の記事が見あたらないので、
もしかしたら、最近はあまり移植が行われていない可能性もありますが、
そのような案件があれば、参考にしてもらえたらと思います。。
まとめとしては、
ネイティブで開発する場合はクロスプラットフォームという意味では難がありますが、
いろいろと柔軟に対応できるのはとても魅力だと思います。
AIRで問題ないコンテンツであれば、もちろんAIRが第一選択になります。
クロスプラットフォームという意味でも問題ありませんし、
最近のAIRであれば、ネイティブ機能を使うことも問題ないようです。
今はまだ実用的とは言い難いですが、CreateJSなどを使用して、
HTML5化するというのも、今後は十分視野に入ると思いますし、
そうなって欲しいと願っています。