SCREEN STRUCTURE
必要な情報へ迷わず到達できる画面の骨格。
- 画面一覧
- 情報の優先順位
- レイアウト
- 画面遷移
HMI DESIGN SCOPE
HMI画面設計を外注すると、
どこまでやってもらえる？
画面の見た目だけでなく、画面構成、操作フロー、状態別UIまで。
制御設計・実装との役割を分けて、必要な範囲だけ依頼できます。
EPICHARISは、制御ロジックそのものではなく、人が見て・判断し・操作する画面側を設計します。
DEFINE THE RIGHT SCOPE
CONTROLPLC / LOGICDEVICECOMMUNICATIONENGINEERING
→HMI DESIGNSCREEN STRUCTUREOPERATION FLOWVISUAL / UIUI COMPONENTS
→IMPLEMENTATIONHMI TOOLINTEGRATIONDEVICEHANDOVER
01 / SCOPE
HMIのデザインは、
「見た目」だけではありません。
HMI画面設計では、何をどこに表示するか、どの順番で操作するか、状態変化をどう伝えるかまでが設計対象です。
OPERATION FLOW
操作の目的と順序を整理し、迷いを減らす流れ。
- 操作手順
- 確認
- 戻る
- 実行
- 誤操作防止
STATE / UI COMPONENTS
装置の状態と画面の反応を一貫して伝える部品。
- ON / OFF
- 正常 / 異常
- 選択状態
- ボタン
- アイコン
VISUAL DESIGN
業務画面として読みやすく、運用しやすい見た目。
- 配色
- 文字・数値
- グラフ
- アラーム
- 視認性
02 / SCREEN STRUCTURE
どの画面に、
何を置くか。
画面一覧、情報の優先順位、レイアウト、画面遷移を整理します。単なる装飾ではなく、必要な情報へ迷わず到達できる構成を設計する領域です。
画面一覧
必要な画面と、それぞれの役割を見える化。
情報の優先順位
運転中に先に見る情報、判断に必要な情報を整理。
レイアウト
情報のまとまりと視線の流れを設計。
画面遷移
次にどこへ進むか、戻れるかを明確に。
03 / OPERATION & STATE
押した後どうなるか。
いま何の状態か。
実行、確認、取消、戻るといった操作フローと、ON/OFF、正常/異常、選択状態などの状態別UIを設計します。
実行・確認
操作の前に必要な確認と、実行後の反応を示す。
取消・戻る
操作を取り消せる状態と、戻る先を分かりやすくする。
ON / OFF
現在の状態と、操作可能かどうかを見分けられるように。
正常 / 異常
装置の状態変化を見落とさず判断できるように。
04 / VISUAL
見栄えだけでなく、
長時間使える画面へ。
配色、文字、数値、アイコン、グラフ、アラームを、視認性と優先順位のある業務画面として整理します。産業機器UIでは、見た目の統一だけでなく、装置の状態や操作可能な範囲を正確に伝える設計が重要です。
COLOR & TYPE
背景、文字、強調色の役割を定義します。
NUMBER & GRAPH
数値の読み取りや変化の把握を助けます。
ALARM
注意や異常を、優先度とともに伝えます。
CONSISTENCY
画面全体で部品とルールを統一します。
05 / DIVISION OF WORK
必要な範囲を切り出して、
相談できます。
案件や開発体制により役割は変わります。必ず同じ分担にするのではなく、必要な範囲を確認して進めます。EPICHARISのUI/HMI設計サービスについて詳しく見る
EPICHARIS / UI・HMI DESIGN
人が見て、判断し、操作する画面側- 画面設計
- 操作設計
- ビジュアル設計
- 状態別UI部品
CONTROL / IMPLEMENTATION
制御・実装側の開発領域- PLC・制御ロジック
- HMI作画環境への組み込み
- 実機との接続・動作
EPICHARIS / EXAMPLE
画面設計・
状態別UI部品
立体駐車場HMI案件での分業例。
06 / EXAMPLE
既存環境へ組み込む側と、
画面を設計する側。
画面全体のUI設計に加え、スイッチON/OFFなどの状態別UI部品を制作し、実装側で既存HMI作画環境へ組み込む役割分担の例です。
CONTROL / IMPLEMENTATION既存HMI作画環境へ組み込み
立体駐車場システムの事例を見る →