情報デザイン概論/2022/1024

第４回 情報デザインの諸相

情報デザイン概論/2022｜2022.10.24

出席確認・Zoom接続

• 以下名簿が表示されます。出欠確認をお願いします。
  　出欠確認・座席記録

• 以下から、Zoomに接続して下さい。
  Zoomミーティングに参加する
  ミーティングID: 970 0606 6698
  パスコード: 968501
  
  

＞ Recording

CONTENTS

• はじめに
• 情報デザインとは
  • 情報デザインの様々な定義
  • 良い情報デザインとは？ （私見）
  • 情報デザインのフィールド
  • 情報×デザインの「てにをは」
  • 情報デザインの 5W2H
• 情報デザインの可能性
  • 情報デザインにできることは何か？
  • 情報デザイナーの役割
  • 付記：「情報が無い」ことの明記も重要な情報
• 情報共有のための意識改革
  • クラウドファースト
  • 「実体渡し」から「アドレス渡し」へ
  • Push型からPull型へ
  • 対面・同期から遠隔・非同期へ
  • アナログからデジタルへ
  • ローカルデバイス（パソコン）からブラウザへ
  • 利用者（消費者）から開発者（生産者）へ
  • 自らの情報発信基盤を持つ
• 情報の整理に関わるキーワード
  • 5つの帽子掛け
  • 書棚とデータベース
  • カテゴリーとタグ
  • フォルダとインデックス
  • ストックとフロー
  • 伽藍とバザール
  • ツリーとセミラティス
  • Wiki と Blog
• APPENDIX
  • 関連LINK
  • 書籍紹介
• 付記
  • 情報の空間性・時間性
  • 差異 / 言語 / 情報

＞ Recording

はじめに

大学の「感染対策レベル」が変更（10月26日〜）になります。
次週以降の授業の方法について受講生の皆様と再検討（相談）します。

情報デザインとは

情報デザインの様々な定義

• Wikipedia
  • 情報デザイン

    情報デザイン（じょうほうデザイン、英: information design）は、
    人間とモノや環境との関係性にかたちを与える方法論、
    生活の中にあふれる無数の情報をわかりやすく提示する手法、
    あるいは、それらの考え方。 

  • Information Design
  • Information Architecture

• ロバート・ホーン「情報デザイン原論」

  情報デザインとは、情報を、人が効率的かつ効果的に使えるような形で
  準備する技と知識である。

• 渡辺保史「情報デザイン入門」

  情報デザインとは、ものと人、人と人との新しい関係を作ることだ。
  本棚の整理から手帳、地図、時計、そして地域社会の活性化、…　
  あらゆるものが、「情報デザイン」の対象である。　

• 情報デザインフォーラム編　「情報デザインの教室」

  うれしい体験をつくることを「情報デザイン」と呼びます。・・・
  情報デザインは・・様々なプロセス・手法により
  社会のニーズを探り出し、「人・モノ・環境の関係性」を
  人間中心的にデザインする行為なのである。

• ブレンダ・ダービン「情報デザイン原論」

  「情報」は、無秩序でもあり、秩序でもある現実を明快に理解するために
  人間が考案（デザイン）した道具である。　

  「情報」はそれ自体、人間がデザインした（ている）もの・・と考えることができます。
  
  

良い情報デザインとは？ （私見）

情報を遠隔・非同期的に複製されやすい状態にすること

生命の情報（DNA・RNA）からWeb上の情報まで、「情報体の気持ち」になって考えればわかることですが、あらゆる情報体は複製（シェア・拡散）されることを望んでいます。20世紀という時代は「複製するな！複製するなら金払え」という考え方が横行した時代でしたが、今、世の中の情報基盤にあるのは「コピーレフト」を前提としたオープンソースソース・ソフトウエアであり、その構成要素はデータとプログラム（プロパティとメソッド）をパックにした「編集に最適な」小さな「オブジェクト」です。また、それらは「文字」の最大の特徴である「遠隔・非同期」的なコミュニケーションによって生み出されています。

• 情報をオープンにすること
• 情報を遠隔・非同期でアクセスできるようにすること
• 情報を編集可能な小さな情報要素の集合体として考えること
  
  

情報デザインのフィールド

• 視覚情報のデザイン
  Graphic Design　Infographics 　Movie　Web Design　Web Application
• 聴覚情報のデザイン
  Sound Design　InfoSound 　Alert　Wind Bell
• モノにおける情報のデザイン
  User Interface Design　Device Interface
• 空間に関わる情報のデザイン
  Sign Design　PublicDesign　Map
  
  

情報×デザインの「てにをは」

• 情報でデザインする　>　ハードからソフトへ
• 情報にデザインする　> 混沌(非情報)から秩序(情報)へ
  いまだ情報として捉えられていない存在を発見し、それを情報化する
  時計、温度計、BigDataが見出す隠れた意味・・
• 情報をデザインする　>　一般に言う「情報デザイン」
• 情報とデザインする　> 　情報(ソフト)とともにモノ(ハード)をデザイン

情報デザインの 5W2H

• What ： これは何？　例）イベント「〇〇」の開催案内等
• Why ： なぜ？　例）イベント開催の目的・主旨等
• When ： いつ？　例）開催期間等
• Where ： どこで？　例）会場、会場までの交通案内等
• Who ： 誰が？　例）出演者、出品者、主催者等
• How ： どのように？　例）申込方法等
• How much ： いくら？　例）入場料　参加費など
  
  
  
  

情報デザインの可能性

情報デザインにできることは何か？

モノ（ハードウエア）のデザイン vs 情報（ソフトウエア）のデザイン

• 情報のデザイン(制作)には、資源・エネルギーはほとんど必要ない
• 情報はどこへでも自由に、また瞬時に移動できる
• 情報は（劣化なしに）複製できる（複製してもオリジナルは消失しない）
• 情報は時間とともに洗練され、安定する
• 情報は物質的な廃棄物を出さない
  
  

情報デザイナーの役割

世の中の様々な問題に気づき、その解決策を提案するのがデザイナーです。
問題解決の様々なステップに情報デザインの力が必要とされています。

• 現状をわかりやすく知らせる
• 問題に気づかせる
• 問題解決のための知識を共有する
• 問題の解決方法を提案する

付記：「情報が無い」ことの明記も重要な情報

気象庁の台風情報のページでは、台風が発生していない場合に、現在台風は発生していません というメッセージが表示されます。「情報が無い」ことを明示することは、情報を探す手間を省く、情報を求めておこる様々な混乱を防ぐ・・などのメリットがあります。

• 例）無音の映像（実験映像等）をTVで放送する場合
  無音のままだと、放送事故あるいはTVの故障か？・・と思われます。「この作品は無音です」と提示することで、視聴者の不安や混乱を払拭できます。
• 例）デジタル地図上に描かれる危険箇所（土砂災害の可能性：赤色）
  エリア内に該当する場所が無い場合は「ご覧のエリアには土砂災害の可能性はありません」と明示することが、利用者の不安を払拭します。
• 例）列車が急停車した
  原因がわかるまで沈黙するのではなく、「現時点では原因がわかりません。ただいま調査中です」ということをアナウンスする
  
  
  
  

情報共有のための意識改革

クラウドファースト

サーバーにあるものがマスター、手元のファイルはクローン

データはローカルデバイス（自分の手元）ではなく、サーバーに一元管理して、みんなで共有するのが理想です。

クラウドファーストで考えると、バックアップが自動的にできる（差分記録が残る）など、データを失うリスクが軽減されるとともに利便性も増します。「もし自分のパソコンが壊れたら・・」という不安からも解放されます。

「実体渡し」から「アドレス渡し」へ

情報伝達は、データの「実体渡し」ではなく、「アドレス渡し」を推奨します。例えば以下のように、データのある場所へと誘導するということです。アドレスは単なる文字列なので、通信負荷なく送受可能です。

・授業の資料一覧です。以下をご覧下さい。
　https://www.example.com/data01.html
・ 荷物は北浜305倉庫、B列45番BOX。開錠の暗証番号は2112です。

• 実体渡し：データそのものを相手に渡す（メール添付）
  • 過去に送信された「実体」は確実に古くなる
  • 文書のアップデート時に、送り直すこと（ファイルの差替え）が必要

• アドレス渡し：データの所在（URL）を相手に伝える
  • リンク先の文書は常に最新にアップデートされている
  • 書きかけの状態でも、事前にその所在を渡しておくことが可能
    
    

Push型からPull型へ

Pushとは、送信者が情報を強制的に送る（受信者は情報を受動的に受け取る）もので、電話・FAX・メールなどがこれにあたります。一方 Pull は、受信者が必要なときに情報を能動的に受け取りにいくもので、Webサイト、共有フォルダ、掲示板を見に行くなどの行為がこれにあたります。送信者都合による Push配信は情報氾濫を招きます。可能な限り Push から Pull への移行が賢明です。

対面・同期から遠隔・非同期へ

リアルタイム・双方向が最良・・というわけではありません。自律分散を前提とするインターネットでは、遠隔・非同期が前提です。

• 遠隔：空間的拘束からの解放
• 非同期：時間的拘束からの解放

インターネットはアナログ回線と違ってパケット送信が前提です。利用者の通信速度にも依存するので、リアルタイム（同期式）双方向のセッションは本質的に得意ではありません。オンデマンド（非同期式）でも視聴できる動画配信とチャットの組み合わせがベストです。

アナログからデジタルへ

アナログとデジタルの最大の違いは、 デジタル情報が「居場所」を選ばないということです*1。しかし例えば、WORD文書やPDFは「A4タテ」などという情報が含まれている点で紙媒体に拘束されたままだと言えます*2。「モノに拘束されないデータにする」ということを常に意識することが必要です。
ちなみに公的報告書は今だに「紙」が基本で、これがデジタル化の妨げとなっています。

ローカルデバイス（パソコン）からブラウザへ

画像処理、図形描画、音楽制作、そして AI関連のソフトウエア開発など、ほぼすべてのことがブラウザ（Chrome, Firefox等）の中だけで完結できるようになりました。ブラウザは、機種・OSに依存しない世界共通のプラットフォームです。

ローカルデバイス（パソコン）にデータを保存するのをやめて、クラウド一元管理を前提とすれば、必要なのはそのアカウント情報だけ・・ということになります。パソコンを管理する煩わしさからも解放されます。

• PC機器への依存を推奨しない理由
  • 電源喪失、故障、経年劣化・・で終了。持続可能性がありません。
  • 機器メーカー・機種に依存するデータは、人によっては開けません。
  • 機種依存するアプリケーションのデータも、人によっては開けません。

• ブラウザを作業基盤とすることを推奨する理由
  • ほぼすべての人がブラウザ環境を持っています。ということは、利用者を差別することなく、誰もがそこでコミュニケーションすることができます。
  • 日常的に使うオフィスツール（ワードプロセッサ、スプレッドシート、スライド等）が Webアプリケーションとしてブラウザ上で動くので、自分のPCにそれらをインストールする必要がなくなります。
  • クラウドベースなので、自分のパソコンが壊れても被害がありません。
  • ウイルス対策はクラウド側にあってデータは守られるので、自分のPCのウイルス対策は事実上不要になります。
  • プロプライエタリなソフトウエアをインストールせずに済む・・ということはライセンス管理のような面倒な作業からも解放されます。
    
    

利用者（消費者）から開発者（生産者）へ

この国では「技術」というものについて、開発者（生産者） と利用者（消費者）という産業革命以後の構図が根強くあって、システム開発を ICTベンダーに丸投げする組織・企業が多く存在します。しかし、業務の ICT 化の名の下に導入される「ガラパゴスシステム」は、その活用に無駄な学習コストがかかるだけでなく、開発がクローズドであるがゆえに、臨機応変な改変もできません。
参考：TheCathedralAndTheBazaar

デジタル技術の特徴は、物質的原材料いらず、オープンなソースコード、豊富な技術情報・・結果、すべての人に DIY の機会が与えられています。消費者意識でベンダーまかせにするのではなく、システムを自らの手で DIY すべく、組織のメンバー全員の意識改革を促すことが大切です。

自らの情報発信基盤を持つ

自らのWebサイトを持つと、その「アドレス渡し」を１回行うだけで、以後の関係構築が完了します。ICTの活用に原材料（お金）は不要です。ITベンダー（専門の生産者）に依存するのではなく、自らその技術（サービス）を利用して Pull アクセスの基盤となる Webサイトを構築することを推奨します。無料のアカウントを持つだけでも、それは実現します。

• Googleサイト：Googleアカウントがあればすぐに公開可能
  https://sites.google.com/view/opensquarejp
• WordPress：世界中のWebサイトの 40%近くを占める Blog システム
  アカウントの作成手順 > WordPress/Account
  
  
  
  

情報の整理に関わるキーワード

現代社会には情報が氾濫しています。それらを上手く整理して伝達・共有するためのキーワードを紹介します。

5つの帽子掛け

情報の整理には一般に以下の5つの視点があります。
by リチャード・ソール・ワーマン

• 1. カテゴリー　Category　・・・共通の特徴をまとめた概念枠組で分類
  ＊学部＞学科＞専攻・・などツリー状の階層構造になる
  ＊全体を部分に区分けする方法は視点により様々
• 2. 時間　Time　・・・歴史年表、スケジュール、テレビ番組表など
• 3. 位置（空間）Location　・・・地図、サイトマップ
• 4. アルファベット順　Alphabet　・・・五十音順、番号順など機械的順序
  ＊紙媒体で検索がしやすく。辞書や事典の多くはこの方法を採用
• 5. 連続量・階層　Hierarchy　・・・人気順、価格順など何らかの価値の順
  ＊各種のグラフはこの基準によって視覚化されている
  
  

書棚とデータベース

従来のように「書類をバインダーに綴じて棚に整理する」という発想ではなく、「書類に関連するカテゴリー名やタグを付けて保管しておけば、あとはシステムが自動的に引き出してくれる」、つまり「ツリー状の枠組みで物事を片付ける必要はく、情報にマーキングだけしておいて、あとは機械に探させればいい」という発想の転換をすることで、情報の管理は非常に楽になります。

• 書棚とデータベース
  
  

カテゴリーとタグ

カテゴリーは、一般にツリー型の分類構造を持ちます。例えば、Webサイトのサイトマップ（ナビゲーションメニューに反映）は、一般にカテゴリーツリーの形で構成されます。

一方タグは、各情報に関連するワード「タグ」付けする・・というもので、ツリー状の分類とは無縁の存在です。例えば「犬の写真」には、「犬」と「写真」の２つのタグを付けておけば、閲覧者は「犬」からでも「写真」からでも目的のデータにたどり着くことができます。

付記：カテゴリーツリーの作り方は多様
例えば、A大学の学生をいくつかのグループに分けるには・・

• 学部＞学科＞学年
• 学年＞学部＞学科
• 学部＞出身都道府県

など、分け方や階層の上下関係は様々に考えることができます。

ツリー状に整理格納する場合、階層が深くなるとデータの探索には時間がかかります。また、実際には一つのカテゴリーに振り分けられない情報というものも存在します。であれば、情報をカテゴリーツリー上のどこかに割り付けるのではなく、個々の情報の方にカテゴリー名を付与する（一般的には、いずれかひとつのカテゴリー名をつけるべきですが、場合によっては複数のカテゴリー名を付与することもできる）という、逆転の発想で情報を整理する方が、柔軟な情報管理が可能になります。

フォルダとインデックス

フォルダは上記の「カテゴリー」に相当するツリー状の階層構造を持つもので、インデックスは上記の「タグ」に相当します。CMS等の管理上の用語としては、同義と考えて差し支えありません。

ストックとフロー

ストックとは、長期にわたって何度も閲覧される情報のことで、マニュアル、参考資料、文書フォームなどがこれに該当します。一方、フローとは、短期間で価値がなくなる情報で、お知らせ、募集告知などがこれにあたります。

伽藍とバザール

ページを独立させました ＞ TheCathedralAndTheBazaar

ツリーとセミラティス

ページを独立させました ＞ Semi-lattice

Wiki と Blog

CMSの２大スタイルである Wiki と Blog は「ストック（カテゴリー）」に重点を置くか「フロー（タグ）」に重点を置くかの違いで説明することができます。

• Wiki：ページ単位として編集・更新。百科事典、まとめサイト・・
• Blog：記事を単位として投稿。最新の投稿が優先・・
  
  
  
  

APPENDIX

関連LINK

• リチャード・ソール・ワーマン　情報アーキテクト
  http://www.wurman.com/
• ヤコブ・ニールセン　ユーザビリティー
  https://www.nngroup.com/articles/author/jakob-nielsen/
• ドナルド・A・ノーマン　認知科学
  Don Norman's jnd website
  https://www.nngroup.com/articles/author/don-norman/
  TED|Don Norman on 3 ways good design makes you happy
• マーシャル・マクルーハン　メディア論
• 松岡正剛　編集工学
  • 編集工学研究所
  • 千夜千冊
    
    

書籍紹介

• 情報デザインアソシエイツ編「情報デザイン」グラフィック社
• 情報デザインフォーラム編「情報デザインの教室」丸善出版
• 渡辺保史「情報デザイン入門」平凡社
• リチャード・ソール・ワーマン「理解の秘密」 NTT出版
• ヤコブ・ニールセン「マルチメディア&ハイパーテキスト原論」電機大出版局
• ロバート・ヤコブソン「情報デザイン原論」 篠原稔和 監訳　電機大出版局
• 松岡正剛「知の編集工学」朝日文庫
  
  
  
  

付記

情報の空間性・時間性

松岡正剛(「知の編集工学」)に、有名な言葉があります。

情報は、ひとりでいられない

• 我々が「情報」をどのように扱っているか、また遺伝「情報」はどのようにふるまっているかをみれば明らかですが、情報は複製・伝達・蓄積・共有されることで、はじめて意味をもつ存在です。　・・情報の時間性
• 例えば、「赤」は単体では意味をもちませんが、「青」と組み合わされて「交差点」という文脈に位置付けられると「止まれ」という意味を担う情報になります。他との「関係」が重要なのです。・・情報の空間性
  
  

差異 / 言語 / 情報

最も基本的な「情報化」は、それに「名を与える」ということです。
言語化されてはじめてそれは情報になります。 > 言葉とは何か
物事を「差異化」して「関係づけ」すること・・