デザインシステム素案(Bootstrap 5 ベース)

[win2cot]

概要

Bootstrap 5 をベースに、本プロジェクト固有のデザイン方針(配色 / タイポ / 主要コンポーネントのバリエーション)を素案として文書化する。完成版ではなく「Sprint 1 以降の画面実装が迷わない最低限」を目指す。

背景

• フロントエンドスタックは確定:HTML5 / CSS3 / JS / Bootstrap 5
• マルチテナント SaaS のため、将来テナント別テーマ可変性(ロゴ・アクセントカラー)を考慮した素案にする

成果物

• docs/specs/ui/design-system.md
  • カラーパレット(プライマリ / セカンダリ / アクセント / セマンティック)
  • タイポグラフィ(見出しサイズ階層、本文)
  • スペーシング基準(Bootstrap 5 utility との対応)
  • 主要コンポーネントの方針(ボタン、フォーム、テーブル、モーダル、トースト、バッジ、ナビゲーション)
  • アクセシビリティ方針(コントラスト最低基準、キーボード操作)
  • 状態表現(loading / empty / error)
  • テナント別テーマ可変性の指針

完了の定義

• docs/specs/ui/design-system.md を PR で追加、マージ済み
• Claude Design 検証の成果物と矛盾しない
• テナント別テーマ可変箇所が明示されている

関連

• 親:[Sprint 0] 画面設計 初版(Claude Design 活用) #149
• 依存(順序):Claude Design 検証とは並行進行可、最終は整合確認

備考

P2 にしている理由:Sprint 0 のクリティカルパスは「方向性決定」と「項目確定」(P1 Issue 群)。デザインシステム素案は Sprint 1 開始までに揃えば良いため、P1 Issue 群より優先度を下げている。