ウェブサイトで成功を目指すために 欠かせない3つのデザイン要素

ウェブサイトで成功を目指すために
欠かせない3つのデザイン要素

「ウェブでの成功を実現するために、まずはサイトの目的を明確化することが必要です。目的がなければ、私たちは何も提案できませんし、判断もできません。そこで、プロジェクトを進めるための前提条件として『ユーザー』『コンテンツ』『コンテキスト（文脈）』を明確化します（図1）。

図1　コンセントが掲げているウェブサイト制作で重要な3つのデザイン要素。

そのサイトに誰がどんな状況で訪れてどんな行動をとるのか、どんなコンテンツや機能が必要とされているのか（ユーザー）。そのサイトでどんな情報を用意できるのか、誰がどんな形でその情報を管理しているのか（コンテンツ）。そのサイトのビジネス的な目的や、置かれている状況（コンテキスト）。ウェブサイトの新規立ち上げやリニューアルは、これら3つの前提条件をきちんと明確化することから始まるわけです。前提条件が明確になれば、私たちも手段や方法論を含み具体性を帯びた提案をすることができます。

そして私たちからの提案もまた3つの側面で構成されています。ブラウザ技術とバックエンドサーバーを的確に組み合わせるなど、最適化された『テクノロジー』。魅力的でわかりやすいデザインを示す『ビジュアルコミュニケーション』。サイトを訪れたユーザーにどのように情報を探してもらうのか、どのような知識を得てもらうのかという視点での『情報アーキテクチャー』。

これら3つの側面のバランスを取りながら実現し、ビジネスゴールを目指すのが私たちの役割です。一方的に提案して終わりではなく、クライアントも気づいていないような強みや弱み、課題の検討を通して明らかにしていくのが、私たちのプロジェクトの進め方です。

図2　プロジェクトのゴールなどの概要をまとめた「クリエイティブブリーフ」。米IA Instituteが配布しているものをコンセントで改良している。
IA Institute、コンセントラボ

もちろんさまざまなタイプのクライアント様がいますが、私たちのスタンスは変わりません。これから作ろうとするウェブサイトの『コンセプト』『ビジネスゴール』『ターゲットユーザー』『ユーザーにもたらす価値』といったプロジェクトの要素をレポートとしてまとめ（図2）、途中でプロジェクトの方向性が私たちとクライアントの間でずれないように進めていくことになります」（長谷川氏）

目的を達成するための
最適な手段を提案する醍醐味

株式会社コンセント
取締役／アートディレクター
堀田理佳氏

図3　「REDWOOD CREEK」では、クリエイティブコンセプトから提案を行い、ウェブでのブランド訴求のためにオリジナルの絵本コンテンツが展開されている。
http://www.suntory.co.jp/wine/special/rwc/

実績の中から、アートディレクターの堀田氏に「サントリー」の案件をケーススタディとしてあげていただいた。

「サントリー様の案件で印象に残っているのは、『レッドウッド・クリーク』というワインのブランドサイトの制作です（図3）。このワインは米国では有名ですが、日本での知名度が低いことから、ブランド訴求を第1の目的に設定しました。メインコンテンツにはブランド名でもあり産地の豊かな自然を象徴する、『レッドウッド（赤杉）』と『クリーク（小川）』をモチーフに絵本に見立てたコンテンツを用意しました。米国で展開されている広告などのビジュアルイメージは、日本国内では使用しないという条件でしたので、逆に自由にアイデアを提案することができたのは楽しかったですね」（堀田氏）

このケースは、ビジネス的な目標が明確でクリエイティブへの制約が少なかったことが、良い提案につながったといえるが、全体観がない状態で、具体的な注文だけ与えられるケースもあるという。

「クライアント側の担当者には、技術的な注文や手法よりも、大局的な視点での方針を立てていただきたいと思っています。発注側として、どのような成果をあげたいのか、そのためにどの程度のコストをかけることが妥当なのか、どの程度の運用負担が生じるのか、そういった観点で常にプロジェクトを見ていただく必要があります。その目的に対して、デザインや情報アーキテクチャの専門家として、具体的にどういった手段が妥当であるかを提案し、それを実現していくのが私たちの役割です。『Flashアニメを作りたい』『SNSをやってみたい』といった手段は、どういった目的でそれをやりたいかを常に意識して検討する必要があります。目的なくして、手段だけ先行してスタートしたプロジェクトは必ず途中で行き詰まってしまいます」（長谷川氏）

専門性を追求して
個々のレベルアップを目指す

図4　「東京国際フォーラム」では、来場者、主催者、プレス・マスコミそれぞれのニーズを想定し、3つのグローバルナビを作成してリニューアルをしている。
http://www.t-i-forum.co.jp/general/

図5　WFP 国連世界食糧計画「ハンガーマップ・ナビ」では、紙の資料をウェブで公開するだけでなく、初めて訪れた人が、各国の基本情報とあわせて飢餓状況を参照できるように提案がされている。
http://www.wfp.or.jp/hungermap/

社内にIAを抱えるウェブ制作会社は増えてきているが、コンセントはディレクター全員がIAの役割を担っている。職域の専門化が進むウェブ制作業界では、IAは専門職としてプロジェクトに参加するケースが多いが、コンセントではディレクターとIAは分けられないと考えている。

「IAは情報設計をする人、ととらえられていますが、もともと米国の編集者リチャード・ソウル・ワーマンが提唱したIAの概念には、情報をわかりやすく伝える人すべてという意味がありました。そういった意味では、ウェブデザインに携わるすべての人がIAの能力を持っている必要があると言えます。コンセントでは、プロジェクトのディレクターが「わかりやすさ」についての品質責任を負うために、必然的にIAの役割も担うわけです。また、役職と各プロジェクトでの役割分担とは分けて考えています。たとえば、クリエイティブよりのプロジェクトの場合、アートディレクターがディレクターを担当することもありますし、あるいは各ページのワイヤーフレームをデザイナーが作成することもあります。

会社の中で専門分化を進めるのではなく、トータルに会社として専門性を高めていきたいと考えていて、プロジェクトごとに必要な体制を組めるよう、1人1人が高いレベルの仕事ができるようになっていきたいと思っています」（長谷川氏）

ウェブサイトにおける情報設計の重要性が企業サイトのWeb担当者にも認識され始めているが、ここに来るまでは平坦な道程ではなかったようだ。

クライアントの嗜好の傾向として、設計よりも実際の見た目を重視しがちであり、その結果IAによる情報設計の提案よりも先にデザイン案の提出を求めてくるケースが多いという。それでも、プロジェクトの当初の段階でデザインの骨格をしっかりと確定できればまだよいが、後になって別の担当者や担当者の上司がプロジェクトにかかわってきて、その人たちの好みでデザインが急遽覆る、などという笑えない事態が実際に起こりうる。

「デザインは複数案を比較すれば適切なものが見つけられるというわけではありません。複数案から選べば検討した感は得られますが、それでその会社のブランドイメージを伝えたり、サイトが使いやすくなったりという目的を達成しているとは限りません。また、担当者個人の好き嫌いで選んだものであれば、担当者が社内でなぜそのデザインになったのか説明できなくなってしまいます。

私たちは、デザインにおいては、言葉で表現したいイメージを固めたり、競合や類似サイトなどのデザインをマップ上に配置して特徴を明確化したりと、いろいろなツールを使いながら理想的なものに詰めていくアプローチをとっています。

一番重要なことは、デザインで表現したいことがなにかということを、担当者とアートディレクター、デザイナーとが言葉で共有し、そしてできあがったデザインがその言葉をカタチにできているか確認することです。もし、ある案が適切でなかったとしても、なぜそれがよくないのかを検討することによって、次の案ではより表現したいポイントを実現できるものになっているはずです」（長谷川氏）

企業側の担当者がウェブサイトでなにを表現したいか、自分たちはどう見られたいか、という要素を順位づけて考えている場合、後になってデザインがぶれる可能性はぐんと少なくなる、とのこと。

「クライアント担当者が、自分自身の判断でウェブサイトの目的を断定してしまうことに抵抗や不安があるのは当然のことです。業種やサイトの目的、もちろん予算や担当者の性格など、さまざまな要素によってプロジェクトの始め方や進め方に違いが生じます。私たちが共に考えることで、目的を明確にするお手伝いをしていきたいと思います」（長谷川氏）

表1　コンセントの予算イメージ

※この記事は、『Web担当者 現場のノウハウvol.4』 掲載の記事です。