【デザインの法則】Design rule index―デザイン、新・100の法則

「Design rule index―デザイン、新・100の法則 」を元に、要約メモしておきたいと思います。

01_80対20の法則

どんな大組織の中でも、全体の中の小さな部分が大きな影響をもつ。

02_アクセシビリティ

ものや環境は、変更を加えなくとも、できるだけ多くの人々が利用できるようデザインされているべきである。

03_先行オーガナイザー

既有知識に照らし合わせて、新しい知識を理解させる教授法。

04_美的・ユーザビリティ効果

デザインの美しいものは、デザインの美しくないものよりも使いやすいと認知される。

05_アフォーダンス

ものあるいは環境の物理的特徴がその機能に影響を与えるという属性。

06_アラインメント（配列）

共通の横の列や縦の行にそって端が並ぶように、あるいは共通の中心にそって真ん中が並ぶように、要素を配置すること。

07_元型

生来の心的傾向や気質に起因する、テーマや形態の普遍的なパターン。

08_魅力効果

魅力的でない人よりも、魅力的な人のほうが知的で、有能で、道義をわきまえ、社交的だと思う傾向。

09_ベビーフェース効果

ベビーフェースの人やもののほうが、大人顔の人やものよりも、無邪気で無力で正直だと考える傾向。

10_チャンキング

数多くの上方単位を連結させて、限定数のユニットあるいはかたまり（チャンク）にし、情報を処理しやすく、記憶しやすくする方法。

11_古典的条件付け

ある刺激を、無意識の肉体的あるいは精神的反応と結びつけるための手法。

12_閉合

個別の要素からなる一連の情報を、複数の個別の要素としてではなく、1個の認識可能なパターンとして知覚する傾向。

13_認知的不協和

態度、思考、信念において一貫性を求める傾向。

14_色彩

デザインにおいて色彩は、注意をひき、要素をグループ分けし、意味を表示し、美しさを高めるために用いられる。

15_共通運命

同じ方向に動いている複数の要素は、異なる方向に動いている要素や静止している要素同士よりも、互いに関連していると知覚される。

16_比較

2つかそれ以上のシステムの変数を、制御された方法で表示することにより、システム内の行為の関係やパターンを説明する方法。

17_確認

行為がなされる前に、行為の確認を要求することによって、意図しない行為がなされるのを防ぐ方法。

18_一貫性

同じ部分が同じ方法で表現される時、システムの有用性（ユーザビリティ）は向上する。

19_不変性

感覚器官の刺激を通じてもたらされた情報が変化しているにも関わらず、対象物を不変であると知覚する傾向。

20_制約

システムにおいて実行されうる行為を制御する方法。

21_制御

システムが提供する制御レベルは、システムを利用する人と技能と経験のレベルに関連付けられるべきである。

22_コンバージェンス（収斂）

複数のシステム内で、同じような特徴が個々に生成されていくプロセス。

23_費用便益分析

ある行為のもたらす便益が費用と同額か、費用を上回る場合にのみ、その行為は推進されるだろう。

24_守ることのできる空間

テリトリーを示す標識、監視の目、活動と所有権の明確な表示をもつスペース。

25_処理の深度

深く分析された情報のほうが、表面的に分析された情報よりも思い出しやすい、という記憶の現象。

26_開発サイクル

成功した製品は、概して創造の4段階——要請、デザイン、開発、テスト——を経ている。

27_エントリーポイント

デザインへの物理的入り口、もしくは注意をひく点。

28_エラー

意図しない結果をもたらす行為、あるいは行為の脱落。

29_期待効果

個人的に期待した結果、もしくは他人から期待された結果、認識や行動に変化が生じる現象。

30_露出効果

好きでも嫌いでもない対象の刺激を繰り返し受けると、その対象の好ましさは増す。

31_フェース率

人物画像における顔と体の比は、その人物の認識のされ方に影響する。

32_安全率

未知の変数の影響を相殺し、システムの故障を予防するために、必要と思われる以上の要素を使用すること。

33_フィードバック・ループ

ある事象の結果がインプットとしてシステムに還元され、将来的に事象を変化させるようなシステム内の変数間の関係。

34_フィボナッチの数列

各項が先行する2項の和となっている数列。

35_図と地の関係

要素は図（焦点を合わせる対象）あるいは地（その他の知覚域）のいずれかとして知覚される。

36_フィッツの法則

目標にたどり着くまでの時間は、目標の大きさと、目標までの距離によって決まる。

37_5つの帽子掛け

情報を組織化するには、カテゴリー、時間、位置、アルファベット、連続量をそれぞれ基準とする5つの方法がある。

38_フレキシビリティとユーザビリティの二律背反性

システムのフレキシビリティが向上するにつれ、システムユーザビリティは低下する。

39_寛容性

エラーを防止するよう、そして万一エラーが起こった場合には、エラーのネガティブな影響を最小限に抑えるよう、デザインされなければならない。

40_形態は機能に従う

デザインの美しさは、機能の純粋さに起因する。

41_フレーミング

情報の提示の仕方を操作することによって、意志決定や判断に影響を及ぼす手法。

42_ごみ入れごみ出し

システムのアウトプットの質は、システムのインプットの質によって決まる。

43_黄金比

約0.618の値をとる、高さと幅など、形態の要素間の比率。

44_よい連続

直線や滑らかな曲線に配置された要素は、まとまりとして知覚され、直線や曲線状に配されない要素よりも、要素間に関連性があると解釈される。

45_グーデンベルク・ダイヤグラム

均一に配置された同質の情報を見る時の、視線の流れの一般的なパターンを表した図式。

46_ヒックの法則

決断に要する時間は、選択肢が増えるほど長くなる。

47_階層

階層構造は、複雑なものを視覚化し理解するための最も簡潔な構造。

48_欲求階層説

デザインを成功させるためには、高次の欲求を満たそうとする前に、人々の基本的な欲求を満たさなければならない。

49_強調

本文や画像の一部分に注意を向けさせるための手法。

50_アイコン

標識や制御装置に対する認識と想起力を向上させるために画像を用いること。

51_没頭

極度の精神集中によって「現実」世界に対する意識が失われ、一般に歓喜や満足感がもたらされる精神の状態。

52_干渉効果

精神作用が、それと競合する他の精神作用の影響を受けて、遅くなったり不正確になったりする現象。

53_逆ピラミッド

重要性の高いものから低いものの順に表示する、情報提示の方法。

54_反復

特定の結果が得られるまで、一連の作業を繰り返すプロセス。

55_プレグナンツの法則

あいまいなイメージで、複雑でまとまりのない形ではなく、単純でまとまりのある形で解釈する傾向。

56_階層化

複雑な情報を扱いやすくし、その情報の中にある関係を明示するために、情報の内容を関係に応じてグループ分けすること。

57_見やすさ

使用する文字のサイズ、書体、コントラスト、文章表示法、行間などによって主に決まる、テキストの視覚的明瞭性。

58_ライフサイクル

全ての製品は、導入期、成長期、円熟期、衰退期の、4つの段階を経過する。

59_マッピング

コントロールと、それによる動きや効果の関係のこと。コントロールとその効果のマッピングがよいシステムは使いやすい。

60_メンタルモデル

人間は、経験によって培われた心的表象を元にして、システムや環境を理解したり、それに対処したりする。

61_擬態

なじみのある物体、生物、環境などの特徴をまねて、その特性がもたらす特定の効果を表現しようとすること。

62_記憶の補助手段

覚えやすいように、情報を再編成すること。

63_モジュール方式

大きなシステムを多数の独立した小さなシステムに分割することによって、複雑さに対処する方法。

64_もっとも平均的な顔の効果

目、鼻、唇、その他の特徴が集団の平均に近い顔が好まれる傾向のこと。

65_正規分布

ひとまとまりのデータが、グラフ上で対称的な釣鐘型の曲線をなす場合、そのデータは正規分布であるという。

66_オッカムの剃刀

機能的に同等なデザインの中では、もっとも単純なデザインを選ぶべきであるという原則。

67_オペランド条件付け

望ましい行動を強化し、望ましくない行動を無視または罰することによって、行動を修正する技法。

68_方向感受性

特定の方向の直線が、他の方向の直線よりも素早く簡単に処理され区別されるという、視覚処理の現象。

69_遂行の負担

仕事を成し遂げるのに必要な労力が大きいほど、その仕事をうまく成し遂げられる可能性は低い。

70_性能 VS 好み

人々が最適条件で仕事をするのを助けるデザインが、人々が最も好ましいと感じるデザインと一致しないことが多い。

71_画像の優位性

言葉よりも画像のほうがよく記憶に残る。

72_段階的開示

任意の時点において、必要な情報または要求された情報のみを表示することにより、情報の複雑さに対処する方法。

73_展望と退避

遮られない視界（展望）と、隠れたり難を逃れたりする場所（退避）を併せ持つ環境が好まれる。

74_プロトタイピング

あるデザインを単純化したモデル、あるいは部分的なモデルを使って、アイデアの研究、必要事項の練り上げ、スペックの改良、機能性のテストを行うこと。

75_近接効果

近くにある要素同士では、離れている要素同士よりも、より関係が深いと認識される。

76_読みやすさ

散文が、その単語や文の複雑さに応じて理解される程度。

77_再生記憶より再認記憶

提示されたものを認識することによって思い出すほうが、頭の中の記憶を直接再生するよりも容易である。

78_冗長性

1つまたは複数の機能不全に備えて、システムの性能を維持するために必要以上の要素を使用すること。

79_3分の1の法則

構図を決める際に、画面の上下左右を3等分して、デザインの重要な要素を美しく配置する手法。

80_そこそこ満足のゆく解決策

最善の解決策を追求するよりも、そこそこ満足のゆく解決策を受け入れるほうがよいことが多い。

81_サバンナの優位性

サバンナに似た環境が、その他の環境よりも好まれる傾向。

82_スケーリングの誤解

ある規模において機能するシステムは、拡大または縮小した規模においても同様に機能すると思い込む傾向のこと。

83_自己相似性

ある形状の部分部分が全体の形状と相似であるか、もしくは部分同士が相似であるという特性。

84_系列位置効果

一連の項目の中で、最初に提示されたものと最後に提示されたものが、間で提示されたものよりも再生されやすいという記憶の現象。

85_反応形成

目標とする行動の近似行動を強化し、その近似行動を次第に目標の行動に近づけることによって、目標の行動を習得させる手法。

86_SN比

ディスプレイ上の、意味のある情報と無意味な情報の比。デザインでは、SN比ができるかぎり高いことが望ましい。

87_類似性

類似性のある要素同士は、類似性のない要素同士よりも、関係が深いと認識される。

88_ストーリーテリング

語り手と聞き手の交流を通して、出来事のイメージ、感動、理解を生み出す手法。

89_構造型

荷重を支えるため、または何かを入れて保護するための部材の組み立て型には、マス構造、フレーム構造、貝殻構造の3つがある。

90_対称性

ある形状内の要素間に視覚的な同等性があること。

91_脅威の検出

脅威を示す刺激は、そうでない刺激よりも効率よく検出される。

92_三次元感覚

ある種の視覚的な特徴を備えた対象やパターンを、三次元で見る傾向。

93_上方照明の先入観

物体の暗い部分を、その物体の上方から照明によって生じた影であると解釈する傾向。

94_不確定性原理

システムにおいて、特定の不安定な変数を測定することによって変数自体が変化し、測定の精度が損なわれる場合があるという原理。

95_一定結合性

一定の視覚的要素（色など）によって結合された要素同士は、結合されていない要素同士よりも関係が深いと認識される。

96_わかりやすさ

システムの現状と使用方法がはっきりわかれば、システムの使いやすさ（ユーザビリティ）が向上する。

97_レストルフ現象

ありきたりのものよりも、見るからに変わったものの方が再生されやすいという記憶の現象。

98_ウエスト比・ヒップ比

ヒップに対するウエストの比率が特定の数値である男女が好まれる。

99_経路検索

空間的および環境的情報を使用して、目的地に進むプロセス。

100_もっとも脆弱な要素（ウィーケストリンク）

システム内の他の要素を破損から保護するために、弱い部分を犠牲にすること。

【デザインの法則】わかりやすさ

家にパソコンがあったので、インターネットを買ってきました。なんとかつながって、facebook とか mixi とかに登録してみたり、某掲示板をのぞいていたりします。とっても楽しいインターネッツライフです！

みたいな人もいるけれど、

インターネット歴３年だけど、会員登録とかなんかそいうのがさっぱり分かりません。何もしてないのにパソコンが壊れてしまいました！

みたいな人もいたり、さまざまです。

一般的なインターネットユーザーに、
「CMSでコミュニティサイトを構築しました。ぜひこのサービスを使ってほしいので会員登録をしてくださいね」
とただ伝えたところで、会員登録〜サービスを利用するまでには膨大な落とし穴があったりします。

誰もがメモリとハードディスクの違いを理解していると思ったら大間違いなのです。というわけで、
20代前後くらいの、普段から当たり前のようにネットやってるわけじゃなくて時々調べ事に使う程度というユーザの動きです。

• ロゴクリック＝トップページに戻るという認識は殆ど無い。
• トップページに戻る場合は、ブラウザの「戻る」ボタン。
• サイドバーのバナーは、認知すらされない傾向が強い。
• そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。
• リストのマークとかのマーク部分をクリックしよーとする人が居る。
• それにより、クリックできないと諦めるケースも。
• プルダウン（ドロップダウン）型メニューは、近くのボタンを押せない状況を作り出す。
• それにより、押すのを諦める可能性。
• プルダウン（ドロップダウン）型メニューがあるとソコから全てのページに移動できると思われる。
• でも、プルダウン（ドロップダウン）型メニューが「使いにくい」というストレスにはあんまり繋がっていない印象。
• 全角・半角の違いはわからない。
• 複数の入力エリアはマウスで移動。
• 便利だと思ってつけているはずのリンクが意図しないページへの誘導になってしまう可能性。
• 「ページトップ」がサイトのトップページへのリンクだと思ってクリックする可能性。
• タイトルに張っているリンクは押されない傾向。
• 迷うとフッターにあるリンクは意外と使われる。
• 押せるのか確認するためにマウスカーソルを動かす可能性は低い
• 矢印ってのは、リンクだと認識しやすいらしい。（→とかっての）
• パンくずリストはあんまり使われない。

»ユーザーの動き。｜CSS HappyLife

パソコンの調子が悪くなったときには、そういうのに詳しい人に聞くことになると思うのですが、
「何がしたくて、何をどうした結果、どうなった」というのをちゃんと伝えると、適切な答えが返ってくるかもです。

「Excel の書類をプリントアウトしたくて、プリントボタンを押したけど、いつものような印刷画面が表示されなかった」
ということが分かれば、ひょっとしてプリンタドライバが壊れているのかも知れないので、ドライバを再インストールすると直るかも？とか。

わかりやすさ、というお話でした。

外部リンク

• »Re:ユーザーの動き。｜CSS HappyLife

【デザインの法則】図と地の関係（と無印）

1. 図は明確な形を持つが、地にははっきりした形がない。
2. 地は図の後ろにも続いている。
3. 図は空間内で明確な場所を占め、より近く見えるが、地は空間内で明確な場所を占めず、遠く離れて見える。
4. 水平線より下にある要素のほうが図と知覚されやすく、水平線より上にある要素のほうが地と知覚されやすい。
5. デザインの下部にある要素のほうが図と知覚されやすく、上部にある要素のほうが地と知覚されやすい。

図は見せたいもの、地は主張してほしくないものです。キャラクター（図）と背景（地）といったところでしょうか。

無印が好きです。
無印はOEMを扱ったプライベートブランドなので、「大塚食品のボンカレー」のようなナショナルブランドとは違います。無印の商品を実際に生産しているのは、大塚食品のような大手メーカーなので、無印というのは「フィルター」のようなものだと僕は考えています。

無印というフィルターが好きです。
「無印がいい」「無印でいい」その両方へのアプローチに成功していると、アドバイザリーボードの原研哉さんは述べています。

無印の製品はすごく無口です。洗濯機はただ洗濯をするし、冷蔵庫はただ冷蔵を行っています。
洗濯機は壁に吸い込まれるようだし、冷蔵庫は寒い北極まで吸い込まれ、まるでそこにいないように「そこにいる」。そして女と寝る。
完璧な冷蔵庫などといったものは存在しない。完璧な絶望が存在しないようにね。
放って置いても人は死ぬし、女と寝る。そういうものだ。

村上春樹っぽい雰囲気でしめてみました。
村上春樹風に語るスレジェネレーターは、下の外部リンクからどうぞ。

外部リンク

• »村上春樹風に語るスレジェネレーター
• »良品計画 – Wikipedia

【デザインの法則】認知的不協和

6ポケットとは、子供ひとりに対してスポンサー（財布）が6人いることをいいます。両親と、それぞれの祖父母を足して6人です。
それが晩婚/非婚化の影響によって、それぞれの叔父叔母を含めた10ポケットに広がってきているとか。

キッズビジネスは12兆円規模ですってよ奥さん！

子供向けの雑誌にゲームソフトのオリジナルケースが付いていたり（中身は買って下さいと）、ゲームソフトの体験版が付いていたり（まあ、買って下さいと）、1oポケットの皆さま大変ですね〜と人ごとのように言いながら、甥っ子をふたり抱えている大森です。

子供向けを大人向けに置き換えたものがあります。脳トレとか大人の塗り絵、大人の科学.netとか、大人のおもちゃとか。
その逆で、大人向けを子供向けにというのもまあすでにありますが、キッズケータイとか名刺とか。掘り下げていけば何か面白いアイデアが出そうな予感です。甥っ子をふたり抱えている大森でした。

あ、そうそう。認知的不協和とは、無料配布される体験版のソフトのように、試用期間が切れたときに発動する不協和のことを言います。いままであったものがいきなりなくなってしまうと不便です。
スイート・テン・ダイヤモンドなんかも「愛情を示すためには贈らなければいけない」と言われて、なんだか贈らないとダメなのかな？とか贈られなかったから愛情がないのかしら？という不協和が生じます。

多くのエステが無料体験を行えるのは、認知的不協和を生じさせることができるから（もしくは、すでに生じているから）というのもありますよね。

というわけで、えっと…
甥っ子をふたり抱えている大森でした。

【デザインの法則】エラー

必要な時にのみ、そこにあればいいと思うのです。

以前使っていたケータイですが、SDカードを入れると画面の一番上、電波や電池残量などが並ぶところに「SD」というアイコンが表示されます。私見ですが、僕はSDカードをずっと入れっぱなしにして使っていたので、むしろSDカードが入っていないとき（入れ忘れたとき）に「入っていませんよ」という意味で表示して欲しかったのです。
毎日毎日「今日もちゃんと入ってます！」とかっこ悪いアイコンで表示されても気分が悪いのです。

正常なときに緑ランプが付いていて、異常が起こったときに赤ランプが付く

というのは、正常に作動していることを伝えることがそれほど重要ではない場合には、

正常なときにランプが消えていて、異常が起こったときに赤ランプが付く

ということもできるはずで、少なくとも僕が使っているいくつかの機器はそうなっています。例えば配信型の天気予報ですが、雨が降るときや台風が来るときにだけ情報が届けばいいという人もいるのです。「明日も夏なので暑いのです！」という情報は必要なくて「明日はめずらしく雨なのです」という情報だけが欲しいのです。

あらかじめ設定した条件を満たす場合だけに届く配信型の情報サービス（天気予報とか）があると、使ってくれるユーザーもいるよなと思うのでした。

外部リンク

• »ゲリラ雷雨防衛隊員出動！局地的豪雨をメールで予報します – ニュース – nikkei BPnet

【デザインの法則】干渉効果

赤信号にGO、青信号にSTOP。
赤色でGREEN、緑色でRED。

色と文字など、ふたつの情報がお互いに干渉していることを言います。

で、これをどうやって日常に取り入れていくかというと「ずらし」とか「すかし」といったものに応用します。

»CUNE
このアパレルメーカーは、なかなか困ったちゃんで大好きなのですが、どの辺が困ったちゃんかというと、商品カタログをみてもらえれば分かりますがウサギのようなキャラクターが、かわいい顔のまま「ブッコロス」と言っていたり（友達が着てた）、買わなくていいですとか言ってみたりする、干渉アパレルメーカーです。

»ピエロになって、なにもしない…
これはもう干渉効果のお手本のようなものです。「すかし」です。