画面モックアップ(試作品)と各項目を解説します。
管理システムは画面を大きく縦に３分割します。
| 段 | 概要 |
|---|---|
| 上 | 最上部の細長いエリアで、以降「PageHeader」と呼びます。システム名とマスタメニューを表示します。すべてのページで共通して表示されます。 |
| 中 | PageHeaderのすぐ下で、現在のページ名と親メニューへのLinkを表示します。以降「Breadcrumb」と呼びます。 |
| 下 | 一覧や明細など機能の本体を表示します。以降「MainContents」と呼びます。 |
それでは、画面要素について解説していきます。
管理ツール・管理メニューリスト

PageHeader
| 名称 | 概要 |
|---|---|
| Bookmin | 本システム名(横にログイン者名を表示しても良いでしょう) |
| Home | 管理メニューリストへ遷移します。 |
| 売上管理 在庫管理 マスタ管理 |
マウスオーバーでそれぞれの子メニューを表示します。 |
| ログアウト | セッション情報をすべて破棄し、認証画面へ遷移します。 |
Breadcrumb
管理メニュー一覧ではトップ画面ですので階層化されたリストは表示されませんが、
例えば本日の売上集計画面でしたら、[ Home / 売上管理 / 本日の売上集計 ]のように表示されます。
MainContents
３つのカテゴリで横に分割し、それぞれの子メニューリストを縦に展開します。
マスタメニューをマウスオーバーした際のイメーです。
