KenG Blog

カンペキな初心者のための、Adobe AIRの基礎の基礎

AIRのサンプルをデモ（Buzzword , iPhone , NHK時計ーブログパーツをAIR化）

AIRとは

• Web標準技術の全面採用（既存技術の活用。新技術がないので習熟が楽）
• Mac/Winに対応（ランタイムはもちろん、開発環境もクロス。MacとWinで自由にコラボ）
• ランタイム型（Javaや.NETフレームワークも。FlashもWebブラウザも言ってしまえばランタイム）

AIRのメリット

• AIRランタイムはワンクリックでインストール、もしくはAIRアプリと一緒に自動インストールされるスムーズさ
• 他のランタイムと比べてサイズが小さい（Beta2で9.4MB）
• HTML/CSS/MXML/Ajaxで開発

開発〜配信フロー：

1. 制作するのはWeb標準ファイル＋App.xml（AIR用アプリ記述XMLで、開発環境が自動生成）
2. AIRにパッケージ化（Zip)
3. AIRランタイムに１回インストール

多くにリーチできるWeb技術、特にWeb 2.0アプローチはWebブラウザ＋サーバサイド処理で、限りなく多くのユーザにリーチ。Flashも99％のユーザにリーチ。一方、バイナリー形式化されたスタンドアロンアプリは、より高速かつ高機能。この間にある谷をAIRが補う。
アドビは「Webの流儀、カルチャー」をデスクトップの世界に持っていくというアプローチ。

開発が最も楽なのがFlex Builder 3 beta 2。わずか24行のスクリプトとグラフィックファイルでUIをもつAIRアプリが完成。

Dreamweaver CS3 + Updateの場合、HTML+CSS, JavaScriptで同様のものを開発できる。AIRにはWebKitというHTML/JSエンジンが搭載されており、それで表示できるソースを書けばOK。クロスブラウザテストの必要なし。CSSが作りやすい。

Flash CS3＋AIR Update。基本はActionScript 3で開発するが、AS3ムービーの中にUILoaderコンポーネントでAS1&2ムービーを埋め込むことで、AS1&2ムービーをAIR化できる。

上記すべて同じAIRメソッドを呼び出すことで、開発環境や手法が違っても同じUIをもつAIRアプリが開発できる。

完成後はAIRパッケージの作成（人に配布するための作業）

• パッケージ作成
• 自己認証の証明を作る

まとめのメッセージ
「カタチ先行で開発しよう」
　アイコンやウィンドウなどはオリジナルものを作ろう

TIPS：アイコン作成はFireworks CS3が便利。128x128 〜 16x16までの4ファイルを1ドキュメントに配置し、スライス機能を使って一度に書き出し。アイコンはシンボルとして作ることで、変更を加えると４サイズともに適用される。アドビのアプリケーションのアイコンはFireworks CS3で作られている。Firefoxも実はそう。

TIPS：AS3やMXMLをネットで検索するとたくさんのサンプルが見つかるので、コピペしてRUNしよう。Flexだとこの行為がとても楽にできて習熟度も高い。Flex Exampleが便利。AIRについては kamijo akihiro blog がAdobeLabsの細かい情報を日本語で伝えてくれる。