文脈を理解したWebコミュニケーションデザイン

パッケージングの違いは文脈の違い

前回の記事「あなたも私もメディアカンパニー」で、コンテンツを制作するだけでなくメディアカンパニーのように配信の仕方にも工夫をしなければならないという話をしました。コンテンツを配信する際に考えておきたいポイントを記事で幾つか紹介していますが、制作者として注目しておきたい要素は「パッケージング」です。情報を利用者・顧客に届けるために、どのようなパッケージングをすると最適なのかを考えなければいけません。

パッケージングは、制作者であれば意識しなくても常に考えていることです。パソコン上で動作する Web ブラウザ上でどのように Web サイトの情報を表示させれば良いかを常に考えていると思います。最近だとスマートフォン向けの Web サイトをどう作るか考えている方も多いでしょう。パッケージングでまず最初に考えておきたいのが、どの情報をどのように見せるかです。

例えば Web サイトのモバイル版を作るとしても、単に PC 版の情報をモバイル向けの技術に転換して書き出せば良いというわけではありません。モバイルではスクリーンサイズが小さいだけでなく、利用者がサイトに接触する時間もわずかです。モバイルという環境でどのようにそのサイトにアクセスするのかを前提にして情報の再編成が必要になるでしょう。

PC版（左）とモバイル版（右）

Volkswagen の Web サイトを見てみましょう。PC版では新車の写真が大きく使われており、新車のプロモーションページへの誘導が幾つか作られています。全体的にイメージ先行といえるでしょう。しかし、同社のモバイル版は違います。大きな画像が使われているものの、ディーラーの検索や購入に役立つ情報を全面に押し出しプロモーションというよりツールとして使われることを想定しています。同じ企業のトップページにも関わらず、対象にしているデバイスが異なるだけで情報量、見せ方、アプローチが全く異なります。情報のパッケージングがモバイル向けはコンパクトになっているだけでなく、利用者へ向ける情報も違うわけです。

なぜこうした Web サイトを作ることが必然となったのでしょう。それは単にモバイルだからというだけではなく、Web デザインを考える上で文脈の理解が必須になったからです。

文脈を理解したデザイン

Context (文脈・コンテキスト) という言葉は、このサイトでも時々出て来ています。文脈を理解して情報を見せるという考え方は Web では随分長い間されており、Google のアドワーズ広告はその代表的な例です。コンテンツの内容 (文脈) を理解し、そこから最適だと考えられる広告を表示させるこの技術。従来は Web サイトコンテンツの文脈のみをコンテキストと指していたわけですが、利用者のコンテキストが今注目されています。利用者がどのように Web サイトの情報と接触しているかに応じてデザインを変えるという考え方です。

CSS Nite LP7 の講演でもコンテキストについて話をしましたが、そこで Web 利用者から取得出来るコンテキストが幾つかあることを紹介しました。（スライドを公開したときと少し変えてあります）

• 場所
• 時間
• 状況
• デバイス
• 言語
• 文化
• 趣味・趣向

こうした利用者の文脈を理解することでカスタマイズされた情報を提供するだけでなく、その瞬間 (ヒトトキ) に合った見せ方を提供することが可能になります。

近所のラーメン情報も一緒に表示される検索結果

Google は「ラーメン」というシンプルな検索キーワードでも利用者の文脈 (場所) を理解して、検索している場所周辺を検索結果に反映させています。利用者の求めているものを場所というコンテキストから読み取っているわけです。先の Volkswagen の例でも、 Volkswagen の Web サイトをわざわざモバイルから見る理由（デバイスと状況）を想定した結果といえるでしょう。昨年末の講演で、人々の生活の瞬間に入れる情報デザインが必要であると話しましたが、入り込むには情報を小さくするだけでなく文脈の理解が欠かせないでしょう。

メッセージを伝える前に相手の理解から

文脈の理解はデザインだけの話ではなく、マーケティングにも重要なテーマです。顧客の文脈を理解することで、より的確な情報を提供出来るだけでなく、信頼度やロイアリティも高まるでしょう。コンテンツをどのように配信するかを考えるにおいて、メディアカンパニーのような振る舞いが必要だと前回の記事で解説しましたが、文脈の理解がその振る舞いといえます。顧客 (利用者) の世界を理解し、彼等が重要だと思っていることは何か、そしてどのように対話をすれば良いかを考えること・・・これこそ文脈の理解ですし作られたコンテンツが効果的に相手に伝わるのではないでしょうか。

全部出しの盛りだくさんな Web サイト。利用者に設定画面を提供しカスタマイズさせる Web サイト。ソーシャルフィルタを利用した他力で情報が絞られる Web サイト。いろいろありますが、いろいろ情報をインプットしなくても利用者のこと理解して的確な情報だけを見せてください・・・というのが文脈を理解したコミュニケーションデザインなのかもしれません。