RSS

初出:2007年12月 1日 21:37

カンペキな初心者のための、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ランタイムに1回インストール

多くにリーチできる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ドキュメントに配置し、スライス機能を使って一度に書き出し。アイコンはシンボルとして作ることで、変更を加えると4サイズともに適用される。アドビのアプリケーションのアイコンはFireworks CS3で作られている。Firefoxも実はそう。

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

コメント

コメントする











名前、アドレスを登録しますか?








このエントリーのトラックバックURL:

トラックバック一覧


記事の詳細ページ

記事の全文を表示します。関連するコメントやトラックバックなどもこちらからどうぞ。

本日のBGM

Ajaxで動いてます。詳しくはここ

Now & Then

Twitter Updates

    follow me on Twitter