デザインを科学する

脳科学が証明する「美しい」デザインの正体:なぜ我々はiPhoneの角丸に惹かれるのか

序論:0.05秒で決まる「恋」と「恐怖」の神経メカニズム

現代社会において、我々の視覚は四角いフレームに支配されていると言っても過言ではない。朝起きて最初に目にするスマートフォンの画面、仕事で向き合うラップトップ、帰宅後に眺めるテレビ。しかし、その「四角」の細部を顕微鏡的な視座で観察したとき、そこには純粋な直角は驚くほど少ないことに気づく。AppleのiPhone、Googleの検索バー、Instagramのアイコン、そして無意識にクリックしてしまう「購入する」ボタン。これらはすべて、角が丸められているか、あるいは数学的に極めて高度な計算に基づく有機的な曲線を描いている。なぜ、テクノロジーの最先端を行く企業たちは、この「角の処理」という微細なディテールに莫大なリソースを投じるのだろうか。

その答えは、我々の意識が追いつかないほどの超高速な神経処理の領域に隠されている。カールトン大学のGitte Lindgaardらによる画期的な研究は、人間がウェブサイトや視覚的対象に対する美的判断(好きか嫌いか、美しいか否か)を下すのに要する時間が、わずか50ミリ秒(0.05秒)であることを明らかにした 1。瞬きをする時間(約100〜150ミリ秒)の半分にも満たないこの刹那に、脳はすでに対象の評価を終えているのである。この事実は、我々の「美」に対する判断が、論理的思考や経験に基づくトップダウン処理ではなく、生物学的・本能的な情動反応であるボトムアップ処理によって支配されていることを強く示唆している 4

本レポートは、神経美学(Neuroaesthetics)、認知心理学、進化学、そして計算幾何学の多角的な視点から、この「美しさ」の正体を解剖するものである。なぜ我々の脳は鋭利な角を拒絶し、滑らかな曲線を渇望するのか。その背景には、太古のサバンナで捕食者から身を守っていた記憶から、脳のエネルギー消費(代謝コスト)を最小限に抑えようとする生体恒常性の維持メカニズム、そして空間コンピューティング時代における眼球運動の物理法則に至るまで、壮大かつ精緻な科学的ロジックが存在する。


第1章:脳の脅威検知システムと「角」の記号論

1.1 扁桃体の警報:Bar & Netaによる神経美学の転換点

「なぜ人間は丸いものを好むのか」という問いに対し、神経科学の分野から最も説得力のある回答を提示したのは、ハーバード大学医学大学院のMoshe BarとMaital Netaによる一連の研究である。彼らの研究は、それまでの美学研究が主観的な「好み」の調査に留まっていたのに対し、fMRI(機能的磁気共鳴画像法)を用いて脳の直接的な反応を可視化した点で革命的であった 5

実験プロトコルの詳細と生理学的反応

2006年と2007年に行われた彼らの実験では、厳密に制御された視覚刺激が使用された。被験者には、日常的な物体(ソファ、時計、鏡など)や抽象的な幾何学図形の画像が提示された。重要なのは、それぞれの物体について「鋭角的な輪郭を持つバージョン(Sharp-angled)」と「曲線的な輪郭を持つバージョン(Curved)」のペアが用意された点である。例えば、鋭い角を持つ四角い時計と、丸みを帯びた楕円形の時計が比較された 6

画像はわずか84ミリ秒という、意識的な認知がギリギリ可能な極短時間だけ提示された。その結果、被験者は一貫して「曲線的な物体」に対して有意に高い好意(Preference)を示した。さらに、fMRIによる脳活動の解析において、鋭角的な物体を見た瞬間に、被験者の扁桃体(Amygdala)が両側性に強く活性化することが確認された 5

刺激の種類活性化する脳領域生理学的意味心理的反応
鋭角的な形状扁桃体 (Amygdala)潜在的な脅威の検知、覚醒レベルの上昇警戒、緊張、回避衝動
曲線的な形状前頭眼窩野 (OFC) など報酬系の活性化、安全信号の処理安らぎ、接近衝動、好意

8

脅威としての「鋭角」

扁桃体は、脳の側頭葉内側に位置し、恐怖条件付けや「闘争・逃走反応(Fight or Flight response)」のトリガーとなる原始的な領域である。BarとNetaの発見は、視覚野に入力された「鋭い角」という情報が、高次視覚野で物体として認識されるよりも早く、あるいは並行して、扁桃体へと送られ「危険信号」として処理されていることを示唆している 8

進化心理学の観点から見れば、この反応は極めて合理的である。自然界において、鋭利な形状は常に生命への脅威と結びついていた。

  • 捕食者の牙や爪:ライオンの牙や鷲の爪は、鋭い曲線と尖った先端を持つ。
  • 環境的な危険:植物の棘(トゲ)、割れた岩の断面、折れた骨。
  • 武器:人類が作り出した最初の道具である石器や槍もまた、鋭角を特徴とする。

我々の祖先にとって、視野の隅に映る鋭い形状に対して瞬時に身構えることは、生存確率を高めるために不可欠な適応であった。逆に、曲線的な形状は、熟した果実、豊かな水源、肉体の丸み、あるいは安全な地形(なだらかな丘陵)など、ポジティブあるいは中立的な対象に関連付けられることが多い 5

現代人がiPhoneの角丸や、角の取れた家具に囲まれて安らぎを感じるのは、この原始的な「脅威検知システム」が沈静化され、脳が「ここは安全である(Safety Signal)」という信号を受け取っているためと考えられる。鋭い角がない環境は、扁桃体を鎮め、リラックスした状態を誘発する「神経学的なシェルター」として機能しているのである。

1.2 文脈による「恐怖」の上書き:Lederらの対照実験

しかし、この「曲線=善、鋭角=悪」という図式は絶対的なものではない。ウィーン大学のHelmut Lederら(2011)は、BarとNetaの研究をさらに発展させ、物体の「意味(Semantic Meaning)」が形状の好みに与える影響を調査した 5

彼らは、元々ネガティブな意味を持つ物体(例:爆弾、ナイフ、怒った顔など)と、ポジティブな意味を持つ物体(例:ケーキ、ぬいぐるみ、笑顔)を用意し、それぞれに「丸いバージョン」と「尖ったバージョン」を作成した。実験の結果、ポジティブまたは中立的な物体においては、これまでの研究通り曲線的な形状が好まれた。しかし、ネガティブな物体においては、形状による好みの差が消失したのである。

これは、対象物が明らかに危険である(例:爆弾)と脳が認識した場合、その輪郭が丸かろうが尖っていようが、「脅威」としての評価(Negative Valence)が支配的になり、形状由来の微細な感情(Affect)が上書きされることを示している 5。つまり、iPhoneのデザインが美しいと感じられるのは、それが前提として「好ましい、あるいは中立的なオブジェクト」であるからこそ、角丸の効果が最大限に発揮されていると言える。

1.3 視野の端における進化論的適応

もう一つの重要な視点は、人間の視野構造と捕食者検知の関係である。Liuら(2021)の研究によれば、視覚系は「中心視野」と「周辺視野」で異なる役割分担を持っている。かつて被食者(Prey)の側面を持っていた人類にとって、周辺視野(Corner of the eye)における鋭い動きや形状の変化は、捕食者の接近を知らせる警報装置であった 12

現代のUIデザインにおいて、画面の四隅(周辺視野にあたる部分)が鋭角であると、ユーザーの潜在意識は無意識のうちにその「尖り」に注意を奪われ続けることになる。これは「ボトムアップ性注意(Bottom-up Attention)」と呼ばれ、ユーザーが意図しない形でリソースを消費させる。角を丸めることは、この周辺警戒システムを解除し、ユーザーの視線を自然にコンテンツの内側(中心視野)へと誘導する効果を持つ。AppleのHIG(Human Interface Guidelines)が角丸を推奨する背景には、この「視線の求心性」を高めるという機能的な意図も含まれているのである 13


第2章:脳のエネルギー経済学と処理流暢性

「恐怖反応の欠如」だけが、曲線が好まれる理由のすべてではない。もう一つの、より現代的かつ普遍的な要因は、「脳がいかに楽をして情報を処理できるか」という処理流暢性(Processing Fluency)の理論にある。これは、神経経済学的な視点から「美」を再定義する試みである。

2.1 視覚野の代謝コストと「美」の相関

Reberら(2004)が提唱した処理流暢性理論によれば、人間は「処理が容易な刺激」に対してポジティブな感情(美的快感)を抱く傾向がある 5。これは、脳が体重のわずか2%程度の重量しかないにもかかわらず、身体全体のエネルギーの約20%を消費するという事実と深く関係している。脳は常に「省エネ」を求めており、情報の処理コストを最小限に抑えるための適応的なヒューリスティックとして「美」を感じるように進化した可能性がある 15

鋭角の処理コスト:高エネルギー状態

鋭い角(コーナー)は、視覚情報処理において「不連続点」を意味する。数学的にも、直線が急激に方向を変える特異点である。網膜から送られた信号が一次視覚野(V1)に到達すると、エッジ検出細胞(Edge Detectors)が発火する。鋭角の場合、複数の方向性を持つエッジ検出細胞が同時に、かつ強く活動する必要がある。

Barrow Neurological Instituteの研究(2019)では、コーナーの角度と神経活動の関係を定量化している。その結果、コーナーの角度が鋭角であればあるほど、視覚システムにおける神経細胞のスパイク発火数(Neural Spikes)が増加することが明らかになった 16。これは、鋭い角を見ることは、脳にとって文字通り「まぶしい」「うるさい」高エネルギー消費のタスクであることを意味する。また、鋭角は「サリエンス(顕著性)」が高く、コントラストが強調されて知覚される錯視(マッハバンド効果の変種など)を引き起こしやすく、これも処理負荷を増大させる要因となる 17

曲線の処理コスト:低エネルギー状態

一方、曲線や円形は、網膜上の受容野の構造や眼球運動の特性と親和性が高い。

  • 中心窩(Fovea)の特性: 中心の高解像度領域である中心窩は、円形や曲線の処理に最適化されているという説がある 18
  • 眼球運動の慣性: 視線の移動(サッカード)は、物理的な質量を持つ眼球を筋肉で動かす運動であるため、慣性の法則に従う。鋭角的な軌道修正(急停止と急発進)は筋肉への負荷が高いが、曲線的な軌道は滑らかでエネルギー効率が良い。Stratton(1902)の時代から、眼球運動の滑らかさが美的快感に繋がるという仮説が存在しており、現代のアイトラッキング研究もこれを支持する傾向にある 5

つまり、人間がiPhoneの角丸を見て「美しい」と感じるとき、脳内では「この形状は低コストで処理できる」という代謝レベルの報酬信号が発生しており、それが「快感」として解釈されているのである 15

2.2 認知負荷と情報の圧縮

情報理論の観点からも、角丸は優れている。鋭角な長方形が並ぶグリッドレイアウト(例えばExcelの表)は、すべての交点が強い視覚的ノイズとなり、情報の優先順位がつけにくくなる。これを認知的過負荷(Cognitive Overload)と呼ぶ。

角丸を適用したカード型UI(Bento Gridsなど)は、要素間の境界を柔らかく区切ることで、視覚的な摩擦を減らす。角が丸いことで、コンテンツ(内側)と余白(外側)の区別が直感的に処理されやすくなり、ユーザーはコンテンツの内容そのものにリソースを集中できる 14。これは「情報のチャンク化(塊としての認識)」を促進し、短期記憶への負担を軽減する効果もある。


第3章:幾何学の魔術:円、長方形、そして「スクワークル」

Apple製品の「角丸」が、他社の製品や単なるCSSのborder-radiusで描かれた角丸と決定的に異なり、より洗練されて見えるのには、厳密な数学的理由がある。多くの人々、そして一部のデザイナーさえもが、角丸を「長方形の角に正円の1/4(円弧)を接続したもの」と認識している。しかし、Appleや高度なインダストリアルデザインの世界では、これは「不完全な角丸」とされる。彼らが追求しているのは、スクワークル(Squircle)あるいはスーパー楕円(Superellipse)と呼ばれる形状、そして曲率連続性(Curvature Continuity)という概念である。

3.1 「正円の角丸」の欠点:接線接続(Tangency)の限界

一般的なCADソフトや、ウェブデザインの標準的なコードで描かれる角丸長方形は、直線部分とコーナーの円弧部分が「接線連続(G1連続)」という状態で繋がっている。

  • 直線部分: 曲率は「0」(完全にまっすぐ)。
  • コーナー部分: 曲率は一定の値「1/R」(Rは半径)。
  • 接続点(接点): この点において、曲率が「0」からいきなり「1/R」へと不連続にジャンプする。

数学的には線は繋がっており、接線の傾きも一致しているため、カクカクしてはいない。しかし、曲率の変化率(加速度)のグラフを見ると、接続点で垂直な「崖」ができる 21。人間の視覚系、特にV4野などの高次視覚野にある曲率検出細胞は、この曲率の急激な変化を極めて敏感に察知する能力を持っている 22

その結果、現実世界の物体(例えば製品の筐体)においてG1連続の角丸を採用すると、表面に当たる光の反射(ハイライト)が接続部分で不自然に折れ曲がったり、目に見えないはずの「境界線」が浮き出て見えたりする。デザイナーはこれを「接線(Tangency)のぎこちなさ」や「硬さ」として知覚する 23

3.2 スクワークルとスーパー楕円の方程式

この視覚的な不協和音を解消するために登場するのが「スクワークル」である。スクワークルは、正方形と円の中間にある形状であり、以下のスーパー楕円(Superellipse)の方程式で表される 21

    \[|x|^n + |y|^n = r^n\]

ここで、n=2 のときは通常の「円」になり、n が無限大に近づくと「正方形」になる。Appleのアプリアイコン(iOS 7以降)やiPhoneのハードウェアデザインで採用されている形状は、この n が4から5の間(あるいはそれらをベースにさらに微調整されたスプライン曲線)に近いと言われている 21

スクワークルの最大の特徴は、直線から曲線へと移行する際に、曲率が「0」から「いきなり」変化するのではなく、「0」から徐々に、滑らかに加速しながら増加していく点にある。

3.3 曲率連続性(Curvature Continuity)の階層:G0からG3へ

インダストリアルデザイン、特に自動車産業(Class-Aサーフェス)やAppleのデザイン哲学において、この滑らかさは「G」という単位で分類・管理されている 25

連続性レベル名称説明視覚的特徴・光の反射
G0位置連続 (Position)線や面が単に接触している状態。明確な「角(カド)」がある。
G1接線連続 (Tangent)接線の傾きが一致している。一般的なフィレット。接続点で曲率が急変する。ハイライトの線が接続点で「折れる」。
G2曲率連続 (Curvature)曲率(半径の逆数)が一致している。Apple製品や高級車のボディ。ハイライトが滑らかに繋がる。
G3曲率変化率連続曲率の変化率(加加速度)まで滑らか。究極の滑らかさ。液体のような有機的な質感。

Appleの「角丸」は、単なる円弧ではなく、このG2(曲率連続)あるいはさらに高次なG3連続を満たすように設計されている。これにより、iPhoneの筐体に当たる光は、角で途切れることなく、まるで液体の表面を滑るかのように流麗に反射する。これが、ユーザーに「プレミアム感」や「有機的な生命感」を無意識下に植え付ける物理的な正体の一つである 24

3.4 錯視の補正:骨効果と光学的な膨らみ

なぜそこまで数学的にこだわる必要があるのか? それは人間の視覚が引き起こす錯視を補正するためでもある。

骨効果(Bone Effect)

直線と半円を単純に繋げたカプセル型やボタン形状において、接続部分が実際よりも外側に膨らんで見えたり、逆に直線部分が内側に反って(凹んで)見えたりする現象が発生する。接続部分の視覚的質量が過剰に知覚されるため、あたかも骨の関節(Bone)のように見えることからこう呼ばれる 31

光学的な膨らみ(Optical Bulge)

同心円状に角丸長方形を配置した場合(例えばボタンの中に枠線がある場合や、ベゼルと画面の関係)、内側の角丸と外側の角丸の半径が単純な等差関係にあると、内側の長方形が歪んで見えることがある 24

スクワークルや曲率連続のデザインは、この錯視を回避し、人間の目にとって「自然で歪みのない長方形」に見えるように、あらかじめ微細な補正を加えた形状なのである。つまり、Appleの角丸は「幾何学的に正しい形(正円)」を捨て、「人間の知覚的に正しい形」を採用するという、極めて人間中心的なエンジニアリングの結晶と言える。


第4章:行動経済学とUI:クリック率を変える「形」の力

ハードウェアの形状だけでなく、ソフトウェアのインターフェース(UI)においても、角丸はユーザーの行動を支配する決定的な要因となっている。ここでは、ボタンやカード型UIにおける角丸の効果を、具体的な定量データと行動経済学の観点から分析する。

4.1 クリック率(CTR)への劇的な影響:Biswasらの研究

マーケティングとUIデザインの研究において、角丸のボタン(Rounded Buttons)が鋭角なボタン(Sharp Buttons)よりも高いパフォーマンスを発揮することは、統計的に有意なデータによって裏付けられている。

南フロリダ大学のDipayan Biswas、Annika Abell、Roger Chackoらによる包括的な研究(2023年 Journal of Consumer Research 掲載)は、このテーマにおける記念碑的な成果である。彼らは実験室実験、フィールド実験、アイトラッキングを含む一連の調査を行い、角丸のCTA(Call to Action)ボタンが、鋭角なボタンと比較してクリック率(CTR)を17%〜55%も向上させるという衝撃的な結果を報告した 34

以下は、彼らの研究で確認された具体的なシナリオ別の成果である。

シナリオ改善率・結果詳細
レストランのオンライン広告CTR +24.6%
注文数 +16.8%
角丸ボタンを使用した広告は、鋭角ボタンの広告に比べて有意に高いエンゲージメントを獲得し、実際の売上増にも直結した。
イベント計画ツールLPCTR +55.5%ランディングページ(LP)における「登録ボタン」を角丸にしただけで、コンバージョンが劇的に改善した。
スマホアクセサリECサイトカート追加数 +25.7%商品購入時の「カートに入れる」ボタンを角丸にすることで、購入意欲(アプローチ動機)が高まった。
実験室での調査クリック意向 +46%学生を対象とした調査で、追加アンケートに回答するボタンを押す確率が、角丸の場合に大幅に上昇した。

4.2 視線追跡(アイトラッキング)が暴くメカニズム

なぜ角丸ボタンはこれほどまでにクリックされるのか? Biswasらはアイトラッキング技術を用いて、ユーザーの視線の動きをミクロレベルで解析し、そのメカニズムを解明した 35

  1. 視線の滞留(Dwell Time): ユーザーは角丸ボタンを、鋭角ボタンよりも28.6%長く見つめる傾向がある。これは、角丸が視覚的な「心地よさ」を提供し、視線を繋ぎ止める力(Holding Power)を持っていることを示す。
  2. 視線の回帰(Return Frequency): ユーザーの視線がいったん他の要素に移った後、再びボタンに戻ってくる頻度は、角丸の場合に61.8%も高い。角丸は「視線のアンカー(錨)」として機能し、ユーザーの注意を繰り返し引きつける。
  3. 内向きのフォーカス(Focus Inward): 幾何学的に、鋭い角は視線を外側(枠の外)へと発散させるベクトルを持つ(矢印の先端のような効果)。対照的に、丸い角は円弧が内側を向いているため、視線をボタンの中心(コンテンツ)へと収束させる効果がある 14。これにより、ボタン内の「登録する」「購入する」といったテキスト情報への注目度が高まり、アクションへと繋がりやすくなる。

4.3 美的ユーザビリティ効果とハロー効果

デザイン心理学には「美的ユーザビリティ効果(Aesthetic-Usability Effect)」という強力な法則がある。「見た目が美しいものは、使いやすいと感じられる」という認知バイアスである 38

ユーザーは、角丸を多用した「美しい」インターフェースに直面した際、多少の機能的な欠陥やロード時間の遅延があったとしても、それに対して寛容になる傾向がある。さらに、第一印象(最初の50ミリ秒)で形成された「好ましさ」が、その後の全ての評価(信頼性、知性、品質など)に肯定的な影響を与える「ハロー効果(Halo Effect)」も作用する 38

「iPhoneのアプリは使いやすい」「Apple製品は高品質である」という一般的な認識の一部は、iOSが徹底して採用している角丸デザインが生み出す「視覚的な心地よさ」が、機能的な評価へと転移した結果である可能性が高い。脳は「美しいもの」を「良いもの」と誤読する癖があるのだ。

4.4 信頼と権威のトレードオフ:四角形の心理学

一方で、すべてのUIを丸くすれば良いわけではない。形状心理学において、正方形や長方形(鋭角)は「信頼」「安定」「権威」「厳格さ」を象徴する 43

  • 銀行・法律事務所: 伝統的な金融機関や法律関連のウェブサイトでは、過度な角丸を避け、鋭角やわずかなR(2-4px)を採用することで「堅実さ」や「プロフェッショナリズム」を演出するケースが多い 46
  • エラーと警告: ユーザーに危機感を抱かせる必要がある「エラーメッセージ」や「削除確認」のダイアログでは、あえて鋭角なデザインや高いコントラストを用いることで、脳の扁桃体を刺激し、注意を喚起する手法が取られる。

デザインとは、この「親しみやすさ(角丸)」と「信頼感(鋭角)」のバランスを、ブランドの目的に合わせて調整する神経科学的なチューニング作業なのである。


第5章:ニューロダイバーシティとインクルーシブデザイン

近年のデザイン潮流において見逃せないのが、「ニューロダイバーシティ(神経多様性)」への配慮である。自閉スペクトラム症(ASD)、ADHD(注意欠如・多動症)、ディスレクシア(読み書き障害)などの神経特性を持つ人々にとって、デザインの形状は単なる「好み」の問題ではなく、情報のアクセシビリティや精神的な安定に関わる切実な問題となる。

5.1 感覚過敏と「尖り」の苦痛:SPSの視点

神経多様性を持つ人々の中には、感覚処理感受性(Sensory Processing Sensitivity: SPS)が高いケースが多く見られる。彼らにとって、過度に複雑な視覚刺激、高いコントラスト、チラツキ、そして「鋭利な形状」は、認知的過負荷(Cognitive Overload)や物理的な不快感、不安を引き起こすトリガーとなり得る 48

  • 視覚的ノイズとしての鋭角: 鋭い角やグリッド線が密集したレイアウトは、感覚過敏を持つ脳にとって処理しきれないほどの「高周波ノイズ」として知覚されることがある。これは「視覚的混雑(Visual Crowding)」現象を悪化させ、情報の読み取りを困難にする。
  • ソフトシェイプの治療的効果: 精神分析家のFrances Tustin(1984)は、自閉症児が自身の身体感覚の境界を形成する過程で、「柔らかい形状(Soft Shapes)」や流動的な物質に触れることで安心感を得ることを指摘している 51。角丸や有機的な形状(Organic Shapes)は、予測可能で刺激が穏やかであるため、ASDやADHDのユーザーにとっても「目に優しく」「安全な」デジタル環境を提供する 5

5.2 バイオフィリック・デザインと「Takete/Maluma」

ゲシュタルト心理学における有名な「ブーバ/キキ効果(またはタケテ/マルマ効果)」は、人間が鋭角的な図形に「鋭い音(Takete/Kiki)」を、曲線的な図形に「丸い音(Maluma/Bouba)」を直感的に結びつける共感覚的な現象である。ASDを持つ人々において、この共感覚的な統合が定型発達者とは異なる処理をされることがあるが、一般的に「丸い形状」は「穏やかさ」や「肯定的感情」と結びつきやすい 11

自然界の要素を取り入れるバイオフィリック・デザイン(Biophilic Design)は、神経多様性を持つ人々のストレス軽減、集中力向上、創造性刺激に寄与することが多数の研究で示されている 53。自然界には「完全な直線」や「鋭利な直角」はほとんど存在しない。葉の曲線、川の流れ、雲の輪郭。角丸や流体的な形状(Fluid Shapes)を取り入れたUIは、デジタル空間におけるバイオフィリアの実践であり、万人に優しいインクルーシブな環境構築の重要な要素である。

5.3 2025年のトレンド:流体とBento Gridsの融合

2025年のUI/UXトレンドとして注目されている「Bento Grids(弁当箱のようなグリッドレイアウト)」や「Fluid Shapes(流体シェイプ)」は、このニューロダイバーシティの文脈でも解釈できる 56

Bento Gridsは、情報を明確なコンテナ(容器)に分割して整理する手法だが、そのすべてのコンテナは角が丸められている。これにより、情報は構造化されつつも、威圧感を与えない。これは、情報の整理整頓や予測可能性を好む(ASD的特性)と同時に、視覚的な刺激の少なさを求める(感覚過敏的特性)ユーザー層に対して、非常に有効なアプローチとなっている。


第6章:空間コンピューティングと未来の形状:Vision Proが変える「形」の物理学

Apple Vision Proの登場により、デザインは2次元のスクリーンを飛び出し、3次元空間へと拡張された。この「空間コンピューティング」の領域において、角丸はもはや「美学的な選択」ではなく、物理的かつ生理学的な「機能的必須要件」となっている。

6.1 アイトラッキングとターゲット捕捉の精度

Vision Proの操作は、主に視線(Gaze)によって行われる。ユーザーが見ている場所をシステムが正確に特定し、そこをインタラクティブな領域として認識させる必要がある。しかし、人間の眼球運動、特にサッカード(跳躍眼球運動)には微細な「ブレ」や「ゆらぎ」が存在する。

Appleの空間コンピューティング向けヒューマンインターフェースガイドライン(HIG)は、UI要素において「丸みを帯びた形状」を強く推奨しているが、これには明確な工学的理由がある 13

  • 中心捕捉の容易性(Targeting): 人間の目は、鋭角なコーナーを持つ四角形よりも、丸みを帯びた形状(円や角丸長方形)の方が、その幾何学的な「中心(Center)」を直感的に捉えやすい。角が尖っていると、視線が無意識に四隅の「尖り」に分散してしまい、中心点(注視点)が安定しないリスクがある 13。視線入力において、中心が捉えやすいことは誤操作の減少に直結する。
  • コーナー検出の回避: 第1章で述べたように、周辺視野は鋭角に敏感に反応する。空間UIでは、複数のウィンドウが視野内に浮かぶことになるが、それらがすべて鋭角な四角形だと、ユーザーの周辺視野は常に「鋭い角」の刺激に晒され続け、疲労(Eye Strain)が蓄積する。角丸は、周辺視野への刺激を和らげ、没入感を維持するために不可欠である。

6.2 ハロー効果と環境との調和

空間UIでは、ユーザーが注視している要素がハイライトされる「フォーカス効果(Focus Effect)」が重要となる。Appleは、要素の背後がぼんやりと光る「ハロー(Halo)」のような表現を採用している。

角丸の要素は、この光のハローが滑らかに広がり、背後の現実空間(パススルー映像)と自然に調和する。もし鋭角な要素が光ると、光の輪郭も鋭角になり、視覚的に「突き刺さる」ような強い刺激となってしまう。これは現実風景との違和感(Cognitive Friction)を生み、AR体験の質を低下させる 59

空間コンピューティングにおいて、インターフェースは現実世界に物理的に存在するかのように振る舞う必要がある。現実の物体(コップ、石、家具)の多くがエッジの取れた形状をしている中で、鋭利なデジタルウィンドウが空中に浮かんでいると、脳はそれを「異物」として認識し、警戒モードを解除できない。角丸は、デジタルオブジェクトと物理的現実の境界を曖昧にし、脳に対して「これは自然な存在である」という和解状を送るための、計算された形状なのである。


結論:美しさは「生存」と「計算」の交差点にある

なぜ我々はiPhoneの角丸に惹かれるのか。本レポートが解き明かしたように、その答えは単一の理由には帰結しない。それは、数百万年にわたる進化の歴史と、最新の数学的モデリング、そして未来のインターフェース技術が交差する点に存在している。

  1. 生物学的基盤: 扁桃体は鋭角を「脅威」とみなし、曲線を「安全」とみなす。この0.05秒の無意識の判断が、美しさの感情的基盤を形成している。
  2. 認知的効率: 脳はエネルギー効率を最優先する。処理負荷の低い滑らかな曲線は、脳にとって代謝コストの低い「報酬」であり、それが快感として知覚される。
  3. 数学的洗練: Appleの採用する「スクワークル」と「G2/G3連続性」は、幾何学的な不連続性を排除し、光と視線の流れを止めないことで、人工物でありながら有機的な質感を獲得し、錯視を回避している。
  4. 行動経済学的効果: UIにおける高いクリック率、視線誘導の正確さ、そして信頼感の形成において、角丸は鋭角よりも統計的に優れたパフォーマンスを発揮する。
  5. 社会的包摂と未来: 神経多様性への配慮を含め、角丸は「誰にとっても優しい」デザイン言語としての地位を確立し、空間コンピューティング時代においては物理的な必然性を持つ標準規格となりつつある。

「美しさ」とは、単なる表面的な装飾でも、個人の主観的な好みでもない。それは、人間の脳が世界をどのように知覚し、どのように生存しようとしているかという生体メカニズムそのものの反映である。iPhoneの角丸が美しいのは、それが我々の脳の設計図に最も適した形をしているからに他ならない。科学が証明するのは、デザインの背後にあるこの「必然の愛」なのである。我々が次に触れるスクリーン、次に押すボタンの背後には、常にこの壮大な科学的物語が流れている。

引用文献

  1. Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour and Information Technology, 25(2), 115-126 – ResearchGate, https://www.researchgate.net/publication/220208334_Attention_web_designers_You_have_50_milliseconds_to_make_a_good_first_impression_Behaviour_and_Information_Technology_252_115-126
  2. Attention web designers: You have 50 milliseconds to make a good first impression!, https://www.semanticscholar.org/paper/Attention-web-designers%3A-You-have-50-milliseconds-a-Lindgaard-Fernandes/f9715b117c57d4e7064afe1c1cb95d5bf4cc1831
  3. The Role Of Visual Complexity And Prototypicality Regarding First Impression Of Websites: Working Towards Understanding Aesthetic Judgments – Google Research, https://research.google.com/pubs/archive/38315.pdf
  4. The 50 Millisecond Judgement | Out of My Gord, https://outofmygord.com/2006/02/02/the-50-millisecond-judgement/
  5. Preference for Curvature: A Historical and Conceptual Framework – Frontiers, https://www.frontiersin.org/journals/human-neuroscience/articles/10.3389/fnhum.2015.00712/full
  6. UNCORRECTED PROOFS – Cognitive and Affective Neuroscience Lab, https://canlab.unl.edu/sites/unl.edu.cas.psychology.cognitive-and-affective-neuroscience/files/media/file/BarNeta_JCB-254.pdf
  7. Humans prefer curved visual objects – PubMed – NIH, https://pubmed.ncbi.nlm.nih.gov/16913943/
  8. Visual elements of subjective preference modulate amygdala activation – PubMed – NIH, https://pubmed.ncbi.nlm.nih.gov/17462678/
  9. (PDF) Do People Prefer Curved Objects? Angularity, Expertise, and Aesthetic Preference, https://www.researchgate.net/publication/250146139_Do_People_Prefer_Curved_Objects_Angularity_Expertise_and_Aesthetic_Preference
  10. More than Meets the Eye: Exploring the Emerging Field of Neuroaesthetics – | Columbia Undergraduate Science Journal, https://journals.library.columbia.edu/index.php/cusj/blog/view/572
  11. Do observers like curvature or do they dislike angularity? – PMC – PubMed Central, https://pmc.ncbi.nlm.nih.gov/articles/PMC4975689/
  12. Visual space curves before eye movements – bioRxiv, https://www.biorxiv.org/content/10.1101/2021.10.13.464140v5.full-text
  13. Eyes | Apple Developer Documentation, https://developer.apple.com/design/human-interface-guidelines/eyes
  14. What does a rounded interface mean? – Cieden, https://cieden.com/book/sub-atomic/shapes/rounded-interface
  15. Less is more: Aesthetic liking is inversely related to metabolic expense by the visual system, https://pmc.ncbi.nlm.nih.gov/articles/PMC12670382/
  16. Why round corners are more efficient for human consumption | by Mohamad Eltazy | Bootcamp | Medium, https://medium.com/design-bootcamp/why-round-corners-are-more-efficient-for-human-consumption-20a82a2bcf39
  17. Why Rounded Corners Are Easier on the Eyes – UX Movement, https://uxmovement.com/thinking/why-rounded-corners-are-easier-on-the-eyes/
  18. What Are Rounded Corners and Why Graphic Designers Use Them – Amadine, https://amadine.com/useful-articles/rounded-corners-in-amadine
  19. https://uxmovement.com/thinking/why-rounded-corners-are-easier-on-the-eyes/#:~:text=Some%20experts%20say%20that%20rectangles,in%20the%20brain%20%5B1%5D.
  20. How Art Hijacks Your Brain — In the Best Possible Way! | by R K – Medium, https://medium.com/@neuronsandyears/how-art-hijacks-your-brain-in-the-best-possible-way-a3a1dcec3f76
  21. Apple design, squircles, and curvature – Applied Mathematics Consulting, https://www.johndcook.com/blog/2018/02/13/squircle-curvature/
  22. Sensitivity to curvature deformations along closed contours | JOV – Journal of Vision, https://jov.arvojournals.org/article.aspx?articleid=2755350
  23. Circling the Square: Designing with “Squircles” Instead of Rounded …, https://99percentinvisible.org/article/circling-square-designing-squircles-instead-rounded-rectangles/
  24. Superellipse Mathematical Reference | Grida, https://grida.co/docs/math/superellipse
  25. Alias 2024 Help | Continuity G0 G1 G2 G3 | Autodesk, https://help.autodesk.com/cloudhelp/2024/ENU/Alias-Video-Tutorials/files/essential-concepts/continuity-g0-g1-g2-g3.html
  26. g0 g1 g2 and g3 surface continuity explained – YouTube, https://www.youtube.com/watch?v=X8TCvNQzYcc
  27. Have You Ever Wondered About Surface Continuity? G0, G1, and G2 Explained, https://plmtechtalk.com/2017/01/04/have-you-ever-wondered-about-surface-continuity-g0-g1-and-g2-explained/
  28. Understanding G0, G2 & G3 In Relation to Curvature Combs/Continuity – Rhino, https://discourse.mcneel.com/t/understanding-g0-g2-g3-in-relation-to-curvature-combs-continuity/146065
  29. The secret formula for Apple’s rounded corners – Reddit, https://www.reddit.com/r/apple/comments/17764ty/the_secret_formula_for_apples_rounded_corners/
  30. Squircles vs. round squares: everything designers need to know – Webflow, https://webflow.com/blog/squircle-vs-rounded-squares
  31. Principles of Logo Design | PDF | Logos | Brand – Scribd, https://www.scribd.com/document/586841199/Principles-of-Logo-Design
  32. 7 OPTICAL ILLUSIONS THAT EVERY GRAPHIC DESIGNER SHOULD KNOW, https://nostalgicdolphin.com/7-optical-illusions-that-every-graphic-designer-should-know/
  33. Concentric rounded rectangles – Exploding Pixels, https://explodingpixels.wordpress.com/2009/04/22/concentric-rounded-rectangles/
  34. How to increase CTR by +17% – Bri Williams, https://www.briwilliams.com/blog/rounded
  35. Do rounded buttons show a better usability? – Cieden, https://cieden.com/book/sub-atomic/shapes/rounded-buttons-and-usability
  36. Curvy Digital Marketing Designs: Virtual Elements with Rounded Shapes Enhance Online Click-Through Rates | Journal of Consumer Research | Oxford Academic, https://academic.oup.com/jcr/article-abstract/51/3/552/7470747
  37. Curvy Digital Marketing Designs: Virtual Elements with Rounded Shapes Enhance Online Click-Through Rates – ResearchGate, https://www.researchgate.net/publication/376783770_Curvy_Digital_Marketing_Designs_Virtual_Elements_with_Rounded_Shapes_Enhance_Online_Click-Through_Rates
  38. The Halo Effect in UI design | Flying Bisons, https://flyingbisons.com/blog/the-halo-effect-in-ui-design
  39. The Aesthetic-Usability Effect: How to balance beauty and function | by Aleksandra Smith, https://medium.com/uxdworld/the-aesthetic-usability-effect-how-to-balance-beauty-and-function-c8d5f64a163a
  40. Understanding the Aesthetic Usability Effect – Amulet Technologies, https://www.amulettechnologies.com/11940-2/
  41. The Halo Effect in UX Design: How Visuals Shape User Trust – Sigma Collection, https://www.thesigma.co/journal/halo-effect-ux
  42. Harnessing the Halo Effect, https://liberalarts.byu.edu/internship-resource/harnessing-the-halo-effect
  43. Knock Design Into Shape. Psychology of Shapes. – Tubik Blog, https://blog.tubikstudio.com/knock-design-into-shape-psychology-of-shapes/
  44. Shape Psychology of Squares and Rectangles – Iron Dragon Design, https://www.irondragondesign.com/shape-psychology-squares-and-rectangles/
  45. The Essential Guide to Shape Psychology in Design: How Shape Psychology Drives Consumer Behavior – Alitestar, https://alitestar.com/blog/design/35/the-essential-guide-to-shape-psychology-in-design:-how-shape-psychology-drives-consumer-behavior
  46. UI design best practices: Rounded corners vs sharp edges – Zazzy Studio, https://www.zazzy.studio/jots/rounded-corners-vs-sharp-edges
  47. The Hidden Psychology of Shapes in Logo Design – Creatively Kira, https://www.creativelykira.com/post/psychology-of-shapes
  48. Design for Neurodivergent Users: Simple Tips for Better UX – Bits Kingdom, https://bitskingdom.com/blog/inclusive-design-neurodivergent-users/
  49. Designing for Neurodiversity: Inclusive Visual Content for ADHD and Autism, https://www.vermeulen-design.com/blog/designing-for-neurodiversity-inclusive-visual-content
  50. Inclusive UX/UI for Neurodivergent Users: Best Practices and Challenges – Medium, https://medium.com/design-bootcamp/inclusive-ux-ui-for-neurodivergent-users-best-practices-and-challenges-488677ed2c6e
  51. Layers of the Skin: Three Perspectives on Tactile Sensation in Autism – Karger Publishers, https://karger.com/hde/article/69/4/206/926856/Layers-of-the-Skin-Three-Perspectives-on-Tactile
  52. (PDF) Angular Versus Curved Shapes: Correspondences and Emotional Processing, https://www.researchgate.net/publication/319936148_Angular_Versus_Curved_Shapes_Correspondences_and_Emotional_Processing
  53. Neuroinclusive workplaces and biophilic design: Strategies for promoting occupational health and sustainability in smart cities – AccScience Publishing, https://accscience.com/journal/GHES/1/1/10.36922/ghes.0549
  54. Exploring biophilic building designs to promote wellbeing and stimulate inspiration – PMC, https://pmc.ncbi.nlm.nih.gov/articles/PMC11878902/
  55. Neuroinclusive workplaces and biophilic design: Strategies for promoting occupational health and sustainability in smart cities, https://digitalcommons.lindenwood.edu/cgi/viewcontent.cgi?article=1495&context=faculty-research-papers
  56. Top 25 Web Design Trends to Create Stunning Websites in 2025, https://www.aufaitux.com/blog/web-design-trends-2025/
  57. UX/UI Trends 2025. Innovation will lead to new… | by Maja Mitrovikj – Medium, https://medium.com/codeart-mk/ux-ui-trends-2025-818ea752c9f7
  58. How to design apps for Apple Vision Pro | Merge Development, https://merge.rocks/blog/how-to-design-apps-for-apple-vision-pro
  59. Focus and selection | Apple Developer Documentation, https://developer.apple.com/design/human-interface-guidelines/focus-and-selection

関連記事

TOP