操作
バグ #459
未完了Phase 1: デザインシステム統一基盤構築
ステータス:
解決
優先度:
高め
担当者:
-
開始日:
2025-06-10
期日:
進捗率:
0%
予定工数:
説明
Phase 1 概要¶
デザインシステムの統一基盤を構築し、両システム間の一貫性を確保する
タスク内容¶
-
現状分析・調査
- カスタムUI(task.call2arm.com)のデザイン実装詳細確認
- RAGアシスタントの現行デザイン実装確認
- 差分分析と統合ポイントの特定
-
統一デザイントークン定義
- カラーパレット統一(#06C755ベース)
- タイポグラフィシステム定義
- スペーシング・サイジングルール策定
-
共通コンポーネントライブラリ設計
- ボタン、フォーム、カード等の基本コンポーネント
- レイアウトコンポーネント(ヘッダー、サイドバー、フッター)
- インタラクションパターン定義
成果物¶
- デザインシステムドキュメント
- 統一TailwindCSS設定ファイル
- コンポーネント仕様書
親チケット: #458¶
Redmine Admin さんが5日前に更新
Phase 1: デザインシステム統一基盤構築 - 完了報告¶
✅ 実装完了項目¶
1. 統一デザイントークン定義¶
-
ファイル:
/var/docker/task2-service/shared/design-tokens/unified-tailwind-config.js
-
内容:
- カラーパレット: #06C755 (line-green)を中心とした統一配色
- タイポグラフィ: Apple/Hiragino/Noto統一フォント
- スペーシング: 拡張値 (18, 88, 128)
- borderRadius: line系 (line-sm, line, line-lg)
- boxShadow: line系シャドウ定義
- animation: fade-in, slide-up, slide-down
2. デザインシステムドキュメント¶
- DESIGN_SYSTEM.md: デザインシステム仕様書作成
- COMPONENT_SPECS.md: 共通コンポーネント仕様書作成
3. 設定ファイル更新¶
-
RAGアドバイザー (
/var/docker/task2-service/app/rag-advisor/tailwind.config.js
): 統一設定適用済み -
カスタムUI (
/root/task-call2arm/ui/tailwind.config.js
): 統一設定適用済み
4. ビルド状況¶
- RAGアドバイザー: ✅ ビルド成功・デプロイ完了
- カスタムUI: ⚠️ React 19互換性問題により一部エラー(対応中)
📊 統一達成項目¶
項目 | 状態 | 詳細 |
---|---|---|
カラーパレット | ✅ | #06C755で完全統一 |
フォントファミリー | ✅ | システムフォント統一 |
スペーシング | ✅ | 拡張値追加完了 |
borderRadius | ✅ | line系定義統一 |
boxShadow | ✅ | 深度レベル定義 |
animation | ✅ | 標準アニメーション定義 |
🚀 次のステップ (Phase 2)¶
- 共通コンポーネントライブラリの実装
- ボタン、フォーム、カード等の基本コンポーネント作成
- レイアウトコンポーネントの統一実装
📝 Git履歴¶
- task2-service:
bc1ec45
- Phase 1実装 - task-call2arm:
0757d3d
- Tailwind設定統一
ステータス: Phase 1完了 → Phase 2準備中
操作