これからのWEBデザイナーは情報設計ができると強い！経験と努力を重ねて強みにしよう！

私たちがよく目にするWEBサイトは、さまざまなデザインで制作されています。何気なく見ているサイトも、ページの目的によってデザインやコンテンツの配置が工夫されています。

例えばLPページなら、ユーザーを刺激するデザインで興味を持ってもらえるように制作されていたり、ブログなら最新のコンテンツ（記事）が見やすく配置されていたりと、ユーザーの目的が達成できるように考慮し構成されています。企業サイトの場合は、会社情報や事業内容などその会社が何であるかをユーザーが理解しやすいように制作しています。

もしこれらのページでユーザーの知りたい情報などを容易に取得できないとなると、ページから離脱しサイト側の目的を果たすことができなくなります。そのような意味でページを制作するときは、何をどのように設置しどうしたら目的を達成できるかを考え設計することが重要になってきます。今回は、WEBページでの「情報設計」について考えていきます。

情報設計とは

情報設計（Information Architecture／略称：IA）とは、たくさんある情報を何らかの分類でまとめ、それらをどのように構成したら分かりやすいかを考え設計することです。
WEBサイトでは、グローバルナビゲーションやボタンを適切に配置し、ユーザーの目的を達成しやすくすることが大事です。

IAとUIとUXの違い

IAは、UI（User Interface）やUX（User Experience）と比較されるところがありますが、先に述べたIAは、サイトマップのように情報の構成を設計したもの。UIは、人間が直感的に理解できるものをデザインすることを、UXは、UIによりユーザーが実現できること（体験）を意味します。

情報設計の流れ

クライアントから制作依頼を受けると、まずどのようなページを作成したいかヒアリングを行います。そこで出た要望をベースに制作する形になりますが、何も考えずに制作してもクライアントのニーズに応えることはできません。クライアントにとって効果的なものを制作するためには、情報設計をしっかり行うことが重要です。ではどのように行えば良いか、流れを追って説明します。

情報収集

クライアントに要望をヒアリングすると、初めは「〜するページを作りたい」など割とざっくりした内容から始まることが多いです。しかし話を進めていくうちに、具体的な目標や現在抱えている問題（課題）など、さまざまなことが見えてきます。制作を依頼するということは、ただ単に「見栄えの良いページが欲しいから」ということではなく必ず達成したい目標や改善したいものがあるはずなので、できる限り多くの情報を集めるようにします。

分析

ヒアリングした要望や課題をまとめ、これを１つずつ分析していきます。問題がある場合は、導線や情報が分かりにくくなっていないか、表示速度が遅くないかなど、現在のページから原因を推測しつきとめるようにします。新規作成サイトやサイトリニューアルの場合は、ヒアリング内容をベースに競合他社と比較し改善ポイントを洗い出したり、現在のトレンドや今後の動向などを精査したり、幅広く分析を行います。分析結果は、必ず客観的な観点から説明できるようにまとめます。

戦略

では実際クライアントの目的を達成するためにどのようにすれば良いか、前述の分析結果も踏まえ戦略を立てます。その際に数パターンのペルソナを設定し、ターゲットをどのようにゴールまで導くか、カスタマージャーニーマップを作るなどしてシミュレーションを行います。何パターンか試し、いくつかの成功例が導き出せたら、これを戦略の要素として取り入れるようにします。

設計

分析と戦略の立案により、クライアントの目的（ゴール）が明確になってきたところで、WEBページをどのようにすれば良いかを考えていきます。まず必要になるページを洗い出し、階層化し、サイトマップを作成します。次に導線をどのように設定するか、UXの観点を取り入れ設計します。サイト構成と導線設計が固まってきたら、各ページのワイヤーフレームを作成し、完成したサイトをイメージしていきます。

ここまでは一般的な流れになりますが、案件によって行う順序や作成する資料は柔軟に対応しても良いと思います。資料はクライアントと認識を共有するための重要なものなので、できる限り詳細に記述するようにしましょう。

情報設計する際の注意点

情報設計は目的を達成するための重要なファクターですが、設計する上での注意点をいくつか挙げてみました。

クライアントの要望は膨らみ続ける

サイトマップやワイヤーフレームで確認を行ったが、制作フェーズで追加要望が出ることはよくあることです。最初から全てを満たすことは簡単ではないですが、最低限、認識に齟齬が生まれないようにしなければなりません。

カスタマージャーニーは、憶測や願望に寄らないように

ペルソナを設定しカスタマージャーニーで仮説を立てますが、そこで楽観的観測から実際とズレが生まれることがあります。これも難しいことですが、できるだけこれまでの実績や経験をもとに立てるようにすることが原則となります。

クライアントとの認識合わせは綿密に

クライアントに「想像していたものと違う……」と思われることは、双方にとって不幸なことです。サイトマップやワイヤーを作成する段階で認識がずれると、その後の工程でさらにかけ離れたものになっていってしまいます。制作フェーズに入ってからでは取り返しのつかないことに発展しかねないので、この段階でしっかり認識を合わせておくことが重要です。

まとめ

筆者は主にコーディングを担当することが多いのですが、同僚やOJT生、スクール卒業生などから「WEBデザイナーになりたい」と相談されることがよくあります。相談者の多くから「デザインに自信がないけど、デザイナーとしてやっていけるか」との悩みを聞きますが、私はいつも「デザイナーと言っても２種類あるよ」と助言をします。

１つは、アーティスティックなデザイナーです。たぶんデザイナーを目指す多くの人はこちらのほうを思い描いていると思うのですが、アートとなると才能や実力の世界なので、叶わないと思い諦めてしまうことがあります。
もう１つは、今回の記事にある「情報設計」のできるデザイナーです。私が思うに、「情報設計」がしっかりできる人も凄いと思います。アートとなると多少の才能も必要ですが、「情報設計」ならば経験や努力でデザイナーとしてやっていくことは可能だと思います。
もちろん、ツールやデザインの基礎知識などは必要だと思いますが、あまりにもアートのほうをイメージし過ぎて自信をなくし、早々にWebデザイナーを諦めることはないと思います。

何事にも努力は必要ですが、WEBデザイナーとして悩んでいる人がいたら、自分の強みとなるものを見つけ、それに特化するのもWEBデザイナーの仕事を長く続けていく１つの方法だと考えています。せっかく見つけた目標なので、簡単に諦める前に一度踏みとどまって、この記事を見てもう一度考え直してもらえたら幸いです。

株式会社デジタルスケープ
デザイン&デベロップメントスタジオ
高杉 充

2005年よりWEB業界に入り、未経験ながらOJTで１年ほど数社のサイト更新を経験した後、以降はグローバルメーカーやWEB証券会社のサイト運用など大手から中小企業まで様々な案件にWEBコーダー・フロントエンドエンジニアとして携わる。現在は、フロントエンドエンジニア・ディレクターとして、サイトリニューアルやお客様先常駐案件などの提案から制作・運用までを担当。
コミュニケーションを通して信頼関係を構築し、安心して働ける環境でメンバーと共に成長することが何よりの喜びです。