8.1.5 GUI画面設計のポイント
GUI画面の設計ではさまざまな機能が利用できるので,大量の画面を必要とする基幹業務などへの適応ができます。しかし,利用できる機能が多ければ多いほど,ポイントを絞って設計しなければ煩雑な画面になってしまいます。
ここでは,より快適に業務を行うための画面の設計のポイントについて説明します。
- 〈この項の構成〉
(1) 使いやすいGUI画面の特長
使いやすいGUI画面の特長を次に示します。
-
操作方法が統一されている。
-
画面のサイズ,形式が画面の種類ごとに統一されている。
-
入力必須,選択必須の項目は,スクロールしなくても必ず表示される位置にある。
-
操作を画面上だけに集中させず,マウス操作やキー操作にも割り振るなどして,最も簡潔な方法で操作できるようになっている。
-
画面上で使用している色数が適当である。また,長時間作業していても目に負担を掛けない色使いである。
(2) GUI画面を設計するときの検討課題
GUI画面を設計するときには,次の点をよく検討します。
(a) 画面中の機能の絞り込み
一つのGUI画面には,まとまりのある機能を持たせます。最初に表示する画面にはなるべく汎用的な機能を持たせ,そこから二次ウィンドウやダイアログに制御を移していく方が,画面を効率良く使えます。
(b) 操作方式,画面形式の統一
操作方式や画面形式を統一すると,初めて操作する画面でもそれまでの経験を基に操作できるので,効率良く作業ができます。また,決まった機能を持つボタンの位置が画面間で統一されていれば,誤入力や誤操作を防げます。
- (例)
-
画面を終了するときに表示されるダイアログのボタンの配置は,常に「はい」「いいえ」「キャンセル」の順である。
(c) 使用している色の考慮
GUI画面の特長である多彩な色を使いながら,見やすい画面にするには,次の点に注意してください。
-
目立たせたい項目を決め,背景色とは対立する色を指定する。それ以外は同系色でまとめる。
-
使用する色は統一する。
(タイトルバーの色,背景色の色,エラーダイアログの色など)
-
目が疲れないように,広範囲の色には彩度の低い色を使う。
-
文字色には必ず見やすい色を使う。
-
モノクロの画面や液晶画面で表示されることも考慮する。
-
色弱者を考慮する(赤と緑の組み合わせを避けるなど)。
(d) ユーザレベルの考慮
熟練者でも初心者でも操作しやすいように配慮してください。
- (例)
-
初心者用のガイドを用意する。ただし,熟練者には必要ないので画面上に常駐させない。
(e) PFキー,テンキー入力の利用
操作をすべて画面に集中させずに,今までのオペレーションとの連続性や手間などを考慮して機能を割り振ってください。
(f) ハードウェアデバイスの影響
ブラウン管や液晶画面などのハードウェアデバイスによって,表示結果やサイズが異なる点を考慮してください。
(g) 基幹業務で利用するということ(AP生産性,保守性の配慮)
基幹業務は,大量の画面,APから構成されています。また,常に変更・更新されます。これらの点を考慮して,生産性,保守性,信頼性について十分,検討してください。
(h) CUI画面での操作に対応するGUI画面の機能
これまでCUI画面上で操作していたものをGUI画面に移行させる場合,各フィールドに対応するGUIの機能は次のようになっています。
- キー入力するフィールド
-
CUI画面でキー入力していた各フィールドは,目的に応じて次の分類のオブジェクトに割り振れます。各オブジェクトの詳細は「8.5 GUI画面で使用するオブジェクトの詳細」を参照してください。
- キーエントリしていたフィールドに対応するGUI画面の機能
-
-
直接,入出力するもの
「入出力テキスト・フィールド」「入出力日付テキスト・フィールド」「入出力時刻テキスト・フィールド」
-
選択して入出力するもの
「コンボボックス」「ポップアップテキスト・フィールド」「スピンボックス」
-
- 固定(ラベル)フィールドに対応するGUI画面の機能
-
「固定テキスト・フィールド」「出力テキスト・フィールド」「出力日付テキスト・フィールド」「出力時刻テキスト・フィールド」
- 一覧を表示するフィールドに対応するGUI画面の機能
-
「フィールドボックス」「リストボックス」「テキスト・フィールドの反復」
- PFキーなど画面を確定し,APに制御を渡して処理をコントロールするものに対応するGUI画面の機能
-
-
CUIでのファンクションキー操作をそのまま使いたい場合
「GUIのボタンにPFキーや送信キーを割り振って使う」
「GUIのボタンとPFキーを組み合わせて使う」「プッシュボタン」
-
GUI画面の機能を利用したい場合
「メニューバー」「テンキー(自動送信と組み合わせて使う)」「ラジオボタン」「チェックボタン」「トグルフィールド」
-