読み方：がめんせんいず

画面遷移図【screen flow diagram】

概要

画面遷移図とは、情報システムやアプリケーションの開発で、利用者が操作する画面同士のつながりを図式化した設計資料のこと。各画面を四角形で表し、ボタンやリンクなどの操作によってどの画面へ移動するかを矢印で示す。

図の構成要素は単純で、個々の画面を表す枠と、移動の方向を示す矢印を組み合わせて描く。矢印の付近には、クリックや入力項目の確定といった、移動の契機となる利用者の操作内容を書き添えることが多い。画面名は「顧客一覧」「注文確認」のように機能を日本語で表すと理解しやすくなる。

画面遷移図は主に基本設計から詳細設計の段階で作成され、画面一覧や画面レイアウトと併せて用いられる。画面一覧は機能の実現に必要な操作画面を列挙したもので、画面レイアウトは個々の画面の内容を示す。画面遷移図は複数の画面をまたいだ操作経路を表現する。必要に応じて、「ワイヤーフレーム」や「画面設計書」などの詳細な設計書や設計図面を作成することもある。

この図を作成する目的は、開発に関わる様々な関係者の間で、システムの仕上がりイメージや操作の流れを正確に共有することにある。発注者やデザイナー、プログラマなどが同一の図を参照しながら議論を進めることで、画面の不足や操作手順の矛盾、行き止まりになる遷移といった考慮漏れを設計段階で早期に発見できる。プログラミング工程やテスト工程における基準としても活用され、レビューの際には存在しない画面への遷移や到達できない画面の有無を確認する材料にもなる。

画面遷移図は記法が厳密に標準化されているわけではなく、組織や開発プロジェクトごとに表記方法が異なる。単純な画面構成では画面名と矢印だけで表現することもあれば、分岐条件や権限による遷移制御、エラーメッセージ画面、外部サイトへの遷移などを含める場合もある。画面の数やシステムの複雑さに応じて、全体の輪郭をつかむための概要図から、ポップアップ表示まで網羅した詳細な図まで、用途に合わせて詳細度の異なる図が作られることもある。近年ではWebアプリケーションやスマートフォンアプリの開発において、UIデザインツールを用いて画面遷移図と画面デザインを連携させて管理する例も一般的になっている。

(2026.7.19更新)