Iajuku kagoshima 130316

2013 © Concent, Inc.

IA塾 in 鹿児島

2013/03/16

株式会社コンセント


IA Juku in Kagoshima PAGE: 1

本日のメニュー

第1部講義

IAとは？

Web 情報アーキテクチャ設計で大切なポイント

プロジェクトの流れとIAの役割



IAとは？



IAとは？

「IA」とは2つのことを指しています。

情報アーキテクチャ – Information Architecture

構造化された情報そのもののことを指します

知識やデータの組織化を意味し、

「情報をわかりやすく伝え」「受け手が情報を探しやすくする」ための表現技術

分かりやすさのためのデザイン

インフォメーションアーキテクト – Information Architect

情報アーキテクチャを設計する人のことを指します

データに潜む隠れたパターンを整理し、複雑さを明快にする人

ユーザーが自分の知識を獲得するための道具を見つけられるような、構造や地図を作る人

IA！

From: Wikiぺディア

From: Information Architects, Richard Saul Wurman



情報アーキテクチャとは？



IAとは？

情報アーキテクチャとは？ - Information Architecture

知識やデータの組織化を意味し、「情報をわかりやすく伝え」「受け手が情報を探しやすくする」ための表現技術

データ情報知識知恵

「情報を収集し」「整理し」「優先順位をつける」

統合組織化・文脈化

Webサイトでは… • 情報構造、ナビゲーション、ラベルなどの要素を指します • サイト内での情報の分類や、情報のつながりを定義することです

From: Nathan Shedroff



IAとは？

情報アーキテクチャを「Webサイト」で活用するメリット

多様なユーザーに対して変化に富んだ情報を提供する「Webサイト」では、以下3つのメリットがあります。

利用者が情報を探し、活用し、理解しやすくする

送り手が自分の意図どおりに情報を提示できる

情報の変化に対応する



IAとは？

「Webサイト」の情報アーキテクチャ設計に必要な3つの要素

これら3つの要素を分析・検討することが、情報アーキテクチャ設計をする上での前提条件となります。

ユーザー

User

コンテンツ

Contents

コンテキスト

Context

• どんなユーザー？

• サイトを使う目的は？

• どんな状況で使う？

• ビジネス要件は？

• 制約事項は？

• 現況の課題は？

• どんな情報がある？

• 情報間の関係は？

• 更新・追加はある？



Webエコシステム（Web生態系）

エンタープライズ情報アーキテクチャ

（EIA）

サイトストラクチャグラフィックデザイン

IAとは？

「Webサイト」での情報アーキテクチャの考え方

インターネット上の情報アーキテクチャは、4つの階層に分けて考えることができます。

インターネット全体のIA 1企業内のIA 1サイトのIA 画面でのIA



インフォメーションアーキテクトとは？



IAとは？

インフォメーションアーキテクトとは？ - Information Architect

「情報アーキテクチャ」を設計する人のことを指します。

広義のIA Big IA

戦略設計ビジュアルデザイン

実装

狭義のIA Small IA

• サイトストラクチャ • ナビゲーション • ワイヤーフレーム

• 調査、分析 • ユーザー定義 • サイトコンセプト • 設計方針

IA！

プロジェクトを総合的に見ていくプロデューサー的役割も果たします



Web情報アーキテクチャ設計で大切なポイント



1. ユーザーを知る

2. 情報自体の整理を行う

3. ユーザーの体験をデザインする


大切なポイント3つ

「Webサイト」でIA設計をする際に踏まえるべき3つのポイントがあります。

who？




1. ユーザーを知る

そのサイトを使う「ユーザー」が誰なのか、どんな利用状況やニーズがあるのかを知ることが大切です。

年代は？どんな職業？

どんなものが好き？よく行く場所は？

職場で使う？自宅で使う？平日？休日？

何が知りたい？何を探している？何か困ってる？

？

？

ログ解析、市場マーケティングデータ、ユーザー調査、ペルソナ …etc




2. 情報自体の整理を行う

扱われる情報の分類を整理し、情報同士の関係や連携するべき情報を明示化することが大切です。

B

C D

E

F

H

A G

イベント

チケット購入

場所

口コミ

スケジュール

会場アクセス

情報の分類情報の関係性

コンテンツリスト、LATCH法、コンテンツモデル …etc



Webサイト以外の接点


3. ユーザーの体験をデザインする – User Experience Design

ユーザーが繰り返し使う「体験」の中で、どんな「価値」が提供できるのかを考えることも大切です。

TV

店舗など

雑誌・新聞等

利用する

ユーザシナリオ、ストーリーボード、UXフロー、 …etc




人間中心設計（HCD）の考え方を活用する

「ユーザー」のことを考慮しIA設計を行い、「ユーザー」に満足度を提供するために活用できるプロセスと手法です。

ユーザビリティを考慮したデザインプロセス（国際規格 ISO9241-210より）

利用状況の理解と詳細な記述

ユーザーおよび組織の要求事項の詳細な記述

要求事項に対する設計の評価

設計による解決案の作成

リリース

• ペルソナ/シナリオモデル • ユーザーモデリング

• フィールド調査 • 文脈的調査

• プロトタイピング • デザインパターン

• ユーザーテスト • ヒューリスティック評価

要求が達成されるまで繰り返される

※コンセントではこのHCDのプロセスをプロジェクトに取り入れています







プロジェクト体制の例

例えば大規模案件などの場合では、以下のような体制でプロジェクトチームを組む場合があります。

プロデューサー

デザイナーインフォメーション

アーキテクトコーダーテクニカル

広義のIA Big IA

ディレクターアートディレクター

プロジェクトマネージャー

プロデューサー兼ディレクターの場合も

ディレクター兼プロジェクトマネージャーの場合も

※体制はケースバイケースです

狭義のIA Small IA



サービス

デザイン

アクティビティ

デザイン

インタラクション

デザイン


プロジェクトの流れについて

大きく3つのフェーズに分かれていて、各フェーズごとに必要な検討を行いアウトプットを作ります。

• サービス自体の価値定義

• ユーザー価値、ビジネス価値

双方から検討

• エスノグラフィ調査に基づき

方針策定

• サービス実現のためのシナリオ定義

• 利用文脈調査に基づき、

メンタルモデルやシナリオを検討

• IAに反映

• 具体的に操作する画面や、

インターフェイスをプロトタイプに

基づき検討

• 利用シナリオに基づき、

複数のプロトタイプを用意し比較検討

納品物

• エスノグラフィ調査レポート

• 価値マップ（ジャーニーマップ）

• サービス戦略定義書

納品物

• 利用シナリオ

（UXフロー、ストーリーボード）

• 情報アーキテクチャ設計

納品物

• UI比較検討レポート

• プロトタイプ

戦略設計ビジュアルデザイン

コンセントのUXプロジェクト



コンセプト定義前提条件

（調査・分析）情報アーキテクチャ設計


Web IA設計の流れについて

Web IA設計の全体像と流れは以下のようになっています。

ユーザー

User

コンテンツ

Contents

コンテキスト

Context

サイトストラクチャ

ナビゲーション

ラベル

ユーザーエクスペリエンス

方針画面設計

※具体的なアウトプットの例を別紙にて紹介します



もっとIAを知りたい



おすすめの参考書籍

「もっとIAのことを詳しく知りたい！」…という方に、以下の本をおすすめします。

IAの基本をもっと知りたい現場でのIAの使い方を知りたい

IA100 Web情報アーキテクチャ IA THINKING

IAの全体像、概念を知る具体的な設計の落とし方を知る IAの実務での実践方法を知る



参考サイト

ちなみに「IA100」の Youtube 版があります。



参考サイト

「IA」や「HCD」を推進している団体のWebサイトもチェックしてみてください。

IAAJ：Information Architecture Association Japan HCD-Net：人間中心設計推進機構



参考サイト

弊社Webサイトでも、色々な情報を発信しています。

株式会社コンセント



Thank you!

Documents

Iajuku kagoshima 130316