最新トレンドやキーワードをわかりやすく解説
WCR Watch [1]


リッチクライアントの最右翼FlexとFlashの違い

宮下知起
2004/11/9


 10月23日(2004年)、マクロメディアがユーザー向けに開催したカンファレンス「Macromedia Flash Conference 2004」では、マクロメディアがRIA(Rich Internet Application)の普及に向けて、RIAのプラットフォームと開発ツールの提供に注力することがあらためて強調された。そして、RIAを推進する原動力が従来のFlashではなく、“Macromedia Flex”であることが明言された機会でもあった。本稿では、まだ内容が広く知られていないMacromedia FlexでRIAを実現する場合と従来のFlash作成ツール“Flash MX”を使う場合とでどのような違いがあるのか、カンファレンスの各スピーカーの発言内容から整理してみたい。

米マクロメディア シニアプロダクトエバンジェリスト Christophe Coenraets氏

 ところで、“RIA”と“リッチクライアント”という2つのキーワードの存在に読者は混乱するかもしれない。今回のカンファレンスでマクロメディアは、「RIAは、リッチなユーザーインターフェイスを保ちながら、誰もが使うことができる、リーチの長いWebアプリケーションのデプロイモデル」(米マクロメディア シニアプロダクトエバンジェリスト Christophe Coenraets氏)という定義を加えている。Flashの普及率は現在インターネットに接続するPCの98%だ。しかもFlashにはCurlやBiz/Browserが必要とするクライアントライセンスが不要。マクロメディアのリッチクライアント・ソリューションは、Flashをユーザーインターフェイスに用いることでより幅広いユーザーに利用できる、ということを同社は訴えている。

編注:Macromedia Flexの詳細は「XMLでリッチクライアントを実現「Macromedia Flex」」を参照してほしい。

Flexは、FlashをUIに使いたいJ2EE開発者に最適なリッチクライアント開発環境

- PR -
  Christophe Coenraets氏によると、FlexはRIAのプレゼンテーション層を実現する“プレゼンテーションサーバ”であるという。FlexはJ2EEサーバ上でサーブレットアプリケーションとして動作する。プレゼンテーションの生成のみを担うユニークなサーバ製品だ(編集注:Flexは近い将来.NETにも対応予定である)。

 さらに同氏は「Flexのプログラミングモデルは、JavaのJSPによく似たプログラミングモデルを持つ。タグベースの開発スタイルを持つため、J2EE開発者には馴染み易いはずだ」と説明する。Flexでは、画面の設計をMXMLと呼ばれるテキストベースのタグで行う。テキストファイルなので、開発者は任意のテキストエディタで開発ができる。MXMLはXML形式のマークアップ言語なので、普段XMLを書く機会の多い開発者には難しくないはずだ。

 Flexには、Flashで実現するグリッドやアコーディオンタブなど、さまざまなユーザーインターフェイスがコンポーネントで用意されている。XMLのタグでこれらを利用することを定義するだけで、実行時にFlashによるユーザーインターフェイスが生成される。

 また、FlexにはFlex Builderと呼ばれる開発環境が提供される。これは、Macromedia Dreamweaver MXの環境をベースに開発されたもので、DreameweaverがWYSIWYGでHTMLをコーディングできるのと同様に、ユーザーインターフェイスと、その対になるMXMLの両方を随時参照しながら開発できる。

 さらにFlexでは、ユーザーインターフェイスにひも付くさまざまなアクションはAction Script 2(以下Action Script)で記述することになるが、Action Scriptは完全なオブジェクト指向言語であり、Javaプログラマには取っ付きやすい。

株式会社セカンドファクトリー コミュニケーションセクションマネージャ/RIA アーキテクト 東賢氏

 株式会社セカンドファクトリー コミュニケーションセクションマネージャ/RIA アーキテクト 東賢氏は、従来までデザイナがFlashムービーに動きを持たせるためだったAction ScriptがAction Script2になったことで、システム開発向けに変化したと述べる。「もともとアニメーションのための言語だったので、以前はバグに甘いところがあった。なぜなら内部的にエラーがあっても、アニメーションは動いていた方がよかったからだ。Action Script 2は型チェックが厳密になったことによって、バグが潜みづらくなった」と説明する。また、Javaと同様にインターフェイスの継承が可能になったことでプログラムのメンテナンス性も高まっている。さらに東氏は「Flexでの開発にはオブジェクト指向の思考ができる人が重要だ。そこから考えると、Javaプログラマからの転向の方が現実的だ。中途半端に以前のAction Scriptに詳しい人はかえって開発の障害になる可能性もある」と述べる。

Flexの優位性はどこにあるのか?

 従来のFlashは、オーサリングツールを使ってバイナリファイルであるFlashファイル(swfファイル)を作成してサーバに配置したが、Flexの場合は異なる。サーバにはMXMLで記述したテキストファイルを配置する。JSPが実行時サーブレットにコンパイルされるのと同様、MXMLは実行時にコンパイルされ、swfファイルが生成される。2回目以降のアクセスではキャッシュされたswfファイルが使われる。これはJSPのコンパイルモデルに似ている。

 JSPと同様のコンパイルモデルは「JSPにデータベースアクセスに必要な情報を埋め込むことができ、swfファイルのサイズを小さくすることができる」(東氏)メリットももたらす。また画像もswfファイルに含めなくてもよくなるので、この点でもswfファイルのサイズ縮小に貢献する。Flexによる開発は通常のJSP、HTMLを使ったWebアプリケーション開発の手法を適用しやすい。

 セカンドファクトリーは、最近自社が手掛けた「富士写真フイルムのサービス」を例に、Flexのメリットを説明する。「お客さまは開発後のメンテナンスを自社でやりたいと考えていた。Flexであれば、FlashのユーザーインターフェイスをJSPと同様にテキストファイルで管理できる。また、頻繁な仕様変更が予測されるので、修正作業そのものがトラブルのトリガとなることが予想された。そのため、テキストファイルであることが求められた」

 さらに、このシステムは他社にASPサービスとして提供することも想定されていたため、画面のコーポレートカラーや見栄えを切り替えられる必要があった。「通常のFlashでは、画像をスタティックにswfファイルに埋め込むことしかできなかった。しかし、Flexの場合は、画像の要素を外部のリソースから持ってくることができるために、機能は同じで見栄えだけを変えることが容易だ」(東氏)。

FlexはRIAの開発効率を向上させる

 RIAの開発では、生産性が大きな課題となる。高いユーザビリティを実現するために、その分開発にはコストが掛かるからだ。そのため、Flashによるユーザーインターフェイス構築においては、「提供されるコンポーネントがどれだけ充実しているか、また、そのまま使えるものがどれくらいあるかが重要なポイント」(東氏)だという。この点でセカンドファクトリーはFlexを高く評価する。またFlexではアプリケーションの機能は変えずに、見栄えだけを変更する“スキニング”が容易になる。

 さらにRIAの開発では、顧客が望む高いユーザビリティを実現するために、最初にユーザーインターフェイスのモックアップを作成し、それをクライアントに確認しながらいく度か修正を繰り返していくプロセスが必要になる。Flex Builderは、XMLファイルを変更するだけでユーザーインターフェイスを変更できるため、モックアップの作成には最適だ。「プロトタイプを最終的な仕様につなぐことができる」(東氏)という。

 FlexによるRIAの開発では、デザイナが不要になるわけではない。もちろん、ユーザーに優れた体験、優れた操作性を提供するデザインを考えるのはデザイナの仕事である。Flexは、デザイナと開発者との間に明確な分業体制を提供する。クリエイティブの要素をアプリケーションロジックとは別にすることができる。

 ただ、今後の課題は残される。RIAの開発にはテスト手法が確立されていない。「自由度が高い分、その確立には時間がかかる」(東氏)という。しかし、J2EE開発と似たモデルを適用できる点、「従来のJ2EE開発のノウハウを適用しやすい。これは大きなメリットだ」(東氏)とも述べた。

 Flexは、従来までデザイナーの独壇場だったFlash開発を、J2EE開発者にも門戸を開いたプラットフォームだ。その実力は国内でもすでに評価できる段階に来た。正式出荷は11月中(2004年)に行われるが、Flex 1.5英語版(トライアル)とFlex Builder英語版(トライアル)はすでにマクロメディアのサイトからダウンロードできる。ぜひ、読者自らの手で評価してほしい。

 



HTML5 + UX フォーラム 新着記事
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

HTML5+UX 記事ランキング

本日 月間
ソリューションFLASH