AI生成UIの検品を、公開された物差しで1画面ずつ行う連載「UI裁判」の第1回。デザインシステム群青のコールドテスト#175「施工写真台帳」を6観点で測り、要再構築の判定に至るまでの筋道をそのまま公開します。
タグ: デザインシステム
UX心理、UIデザイン原則、UIコンポーネント、リサーチ記事を横断して探せるUIXHEROのナレッジ一覧です。目的に合わせて絞り込みながら、設計や実装の判断材料を見つけられます。
UX心理、UIデザイン原則、UIコンポーネント、リサーチ記事を横断して探せるUIXHEROのナレッジ一覧です。目的に合わせて絞り込みながら、設計や実装の判断材料を見つけられます。
AI生成UIの検品を、公開された物差しで1画面ずつ行う連載「UI裁判」の第1回。デザインシステム群青のコールドテスト#175「施工写真台帳」を6観点で測り、要再構築の判定に至るまでの筋道をそのまま公開します。
同じ役割を持つUIコンポーネントが、画面をまたいで異なる見た目・振る舞いをしていると、ユーザーは毎回「これは何だ?」と学習し直す羽目になる。コンポーネント単位で視覚的一貫性を担保するための原則です。
Figmaでは美しいが、実装すると崩れる——デザインと実装の乖離は、コンポーネントの状態・余白の定義・フォントの扱いが「実装不可能な形」で設計されているときに起きる。壊れない設計の原則。
同じボタンが画面ごとに微妙に違う色・サイズ・角丸——「なんとなく作った」UIは、スケールするにつれて一貫性が崩れる。コンポーネントとトークンでルール化し、再利用可能な設計資産を作る原則。
画面ごとにボタンの色や位置が違うUIは、ユーザーに毎回「これは何のボタンか」を学習させる。同じ機能には同じ見た目を繰り返し適用し、ユーザーの予測を裏切らない一貫性の設計原則。