リッチインターネットアプリケーション(以降RIA)の構築に当たって、前回の記事で
・直感的で扱いやすいユーザーインタフェース(以降UI)
・ユーザーにストレスを与えないシームレスな遷移
の2点が重要な着眼点になるということを述べました。
前回はユーザ情報の入力フォームを例に解説しましたが、まだRIAと言われてもイメージがつかみきれていない方がいらっしゃるかもしれません。そこで今回は、RIAを利用したサイトの実例を紹介しながらその2点について考えてみることにします。
まずRIAの恩恵を身近に感じられるのは、ECサイトやオンラインショッピングなどにおける商品の選択・売買・予約のような場面ではないでしょうか。
ショッピングサイトから商品を購入する場合、ユーザは数ある商品の中から目的の商品を選び出し、自分の顧客情報を記入し、購入の決定を行います。しかし、全てのサイトでこういった流れやUIが統一されているわけではありませんから、「目的の商品が見つからない」「ページの遷移が遅い」「どう記入したらよいかわかりづらい」というストレス・不安感をユーザに与えてしまう危険性は十分にあるはずです。そこでRIAを利用することによって、そういったストレス・不安感を軽減することが出来ます。
事例(1) T-SELECT(http://t-select.livedoor.com/)
一般のユーザがデザインしたTシャツの販売サイトです。
トップページであるTシャツを選択すると、RIAを利用した商品の情報のページに遷移します。そこには商品のイメージ・価格・サイズ・色などユーザが必要としているだろう情報が一通り表示されています。これによってユーザが手に取ることができない商品のイメージを、わかりやすく伝えることが出来ます。さらにこのページから枚数の決定、買い物カートの確認の画面を経て購入決定画面までシームレスに移動することが出来、ユーザのストレス・不安感を最低限に抑えようとしているのがわかります。
さらにそれぞれの画面の転換をアニメーションで表現し、ボタンとその他の要素の色味の違いを強くするなどの工夫が為され、操作性が高く直感的なUIが構築されています。
次に、RIAを利用することによって従来の技術とは異なる自由なレイアウト、場面展開の表現が可能です。さらにFlashでは音楽ファイル、ビデオファイル、XMLファイルを外部から読み込むことでより高度なRIAを構築することが出来ます。
この特色を活かして、独自の表現によって企業・商品イメージを伝えるサイトによく活用されています。
事例(2) Bravis International Limited(http://www.bravis.com/)
企業のアイデンティティ・ブランドアイデンティティを手がける企業だけあって、独特な見せ方をするRIAを使っています。
最初は英語・日本語を選択するボタンしか表示されていませんが、選択肢を選んでいくにつれて選んだメニューの要素が下方向に広がり画面も下方向にスクロールしていきます。次にどこを選んだらよいか直感的に把握できるように工夫されており、サイト内で迷うことはないでしょう。またサイト内のほぼ全てのコンテンツにシームレスにアクセスできます。
事例(3) Vodafone Future Site(http://www.vodafone.com/flash/futures/index.jsp)
Vodafoneの考える未来のモバイルコミュニケーションを表現したRIAです。
ビデオファイルをふんだんに利用した映像によるUIや、紹介されている未来のモバイルコミュニケーションツールにユーザが投票できるといった、まさに“リッチ”なコンテンツになっています。カメラワークやムービー内の細かな小物の動きまで作り込まれており、クオリティの高さは群を抜いています。多くの画像や音声を使って作成されていますが、場面ごとに外部swfファイルを読み込むようにすることで1度に読み込むファイルのサイズを少なくし、ロードにかかる時間を短縮しています。画面転換時の滑らかなアニメーションも、ユーザの体感的なロード時間を短縮する効果を狙ってのものでしょう。
事例(4) VOLVO S40, THE INSIDE STORY.(http://demo.fb.se/e/s40/index.html)
VOLVO S40の紹介サイトです。部屋から出てS40に乗り込むというストーリー仕立てで、S40の魅力を表現したRIAです。
部屋の中に置いてあるテレビを操作することでいくつかのCMのビデオを見ることが出来ますが、前述のVodafoneのようにビデオファイルを使うのではなく、基本的には画像ファイルで表現されています。画像ファイルをうまく使うことで、インタラクティブに車の外観を見たり車の内装を見回すといった疑似体験が可能になっています。UIは控えめにあまり目立たないような表示になっていますが、ユーザの直感で操作して欲しい・操作できるはずという自信の表れなのかもしれません。
以上の4つの素晴らしいRIAを例に述べたように、ユーザがストレスなく直感的にインタラクティブに操作出来るというのがRIAの魅力であり、構築する際には気を配らなくてはならない重要なポイントになります。
(佐藤啓太)
グリーンITの第一歩は見える化です
ERPパッケージの導入を成功させるコツ
エンタメCGM「gooメーカー☆メーカー」
これからの時代のセキュリティ対策
ZDNet Japan Green IT
Techno Exchange
ココが変わった、新型「ニンテンドーDSi」--「ニンテンドーDS Lite」と比較
フォトレポート:本体が分離するNTTドコモの「セパレートケータイ」の謎に迫る
話題のスマートフォン、写真で見るBlackBerry Bold