2026年5月31日（日）

今日やったこと

TSUMOO-31 新規登録画面コーディングを完了し、登録関連の画面を一通り整理
TSUMOO-32 パスワードリセット画面コーディングを完了し、再設定メール送信、再設定入力、完了画面までの見た目を整備
認証前画面で使うフォーム、ボタン、リンク、完了画面の見た目を共通化し、PC / SP の表示を調整
TSUMOO-33 ダッシュボード画面コーディングと TSUMOO-34 タスク一覧画面コーディングの整理に入り、タスク開始メモを作成
/app/dashboard の画面コーディングを開始し、認証後共通レイアウト、サイドバー、SP下部ナビゲーションのたたき台を実装
ダッシュボードに、クイック作成、タスク一覧、今日の達成状況、直近7日間サマリーを配置
タスク一覧は、チェック型 / ステータス型 / 完了済みの代表モックを置き、完了操作ボタン、ステータスラベル、編集導線の見た目を調整
PC / SP / タブレット幅で、文字サイズ、余白、カード幅、スクロール領域、下部ナビゲーションの見え方を細かく調整
ログイン画面で決めたフォント色、フォームフォーカス、やわらかいブラウン・ベージュ・オレンジのトーンをログイン後画面にも反映
npm run lint を通しながら、画面コーディングの状態を確認

ロードマップ

フェーズ1: タスク管理MVP

進捗: 13 / 38件

今日対応したタスク

完了 TSUMOO-31 新規登録画面コーディング
完了 TSUMOO-32 パスワードリセット画面コーディング
進行中 TSUMOO-33 ダッシュボード画面コーディング
進行中 TSUMOO-34 タスク一覧画面コーディング

完了したタスク

TSUMOO-32 パスワードリセット画面コーディング
TSUMOO-31 新規登録画面コーディング
TSUMOO-30 認証画面コーディング
TSUMOO-10 公開トップページ実装
TSUMOO-9 開発環境・基本設定整備
TSUMOO-8 アプリケーション初期構築
TSUMOO-7 API設計
TSUMOO-6 DB設計
TSUMOO-5 画面詳細設計
TSUMOO-4 UI方針整理
TSUMOO-3 フェーズ1基本設計
TSUMOO-2 フェーズ1要件定義
TSUMOO-1 Tsumoo構想整理

次に取り組むタスク

TSUMOO-33 ダッシュボード画面コーディングのPC / SP / タブレット調整
TSUMOO-34 タスク一覧画面コーディングの見た目とスクロール体験の調整
ダッシュボードが落ち着いたら、タスク作成 / タスク編集 / 振り返り / 設定画面の画面コーディングへ進む

考えたこと

今日は、認証前画面のコーディングを一段落させたあと、ログイン後画面の最初の入口になるダッシュボードへ進みました。

認証画面は「初回利用やログインの安心感」を優先した画面でしたが、ダッシュボードは毎日使う作業画面になるため、同じやわらかいトーンを保ちつつ、情報密度と操作しやすさを少し高める必要がありました。

モックのPCのデザインは直近7日間の情報を下部に配置していましたが、見た目どおりに作ったときに、スクロールする日強グアあり、操作性が微妙だったので、右側に配置することでバランスのよい配置になり、視認性が高まりました。

明日も見た目や使い勝手を考えながらダッシュボードの修正を行う予定です。

決めたこと

ダッシュボードとタスク一覧は、別URLにせず /app/dashboard 内の同じ画面として扱う
PCではサイドバー、SPでは下部ナビゲーションをログイン後共通レイアウトの基本にする
ダッシュボードのPC画面では、右カラムに今日の達成状況と補助サマリーを置く
右カラムの補助サマリーは、分析寄りになりすぎないよう 直近7日間の完了数 と 過去1週間で100%達成した日数 を残す方向にする
1日あたり平均完了数 は、ダッシュボードより振り返り画面向きとして外す方向にする
クイック作成の任意項目は、APP-001では初期状態で閉じ、任意項目を表示 から展開する
タスク作成 / 編集の専用画面では、任意項目を折りたたまず表示する方針を維持する
タスク一覧の三点メニューは初回実装では置かず、カード選択や右端の導線から編集画面へ進む
削除操作は一覧ではなく、タスク編集画面で確認を挟んで扱う
実データ取得、認証ガード、作成処理、完了処理、フィルター処理は後続タスクで扱う

次にやること

ダッシュボードのPC / SP / タブレット表示をスクリーンショットで見比べながら微調整する
タスク一覧のスクロール領域、下端揃え、ページング表示の見た目を整える
TSUMOO-33 / 34 の画面コーディングを完了扱いにできるところまで詰める
次の画面として、タスク作成 / タスク編集 / 振り返り / 設定画面の設計とモックを確認する