Back to Top

entacl Lab. Webクリエイティブラボラトリー

Webクリエイティブラボラトリー

投稿日:    投稿者: 岩田

Information Architectureとは(情報設計)

Information Architectureとは(情報設計)

Information Architecture(情報設計)とはなんなのでしょうか? マーケティングに近い内容で言われているIAですが、ここではデザイナー/ディレクターとして必要です!という「IA」についてご説明していきます。

Information Architectureとは

「Information Architecture 情報設計」(以下IA)とは、 最初にクライアントからのお話を聞いてから、実際にデザインを作成するまでの間の作業になります。

IAという言葉自体はそこそこ新しめですが、 実際は昔から重要視されており、たとえば現状分析をマーケティングチームで行い、設計や企画部分からプランナーが入るなど、各社様々な規模感や方法で行われています。

こういった内容を取り入れながらWEBに特化させた考え方や一連の設計フローをInformation Architecture、情報設計といいます。

ここで書くIAは、マーケティングやプランニングの専門的な知識を掘り下げるのではなく、 「デザイナー、ディレクターとして考えておかなければいけないIA」という視点で、クライアントやチームでその意識を共有できるようなドキュメント化の方法についてまとめていこうと思っています。
ざっくりIA設計フロー
まずはIAとはどんな作業があって、どんな事を考えるのかを、ざっくりフローにまとめてみました。

これを見てもらえばわかると思いますが、このような思考フローは、 まともなデザイナーであれば、当然頭の中でこのようなプロセスをたどっているはずです。

そうそう!頭でやってるよ!だから黙ってろよ!!
という方も一度ドキュメントに落とす事で頭をより整理できますし、クライアント含めたチームで、思考を共有できますので是非一度やってみてください。

またキチンとドキュメントにまとめ提案する事で、業務として見積にのせる事ができるようになり、 思考に時間をかけられるようになります。

IA_flow.jpg このフロー図のPDFはこちらから

ざっくり説明

IAのはじめは分析から
IAの始めは、分析です。これはあまり頭を使わないものがほとんどです。 まずは要件定義、これはクライアントにそのサイトでどんなことがしたいのか聞きます。 なんのためのサイトなのかはもちろん、他にある狙いなど、ビジネスニーズを聞きましょう。 はっきりした意見の無いクライアントにはSWOT分析などを使い、考えを明確化するのも一つのやり方です。

その後はターゲットユーザーのセグメントやユーザー分布図などで 、ターゲットになるユーザーを考えましょう。

ユーザーがある程度特定できたら、そのユーザーが何をしにそのサイトを訪れるのか? 何がしたいのか?というユーザーニーズを考えます。

ユーザーニーズ、ビジネスニーズが出揃ったら、いよいよ戦略を考えるのですが・・・ (別記事:ユーザーニーズとビジネスニーズを参照

その前に、WEBというは単独で存在するというわけではない事をお忘れなく! 実際はサーチエンジンなどから、様々な同業他社のサイトと比較して見られている事がほとんどです。 戦略を考える迄に、競合会社のWEBサイトをチェックして良い点、悪い点を理解します。 (別記事:ヒューリスティック評価を参照

また、その業界の中でのポジショニングマップを作成して、現状のサイトの立ち位置や見え方、 サイトの目指すべきポジションを明確にしましょう。
さて戦略を考えましょう
ここからは考えるフェーズになります。意外と頭をつかいますが、 分析が完璧にできていれば、おのずと目指す所が見え始めているのではないでしょうか?

分析結果を元に、根本となるコンセプトを決めましょう。 これは細かいものではなく本当に幹になる部分で結構です。 たとえば、メガネブランドのECサイトなら 「20〜30代の人にメガネをいっぱい買ってもらいファンになってもらう」 ニュースサイトなら「毎日見にきてもらう」 ぐらいでいいと思います、サイトのゴールみたいなものですね。 細かい戦略はこのあとに決めていけばいいでしょう。 また、これは暫定でもかまいません。

そしてなんとなくコンテンツのイメージを膨らませましょう。 単純にサイトが綺麗に整っていればいいのか?キャンペーンサイトやスペシャルコンテンツを つくった方がいいのか?分析したユーザーとそのニーズを叶える為の大枠を暫定で決めます。

暫定のコンセプトやコンテンツがなんとなく決まったら、それがユーザーにとって どう感じるかペルソナを立てたりユーザー行動モデルを使ってシミュレーションしましょう。

コンテンツがはっきりしないのであれば、このあとのコンテンツマトリックス作成後に シミュレーションしてもいいです。うまくいかなければコンセプトを考え直してもう一度!!

シミュレーションでうまく行きそうな感じになったら、 具体的に必要なコンテンツを全て書き出しましょう。コンテンツマトリックスの出来上がりです。 ページ遷移や階層構造などは全く考える必要はありません。
いよいよ設計します
戦略までで、サイトの内容が決まりました。 「誰に対して何をどうみせるか」ですね。これが本当の意味でのコンセプトです。

それではサイトの骨組みであるサイトマップを作成します。 同時にナビゲーションや階層構造がどうあるべきかを考えましょう。 また、この際に機能的デザインの見せ方や新しい技術などを導入する場合は、 デザイナーや技術者と相談しながら決めていくのが理想です。 (FlashサイトやHTML5、JavaScriptを多用したサイトなど) サイト構成が決まる前でないとできないデザインや見せ方も多々ありますので。

サイトマップとナビゲーションなどが決まったらいよいよ ワイヤーフレームを作成しましょう。

ワイヤーフレーム(画面設計)はデザインのない骨組み状態のページの事で 要素図と違いある程度レイアウトや機能フローを盛り込んだものになります。

まずはサイトの核となるページのワイヤーフレームを4〜5ページ作り、 チームで共有します。この時点で機能的なデザインや技術の最終確認を クライアントとチームで共有し合意を得ます。

ここまでで情報設計は概ね完了といってもいいです。

あとはコンテンツの内容にあわせて、ユーザービリティを考慮しながら 全ページのワイヤーフレームを書いていけばいいだけです。

カラースキームやデザインのトーン・マナー、モチーフなどは プロのデザイナーにお任せしましょう。
あっあなたがデザイナーですか?では良いデザインになるはずですね。よかった。
おまけ
上記のフローは、全ての案件で全部行わなければいけないわけではありません。 自分の思考が進まなかったり、チームの理解の弱い所などだけ抜粋してドキュメント化して使用すればいいと思っています。

また、IAにこうでなければいけない!といのはありません。 もともとが人間の思考です。案件の内容にあわせてどんどんオリジナルのドキュメントにしていってください。

今回は全体の説明だけですので、各項目で具体的にどうするかはlab内にて別途記事にします。。。 ここで出てきたそれぞれのドキュメント詳細やサンプルもあわせて紹介していきますので。 それではよいサイトを!!