ページを読み込み中...
しばらくお待ちください
しばらくお待ちください
同じ役割を持つUIコンポーネントが、画面をまたいで異なる見た目・振る舞いをしていると、ユーザーは毎回「これは何だ？」と学習し直す羽目になる。コンポーネント単位で視覚的一貫性を担保するための原則です。
「おしゃれで淡い」デザインは、誰も読めないサイトを生む。色・サイズ・明度の「差」を意図的に設計し、情報の優先順位と役割をユーザーの視線に直接語りかけるコントラストの設計原則。
ユーザーは「プランを選ぶ」「削除する」「購入する」——これらの意思決定の瞬間に最も迷い、最も離脱する。情報・比較・リスク提示を最適化し、ユーザーが後悔しない選択をできるよう設計する原則。
Figmaでは美しいが、実装すると崩れる——デザインと実装の乖離は、コンポーネントの状態・余白の定義・フォントの扱いが「実装不可能な形」で設計されているときに起きる。壊れない設計の原則。
同じボタンが画面ごとに微妙に違う色・サイズ・角丸——「なんとなく作った」UIは、スケールするにつれて一貫性が崩れる。コンポーネントとトークンでルール化し、再利用可能な設計資産を作る原則。
何もない画面は、ユーザーへの最悪の歓迎だ。初回利用・検索0件・データ削除後——「空」の瞬間こそ、次のアクションへ誘導する最大のチャンスと捉える設計原則。
優れたエラーメッセージよりも、エラーそのものを発生させないUIが上。制約・デフォルト値・インラインバリデーションを活用し、ユーザーが間違えられない設計を作る原則。
エラーは必ず起きる。問題はその後だ。エラーメッセージが「何が起きたか」「なぜ起きたか」「どう直すか」を伝え、ユーザーが迷わず回復できるUIを設計する原則。
「思っていたのと違う」がユーザーの信頼を壊す。リンク先・操作結果・処理時間——ユーザーが「次に何が起きるか」を正確に予測できるよう、UIが事前に約束する設計原則。
ユーザーは他のサービスで学んだ操作パターンを、あなたのUIにも期待する。ヤコブの法則に基づき、既存のメンタルモデルを活用して学習コストをゼロにする設計原則。
ユーザーの操作に対してシステムが反応を返さないUIは、沈黙という最悪の体験を生む。あらゆる操作に適切な反応を返し、ユーザーとシステムの対話を成立させる設計原則。
ユーザーが求める情報を「探せない」UIは、情報がないUIと同じ。ナビゲーション・ラベル・検索・構造を通じて、目的の情報に最短でたどり着ける設計原則。