© Sociomedia, Inc.

2015.7.17

ソシオメディア株式会社

篠原 稔和

シロクマ本に学ぶエクスペリエンスのための手技法

IA CAMP 2015

© Sociomedia, Inc.

UX Design Consulting

ソシオメディア株式会社

UX 戦略コンサルティング デザイン・リサーチ

ユーザーインターフェース・デザインコンセプト・デザイン

2

© Sociomedia, Inc.

シロクマ本 再考！

© Sociomedia, Inc. 4

© Sociomedia, Inc.

「シロクマ本」は IA のための「バイブル」

Once again, Rosenfeld and Morville have written the Bible of information architecture. (Amazon)

Often referred to as 'the Polar Bear book' (because of the polar bear on the cover), or the IA bible. (goodreads)

The “polar bear book” is considered by many to be the information architecture bible. (UX BOOTH)

5

© Sociomedia, Inc. 6

© Sociomedia, Inc.

「バイブル」とは？

https://ja.wikipedia.org/wiki/バイブル

● 英語で「聖書」のこと

● 転じて、ある特定の分野において権威ある書物のこと

● 常に傍らに置く事から転じて、座右の書や愛読書のこと

（皮肉として、ある特定の分野において優れすぎて誰も実行できない最良の実践を記述した書物のこと）

7

© Sociomedia, Inc.

「バイブル」とは？

● バイブルとしての意義を探求すべき：

→ →

● UX をシステムとして創造する人は「 IA 」を学ぶべき：

→

→

8

日々参照して習慣化・血肉化されていくもの

繰り返し分析・解釈されるもの

　 Web にとどまらず、モバイル・クロスポイント・ IoT などのすべてを包含している

　 IA という領域は、 UX を求めるすべての人が必要となる知識とスキルの源泉になっている

© Sociomedia, Inc.

現行バージョンから

© Sociomedia, Inc.

© Sociomedia, Inc.

第 2 版のアウトライン

Ⅰ 部　情報アーキテクチャ入門1 章：情報アーキテクチャの定義2 章：情報アーキテクチャの実践3 章：ユーザーニーズとユーザー行動

Ⅱ 部　情報アーキテクチャの基本原則4 章：情報アーキテクチャの解剖学5 章：組織化システム6 章：ラベリングシステム7 章：ナビゲーションシステム8 章：検索システム9 章：シソーラス、制限語彙、メタデータ

Ⅲ 部　プロセスとメソッド10 章：調査11 章：戦略12 章：設計と文書化

Ⅳ 部　情報アーキテクチャの実践13 章：教育14 章：倫理15 章：情報アーキテクチャのチーム編成16 章：ツールとソフトウェア

Ⅴ 部　情報アーキテクチャの組織展開17 章：情報アーキテクチャの立証18 章：ビジネス戦略19 章：企業の情報アーキテクチャ

Ⅵ 部　事例研究20 章： MSWeb ：企業内イントラネット21 章： evolt.org ：オンラインコミュニティ付録：情報源

11

© Sociomedia, Inc.

1st （ 1998 ）からの 2nd （ 2003 ）への改訂ポイント

● 　 UX の重要性の強調：

「ユーザーニーズとユーザー行動」へのフォーカス

● 　基本原則が 4 つから 5 つへ：

組織化、ラベリング、ナビゲーション、検索　　↓組織化、ラベリング、ナビゲーション、検索、＆ シソーラス・制限語彙・メタデータ

● 　トップダウンアプローチに加え、ボトムアップアプローチ 　　 も追加

● 　 IA のためのツールとソフトウェアを数多く追加

● 　実践上の課題と事例の追加12

© Sociomedia, Inc.

改訂版・再改訂版

© Sociomedia, Inc.

© Sociomedia, Inc.

3rd （ 2006 ）の改訂ポイント

● Peter からのアドバイス

・ IA フレームワークの中に、ソーシャルメディアとユーザー参加を入れたこと

・すべての章の再検討を行ったこと

● 主な改訂ポイント

・組織化とナビゲーション：　タグ付け、フォークソノミー、ソーシャル分類、ガイド付きナビゲーション

・設計とドキュメンテーション：　設計段階におけるダイアグラムの役割、青写真やワイヤーフレームの背景

・教育、ツール、ソフトウェア：調査のフィードバックを反映

・エンタープライズ IA の章の全面的リライト

・参考情報の追記

15

© Sociomedia, Inc.

© Sociomedia, Inc.

4th （ 2015.9 ）の改訂ポイント● Peter からのアドバイス：「 3rd から 4th はかなり重要」

・ 3 人目の著者が入った：Jorge Arango

　　 Pervasive IA （至るところに拡がる（消費者行動全体・クロスチャネル） IA ）

・タイトルが変わった :Information Architecture for the World Wide Web↓Information Architecture: For the Web and Beyond

● 「 Beyond 」の意味

・ウェブサイトを超えた　例： mobile, cross-channel, Internet of Things

・ IA を超えた　例： Everyone in user experience needs this knowledge and skill　見つけるためのデザイン、理解のためのデザイン "places made of information."　

17

・表紙がカラーになった（黄色いクマ？）・うすくなった！！

© Sociomedia, Inc.

2nd Edition THE ELEMENTS OF USER EXPERIENCE:

USER-CENTERD DESIGN FOR THE WEB AND BEYOND

© Sociomedia, Inc.

第 4 版のアウトラインPart Ⅰ. Introducing Information ArchitectureChapter 1 ： The Problems that Information Architecture Solves （新）Chapter 2 ： Defining Information Architecture （旧 1 章）Chapter 3 ： Design for Finding （新）Chapter 4 ： Design for Understanding （新）

Part Ⅱ. Basic Principles of Information ArchitectureChapter 5 ： The Anatomy of an IA （旧 4 章）Chapter 6 ： Organization Systems （旧 5 章）Chapter 7 ： Labeling Systems （旧 6 章）Chapter 8 ： Navigation Systems （旧 7 章）Chapter 9 ： Search Systems （旧 8 章）Chapter 10 ： Thesauri, Controlled Vocabularies, and Metadata （旧 9 章）

Part Ⅲ. Getting Information Architecture DoneChapter 11 ： Research （旧 10 章）Chapter 12 ： Strategy （旧 11 章）Chapter 13 ： Design and Documentation （旧 12 章）

19

© Sociomedia, Inc.

変わらない点

● 情報アーキテクチャの基本原則

「組織化、ラベリング、ナビゲーション、検索、メタデータ」

● 「調査→戦略→設計と文書化」のプロセス

　プロセスで UX の手技法が必要なこと（プロセスとメソッド）

20

© Sociomedia, Inc.

プロセスとメソッド

© Sociomedia, Inc.

調査 戦略 設計 実装 保守

プロジェクト

プログラム

プロセスとメソッド

22

© Sociomedia, Inc.

コンテキスト

コンテンツ ユーザー

ビジネス目標資産、政治、文化、技術、人材

ドキュメント /データタイプ、

コンテンツオブジェクト、メタデータ、ボリューム、

既存の構造

顧客、タスク、ニーズ、情報探索行動、

エクスペリエンス、語彙

プロセスとメソッド調査 戦略 設計 実装 保守

プロジェクト

プログラム

23

© Sociomedia, Inc.

調査のためのツールとメソッド

コンテキスト

コンテンツ

ユーザー

背景調査プレゼン

テーションミーティング

株主インタビュー

テクノロジーアセスメント(技術評価 )

ヒューリスティック評価

メタデータ分析コンテンツ分析

コンテンツマッピング

検索ログ分析クリック

ストリーム分析

ユースケースペルソナ

コンテクスチュアル

探索

ベンチマーキング

ユーザーインタビュー

ユーザーテスト

調査 戦略 設計 実装 保守

プロジェクト

プログラム

プロセスとメソッド

24

© Sociomedia, Inc.

情報アーキテクチャ戦略の開発TACT

Think

考える

IA StrategyReport

Project Plan for Design

Articulate

表現するIA Strategy

Presentation

Communicate

コミュニケートする

Test

テストする

リサーチデータをクリエイティブなアイデアへ変換

ダイアグラム、メタファー、青写真ワイヤーフレーム

プレゼン、反応、ブレインストーム

クローズドカードソート、プロトタイプ

詳細な戦略、方向性、見通し

高度な戦略、方向性、見通し

チーム、成果物、スケジュール、予算

戦略開発プロセス

戦略フェーズ成果物

調査 戦略 設計 実装 保守

プロジェクト

プログラム

プロセスとメソッド

25

© Sociomedia, Inc.

調査 戦略 設計

■コンテキスト　・背景調査　・導入プレゼン　・調査ミーティング　・株主インタビュー　・技術評価■コンテンツ　・ヒューリスティック評価　・コンテンツ分析　・コンテンツマッピング　・ベンチマーキング■ユーザー　・利用統計　・検索ログ分析　・顧客サポートデータ■参加者定義とリクルーティング　・サーベイ　・コンテキスト調査　・フォーカスグループ■ユーザー調査セッション　・インタビュー　・カードソーティング　・ユーザーテスト

■制作物と成果物　・メタファー検討　・シナリオ　・ケーススタディ　　とストーリー　・概念的ダイアグラム　・青写真　　とワイヤーフレーム

・青写真

・ワイヤーフレーム

・コンテンツマッピング　とインベントリ

・コンテンツモデリング

・制限語彙

・デザイン・スケッチ

・ Web ベース・プロトタイプ

・アーキテクチャスタイルガイド

・ POP アーキテクチャ

プロセスとメソッド

26

■ユーザー　・利用統計　・検索ログ分析　・顧客サポートデータ■参加者定義とリクルーティング　・サーベイ　・コンテキスト調査　・フォーカスグループ■ユーザー調査セッション　・インタビュー　・カードソーティング　・ユーザーテスト

■ユーザー調査セッション　・インタビュー　・カードソーティング　・ユーザーテスト

© Sociomedia, Inc.

今後身につけていくべきノウハウ

© Sociomedia, Inc.

今後身につけていくべきノウハウ

● 組織の中の情報を引き出すアプローチ：

　→　

● 情報をデータとしてシステム化していくアプローチ：

　→　

● 「ユーザー理解」の前提となる「ユーザー調査」の各種手

法：

　→　

28

トップダウン／ボトムアップ

シソーラス、制限語彙、メタデータ

三澤さん（この後）よろしくお願いします！

© Sociomedia, Inc.

シロクマ本 再考！

シロクマ本 最高！