【第29回 HTML5とか勉強会レポート】次のモバイルアプリはどのフレームワークで作る？：D89クリップ（43）（2/2 ページ）

スマートフォンアプリの開発を容易にするJavaScriptのフレームワークが続々と増えている。それぞれの良さや仕組み、何がどこまでできるのかを徹底解剖する

[佐藤翔，ねこポッポ] PC用表示関連情報

LINE

Hatena

前のページへ | 　　　　　　

Titanium Mobile

　Titanium Mobileを開発しているAppcelerator.のプラットフォームエバンジェリスト増井雄一郎氏はTitanium Mobileの紹介を行いました。セッションで使用されたスライドは公開されています。

　以下、増井氏の発言の要約です。

　カメラやセンサなどのネイティブの機能を使いたいけど、ネイティブ用の言語であるObjective-CやJavaを覚えるのはつらい、という人は多いかと思います。

　そこで、JavaScriptだけでネイティブの機能を使ってアプリを組めるのが、Titanium Mobileです。PhoneGapと違う点は、開発において画面を作る際にHTMLを使いません。JavaScriptのコードで画面を作ります。ネイティブAPIのUIを扱えます。

Appcelerator.プラットフォームエバンジェリスト増井氏によるTitanium Mobileの紹介

　しかし、「TitaniumVS. HTML5」という構図ではなく、混在が可能です。例えば、全体のUIはTitaniumで書くけど、アニメーションやグラフなど既存であるものはHTML5で書けます。スクロールのスピードを要求されるテーブルビューやカメラ機能、アクションシートの部分だけTitaniumを使う、ということが可能です。

　実際に使われているのかという点ですが、すでに30万人の開発者と3万5000以上ものアプリがアプリストアに存在しています。『ココログ』のiOSとAndroidアプリは共にTitaniumで開発されています。もともと、このアプリのiOS版はObjective-Cで開発されていましたが、Android版も出すタイミングでバージョンアップの手間を省くために両アプリともTitaniumで作ることにしました。

　他にもサイボウズのiOS／Androidアプリがあります。このようにiOS／Android両対応のアプリにはTitaniumがよく使われています。『積ん読本』というアプリはプログラミングをほとんど知らないデザイナーの方がTitaniumを使って作ったアプリです。学習も含め2週間で実装をしたそうですが、このように開発が比較的簡単といえます。

コードでUIを書くと、各プラットフォーム固有のUIが作れるTitanium

　Titaniumの特徴としてコードでUIを書くと、各プラットフォーム固有のUIが作られます。タブバーの場合、iOSなら下部、Androidならば上部に表示されます。各プラットフォームのユーザーがいつも使い慣れているUIを実現できます。

　Titaniumが苦手とするのは、画像処理系です。線を引いたり、画像をセピア色に変えるなどの処理は苦手です。リアルタイム性にも少し弱く、ボタンをタッチしたら必ず60分の1秒以内に感知できるようにするには、できなくはありませんがノウハウが必要になってきます。

　そういった部分は例えばJavaで書いたモジュールを追加するなどして対応でき、ネイティブ言語との混在が可能です。しかし、「それではJavaScriptだけで作るTitaniumの意味がない」と思われる方もいます。そのために、モジュールを売買するOpen Mobile Market placeをWeb上に用意しています。ここでグラフを書く機能や、標準では用意していないAirPrintというネットワークのプリンタをサポートする機能、撮影した画像にフィルタを掛ける機能など、多くのモジュールをダウンロードしたり買うことができます。プロジェクトにインポートするだけで利用できます。

　今までリアルタイム性という点でゲーム開発に弱かったのですが、日本人の方でモジュールを作った人がいます。もちろんiOSとAndroidの両方で動きます。このモジュールを使ってTitaniumでゲーム開発ができます。

JavaScriptフレームワークの今が分かる座談会

　イベントの後半は、セッションを行った3人とモデレータの小松健作氏による座談会が開かれました。以下のテーマで話が進められました。フレームワーク開発の裏側と現状を知ることのできる貴重な内容になっています。座談会の動画はYouTubeでご覧になれます。

動画が取得できませんでした

　「ネイティブと比較してパフォーマンスはどうか」「過去のものを含めさまざまなハードウェア対応について」「JavaScriptフレームワークはどこまで進化する？」「マルチデバイスへの対応UI/UXについて」「バイバイObjective-C？（アプリ開発にネイティブ言語は要らなくなる？）」

豪華過ぎる懇親会とLT

　座談会終了後には、懇親会が開かれました。寿司やお肉など豪華過ぎる食事が振る舞われ、参加者は一瞬で「ディー・エヌ・エー大好き！」（記者だけ？）と興奮状態になったのではないでしょうか。2本のLTとHTML5クイズが行われました。

　1本目のLTは、Titanium Mobile増井氏によるMobiRubyの紹介。軽量化されたRubyのmrubyによってiOSのネイティブアプリが開発できるフレームワークです。これにより、RubyによるiOS／Androidアプリの開発が可能になります。MobiRubyは増井氏によって開発が進められています（MobiRuby：http://mobiruby.org/　）。

　2本目のLTは、ディー・エヌ・エーの近澤氏によるArctic.jsの紹介。実際にモバゲーのソーシャルアプリで活用されている、HTML5のcanvas要素を使うJavaScriptのフレームワークです。OSやデバイスの差異を吸収し、60fpsに近い高いフレームレートで滑らかに画像を描写します。キャラめがけて大砲を打つゲームデモでは、ネイティブ言語で開発されたアプリのようにスムーズにオブジェクトが移動し、フレームワークの完成度とcanvasの高い表現力が感じられました。ActionScriptに近いコーディングのため、特にFlash経験者にはとっつきやすいです。

Arctic.jsを説明するディー・エヌ・エーの近澤氏

　Arctic.jsの名前の由来は、「Arctic＝北極」という何か頂点を目指すという意味かと思いきや、開発者の近澤氏が大好きな蒙古タンメン中本の北極ラーメンからでした。「中本.js」も考えたそうですが、クールさに欠け過ぎるということでArctic.jsに落ち着いたそうです。ロゴも北極の険しい山をイメージしていると思いきや、実は麺をすくい上げる箸の姿だそうです（Arctic.js＝ブログ：Technology of ディー・エヌ・エー）。

麺をすくい上げる箸のロゴ

誰でもアプリが開発できる時代がやって来た！

　フレームワークの登場で、数年前に比べてスマホアプリを開発する敷居はかなり下がったのではないでしょうか。Titaniumを使えばObjective-CやJavaを習得せずともJavaScriptでネイティブアプリが開発でき、PhoneGapはWebデザイナーやプログラミングに触れたことのない人でもとっつきやすく、Dreamweaverとの連携で開発環境も整っています。ngCore onHTML5はまさに将来のアプリの姿ではないでしょうか。これからHTML5とJavaScriptはアプリ開発に欠かせないものとなりそうです。

　HTML5とか勉強会は定期的に開催されています。勉強会の告知はGoogleグループのメーリングリストで行われます。勉強会に興味があれば「html5j.org - Google グループ」からグループに参加してみてください。

筆者紹介

ねこポッポ代表猫締役

佐藤翔（さとうしょう）

猫の絵のTシャツを作ってます。自分だけが30人登場する出会い系サイトを作りました。Facebookで宣伝したら初日はたくさんアクセスがありましたが、5日目は3人しか来ませんでした。cocos2dでスパイ猫ゲーム『タマクルーズ』を開発中。

Facebook：http://facebook.com/satohsho

「次回」へ

「D89クリップ」バックナンバー

【第29回 HTML5とか勉強会レポート】 次のモバイルアプリはどのフレームワークで作る？：D89クリップ（43）（2/2 ページ）