1. GUI の確立にみる「ディスプレイ行為」の形成過程
2009.2.27
情報科学研究科社会システム情報学専攻
電子社会設計論講座茂登山研究室
水野勝仁

2. 発表の流れ
■ 研究の背景と目的・意義
■ 「ディスプレイ行為」
■ 関連研究
■ 研究の独自性と方法
■ 行為，痕跡，イメージの関係の変化と道具の変化：ペンからマウスへ
■ 言語的記号から絵画的記号へ：プログラムとアイコン
■ カーソルによる選択行為と「ディスプレイ行為」：マウスとアイコン
■ 研究の成果
■ 課題と今後の研究

3. 背景と目的・意義
■ 背景
‣ コンピュータの操作：ディスプレイを見つめ，マウスを動かし，キーボードを打つ
- 身体的行為に連動するディスプレイ上のイメージの変化を，自分の「行為」とし
て受け入れる
■ 目的・意義
‣ GUI の確立に「ディスプレイ行為」の形成過程をみること
- ヒトの行為とディスプレイ上のイメージの関係から，ユーザ・インターフェイス
を捉え直す
‣ ヒトの行為を形成していく場に，情報科学を拡張していくこと
- ヒトがコンピュータを主体的に使っていくことを考えるための基盤作り

4. 「ディスプレイ行為」
■ 「ディスプレイ行為」：身体的行為と，ディスプレイ上のイメージの変化の結びつ
きによって形成される行為
‣ ディスプレイ上のイメージを見つづけることで行われるヒトの「行為」
- ユーザ・インターフェイスの開発の中で生まれた
• クリックなどの新しい言葉がしめすように，「ディスプレイ行為」は，人
の新しい行為のひとつとなってきている
■ 「ディスプレイ行為」の輪郭：見たものを指示する
‣ ディスプレイ上のイメージに対して，ただ行為を行うことを促す
- ディスプレイ上のイメージを指さす直示詞（「これ」）の働き
• ヒトが「ディスプレイ行為」をどのようにして習得していったのか？

5. 関連研究
■ ベン・シュナイダーマン（2004）『ユーザ・インターフェイスをデザインすること』
‣ 「直接操作」という GUI を理解するための重要な概念を示す
- GUI とコマンド入力をミスの頻度など，主に道具的観点から捉えている
• イメージと行為とのつながりへの考察に至っていない
■ ティエリー・バーディニ（2002）『ブートストラップ』
‣ ダグラス・エンゲルバートの思想から，ユーザ・インターフェイスを考察
‣ ユーザ・インターフェイスにおける身体の重要性を示す
- 身体的行為とディスプレイ上のイメージとの関係は考察していない
➡ ユーザ・インターフェイスにおける行為とイメージとを関連づけて考察するには至っ
ていない

6. 参照した研究
■ コンピュータを直接扱ってはない研究を参照
‣ ヒトの行為とディスプレイ上のイメージを結びつけるために
- ジークムント・フロイト（1925）「マジック・メモについてのノート」，
ウィリアム・アイバンス（1953）『ヴィジュアル・コミュニケーションの歴
史』，ジル・ドゥルーズ（1981）『感覚の論理』
- ヴィレム・フルッサー（1996）『テクノコードの誕生』，ゴットフリート・ラ
イプニッツ（1678）「観念とは何か」，アンガス・フレッチャー（1964）
『アレゴリー』，ジャンバッティスタ・ヴィーコ（1731）『新しい学』
- ジョージ・レイコフ＆マーク・ジョンソン（1980）『レトリックと人生』，
ルース・ギャレット・ミリカン（2002）『意味と目的の世界』，アンドレ・
ルロワ＝グラン（1964-5）『身ぶりと言葉』

7. 本研究の独自性と方法
■ 独自性
‣ 「ディスプレイ行為」という視点
- 従来は別々に扱われてきたユーザ・インターフェイスにおける身体的行為
と，ディスプレイ上のイメージの変化
• これらを結びつけて，ひとつの「行為」として考察する
■ 方法
‣ GUI に至るプロセスを，ヒトの行為とディスプレイ上のイメージとの関係から
捉え直す
- スケッチパッド，マウス，スモールトーク，デスクトップ・メタファーを，
当時の映像や文献をもとに考察していく

8. 行為，痕跡，イメージの関係の変化と道具の変化：
ペンからマウスへ

9. 行為，痕跡，イメージの結びつき
■ 行為＝痕跡＝イメージ
‣ 手を動かすと，その動きに一致した痕跡が刻まれ，それがイメージとして提示される
- 私たちが「イメージ」と呼んできたものは，「行為＝痕跡＝イメージ」という関
係を持っているもの
■ マジック・メモとスケッチパッド
‣ マジック・メモ：何度も書き直すことができるメモ帳
- 直接痕跡を刻まない
‣ スケッチパッド：「拘束 [constraint]」という概念を用いて図形を描くシステム
- 痕跡を刻むことがないペン
• 「行為＝痕跡＝イメージ」の関係が解体されていく過程を示す

17. マジック：メモ：行為＝痕跡＝イメージの解体可能性
■ ジークムント・フロイトが取り上げた玩具「マジック・メモ」
‣ いつでも新たな受け入れ能力を提供／記録したメモの持続的痕跡の保持
‣ 三層構造：第一層：セルロイド，第二層：パラフィン紙，第三層：ワックスボード
- 三層が密着している時には，イメージが見えるが，第二層と第三層とを分離すると
イメージは消え去るが，痕跡は残り続ける
■ 「イメージは消えさり，痕跡は残り続ける」ことを可能にする三層の役割
‣ 第一層：行為の受け入れ，第二層：イメージの受け入れ，第三層：痕跡の受け入れ
- イメージの表示の条件：行為と直接結びついた痕跡との密着
- イメージと分離して残り続ける痕跡
• 行為＝痕跡＝イメージの解体可能性を示す

18. スケッチパッド：行為＝痕跡＝イメージを無効にする「変換」という原理
アイヴァン・ザザーランド，スケッチパッド（1962）
[Computer Sketchpad, 1967]

19. Sutherland, Computer inputs and outputs, 1966

20. スケッチパッド：行為＝痕跡＝イメージを解体する「変換」という操作
■ 「拘束」という従来の視覚的表現になかった概念
‣ ペンが描いていないところに，線が描かれる
■ 二つのリアリティを結びつけること
‣ ヒトの描く行為／コンピュータの選択行為
- コンピュータによる「変換」の操作
- インターフェイスで，二つのリアリティを一致させる
• ライトペンで，ディスプレイの点を選択することで「描く」
■ 不可視になった痕跡
‣ 痕跡が表面上なくなったことで，行為とイメージが自由になる

21. マウス：ヒトとコンピュータの共進化による新たな行為と道具
ダグラス・エンゲルバート，NLS デモ（1968）
[Alan Kay，Doing with Images Makes Symbols , 1987]

22. マウス：ヒトとコンピュータの共進化による新たな行為と道具
■ ヒトとコンピュータとの共進化
‣ エンゲルバート：ヒトの行為を，コンピュータの操作のために最適化する
- ヒトがコンピュータの操作の際に行っているのは選択行為
• ディスプレイ上を指さす選択行為に最適化した道具の開発
■ タイプライター[手と目の分離] ＋（見なくても）掴みやすい形＝マウス
‣ 「ペン」という形との訣別
- 手元を見なくても掴みやすい形
• 四角い箱を動かし，ディスプレイ上のイメージを選択するという行為の形成
‣ 手を見ることなくディスプレイを見続けることで成立する「行為」が形成され始めた

23. 本章のまとめ
行為＝痕跡＝イメージの関係から，マジック・メモと
スケッチパッドを考察し，イメージの性質の変化と，
それに伴うヒトの行為の変化を示した．そして，行為
の変化がペンからマウスという道具の変化を促したこ
とを示した

24. 言語的記号から絵画的記号へ：プログラムとアイコン

25. 絵画的記号としてのアイコンと言語的記号としてのプログラム（１）
■ ユーザ・インターフェイスを「絵画的記号と言語的記号との闘争の場」と考える
‣ GUI：言語的記号と絵画的記号という異なる性質を示すものが同時に存在する場
- アイコンによって，多くのヒトがコンピュータを使えるようになった
• アイコンという絵画的記号とヒトの視覚的思考の親和性
• アイコンは，プログラムから形成される
- プログラムはヒトとも対話し，コンピュータとも対話する
• プログラムという言語的記号の逐次性と CPU の情報処理の親和性
• プログラムが，アイコンという非逐次的な情報処理形式を表示する

26. 絵画的記号としてのアイコンと言語的記号としてのプログラム（２）
２次元的コードから線形的コードへ，ヴィレム・フルッサー（1997）『テクノコードの誕生』
■ フルッサーを経由し，アイコンとプログラムとの関係を明確にする
‣ 絵画的記号をみるヒトが体験する時間
- 最初に見たものを最後にまた戻って見ることできる旋回する時間
‣ 言語的記号をみるヒトが体験する時間
- 旋回するものを，一次元的に引き延ばしていく時間
➡ 絵画的記号が示す平面性・旋回性と言語的記号が示す線形性・逐次性との間の闘争

27. アイコンとプログラムの関係
David C. Smith, `Pygmalion`, Allen Cypher
ed., Watch What I Do , 1993

28. アイコンとプログラムの関係
■ 絵画的記号がもつ「多元的コミュニケーション」の可能性
‣ 言語的記号が示す抽象的で，線形的な見方からの逃れるため
- 言語的記号と絵画的記号の相補性
■ ピグマリオンがコンピュータに導入したもの
‣ ノイマンロジックに基づく，コンピュータの逐次的情報処理を制御するために，ア
イコンという絵画的記号が配置される平面を，ディスプレイ上に映し出したという
こと
- コンピュータに平面性・旋回性を示す絵画的記号による情報表示を押しつける
■ 非逐次性が排除されたノイマン型コンピュータ世界
‣ 言語的記号と絵画的記号が示す相補性は，アイコンとプログラムとの間には原理的
に存在しないのではないか？

29. 情報隠蔽から生じる「共在の秩序」
■ スモールトークが示したオブジェクト指向
‣ オブジェクトが等価なものとして同一平面上に同時に存在し，メッセージ交換が行わ
れる空間の出現
■ 情報隠
‣ 逐次性を隠 するという消極的な方法が与えたもの
• インターフェイス層：「絵」という非逐次的要素
• プログラム層：「変数」「参照」「データ構造」「機能」という逐次的要素
■ 共在の秩序
‣ 時間という計算過程が隠れた瞬間，その計算結果として生じていた事物の関係性
➡ オブジェクトが抱えている独自の時間を隠しながら，その外観を提示する平面の成立

30. アレゴリーを創造するプログラムという言語的記号（１）
■ 「どのように」ではなく，「なぜ」プログラムがアイコンを作り出すのか？
‣ プログラムとアイコンの間にアナロジーの関係が維持されている
- プログラムの記述によってアナロジーの関係を作ることできる
- プログラムの記述は CPU の動作原理によって強制されたもの
‣ CPU に半ば取りつかれたかたちで要素を繋げ，一つの世界を構成する
- デーモン：私たちに取りつき，一つのアイデアを実現させるために厳格な手順を
実行させる力
• アレゴリーを生み出すアレゴリカル・エージェントの主な性質
➡ CPU というデーモンに取りつかれたアレゴリカル・エージェントとしてのヒト

31. アレゴリーを創造するプログラムという言語的記号（２）
■ 関係を，アナロジーは維持し，アレゴリーは破壊する
‣ アレゴリーは独自の「リアリティ」を持つ
- アナロジーは，ヒトが基準となって世界の要素を結びつける
- アレゴリーは，別の力によって，ヒトが基準の関係は破壊されるが，そこから
新たな関係が構築され独自の世界が立ち上がる
■ アレゴリー：連繋し合うメタファーの連続体／言語の意味を隠 するもの
‣ 象徴的な意味と，無時間的な性格をもつ オブジェクト指向
■ プログラムが創造するアレゴリーとしてのアイコン
‣ プログラムが形成する象徴的な意味と無時間的な平面が，アイコンという絵画的記
号を引き寄せ，ディスプレイに表示する

32. アイコンが示す曖昧さと正しさ（１）
地球儀，すなわち，自然
の世界の上に立ってい
る，頭に翼を生やした女
性は，形而上学である．
これが形而上学という名
辞の意味であるからであ
る．……真ん中にある地
球儀は，つぎに自然科学
者たちが観察することに
なった自然の世界を表象
している．そして，上部
にある象形文字は，最後
に形而上学学者たちが観
照するにいたった知性な 「 ディ ピ ン ト ゥ ー ラ 」 ，
ヴ ィ ー コ 『 新 し い
らびに神の世界を表示し 学』1744年版の口絵と，
ているのである． 扉頁の前に置かれている絵
の説明

33. アイコンが示す曖昧さと正しさ（２）
■ 絵画的記号は言語的記号を必要とする
‣ 絵画的記号の意味を説明し，定着させる言語的記号
■ アレゴリーとしてのアイコンを解釈する
‣ 字義であるプログラムではなく，アレゴリーであるアイコンを表示するディスプレイ
- アレゴリーとは字義から始まる：字義を構成するプログラムを読む必要がある
• 私たちの多くが，プログラムを読もうとはしない：字義を確かめることなく，
アイコンを曖昧なまま受け入れる
- アレゴリーは，読み手に「正しい」読みを与える
‣ アイコンは，私たちに曖昧さと正しさという相反するものを同時に受け入れさせる
- 明確に名指すことができず，「これ」と選択するしかないもの

34. 本章のまとめ
スモールトークが，絵画的記号を表示するための平面
を成立させ，ヒトに指さす選択行為を促す，読みの
「正しさ」と曖昧さを同時に示すアイコンをディスプ
レイ上に配置することを可能にしたことを示した

35. カーソルによる選択行為と「ディスプレイ行為」：
マウスとアイコン

36. Moggridge,
Designing
Interactions,
2007

37. メタファーと身体
■ デスクトップ・メタファーは何をユーザ・インターフェイスに導入したか
‣ ジョージ・レイコフとマーク・ジョンソンの経験基盤主義に基づくメタファー論
から，デスクトップ・メタファーを考察する
- 単に現実のモノを模しているのではない
- ヒトの身体経験とイメージ・スキーマを導入
• 身体経験とイメージ・スキーマを導入した結果，現実を模した形式になった
■ メタファーの基盤となる身体とコンピュータという論理世界
‣ 論理世界は身体を排除する
- どのように身体がコンピュータに入り込んでいったか
• コンピュータの選択行為に適した道具であるマウスを通して

38. マウスとカーソル：カーソルによる選択行為
■ マウスを上に上げて，メニューを開いてください
‣ 実際に，マウスを上に上げて，メニューを指す
- マウスが示す「掴む」というアフォーダンス
• ヒトが最も古くから行ってきた手で掴むという行為
- ディスプレイ上のカーソルが示す「指さす」というアフォーダンス
• アフォーダンスの直接的な知覚に基づく指さすという行為
■ アフォーダンスの受け渡し
‣ マウスとディスプレイ上のカーソルの間で，アフォーダンスを受け渡すことが必要
‣ マウスなどの物理的対象が示すアフォーダンスと，ディスプレイ上のイメージが示
すアフォーダンスを受け渡しながら遂行する行為

39. デスクトップ・メタファーと「ディスプレイ行為」（１）
■ 自由にディスプレイ上のイメージを表示する
‣ カーソルの形が点（・）から矢印（→）へ
- ディスプレイ上のイメージが，私たちの行為を半ば強制的に決める
■ カーソルで指さし選択行為を遂行する際，手は常にマウスを掴んでいる
- 何かを掴んでいるという感覚の蓄積
■ デスクトップ・メタファー
‣ 「マウスでウィンドウを『一番上』に持っていくこと」
‣ 「メタファーは，マウスで書類を掴み，スクリーン上を動かすこと」
- マウスの示す「掴む」というアフォーダンスを，特定の目標状態「持っていく」
「動かす」へと導くようにディスプレイ上のイメージを形成する

40. デスクトップ・メタファーと「ディスプレイ行為」（２）
■ 「ディスプレイ行為」の形成
‣ メタファーが，マウス，カーソル，アイコンを結びつける
- マウス：ヒトが古くから経験する何かを掴むという行為をアフォードする
- ディスプレイ上のカーソル：何かを指さす選択行為をアフォードする
- ディスプレイ上のアイコン：選択行為を特定の目標状態に導くイメージ
‣ マウスなどの物理的対象が示すアフォーダンスと，ディスプレイ上のイメージが示す
アフォーダンスを受け渡しながら遂行する行為，「ディスプレイ行為」を，ヒトが身
につける

41. 本章のまとめ
マウスなどの物理的対象が示すアフォーダンスと，
ディスプレイ上のイメージが示すアフォーダンスを受
け渡しながら遂行する行為，「ディスプレイ行為」
を，ヒトが身につけたことを示した

42. 本研究の成果（１）
■ 行為＝痕跡＝イメージの関係から，マジック・メモとスケッチパッドを考察し，イ
メージの性質の変化と，それに伴うヒトの行為の変化を示した
‣ ヒトの行為の変化は，ペンからマウスという道具の変化をもたらした
■ スモールトークが，絵画的記号を表示するための平面を成立させ，ヒトに指さす選
択行為を促す，読みの「正しさ」と曖昧さを同時に示すアイコンをディスプレイ上
に配置することを可能にしたことを示した
■ マウスなどの物理的対象が示すアフォーダンスと，ディスプレイ上のイメージが示
すアフォーダンスを受け渡しながら遂行する行為，「ディスプレイ行為」を，ヒト
が身につけたことを示した
‣ メタファーによって， マウスの示す「掴む」というアフォーダンスを，特定の
目標状態「持っていく」「動かす」へと導くようにディスプレイ上のイメージを
形成していったことを示した

43. 本研究の成果（２）
■ ヒトとコンピュータとの関係を，ヒトの行為から考えていく基盤としての「ディスプ
レイ行為」
‣ 情報科学がヒトの行為を形成する場に拡張していくための基礎的な知見を，GUI
の確立過程から導く
- ヒトの行為とコンピュータとの関係から生じるゆるくつながった身体感覚
■ コンピュータの技術的進展とヒトの身体
‣ ディスプレイという制約が外され，ヒトの身体がもつすべての感覚のつながりを解
いていく
- ヒトとコンピュータとの結びつきを，行為を中心に据えて考える意識
• 今後のインターフェイスの可能性を探るために必要

44. 今後の研究
iPod touch などのディスプレイに直接触れる「手と目とが一致する」インターフェイ
スにおけるヒトの行為とディスプレイ上のイメージの関係の考察
カーソルやビデオゲームのキャラクターなど，ヒトの行為と連動するディスプレイ上
のイメージが，私たちの意思とは関係なく変移すること（例：カーソルの→が，突然
風車になる）の考察