移行中の知識
丸み
Roundedness
定義
丸み（roundedness）とは、形状の輪郭や角がどの程度曲線的に処理されているかという視覚特性です。UIではcorner radius、円形・pill形状、曲線的なstrokeなどとして現れます。丸みはcomponent同士の形の語彙や視覚的なまとまりに関わりますが、単一のradius値だけで印象や使いやすさが決まるわけではありません。大きさ、余白、線幅、周囲の形状、platformの慣習と合わせて判断します。
実例
実際の場面で考える
同じ概念を異なる制作文脈へ持ち込み、何を観察して判断するかを見る。
Webアプリのdesign system
ボタンとカードのradius体系
見るポイント
ボタン、入力欄、カードへ同じ数値を機械的に当てるのではなく、componentの大きさと役割に応じてradiusの段階を決める。異なる形状が同じ視覚言語として見えるかを確認する。
カード内に別のpanelを置くUI
入れ子になったsurface
見るポイント
外側と内側の角丸が近接する時、radiusと余白の関係を見て、内側だけ不自然に丸く見えたり角同士が衝突して見えたりしないか確認する。
理解
理解のポイント
- contourの曲率は対象への評価へ影響しうることが実験で示されているが、効果の方向や強さをあらゆるUI・文化・ブランドへ一般化しない。
注意
誤解しやすい点
- corner radiusやcurvatureという制作側のparameter / geometric propertyを、知覚されるroundednessそのものの完全な同義語として扱う。
- 「丸いほど親しみやすい」「角ばるほど堅い」といった印象語を、文脈に依存しない普遍的な因果として扱う。
- design system内のすべてのcomponentへ同じcorner radiusを適用し、サイズや入れ子関係による見え方の差を無視する。
- 丸みの強さだけを変えたつもりでも、同時に面積や余白、形状カテゴリまで変えて比較してしまう。
関連
関連する概念
出典