とはIA2010.01.29.Fridirected by DaisukeNoda

Q. そもそも IA とは？

①

A.web サイトの意図をより明確にし、

　活かすための技術。

①インフォーメーションアーキテクチャ（建築） =サイトの構造や情報設計全体を指す

= サイト／情報構造、ナビゲーション、ラベルなどの要素

②インフォメーションアーキテクト（建築家） ＝ 情報アーキテクチャを行う人、設計者

= 情報をわかりやすく、意図通りに提示する人

つまり、IA とは

IA の目的とは

②

・ユーザーとコンテンツをつなぐための

　分かりやすさのデザイン。

・クライアントのビジネスゴールと

　ユーザーのゴールの双方を満たす

　使いやすいweb サイトの構築。

③

Q. なぜ今 IA が重要視されているのか？A. 人々がweb サイトに対して抱く認識は、 主としてその人の個人的なゴールが 達成されるかどうかにかかっているから。

ユーザーエクスペリエンスと密接な関係にあります。

④

IA を理解するにはwebサイトの本質を理解することが重要です。・人々のweb サイトに関する一番の不満は　「探しているものが見つからない」ことである。

・web サイト訪問という体験は、1ページだけで規定

　されるものではなく、訪問した全てのページで決まる。

・web サイトは多種多様のユーザーから構成される膨大な

　オーディエンスがデザインの対象となる。

　※基幹システムとの大きな違い。

⑤

つまり・インフォメーションアーキテクトがデザインするのは　web サイトの全体構造であり、単なるweb ページではない。

・情報アーキテクチャが扱うのはマップや図表ではなく

　コミュニケーションである。

⑥

情報アーキテクチャ入門

⑦

情報アーキテクチャ入門・webサイト構築時の構成要素 ・情報アーキテクチャの 3大要素

簡単に言ってしまえば情報のつなぎ方のデザイン。

また、それぞれのweb サイトの特性により重要視される要素は異なります。

ビジュアル

コミュニケーション

テクノロジー要素情報

アーキテクチャ

1. サイトストラクチャ

（分類／情報構造）

2. ナビゲーション

（情報のつながり）

3. ラベル（ボタンやアイコンの名称／用語）

画面設計

サイトコンセプト

⑧

情報アーキテクチャ入門・サイトストラクチャ = サイトの構成を考える

or

「サイト構造」はサイトの骨格となり、ユーザーにとっては「廊下」であり部屋へ

入るための「扉」になります。サイトのweb 戦略に合わせて構造を検討します。

主な青果物としてはサイトマップや導線シナリオなどがあります。

⑨

情報アーキテクチャ入門・ナビゲーション = サイト内のコンテンツの情報整理と誘導経路「グローバルナビゲーション」「機能ナビゲーション」「フッターナビゲーション」などサイト内のコンテンツの優先順位や、必ず表示を確保しなくてはならない要素や階層ごとの「ローカルナビゲーション」など情報の構造化を図ります。

情報アーキテクチャ入門・ナビーションの事例「問い合わせ」をメインナビゲーションに配置

⑩

「問い合わせ」を機能ナビゲーションに配置

情報アーキテクチャ入門・ラベル（ボタンやアイコンの名称／用語）複数の情報グループを扱っているwebサイトというメディアの特性上ナビゲーションの

ラベリングや一貫性は非常に重要な要素になります。極力ユーザー視点を導入してラベル名を

決めていきましょう。

⑪

⑫

情報アーキテクチャ入門・ワイヤーフレーム = 情報デザインとビジュアルデザインの架け橋ワイヤーフレームはビジュアルデザイン要素を抜いた状態でインターフェイスの情報要素を示す設計図のようなもの。ワイヤーフレームで設計思想をページの構造に落とし込む作業になるのでここがしっかりしていないとビジュアルデザインが優れていても使いにくい、わかりにくいページになってしまう重要な情報アーキテクチャ要素。

1. サイトストラクチャ

（分類／情報構造）

2. ナビゲーション

（情報のつながり）

3. ラベル（ボタンやアイコンの名称／用語）

ワイヤーフレーム ビジュアルデザイン

サイトコンセプト

⑬

情報アーキテクチャ入門・ワイアーフレーム 事例

ワイアーフレーム は情報要素を定義するものであり、ビジュアルデザイン作成時には

必ずしも全ての位置要素などを遵守する必要はありませんが、配置要素を決めるのであれば

デザイナーが作成してもよいかもしれません。

⑭

IA 用語集 ～ 共通言語で会話するために ～

・グローバルナビゲーションシステムホーム画面や検索といった重要なコンテンツに

どのコンテンツからもアクセスできるよう、

全てのページ上で表示されるナビゲーションシステム。

・ローカルナビゲーションシステムユーザーが閲覧しているのと同じ、もしくは近い

カテゴリのコンテンツへの移動を提供するための

ナビゲーションシステム（階層別メニュー）

・ラベリングカテゴリーやそのカテゴリーへのリンクの呼称を決める

ことです。webサイトのユーザーはラベリングされた

名前や表示から、カテゴリー内やリンク先にどのような

情報が存在するかを類推します。

・コンテキスト文脈、あるいは関連性のこと。どのようなwebサイトにおいても、コンテンツや含まれる情報は、コンテキストを伴っています。情報アーキテクチャは、webサイトごとに存在する個別のコンテキストに適合しなければなりません。

・サイトストラクチャサイトマップなどに代表されるサイト構造、サイトの

骨格を定義するもの。webサイトがどのように機能する

のかを定めた説明書のようなものであり非常に重要。

・ユーザエクスペリエンス利用者自身の体験に基づいて使いやすさを向上させていくこと。表現力／操作性に優れたアプリケーションなど，ユーザー・インタフェース、これらの技術の中心になっているのが，「ユーザー中心デザイン」という考え方で、その中心にある考え方。

⑮

参考文献

WebDesigning( ウェブデザイニング )

2010 年 01 月号

本資料に関しては下記の書籍などから多くの文章やイラスト、図などを引用しております。

またコンセントの長谷川 敦士さんのコラムなどにも多くの知恵をお借りしております。

これを機会に IA を深堀していこうと思われた方は、購読をお勧めいたします。

Webデザイナーのための情報アーキテクチャ入門

成功するサイト構築術

Peter Van Dijck ( 著 ), 佐藤 伸哉 ( 編集 ), 中野 恵美子 ( 翻訳 )

ウェブ戦略としての「ユーザーエクスペリエンス」

―5つの段階で考えるユーザー中心デザイン

Jesse James Garrett ( 著 ), ソシオメディア ( 翻訳 )