わたしはこれを法則にしているのか？

みなみなさま、ごきげんさま。

今の時代に生きている人ならば、人工物に溢れた囲まれ使う生活、生きる活動をしているはずです。

つまりは、その人工物はデザインされた設計され私たちの手元に存在しているわけです。

前回、「形は機能に従う」ことがデザインの定義だ。という話をしました。

あらゆるデザインは機能に従っている。と言っても過言ではありません。逆にいえば機能に従っていないものはデザインされていないともいえます。

建築やカップやお皿、家具や電化製品、工業製品に自動車などなどの3次元のものから、ポスターや新聞、WEB記事や広告などの2次元のものまで、全ての人工物は機能に従っています。

スタイルやフォルムなどの見た目のことだけをデザインと呼ばれることもよくありますが、スタイルや見た目はデザインの一部に過ぎません。しかし、判断されるのはスタイルや見た目だけですからなかなか難しい。

どんな機能に従っているのかということを手掛かりにすると少しはわかりやすくなるのではないでしょうか。

グラフィックデザインでは、決まり事がある。という話もしました。その原則的な法則的な話を少しばかり踏み込んでさせていただければと思います。

機能に従う上での決まり事です。

今の時代ならば、コンピュータを使いデザインされたものをコンピュータのデータにし印刷所などに入稿（オンデマンド印刷）をしポスターやチラシなどの広告物にしてもらいます。WEBならばそのデータをサーバーに上げる（UPする）移す感じでしょうか。

コンピュータのない時代は、頭の中でデザインされたものを手作業で一枚の紙に写真を貼っつけたり文字を貼り付けたりしてレイアウトを（写植など集版し）まずは出力所（印刷所ではなく）なる写真のような製版フィルムなどとして、そのフィルムを印刷所に入稿して印刷（オフセット印刷）してもらう、なんて今では考えられないくらいの作業量をしていました。（印刷所と出力所が一緒になっているところもある）

現在も大量（500〜1000枚以上）に刷る場合は、オフセット印刷を利用しますが製版フィルムではなくアルミ版で作成する「CTP（Computer to Plate）」を使用します。大量に刷るとコストの面で安くなり、耐久性や仕上がりの綺麗さではオフセット印刷の方が良いといわれています。

製版フィルムができる前は感光材料（光を受け止める素材）を用いて透明なガラス乾板で転写していたそうです、つまりは大きなカメラで撮影して印刷版をつくっていました。カメラがスキャナーになり、コンピュータとつながり、スキャナーがなくなりデータとなり現在に至るわけです。

その前の時代となれば活版印刷で大量生産を実現していました。

デザインもこの活版印刷であれ手作業でオフセット印刷させるものであれWEBに載せるデータであれ、活版印刷の機能にオフセット印刷の機能にWEBの機能に従わなければなりません。

その昔、新聞に初めて本格的な絵の入った（それまでは挿絵程度のものはあった）広告を出す際に画家に絵を依頼すると画角が合わなかったり新聞紙と描いたものの印刷がうまくいかなかったりしました。
つまりは新聞の機能（紙質やサイズ）にも従わなければなりません。

新聞にせよ、それらにはそれらの機能があります。

RGB（光の三原色）で作ったデータでは印刷はできませんし、（今のコンピュータとプリンターなどでは色味は変わりますが印刷はできますし、印刷所でも色味が変わることを前提に変換してくれれたりもしますが親切なところだけかもしれません）
CMYK（印刷色）で作ったデータではWEBでは発色が違います。

込み入った話です、色には光を組み合わせた色（モニターやスマホ画面やテレビなど）とインクの色を組み合わせた色があります。その組み合わせが違うという話です。赤（R）と青（B）を組み合わせれば紫になりますが、インクには青がありません赤もありません。マゼンタ（M）というピンク系の色とイエロー（Y）を混ぜ赤にしてシアン（C）という水色系の色をその赤と混ぜ合わせて紫にしなければなりません。なんて込み入った話です。

デザインはそんな込み入った話にも従わなければなりません。

芸術ならば高さ制限のあるものを超えてつくることも許されます。（いや許されませんか）額の外に描いてもアートです。二次元であるグラフィックを立体的に見えるように描くことはデザインでも立体に凹凸をつけ三次元とさせるとアートです。

デザインは機能に従わなければなりません。一点ものとしてアート的に枠をはみ出るとか三次元などの機能に従うデザインもあったりするのでややこしい。モダンデザインの概念ができたのは大量生産という時代に対応した作り方のデザインですから、一点ものとなるとややこしくなります。

デザインは従わなければならないからか、法則や原則的なものもたくさんあるので、いくつか紹介できればと思います。

基本的にあらゆるデザイナーがこの原則を元に機能に従おうと試みます。

その原則とは、
ユニバーサルデザインの7原則です。

アメリカの建築家のロナルド・メイスら（ノースカロライナ州立大学の「ユニバーサルデザインセンター（Center for Universal Design）（建築デザイナー、プロダクトデザイナー/工業デザイナー、技術者/エンジニア、研究者工業デザイナー）」が1997年に、

「年齢や能力、状況に関わらず、できるだけ多くの人が同じように利用できるように設計せよ」

と提唱しました。

デザインはさもすれば、美しいやスタイリッシュ、大阪弁では「シュッとした」なんていわれそうなものと思われがちですが、このひと言に尽きます。

年齢や能力、状況に関わらず、できるだけ多くの人が同じように利用できるように設計せよ。

この原則を守ったところで、美しくなるわけでもシュッとするわけでもありません。逆にシュッとしないかも知れません。

できるだけ多くの人が同じように利用できるように、する原則です。全てを守ったからといって全ての人が同じように利用できるとは限りませんが、できるだけ多くの人に同じように利用されることを目指すためのものです。
7つの原則がありますので、見ていきましょう。

原則1
公平な利用（Equitable Use）
利用者に差別感や屈辱感を与えず、全てのユーザーにとって同じ（無理なら同等の）利用手段が用意されていること。

原則2
自由度の高さ（Flexibility in Use）
右利き・左利き双方への対応、ユーザーの好み・ペース、身体的な機敏さに合わせて使い方の選択できること。

原則3
単純で直感的 (Simple and Intuitive Use）
ユーザーの経験や知識、言語能力、現在の集中度に関わらず、直感的に理解できる設計であること。

原則4
明確な情報（Perceptible Information）
周囲の環境条件（暗さや騒音）や利用者の感覚能力に関わらず、視覚・聴覚・触覚など重複した方法で情報が的確に伝わること。

原則5
エラーへの寛容さ（Tolerance for Error）
誤操作や意図しない行動（エラー）による危険を最小限に抑え、失敗しても安全な結果（フェイルセーフ）になること。

原則6
少ない身体的負担（Low Physical Effort）
身体的な疲労を最小限に抑えるため不自然な姿勢を強いることなく、効率的で快適でかつ最小限の力で操作できること。

原則7
接近や利用のためのサイズと空間（Size and Space for Approach and Use）
ユーザーの体格、姿勢（座っているか、立っているか）、移動補助具（車椅子など）に関わらず、適切なアプローチ空間が確保されていること。

最初の項目として、ユニバーサルデザインの７原則をあげましたが、この原則はどちらかといえば、最後のチェック項目的に使われることが多いでしょうか。

最終チェックをするのですから、製作中も気をつけなくてはいけません。出来上がったが、反しているのでは作り直さなければなりません。

人間がつくった原則ですから、状況や環境などで例外も認められますが、できる限り従おうと努めるのがデザイナーです。デザインです。

何より、できるだけ多くの人が同じように利用できるに越したことはありません。

もちろん限定することも大切な場合も多く含まれます。

トイレやお風呂、服などを男女混用にするのかは、まだまだ環境も状況も整っていないかも知れませんし、環境が整わないかも知れません。

従おうとしてもアイデアがない場合もあるかも知れませんが、できるだけ多くの人が同じようにですからそれがなければ、誰一人として利用できなかったものが利用できるようになったとなれば、それもユニバーサルデザインに合致しているという理屈も通るかも知れません。

そのものにもよりますが、より良い未来に向けた原則であります。

次は、デザインの概念です。そもそもデザインとはなんぞや、といえばいいでしょうか。何のために存在しているのか。

デザインとは何者で何を大切にするのか。
という理念的なものといえばわかりやすいでしょうか。

デザインとは、
シグニファイア（Signifier）でアフォーダンス（Affordance）を大切にする。

実際は、アフォーダンス（Affordance）とシグニファイア（Signifier）と紹介されることが多いのですが、わかりやすい言葉にはめると、デザインとはシグニファイア（Signifier）でアフォーダンス（Affordance）を大切にするになります。

急にアフォーダンス（Affordance）とシグニファイア（Signifier）と言われても、わかりません。

このアフォーダンス（Affordance）は1960〜1970年代にアメリカの知覚心理学者・生態心理学者ジェームズ・J・ギブソン（James Jerome Gibson）さんが作った造語で、日本語には訳されていなかったりします。しっくりくる言葉がなかったのかもしれません。無理やりに訳すならば「物理的な事実・可能性」という感じでしょうか。

シグニファイア（Signifier）は、20世紀初頭にスイスの言語学者フェルディナン・ド・ソシュール（Ferdinand de Saussure）さんが提唱した「記号論（セミオティクス）」にあり、こちらも日本語に訳されませんでした。セットでの考えで概念ですから、片方だけが訳されても困ります。こちらも無理やりに「合図・手がかり」と訳されたりします。

なぜこの言葉が世界で日本で広まったかといえば、

認知心理学を修めた現代デザイン界の最高峰権威と呼ばれる、
ドナルド・A・ノーマン（Donald A. Norman）さんの『誰のためのデザイン？』（原題：The Design of Everyday Things）の中で提唱されています。

平な床は、歩くことを大切にして提供しているわけです。
逆に歩かせたくなければ、凸凹にするとか壁をつくることを提供すればいいのです。

何とはなくわかったでしょうか。

凸凹の道よりも平ら道を無意識に選んで歩いている、と言い換えることもできます。

芝生の上を歩いて欲しくなければそれよりも歩きやすい平な道をアフォードするのがデザインです。といっているわけです。

どこにどう作用すればいいのかを人間に伝える「物理的な合図・兆候」のことです。

ドアに「引く（PULL）」と書いてある文字と例をあげていますが、実はドアに文字で書かなければいけない状態はデザインとしては敗北の典型例でもある。ともいっています。

「引く（PULL）」とラベルを貼らなければ物理的なデザインがわからないから、後から貼り付けた「最終手段のシグニファイア」でもある。

文字を読むということは、ほんの一瞬、脳に「認知の負荷」がかかります。優れたデザインであれば文字を読ませるまでもなく、形状そのものが使い方を伝えるべきと主張しています。

「認知の負荷」とは、
人間はシンプルなものを好みます。
その一瞬の負荷で行動が変わる、といっているわけです。
詳しくいえば、
人間の脳（ワーキングメモリ）が一度に処理できる情報の量には限界があり、そのためデザインはユーザーに余計な『考えさせる労力（負荷）』を1ミリでも与えないように設計を心がけます。

これは1980年代にジョン・スウェラー（John Sweller）さん（教育心理学者・オーストラリア）が、脳の負荷（課題内在的・課題外在的・学習関連）は3つに分類してコントロールすると提唱した理論に基づいたものです。
課題内在的負荷とは、
その作業自体が持つ本質的な難しさ。
（どうしようもない負荷。複雑な計算、長い文章を読むなど）
課題外在的負荷とは、
デザインの悪さのせいで発生する余計なストレス。
（無駄な負荷。どこを押せばいいか分からない、文字が小さすぎるなど）
学習関連負荷（適切負荷）とは、
情報を理解し脳のスキーマ（知識構造）に定着させるための有益な脳の働き。（良い負荷。ゲームのチュートリアル、目的のある読書など）

ドアに「引く（PULL）」の例でいえば、
文字を読むことは内在的負荷がかかるわけです、その文字が小さければ外在的負荷も生じます。しかしドアを開きたいという目的があるからその文字は学習関連負荷（適切負荷）にもなり得るから、「最終手段のシグニファイア」となる、といっているわけです。

ならば、文字をなくすことで内在的負荷を除き、外在的負荷（デザインの悪さのせいで発生する余計なストレス）をなくし、ゲームのチュートリアルの学習関連負荷（適切負荷）のように見ればわかるデザインが好ましいことがわかります。

前回、書いたワンページ・ワンメッセージもこの認知負荷の原則からシンプルにという考えです。

スタイリッシュでオシャレなデザインと紹介されたドアが、押しても引いても開かない。スライドさせ開くドアだとすれば、どうなのでしょう。

お店などでは困っているお客さまのために、スライドとか右に矢印（文字を使わずに）と書いたものを後から貼るかもしれません。

それを見たデザイナーはデザインが台無しだと思うのか、失敗したと思うのか。ということを問うているのかもしれません。

「オシャレだけど使いにくい」はデザインではない。
「使いやすいから、オシャレ」なのだ。

ともいえます。

これを提唱したD.A.ノーマンさんは、「UX（ユーザーエクスペリエンス）」と言葉をつくり、この職種を最初に体現し実現させた人物でもあります。そしてこの著書『誰のためのデザイン？』はUI/UXデザインの聖書ともいわれていますからご一読を。UI/UXデザイナーでない人でも聖書になるかもしれませんので、ご一読を。

アフォーダンスとシグニファイアをひと通り見てきましたが、お気づきの方もいるかもしれません。

言葉を変えると、「形は機能に従う。」です。

それを言っちゃ元も子もありません。しかし黙ってはいられません。いや、ここだけの話です。

ざっくりとした説明ですが、ドアなどのシンプルならば機能に従うことも「引く（PULL）」ひとつでいいですが、ネットでの注文方法やDX化によるタッチパネルでの操作や注文方法など複雑な機能にこそアフォーダンスとシグニファイアを取り入れなければ、2度とそのお店やホームページには訪れてくれないかもしれません。

この文章は、どうなのだ。
といわそうですが、いやすでにいわれていますか。
アフォーダンスとシグニファイアでいえば、
長い文章で内在的負荷をかけ大見出しや小見出しなどもなく外在的負荷もかけ、目次や目的など書いてなく学習関連負荷（適切負荷）はかかっていない、というものです。

しかし、端的にわかりやすい言葉にすると、デザインは「形は機能に従う。」です。と説明ができますがこれではシンプルすぎて伝わっていません。複雑なものを複雑なまま紹介されひとつづつ理解することで適切負荷となり、複雑な物事がシンプルにできるようになると考えています。

デザインとはシンプルにするなんてことでと伝わってしまうと、
要るものと要らないものの区別なく、「デザインは引き算」なんて言葉でただ足せなかっただかのものがあることも事実。
スライドドアをスライドするように見えないシンプルなドアをデザインするかもしれません。

複雑なものをどうシンプルにするのか、ただただ断捨離をすることではなく形をつくることです。

なんて言い訳を少ししたところで、
人間の持っている機能、法則といえばいいでしょうか。
物事をどう見ているのか見えているのか。を知っていなければ、立派な概念（形は機能に従うやアフォーダンスとシグニファイア、ユニバーサルデザインの原則）などがデザインに反映されません。

人間にはゲシュタルトというものがあり、それにとらわれています。

ゲシュタルト（Gestalt）とは、
ドイツ語で「形態」「姿」「まとまり」を意味する言葉。

人間の脳には、「バラバラの部品（要素）ではなく、特定の意味を持ったグループ（まとまり）と無意識に捉える」知覚のシステムがあることが現在の心理学ではいわれています。

1910年あたりまでは、
心理学の主流は「要素主義（構成主義）」という考え方で「人間の意識は、細かい感覚の要素が1つずつレンガのように積み重なってできている」という理屈です。

これに対して、心理学者のマックス・ヴェルトハイマー（Max Wertheimer）さんやクルト・コフカ（Kurt Koffka）さんらは、「仮現運動（パラパラ漫画の原理）」を提示し真っ向から反論をします。

仮現運動とは、
静止している画像が連続して切り替わるときに、実際には動いていないにもかかわらず「動いているように見える」錯覚のことです。アニメーションがこの現象で動いて見えている。

この現象を、
要素主義では、「静止画A」を見て、次に「静止画B」を認識したから、脳が計算して動いていると推測する。との考え方です。

ゲシュタルト主義では、人間はAとBをバラバラに見ていない。最初から「動いている1つの現象（全体）」として直感的に知覚している。との考え方です。

つまり、AとBの部品（要素）が存在しているのではなく、「まず全体（ゲシュタルト）の印象が瞬時に脳へ飛び込んで、そのあとにAとBの部品（要素）が認識される」という考え方です。

1912年にこの理論が、
『運動視に関する実験的研究（Experimentelle Studien über das Sehen von Bewegung）』（マックス・ヴェルトハイマー）論文が発表され、1923年に『形態理論について（または ゲシュタルト理論へのアプローチ）
（Untersuchungen zur Lehre von der Gestalt II）』（通称ドットの論文）（マックス・ヴェルトハイマー）が発表されます。

人間には脳内で勝手に「グループ（ひとまとまりの塊）」として認識する習性があるわけです。
人間と書きましたが一部の動物にもそういう習性があることが確認されています。これは先天的なもので、赤ちゃんでも物事をそう捉えていることもわかっています。

つまり、ゲシュタルトの法則を認識し、デザインを行わなければドアを開けてもらえません。

この法則の基本は4つです。

・近接の法則（Proximity）
　距離が近いものがまとまって認識する。
・類同の法則（Similarity）
　色や形が同じものがまとまって認識する。
・閉合の法則（Closure）
　閉じた形になりそうな図形を見ると途切れている部分があっても、
　脳が勝手に線を補って「完全な形」とまとまって認識する。
・連続の法則（Continuity）
　点や線が直線的、あるいは滑らかな曲線でつながっている場合、
　それらをひとつの連続した流れとして認識する。

近接や類同、閉合に連続と堅苦しい言葉ですが、近くのものはグループで同じものはグループ。閉じそうなもの（カッコみたいな閉じてはいない）なんてものもグループで、連続的に流れのあるものもグループです。少し曲がりくねった路線図などの上に書かれている文字などを流れのように読めるのはこの法則があるからです。

その前に1つ重要な知覚が存在することがわかりました。

図と地の法則（Figure-Ground Organization）
人間は何かを見るときに「手前にある主役（図）」と「後ろにある背景（地）」を無意識に区別して認識する。
脳はすべての要素を同じ平面として捉えることができずに、必ずどちらかを主役、どちらかを背景として分離する。
図（Figure）は、視野の中で、くっきりと形を持って手前に浮かび上がって見える、関心の対象（主役）。
地（Ground）は、図の背後に広がり、特定の形を持たずに後ろに退いて見える空間（背景）。

この法則はゲシュタルト心理学派ではなくデンマークの心理学者エドガー・ルビン（Edgar Rubin）さんが1915年に、
『視覚的図形：心理学的研究 第1部』
（デンマーク語原題：Synsoplevede Figurer: Studier i psykologisk Analyse. Første Del.）で発表しました。

上途のような構造の説明されても、いまいちピンとこないかもしれません。

「ルビンの壺」といわれるとわかるでしょうか。

白黒の絵で、壺に見えたり二人の向かい合う横顔に見えたりする。有名な騙し絵です。

しかし、これは騙すために描かれたものではなく、
人間は何かを見るときに「主役（図）」と「背景（地）」を無意識に区別して認識することを証明するものです。

この論文の考え方は、ゲシュタルト心理学派に影響を与えたというか、大前提となります。人間はまず、図と地を分ける。そしてまとまりを見る。というのがゲシュタルトの法則になるわけです。

基本の4つの前の大前提です。

この「図（主役）」と「地（背景）」の関係性には5つの要素があります。

・小さいもの。
　広い空間の中にある小さな塊を、脳は物体（図）だと認識しやすい。
・囲まれているもの。
　周囲を完全に別の領域で囲まれている側を、脳は（図）だと捉えやすい。
・対称性があるもの。
　左右対称、または上下対称の美しい形をしている側を、
　脳は優先的に（図）にしやすい。
・水平・垂直なもの。
　斜めの要素よりも、水平・垂直にまっすぐ立っている要素のほうを、
　脳は安定した（図）とみなしやすい。
・下側にあるもの。
　視野の上側にあるものよりも、
　下側にあるものを地面の上に立つ物体として（図）に認識しやすい。

この大前提をもとにデザインを考えなくてはなりません。考えれば主役を主役としてまずは見てもらえます。

小さいもの。
背景は主人公のものとデザイン界では有名すぎる大前提です。

囲まれているもの。
同じような大きさのものが並ぶと囲まれたものが特別に見えてしまいます。文字の羅列でもラインや丸で囲むだけでその文字にまず目がいきませんか。

対称性があるもの。
シンメトリーは主人公です。背景もシンメトリーにしてしまうと脳は逆にパニックになりますから気をつけなければなりません。幾何学的にロゴマークを並べているデザインも主人公感が半端ありません。

水平・垂直なもの。
本などを読むときを思い浮かべてください。水平・垂直に並べられた文字たちが主役として君臨します。つまりは長い文章を読んで欲しい場合は水平・垂直に文字を並べましょう。

下側にあるもの。
この要素は極めて限定的な条件が必要なのでデザインでの応用は難しい。スマホのナビゲーションは下にあるとか広告のポスターやチラシなどのロゴや大切な情報は下部分に多いとかの説明がなされているものもありますが、それが図になっているわけではありません。つまりは主役として認識はされていません。どちらかといえば背景で地です。この要素は気にしなくても大丈夫かと思われます。

この大前提を理解し、ゲシュタルトの基本である4つの法則をわかっていると、デザインはそれなりに見えるようにはなります。きっと。

いや、まだ心配でしょうか。後々追加されたゲシュタルトの法則を加えてみますか。

・共通運命の法則（Law of Common Fate）
・共通領域の法則（Common region）
・接続性の法則（Element connectedness）
・対称性の法則（Law of Symmetry）
・過去の経験の法則（Law of Past Experience）
・同期の法則（Law of Synchrony）

などがあります。

しかし、長い文章がさらに長くなりそうなので、
またの機会に。

最後までお読みいただきありがとうございます。
ここまでお読みいただけたならば、20分程度の暇つぶしの役には立っているはずです。約30kcalも消費していますから、クッキーを1枚程度、この間に食べていなければダイエット効果もきっとあるはずです。

まとめ

「形は機能に従う（Form follows function）」

ユニバーサルデザインの7原則
「年齢や能力、状況に関わらず、できるだけ多くの人が同じように利用できるように設計せよ」
原則1　公平な利用（Equitable Use）
原則2　自由度の高さ（Flexibility in Use）
原則3　単純で直感的 (Simple and Intuitive Use）

原則4　明確な情報（Perceptible Information）

原則5　エラーへの寛容さ（Tolerance for Error）

原則6　少ない身体的負担（Low Physical Effort）

原則7　接近や利用のためのサイズと空間（Size and Space for Approach and Use）


アフォーダンス（Affordance）
物体と人間の間に「最初から存在している、行為の可能性」のこと。
シグニファイア（Signifier）
アフォーダンスがそこにあることを、人間に気づかせるための「視覚的な合図」のこと。

認知の負荷
課題内在的・課題外在的・学習関連（適切負荷）

ゲシュタルトの法則
・近接の法則（Proximity）
・類同の法則（Similarity）
・閉合の法則（Closure）


・連続の法則（Continuity）

図と地の法則（Figure-Ground Organization）

人間は何かを見るときに「手前にある主役（図）」と「後ろにある背景（地）」を無意識に区別して認識する。
・小さいもの。

・囲まれているもの。

・対称性があるもの。

・水平・垂直なもの。

・下側にあるもの。

参考
京都市ホームページ
https://www.city.kyoto.lg.jp/hokenfukushi/page/0000026494.html
草加市ホームページ
https://www.city.soka.saitama.jp/li/060/040/050/060/070/index.html
会津若松市ホームページ
https://www.city.aizuwakamatsu.fukushima.jp/docs/2008101400048/

こちらの記事も合わせてお読みいただけると嬉しいです。