前回（Vol.1）では、画面駆動設計の進め方やそのメリットについてご紹介しました。
今回は、実際にその画面駆動設計を適用して作成した「画面フロー」「各画面のUI構成」「処理とデータ設計図」について、具体例を挙げながら解説していきます。

🔗 設計資料へのリンク

以下のGitHubに、今回紹介する資料をすべて公開しています。ぜひ合わせてご覧ください。

1. 🎯 画面フローの作成

まず最初に取り組むのが「画面遷移図（画面フロー）」の作成です。

例：ユーザー管理画面からの遷移

画面ごとの設計資料では、次の情報を網羅的に定義しています：

ボタンやリンクなど、各UIコンポーネントに対して紐づく処理を明記します。

ボタン名	操作内容
ユーザー作成	「ユーザー作成画面」へ遷移
編集	該当ユーザー情報を持って「ユーザー編集画面」へ遷移
削除	対象ユーザーを削除後、ユーザー一覧を最新状態で再表示
戻る	管理メニューへ遷移

表示に必要な情報から、DBのデータ構造や取得方法を逆算して設計を行います。

これに応じて、DAOのSQLや取得メソッドの仕様を設計します。

この「画面から考える」やり方は、過去に文法中心でつまずいた自分にとって
非常にしっくり来るスタイル でした。

「画面 → 処理 → データ」と段階的に組み立てるので、初心者でも迷いにくいのが魅力です。

次回は、【Vol.3】詳細設計編：ER図で見るデータ構造と実装の土台に入っていきます。