アドビ システムズが開催した、Web制作者向けイベント「ADC MEETUP ROUND01 モバイルを攻略せよ」。前回のレポートに引き続き、今回は現役クリエーターが語るCS5.5を用いた「モバイル」攻略のエッセンスをレポートしていこう。

"スマホ"向けWebサイト構築のイロハ

昨今、スマートフォンデバイスに最適化させつつ、ワンソースでサイト構築して欲しいとの発注が増えてきていると語るH2O Space.のたにぐちまこと氏。そこで、マルチスクリーンプレビュー機能がさらに進化したDreamweaver CS5.5を使い、マルチスクリーン対応のWebサイトを構築するノウハウが語られた。

今後のコンテンツ開発のキモとなるのは、やはりマルチスクリーン対応といえそうだ

実際にソースを見ながら考える

アプリ開発のこれからを考える

次に行われた面白法人カヤック・比留間和也氏のセッションでは、「ネイティブアプリに変わる、新しいアプリ開発スタイル」をテーマに、jQuery Mobileを活用する手法が紹介された。

jQuery Mobileはモバイルサイト構築のためのフレームワークでjQueryのプラグイン。"ほぼ" HTML5のコーディングだけでアプリの開発が行えるという利点があり、数多くのデバイスに対応している。だが、「簡単に開発が行える分、カスタマイズは非常に難しい」と、過去の体験から実感したデメリットも。

jQuery Mobileを使ったアプリ制作については、「シンプルなデザインなため、業務系やユーティリティ系アプリで有用なのではないか」と語られた。

jQuery Mobileを用いるメリットデメリットを語る比留間氏

グラフィカルな表現は一歩ネイティブアプリに及ばないものの、ユーティリティ系アプリには最適ではないかと比留間氏

モバイル開発で便利になったぞ! Flash CS5.5

Flash等を用いた「ものづくり」を教えるクスールの教頭としても知られる尾崎俊介氏は、「Flash CS5.5対応を利用したモバイル端末開発の最適化」と題して、主にIllustratorとの連携機能強化やコンテンツをステージの大きさに合わせて拡縮させるなど、作り手ならではの講義をおこなった。

デモンストレーションでは、既にAndroid向けに開発されていたカメラアプリをベースに、AIR for iOSを用いてiPhone用アプリへとカスタマイズするという実演が行われた。

コンテンツをステージに併せて自動で拡大してくれるのは、作り手にとっては非常に便利になった機能

開発の効率化が目覚ましいFlash CS5.5

ClockMakerの池田泰延氏からは、Androidアプリ開発を中心に講義が行われた。Flash CS5.5では、Web向けの書き出し、携帯向けの書き出し、Adobe AIRによるマルチプラットフォームで稼働するデスクトップ向けの書き出しが可能なほか、AIR for Android、AIR for iOSと各デバイス向けにアプリケーションを書き出すことも可能になったことを紹介。

モバイル向けのコードスニペットの機能拡充・強化に関しては、スマートフォンやタブレット向けの操作形態(タッチやスワイプなど)に対応したものや、実際にデモンストレーションで簡単にコードスニペットから付け加えたい機能を選択していく作業をスラスラと行ってみせた。

実際にハンズオンでコードスニペットの様子を実演する池田氏

Flexモバイルプロジェクトによるモバイルアプリ開発のイロハ

Flex Builderの基本的な概念から紹介したのはtaiga.jpの廣畑大雅氏。実際にこの日のために制作されたAndroidアプリを例に、画面サイズの異なるデバイスでの見え方など、実機で試さねばわからない部分が紹介された。

廣畑氏が制作した「TigerMinesweeper」のソース。開発者自身からソースの解説を受けられるのは貴重な機会

Flex 4.5 を使用したモバイルアプリケーションの開発

Flex 4.5でのモバイルコンポーネント、特に画面遷移を司るフレームワークについて多くを語ったAKABANAの有川榮一氏。画面遷移フレームワークはアプリの仕組みに応じて使い分けが必要だが、その中から有川氏が紹介したのは、ViewNavigatorとViewだ。ViewNavigatorはひとつの画面を表示させ、画面遷移を管理するもの。一方のViewは、ひとつのViewNavigatorが所属する画面用のコンテナという決まり事を頭に入れておくと、Flexでのアプリ開発に役立つとのことだ。

Flexでの開発で覚えておきたいのが、この画面遷移フレームワーク

恒例のスニーク・ピークでは「Wallaby」や「Edge」のデモも

のっけから「Flash要らず! "HTML5"でアニメーション」という驚きのタイトルで登場したアドビ システムズの太田禎一氏によるセッション。デモンストレーションでは、すでに報じられている「wallaby」を用いて、FLAファイルからHTML5へと変換して見せた。

また、本邦初公開となった「Edge」(JavaScriptフレームワークの「jQuery」をベースに開発されたソフトウェア)では、Flashに頼らず簡単なアニメーションを作ることができるという。デモでは、既にあるHTMLファイルを読み込んで、タグ付けされたリージョンのなかから演出したいものを選択するだけで、コードを書くことなくあっという間にアニメーションを付与してみせた。「Edge」に関しては、本年中に我々もその技術を試せるようになるとのことで、期待したいところだ。

FLAファイルをWallabyでHTML5へコンバートしてみせた

こちらはEdgeによるデモンストレーション。年内に我々も実際に触れることができるかも?