2026年5月24日(日)
今日やったこと
- フェーズ1 MVP の UI 方針書を作成
- Tsumoo の体験の軸として、入力、完了、振り返りの UI 方針を整理
- スマホと PC で重視する体験の違いを整理
- フェーズ1のダッシュボードを、分析画面ではなく作業の起点画面として扱う方針を整理
- タスクカード、フィルター、フォーム、達成状況サマリーの見せ方を整理
- 主ボタン、サブボタン、危険ボタンの役割と見た目の方向性を整理
- 背景色、文字色、丸みのあるウィンドウ表現など、ビジュアルの方向性を整理
- 完了時のマイクロインタラクション方針を整理
- UI 方針書にも決定事項の章を追加し、判断理由を残せる構成にした
- PDF を生成し、目次のページ番号を実ページに合わせて調整
- UI 方針整理の作業をコミットし、PR を作成できる状態にした
ロードマップ
フェーズ1: タスク管理MVP
進捗: 4 / 30件
今日対応したタスク
- 完了 TSUMOO-4 UI方針整理
完了したタスク
- TSUMOO-4 UI方針整理
- TSUMOO-3 フェーズ1基本設計
- TSUMOO-2 フェーズ1要件定義
- TSUMOO-1 Tsumoo構想整理
次に取り組むタスク
- TSUMOO-5 画面詳細設計
- TSUMOO-6 DB設計
- TSUMOO-7 API設計
考えたこと
今日は、Tsumoo をただのタスクアプリにしないために、見た目や操作感の方針を整理しました。
やや可愛すぎる画面構成になった気もしますが、毎日使う道具としての分かりやすさも残すことを意識しました。背景や文字色はやわらかい暖色系を軸にしつつ、ボタンや危険操作などは役割が分かるように差をつける方針にしました。
また、フェーズ1では分析画面を作り込まないため、ダッシュボードは、今日のタスクを確認して、作成して、完了するための起点画面として扱うことにしました。細かい分析はフェーズ2以降に回し、まずは毎日触りやすい画面を作ることを優先します。
UI 方針書にも決定事項の章を作ったことで、後から「なぜこの見た目にしたのか」を振り返りやすくなりました。明日は細かい表現や抜け漏れを確認し、画面詳細設計へつなげられる状態に持っていく予定です。
決めたこと
- UI 方針書は、基本設計書の補助資料として独立させる
- フェーズ1のダッシュボードは、今日のタスク確認、作成、完了の起点画面として扱う
- 背景色は
#E9DED2、文字色は#5B3A32を基調にする - 主ボタンはコーラルベージュ寄りの暖色系にする
- サブボタンは淡いベージュ系にする
- 危険ボタンは赤背景と白文字を基本にする
- 任意項目は折りたたまず表示し、必須項目との強弱で見せ分ける
- PC 向け一括登録は、チェック型タスク最大4件、ステータス型タスク最大2件を基本にする
- タスク一覧の初期表示は、未完了タスクを中心にする
- 完了時は、カード全体が短く反応する表現を基本にする
次にやること
- UI 方針書の細かい表現や抜け漏れを確認する
- 画面詳細設計に進む
- 画像生成やワイヤーフレーム作成に向けて、画面ごとの主役を整理する