SlideShare a Scribd company logo
1 of 30
© 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 Architecture
Chapter 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 Architecture
Chapter 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 Done
Chapter 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 Strategy
Report
Project Plan
for Design
Articulate
表現する
IA Strategy
Presentation
Communicate
コミュニケートする
Test
テストする
リサーチデータを
クリエイティブな
アイデアへ変換
ダイアグラム、
メタファー、青写真
ワイヤーフレーム
プレゼン、反応、
ブレインストーム
クローズド
カードソート、
プロトタイプ
詳細な戦略、
方向性、見通し
高度な戦略、
方向性、見通し
チーム、成果物、
スケジュール、予算
戦略開発プロセス
戦略フェーズ成果物
調査 戦略 設計 実装 保守
プロジェクト
プログラム
プロセスとメソッド
25
© Sociomedia, Inc.
調査 戦略 設計
■コンテキスト
・背景調査
・導入プレゼン
・調査ミーティング
・株主インタビュー
・技術評価
■コンテンツ
・ヒューリスティック評価
・コンテンツ分析
・コンテンツマッピング
・ベンチマーキング
■ユーザー
・利用統計
・検索ログ分析
・顧客サポートデータ
■参加者定義とリクルーティング
・サーベイ
・コンテキスト調査
・フォーカスグループ
■ユーザー調査セッション
・インタビュー
・カードソーティング
・ユーザーテスト
■制作物と成果物
・メタファー検討
・シナリオ
・ケーススタディ
とストーリー
・概念的ダイアグラム
・青写真
とワイヤーフレーム
・青写真
・ワイヤーフレーム
・コンテンツマッピング
とインベントリ
・コンテンツモデリング
・制限語彙
・デザイン・スケッチ
・Webベース・プロトタイプ
・アーキテクチャスタイルガイド
・POPアーキテクチャ
プロセスとメソッド
26
■ユーザー
・利用統計
・検索ログ分析
・顧客サポートデータ
■参加者定義とリクルーティング
・サーベイ
・コンテキスト調査
・フォーカスグループ
■ユーザー調査セッション
・インタビュー
・カードソーティング
・ユーザーテスト
■ユーザー調査セッション
・インタビュー
・カードソーティング
・ユーザーテスト
© Sociomedia, Inc.
今後身につけていくべき
ノウハウ
© Sociomedia, Inc.
今後身につけていくべきノウハウ
● 組織の中の情報を引き出すアプローチ:
→
● 情報をデータとしてシステム化していくアプローチ:
→
●「ユーザー理解」の前提となる「ユーザー調査」の各種手法:
→
28
トップダウン/ボトムアップ
シソーラス、制限語彙、メタデータ
三澤さん(この後)よろしくお願いします!
© Sociomedia, Inc.
シロクマ本 再考!
シロクマ本 最高!
シロクマ本に学ぶエクスペリエンスのための手技法 by 篠原 稔和 - presentation from IA CAMP 2015

More Related Content

What's hot

「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
Yoshiki Hayama
 

What's hot (20)

UXデザイン・UXリサーチってだいぶ広まったよね?
UXデザイン・UXリサーチってだいぶ広まったよね?UXデザイン・UXリサーチってだいぶ広まったよね?
UXデザイン・UXリサーチってだいぶ広まったよね?
 
「顧客の声を聞かない」とはどういうことか
「顧客の声を聞かない」とはどういうことか「顧客の声を聞かない」とはどういうことか
「顧客の声を聞かない」とはどういうことか
 
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
 
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリアHCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
 
サービスブループリント導入ガイド A Guide to Service Blueprinting Japanese Edition
サービスブループリント導入ガイド A Guide to Service Blueprinting Japanese Editionサービスブループリント導入ガイド A Guide to Service Blueprinting Japanese Edition
サービスブループリント導入ガイド A Guide to Service Blueprinting Japanese Edition
 
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語るData × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
 
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
 
UXデザインとコンセプト評価 ~俺様企画はだめなのよ
UXデザインとコンセプト評価~俺様企画はだめなのよUXデザインとコンセプト評価~俺様企画はだめなのよ
UXデザインとコンセプト評価 ~俺様企画はだめなのよ
 
ユーザーインタビューするときは、どうやらゾンビのおでましさ
ユーザーインタビューするときは、どうやらゾンビのおでましさユーザーインタビューするときは、どうやらゾンビのおでましさ
ユーザーインタビューするときは、どうやらゾンビのおでましさ
 
誰も教えてくれないペルソナのひみつ 〜ペルソナの上手な使いかた〜
誰も教えてくれないペルソナのひみつ 〜ペルソナの上手な使いかた〜誰も教えてくれないペルソナのひみつ 〜ペルソナの上手な使いかた〜
誰も教えてくれないペルソナのひみつ 〜ペルソナの上手な使いかた〜
 
心理的安全性を 0から80ぐらいに上げた話
心理的安全性を 0から80ぐらいに上げた話心理的安全性を 0から80ぐらいに上げた話
心理的安全性を 0から80ぐらいに上げた話
 
UXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイントUXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイント
 
45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込む45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込む
 
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
 
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUXUXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
 
Gcm#3 uiデザインの品質を効率的に向上させるには?
Gcm#3 uiデザインの品質を効率的に向上させるには?Gcm#3 uiデザインの品質を効率的に向上させるには?
Gcm#3 uiデザインの品質を効率的に向上させるには?
 
「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
「ユーザーを理解するって言うほどカンタンじゃないよね」 UXデザイン・UXリサーチをもう一度ちゃんと理解しよう!
 
プロダクトの強い軸を作るプロダクトマネジメントフレームワーク
プロダクトの強い軸を作るプロダクトマネジメントフレームワークプロダクトの強い軸を作るプロダクトマネジメントフレームワーク
プロダクトの強い軸を作るプロダクトマネジメントフレームワーク
 
ユーザーストーリー駆動開発で行こう。
ユーザーストーリー駆動開発で行こう。ユーザーストーリー駆動開発で行こう。
ユーザーストーリー駆動開発で行こう。
 
UIデザインの基本
UIデザインの基本UIデザインの基本
UIデザインの基本
 

Viewers also liked

WebフォントとSVGフォント
WebフォントとSVGフォントWebフォントとSVGフォント
WebフォントとSVGフォント
Jun Fujisawa
 
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
Kenji Koshikawa
 
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
Ryujiro Yamamoto
 
Chromeでjavascriptデバッグ!まず半歩♪
Chromeでjavascriptデバッグ!まず半歩♪Chromeでjavascriptデバッグ!まず半歩♪
Chromeでjavascriptデバッグ!まず半歩♪
Yuji Nojima
 
-入門- enchant.js でゲームを作ろう
-入門- enchant.js でゲームを作ろう-入門- enchant.js でゲームを作ろう
-入門- enchant.js でゲームを作ろう
nico0927
 
ウェブデザインの本質と、構成要素
ウェブデザインの本質と、構成要素ウェブデザインの本質と、構成要素
ウェブデザインの本質と、構成要素
vanillate cocoa
 

Viewers also liked (20)

ディレクターからみたMovable Type + PowerCMSの優位性
ディレクターからみたMovable Type + PowerCMSの優位性ディレクターからみたMovable Type + PowerCMSの優位性
ディレクターからみたMovable Type + PowerCMSの優位性
 
HTML5時代の技術の恩恵を受けるには
HTML5時代の技術の恩恵を受けるにはHTML5時代の技術の恩恵を受けるには
HTML5時代の技術の恩恵を受けるには
 
WebフォントとSVGフォント
WebフォントとSVGフォントWebフォントとSVGフォント
WebフォントとSVGフォント
 
CSSにもオブジェクト指向を - OOCSSことはじめ
CSSにもオブジェクト指向を - OOCSSことはじめCSSにもオブジェクト指向を - OOCSSことはじめ
CSSにもオブジェクト指向を - OOCSSことはじめ
 
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
集合知プログラミング 第6章 ドキュメントとフィルタリング~draft
 
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
テスト環境から本番環境へ、URLが異なる環境にWordPressを移行する方法
 
Webアクセシビリティの標準規格「JIS X 8341-3:2010」準拠のための試験方法(最新版)
Webアクセシビリティの標準規格「JIS X 8341-3:2010」準拠のための試験方法(最新版)Webアクセシビリティの標準規格「JIS X 8341-3:2010」準拠のための試験方法(最新版)
Webアクセシビリティの標準規格「JIS X 8341-3:2010」準拠のための試験方法(最新版)
 
Chromeでjavascriptデバッグ!まず半歩♪
Chromeでjavascriptデバッグ!まず半歩♪Chromeでjavascriptデバッグ!まず半歩♪
Chromeでjavascriptデバッグ!まず半歩♪
 
レコメンデーション(協調フィルタリング)の基礎
レコメンデーション(協調フィルタリング)の基礎レコメンデーション(協調フィルタリング)の基礎
レコメンデーション(協調フィルタリング)の基礎
 
Photoshopで効率よくデザインしよう!
Photoshopで効率よくデザインしよう!Photoshopで効率よくデザインしよう!
Photoshopで効率よくデザインしよう!
 
-入門- enchant.js でゲームを作ろう
-入門- enchant.js でゲームを作ろう-入門- enchant.js でゲームを作ろう
-入門- enchant.js でゲームを作ろう
 
.htaccessによるリダイレクト徹底解説
.htaccessによるリダイレクト徹底解説.htaccessによるリダイレクト徹底解説
.htaccessによるリダイレクト徹底解説
 
悩まないコーディングをしよう! OOCSS,SMACSSを用いた、読みやすくてメンテナブルなCSS設計(Sass対応)
悩まないコーディングをしよう! OOCSS,SMACSSを用いた、読みやすくてメンテナブルなCSS設計(Sass対応)悩まないコーディングをしよう! OOCSS,SMACSSを用いた、読みやすくてメンテナブルなCSS設計(Sass対応)
悩まないコーディングをしよう! OOCSS,SMACSSを用いた、読みやすくてメンテナブルなCSS設計(Sass対応)
 
ウェブデザインの本質と、構成要素
ウェブデザインの本質と、構成要素ウェブデザインの本質と、構成要素
ウェブデザインの本質と、構成要素
 
今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャ今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャ
 
コーディングが上達するコツ
コーディングが上達するコツコーディングが上達するコツ
コーディングが上達するコツ
 
Webアプリケーション負荷試験実践入門
Webアプリケーション負荷試験実践入門Webアプリケーション負荷試験実践入門
Webアプリケーション負荷試験実践入門
 
WordPressプラグイン作成入門
WordPressプラグイン作成入門WordPressプラグイン作成入門
WordPressプラグイン作成入門
 
ノンプログラマーのためのjQuery入門
ノンプログラマーのためのjQuery入門ノンプログラマーのためのjQuery入門
ノンプログラマーのためのjQuery入門
 
Webライティング11のルール
Webライティング11のルールWebライティング11のルール
Webライティング11のルール
 

Similar to シロクマ本に学ぶエクスペリエンスのための手技法 by 篠原 稔和 - presentation from IA CAMP 2015

IA Workshop, Introduction to Information Architecture (2002)
IA Workshop, Introduction to Information Architecture (2002)IA Workshop, Introduction to Information Architecture (2002)
IA Workshop, Introduction to Information Architecture (2002)
Nobuya Sato
 
Iajuku kagoshima 130316
Iajuku kagoshima 130316Iajuku kagoshima 130316
Iajuku kagoshima 130316
MoNA Miyauchi
 
Sinap Talk Project Design "IA" 20080902
Sinap Talk Project Design "IA" 20080902Sinap Talk Project Design "IA" 20080902
Sinap Talk Project Design "IA" 20080902
Takashi Sakamoto
 
Android開発者とデザイナーの効率的な連携について
Android開発者とデザイナーの効率的な連携についてAndroid開発者とデザイナーの効率的な連携について
Android開発者とデザイナーの効率的な連携について
lychee .
 

Similar to シロクマ本に学ぶエクスペリエンスのための手技法 by 篠原 稔和 - presentation from IA CAMP 2015 (20)

IA Workshop, Introduction to Information Architecture (2002)
IA Workshop, Introduction to Information Architecture (2002)IA Workshop, Introduction to Information Architecture (2002)
IA Workshop, Introduction to Information Architecture (2002)
 
Find Your Ability: IA for a novice Web Creator
Find Your Ability: IA for a novice Web CreatorFind Your Ability: IA for a novice Web Creator
Find Your Ability: IA for a novice Web Creator
 
IAについて考えてみました。
IAについて考えてみました。IAについて考えてみました。
IAについて考えてみました。
 
Iajuku kagoshima 130316
Iajuku kagoshima 130316Iajuku kagoshima 130316
Iajuku kagoshima 130316
 
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザインアクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン
 
Androidアプリ開発にクリーンアーキテクチャを取り入れよう (OSS編)
Androidアプリ開発にクリーンアーキテクチャを取り入れよう(OSS編)Androidアプリ開発にクリーンアーキテクチャを取り入れよう(OSS編)
Androidアプリ開発にクリーンアーキテクチャを取り入れよう (OSS編)
 
Developers Summit 2013【15-B-6】開発者の "資産形成" につながる Action とは?
Developers Summit 2013【15-B-6】開発者の "資産形成" につながる Action とは?Developers Summit 2013【15-B-6】開発者の "資産形成" につながる Action とは?
Developers Summit 2013【15-B-6】開発者の "資産形成" につながる Action とは?
 
Design for Understanding:理解のデザインとしての情報アーキテクチャ
Design for Understanding:理解のデザインとしての情報アーキテクチャDesign for Understanding:理解のデザインとしての情報アーキテクチャ
Design for Understanding:理解のデザインとしての情報アーキテクチャ
 
Professor Hiroshi ESAKI talks about Internet of Design
Professor Hiroshi ESAKI talks about Internet of DesignProfessor Hiroshi ESAKI talks about Internet of Design
Professor Hiroshi ESAKI talks about Internet of Design
 
Sinap Talk Project Design "IA" 20080902
Sinap Talk Project Design "IA" 20080902Sinap Talk Project Design "IA" 20080902
Sinap Talk Project Design "IA" 20080902
 
いまさら聞けない!ホームページの立ち上げから運用体制構築
いまさら聞けない!ホームページの立ち上げから運用体制構築いまさら聞けない!ホームページの立ち上げから運用体制構築
いまさら聞けない!ホームページの立ち上げから運用体制構築
 
What is tmcn for isit
What is tmcn for isitWhat is tmcn for isit
What is tmcn for isit
 
World IA Day 2013 Japan Opening
World IA Day 2013 Japan OpeningWorld IA Day 2013 Japan Opening
World IA Day 2013 Japan Opening
 
20130629 KA法ワークショップ@DevLOVE仙台
20130629 KA法ワークショップ@DevLOVE仙台20130629 KA法ワークショップ@DevLOVE仙台
20130629 KA法ワークショップ@DevLOVE仙台
 
【16-D-1】UI のこれまでの10年とこれから
【16-D-1】UI のこれまでの10年とこれから【16-D-1】UI のこれまでの10年とこれから
【16-D-1】UI のこれまでの10年とこれから
 
ビジネスとデザイン ~ビジネスは悪くない~
ビジネスとデザイン ~ビジネスは悪くない~ビジネスとデザイン ~ビジネスは悪くない~
ビジネスとデザイン ~ビジネスは悪くない~
 
UX approach for real cross media planning
UX approach for real cross media planningUX approach for real cross media planning
UX approach for real cross media planning
 
Financial Planner の為のITの活用
Financial Planner の為のITの活用Financial Planner の為のITの活用
Financial Planner の為のITの活用
 
UXデザインを活用した仮説立案から考えるデータ分析とは?
UXデザインを活用した仮説立案から考えるデータ分析とは?UXデザインを活用した仮説立案から考えるデータ分析とは?
UXデザインを活用した仮説立案から考えるデータ分析とは?
 
Android開発者とデザイナーの効率的な連携について
Android開発者とデザイナーの効率的な連携についてAndroid開発者とデザイナーの効率的な連携について
Android開発者とデザイナーの効率的な連携について
 

More from Sociomedia

More from Sociomedia (6)

UXとビジネスまとめ by 篠原 稔和 - presentation from UX まとめ 2015
UXとビジネスまとめ by 篠原 稔和 - presentation from UX まとめ 2015 UXとビジネスまとめ by 篠原 稔和 - presentation from UX まとめ 2015
UXとビジネスまとめ by 篠原 稔和 - presentation from UX まとめ 2015
 
UXとデザインまとめ by 上野学 - presentation from UX まとめ 2015
UXとデザインまとめ by 上野学 - presentation from UX まとめ 2015 UXとデザインまとめ by 上野学 - presentation from UX まとめ 2015
UXとデザインまとめ by 上野学 - presentation from UX まとめ 2015
 
「顧客から引き出す技術」–インタビューとグラフィックファシリテーションの共通点 by 三澤 直加 - presentation from IA CAMP ...
「顧客から引き出す技術」–インタビューとグラフィックファシリテーションの共通点 by 三澤 直加 - presentation from IA CAMP ...「顧客から引き出す技術」–インタビューとグラフィックファシリテーションの共通点 by 三澤 直加 - presentation from IA CAMP ...
「顧客から引き出す技術」–インタビューとグラフィックファシリテーションの共通点 by 三澤 直加 - presentation from IA CAMP ...
 
You Are Screwing Up The World by Dan Klyn - presentation from IA CAMP 2015
You Are Screwing Up The World by Dan Klyn - presentation from IA CAMP 2015You Are Screwing Up The World by Dan Klyn - presentation from IA CAMP 2015
You Are Screwing Up The World by Dan Klyn - presentation from IA CAMP 2015
 
デザインの裏のデザインの裏のデザイン - presentation from IA CAMP 2015
デザインの裏のデザインの裏のデザイン - presentation from IA CAMP 2015デザインの裏のデザインの裏のデザイン - presentation from IA CAMP 2015
デザインの裏のデザインの裏のデザイン - presentation from IA CAMP 2015
 
The Architecture of Understanding by Peter Morville - presentation from IA CA...
The Architecture of Understanding by Peter Morville - presentation from IA CA...The Architecture of Understanding by Peter Morville - presentation from IA CA...
The Architecture of Understanding by Peter Morville - presentation from IA CA...
 

シロクマ本に学ぶエクスペリエンスのための手技法 by 篠原 稔和 - presentation from IA CAMP 2015

  • 1. © Sociomedia, Inc. 2015.7.17 ソシオメディア株式会社 篠原 稔和 シロクマ本に学ぶ エクスペリエンスのための手技法 IA CAMP 2015
  • 2. © Sociomedia, Inc. UX Design Consulting ソシオメディア株式会社 UX戦略コンサルティング デザイン・リサーチ ユーザーインターフェース・デザインコンセプト・デザイン 2
  • 5. © 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
  • 7. © Sociomedia, Inc. 「バイブル」とは? https://ja.wikipedia.org/wiki/バイブル ● 英語で「聖書」のこと ● 転じて、ある特定の分野において権威ある書物のこと ● 常に傍らに置く事から転じて、座右の書や愛読書のこと (皮肉として、ある特定の分野において優れすぎて誰も実行でき ない最良の実践を記述した書物のこと) 7
  • 8. © Sociomedia, Inc. 「バイブル」とは? ● バイブルとしての意義を探求すべき: → → ● UXをシステムとして創造する人は「IA」を学ぶべき: → → 8 日々参照して習慣化・血肉化されていくもの 繰り返し分析・解釈されるもの Webにとどまらず、モバイル・クロスポイント・IoTなどの すべてを包含している IAという領域は、UXを求めるすべての人が必要となる知識と スキルの源泉になっている
  • 11. © 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
  • 12. © Sociomedia, Inc. 1st(1998)からの2nd(2003)への改訂ポイント ● UXの重要性の強調: 「ユーザーニーズとユーザー行動」へのフォーカス ● 基本原則が4つから5つへ: 組織化、ラベリング、ナビゲーション、検索 ↓ 組織化、ラベリング、ナビゲーション、検索、 & シソーラス・制限語彙・メタデータ ● トップダウンアプローチに加え、ボトムアップアプローチ も追加 ● IAのためのツールとソフトウェアを数多く追加 ● 実践上の課題と事例の追加 12
  • 15. © Sociomedia, Inc. 3rd(2006)の改訂ポイント ● Peterからのアドバイス ・IAフレームワークの中に、ソーシャルメディアとユーザー参加を入れたこと ・すべての章の再検討を行ったこと ● 主な改訂ポイント ・組織化とナビゲーション: タグ付け、フォークソノミー、ソーシャル分類、ガイド付きナビゲーション ・設計とドキュメンテーション: 設計段階におけるダイアグラムの役割、青写真やワイヤーフレームの背景 ・教育、ツール、ソフトウェア:調査のフィードバックを反映 ・エンタープライズIAの章の全面的リライト ・参考情報の追記 15
  • 17. © 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 ・表紙がカラーになった(黄色いクマ?)・うすくなった!!
  • 18. © Sociomedia, Inc. 2nd Edition THE ELEMENTS OF USER EXPERIENCE: USER-CENTERD DESIGN FOR THE WEB AND BEYOND
  • 19. © Sociomedia, Inc. 第4版のアウトライン Part Ⅰ. Introducing Information Architecture Chapter 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 Architecture Chapter 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 Done Chapter 11:Research(旧10章) Chapter 12:Strategy(旧11章) Chapter 13:Design and Documentation(旧12章) 19
  • 20. © Sociomedia, Inc. 変わらない点 ● 情報アーキテクチャの基本原則 「組織化、ラベリング、ナビゲーション、検索、メタデータ」 ● 「調査→戦略→設計と文書化」のプロセス プロセスでUXの手技法が必要なこと(プロセスとメソッド) 20
  • 22. © Sociomedia, Inc. 調査 戦略 設計 実装 保守 プロジェクト プログラム プロセスとメソッド 22
  • 23. © Sociomedia, Inc. コンテキスト コンテンツ ユーザー ビジネス目標 資産、政治、文化、 技術、人材 ドキュメント/ データタイプ、 コンテンツオブジェクト、 メタデータ、ボリューム、 既存の構造 顧客、タスク、ニーズ、 情報探索行動、 エクスペリエンス、 語彙 プロセスとメソッド 調査 戦略 設計 実装 保守 プロジェクト プログラム 23
  • 25. © Sociomedia, Inc. 情報アーキテクチャ戦略の開発 TACT Think 考える IA Strategy Report Project Plan for Design Articulate 表現する IA Strategy Presentation Communicate コミュニケートする Test テストする リサーチデータを クリエイティブな アイデアへ変換 ダイアグラム、 メタファー、青写真 ワイヤーフレーム プレゼン、反応、 ブレインストーム クローズド カードソート、 プロトタイプ 詳細な戦略、 方向性、見通し 高度な戦略、 方向性、見通し チーム、成果物、 スケジュール、予算 戦略開発プロセス 戦略フェーズ成果物 調査 戦略 設計 実装 保守 プロジェクト プログラム プロセスとメソッド 25
  • 26. © Sociomedia, Inc. 調査 戦略 設計 ■コンテキスト ・背景調査 ・導入プレゼン ・調査ミーティング ・株主インタビュー ・技術評価 ■コンテンツ ・ヒューリスティック評価 ・コンテンツ分析 ・コンテンツマッピング ・ベンチマーキング ■ユーザー ・利用統計 ・検索ログ分析 ・顧客サポートデータ ■参加者定義とリクルーティング ・サーベイ ・コンテキスト調査 ・フォーカスグループ ■ユーザー調査セッション ・インタビュー ・カードソーティング ・ユーザーテスト ■制作物と成果物 ・メタファー検討 ・シナリオ ・ケーススタディ とストーリー ・概念的ダイアグラム ・青写真 とワイヤーフレーム ・青写真 ・ワイヤーフレーム ・コンテンツマッピング とインベントリ ・コンテンツモデリング ・制限語彙 ・デザイン・スケッチ ・Webベース・プロトタイプ ・アーキテクチャスタイルガイド ・POPアーキテクチャ プロセスとメソッド 26 ■ユーザー ・利用統計 ・検索ログ分析 ・顧客サポートデータ ■参加者定義とリクルーティング ・サーベイ ・コンテキスト調査 ・フォーカスグループ ■ユーザー調査セッション ・インタビュー ・カードソーティング ・ユーザーテスト ■ユーザー調査セッション ・インタビュー ・カードソーティング ・ユーザーテスト
  • 28. © Sociomedia, Inc. 今後身につけていくべきノウハウ ● 組織の中の情報を引き出すアプローチ: → ● 情報をデータとしてシステム化していくアプローチ: → ●「ユーザー理解」の前提となる「ユーザー調査」の各種手法: → 28 トップダウン/ボトムアップ シソーラス、制限語彙、メタデータ 三澤さん(この後)よろしくお願いします!
  • 29. © Sociomedia, Inc. シロクマ本 再考! シロクマ本 最高!