UIリデザイン指針

[Itaru372]

UIリデザイン指針（Apple / ChatGPTスタイル準拠）

目的

本アプリのUIを、Apple純正アプリおよびChatGPT iOSアプリの設計思想に近づける。
見た目の模倣ではなく、情報設計・視線誘導・操作負荷の最適化を重視する。

---

基本原則

1. 1画面1目的

• 各画面は単一の明確な目的のみを持つ
• 複数の操作・情報を同時に提示しない
• ユーザーの行動を迷わせない構造にする

---

2. シンプルな情報構造（Information Architecture）

• 階層構造を明確にする（一覧 → 詳細）
• UI要素は必要最小限に制限
• 情報の優先順位を明確にする

---

3. 余白を主体としたデザイン

• 余白を「装飾」ではなく「構造」として扱う
• 要素間のスペースで視線誘導を行う

推奨値：

• 横padding：16〜20px
• セクション間：24〜32px
• 行間：1.5〜1.8

---

4. 視線誘導の最適化

• 強調は最小限（サイズ・ウェイトで制御）
• 色による強調は限定的に使用
• 情報の流れを縦方向に統一

---

5. カラールールの統一

• 背景：白 または iOS標準グレー（#F2F2F7）
• テキスト：黒またはダークグレー
• アクセントカラー：1色のみ使用

---

6. コンポーネント設計

• 過剰な装飾（カード・影・枠線）を排除
• フラットで軽量なUIを採用
• タップ領域は広く確保

---

7. 操作負荷の最小化

• 操作は「スクロール + 最小限の入力」に集約
• UIの学習コストを下げる
• 直感的に使える構造を優先

---

8. 一貫性（Consistency）

• すべての画面でルールを統一
• フォントサイズ、余白、色の使い方を揃える
• 例外を作らない

---

アンチパターン（禁止事項）

• 1画面に複数の目的を持たせる
• 不要な装飾（カード、影、多色使用）
• 情報過多なレイアウト
• 強調の乱用（色・太字・サイズの多用）
• 余白不足による視認性低下

---

完了条件

• 各画面の目的が明確に定義されている
• UI要素が最小限に削減されている
• 視線誘導が自然に成立している
• カラールールと余白ルールが一貫して適用されている
• 操作時の認知負荷が低い状態になっている

---

補足

本Issueでは機能仕様には触れず、UI設計思想およびデザイン原則の統一に限定する。