申し込みフォームをFlashで置き換えてみる

「リッチインターネットアプリケーション」（以降RIA）※1 と言葉だけ聞くと、何か大がかりなアプリケーションを想像してしまいますが、申し込みフォームをFlashで置き換えるだけでも簡単なRIAと言えます。

前回の冒頭でも記されているように、フォームへの入力ミスを成功するまで何度もページ遷移していたのでは、ユーザーはイライラして途中で入力をやめてしまうかもしれません。

あなたも経験ありますよね？

こんな事で大事なお客様を逃していたのでは、大金をかけて構築した意味が薄れてしまいます。この様な事もRIAを用いれば、いとも簡単に解決出来てしまいます。※2

今回はRIA第一歩として、実際に申し込みフォームを「HTML+CGI（既存システム）」と「Flash+CGI（RIA）」の2つを用意し、比較を行っていきたいと思います。

まずは下記のサンプルページをご覧下さい。
（実際に動作いたしますので是非お試し下さい。その際に、あえて入力ミスをしてみましょう。）

これは既存システムで構築された、シンプルな申し込みフォームです。
入力されたフォームデータをCGIにPOSTし、値の形式に間違いがないか判定をします。
ここで間違った形式で入力されると、エラー内容が追加されたページが表示され、再入力を求められます。

図1. 既存システムでのシーケンス図

よく見かける形式ですよね。

これをRIAにしてみましょう。
（実際に動作いたしますので是非お試し下さい。その際に、あえて入力ミスをしてみましょう。）

どうですか？
一見すると通常のフォームと同じですが、送信すると違いが解りますね。
RIAでのシーケンスも見てみましょう。

図2. RIAでのシーケンス図

シーケンス的には既存システムとほとんど変わりがありませんが、ユーザーがストレスを感じる「ページの遷移」がありません。これだけでも大きなアドバンテージと言えるでしょう。さらにエラー項目が点滅し、視覚的にどの項目が間違っているのかが解りやすくなっています。

・直感的で扱いやすいユーザーインターフェース
・ユーザーにストレスを与えないシームレスな遷移

この2点がRIA構築での重要な着眼点となると思います。

次回以降、この着眼点を頭に置きつつ記事をご覧頂ければと思います。

（亀崎洋介）

※1 Macromedia社が提唱する、Flashを用いた表現豊かなWebアプリケーション。
※2 流行のAjaxを用いても可能ですが、RIAでの構築は他にも恩恵があります。詳細は次回以降に。