リッチインターネットアプリケーション(以降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の魅力であり、構築する際には気を配らなくてはならない重要なポイントになります。
(佐藤啓太)
※このエントリはZDNetブロガーにより投稿されたものです。朝日インタラクティブ および ZDNet編集部の見解・意向を示すものではありません。
勝ち残るIT活用--中堅中小企業の現場からタレントの江口ともみさんをレポーターに、
全国さまざまな業種の企業担当者に聞く!
サイバー攻撃関連ニュースのまとめ特別企画:高度化するサイバー攻撃からビジネスを守る
~対策レポートや企業の製品動向をまとめ読み~
管理者は、OS、仮想環境の混在に悩む
クラウド環境に必要な3つの運用サイクル
「使いたい時、使いたいだけ」を実現
今年検討すべき理想のストレージを考える
従来の防御が使えない!?複合的手法による
脅威から企業システムを守るために
【セミナー】IBM、Red Hat、サイオス
リーディングカンパニー3社が語る最新動向
仮想化の暗黒大陸を切り拓く
高次元のサーバー性能とHAクラスタリング
「創世期」から「成長期」へ突入
国内ベンダーはどう「進化し続ける」のか?
コラボレーションを変えるクラウドサービス
オープンソースの強みを発揮するJBoss
企業システムへの接続を安全、簡単にする
Juniper Networks MAGシリーズ
ANAや商船三井など5社の事例で読み解く
2012年春モデルの情報をいち早く掲載
HPのお得な情報や最新情報が満載
入社後の満足と不満足の分かれ目とは?!
納得いく転職をする為の転職活動での留意点
多様なボイスコミュニケーションを実現する
クラウド型プラットフォームとは?
よくある「5つの勘違い」の真実とは?
IT担当者必見の、目覚めの書を公開
株式会社エイジア
株式会社サテライトオフィス
EMCジャパン株式会社
ZDNet Japanは、情報システム部門の読者を対象に、ITを活用したビジネス課題の解決策を提供します。技術や製品の解説、ケーススタディ、ホワイトペーパーなどを通じて、情報システム部門の正しい意志決定を支援します。
ITビジネス全般については、CNET Japanをご覧ください。