デザイン原則キャンバス

タスク管理SaaSのデザインチーム5名。新機能のUIレビューで毎回「もっと情報を表示すべき」派と「シンプルに保つべき」派が対立し、平均45分の議論が発生していた。リードデザイナーの一声で決まることが多く、他のメンバーは不満を感じていた。

ワークショップで策定した原則（4個）:

1. 「考えさせない」をデフォルトにする

   • トレードオフ: 情報の網羅性よりも、判断の速さを優先する
   • 適用例: タスク一覧では優先度上位5件を強調表示し、残りは折りたたむ
   • アンチパターン: すべてのタスク属性（担当者・期限・タグ・進捗率）を一覧に表示する

2. 迷ったらユーザーの「次の一手」に近づける

   • トレードオフ: 汎用性よりも、最頻ユースケースの最適化を優先する
   • 適用例: タスク完了後に「次のタスク」を自動で表示する
   • アンチパターン: 完了後に元の一覧に戻す（ユーザーに次の行動を探させる）

3. 一貫性は予測可能性のためにある

   • トレードオフ: デザインの新しさよりも、操作の予測可能性を優先する

4. エラーは責めず、導く

   • トレードオフ: 厳密なバリデーションよりも、ユーザーの意図の汲み取りを優先する

導入後: デザインレビューの平均時間が45分→20分に短縮。「この判断は原則1に基づいて、情報量を減らす方向にする」のように根拠付きで議論できるようになった。リードの独断ではなく原則に基づく合意でチームの納得感が向上。

服薬管理アプリ（ユーザー8万人、高齢者が60%）。規制対応で「警告をもっと表示すべき」という要求が増え、画面が警告だらけになりかけていた。デザイナーは「警告が多すぎると逆に読まない」と懸念していたが、判断基準がなかった。

策定した原則（5個）のうち重要な3つ:

1. 安全性は妥協しないが、恐怖で伝えない

   • トレードオフ: 法的な網羅性よりも、ユーザーが実際に行動を変える伝え方を優先する
   • 適用例: 飲み合わせ警告は「確認」ボタン付きの1行メッセージ。詳細は展開式
   • アンチパターン: 赤い警告ダイアログを3つ連続で表示する

2. 指先が震えていても使える

   • トレードオフ: 画面の情報密度よりも、タップターゲットの大きさと余白を優先する
   • 適用例: ボタンは最小48×48px、主要操作ボタンは56×56px
   • アンチパターン: 小さなテキストリンクでアクションを提供する

3. 1画面1判断にする

   • トレードオフ: 画面遷移の少なさよりも、1回の判断の明確さを優先する

成果: 警告表示を再設計した結果、警告の「確認済み率」が**38%→82%に向上（実際に読まれるようになった）。ユーザビリティテストでの操作エラー率は12%→5%**に低下。規制当局のレビューでも「ユーザーの理解を促す設計」として高評価を受けた。

従業員500名のSaaS企業。プロダクトが4つに分かれ、それぞれ別のデザインチームが担当していた。デザインシステムを構築する際に「そもそも全社のデザイン基準がバラバラ」という問題に直面。各チームの判断基準を統一する必要があった。

全チーム横断ワークショップを実施（参加者16名、2日間）:

Day 1: インプット収集

• 各チームから「判断に迷った事例」を5個ずつ持ち寄り、計20事例を共有
• ユーザーリサーチの統合レポートからキーインサイトを抽出
• 経営陣からブランド戦略の方向性をヒアリング

Day 2: 原則策定

• 20事例を分類し、共通するテーマを抽出
• テーマごとに原則ステートメントを起草し、投票で6個に絞り込み
• 各原則にトレードオフ・適用例・アンチパターンを付与

策定された6原則の例:

• 「プロらしく、堅くなく」— 信頼性よりもフレンドリーさを犠牲にしない。専門用語よりも平易な言葉を選ぶ
• 「見せる前に整える」— 表示速度よりもデータの正確性を優先する。ローディング中は不完全なデータを見せない

運用方法:

• Figmaのデザインシステムライブラリに原則カードを組み込み
• PRレビューのテンプレートに「関連する原則」欄を追加
• 四半期に1回、原則の適用事例を各チームが発表する「原則ショーケース」を開催

1年後: 4プロダクト間のデザイン一貫性スコア（社内評価）が2.8→4.2（5段階）に向上。デザインレビューでの「好みの議論」が月12件→3件に減少。新メンバーのオンボーディング期間も、デザイン判断で独り立ちするまでの期間が3か月→6週間に短縮された。