UI / HMI UX
Designer:
Kizuku Kitada,Mio Shimizu
生産ラインの状況を一目で把握し、素早い対応を可能にするダッシュボードです。旧来の画面を刷新し、最小限のグラフィックと規則的なルールで、学習コストを抑えながら多くの画面へ展開できる基盤を構築しました。
課題設定
生産ラインの管理画面に求められるのは、今ラインが正常か異常かをひと目で判断できることです。異常の兆候をいち早く拾えれば素早い対応につながり、現場の安心にも直結します。ところが運用が進むにつれ、既存のデザインでは状況が掴みにくく、使いづらいという問題が顕在化していました。そこで「必要な情報に、迅速に辿り着ける画面にできるはず」を出発点に、状況が直感的に伝わる画面を目指しました。
観察・洞察
まずムードボードでさまざまなダッシュボードの見せ方を集めました。グラフや数値を主役にした画面、暗い背景でデータを際立たせた画面などを並べる中で、情報が多い生産ラインの画面にはどんな見せ方が合うのか、その雰囲気の方向性を探っていきました。ここで固めた表現のイメージをワイヤーフレームに落とし込み、色や装飾に左右されない段階で、異常の知らせ・グラフ・一覧といった要素の優先順位と配置を固めています。この土台が、その後の画面づくりを支えています。
アイデア展開
骨格が固まったら、次は「どう見せれば直感的に伝わるか」の検討です。数字が多く並んでいた部分をグラフィックで表現し直し、画面を見た瞬間に状況を掴めるようにしました。「良い・悪い」「増えている・減っている」といった状態を視覚的に浮かび上がらせる狙いです。さらに平面にとどまらず3Dの要素も取り入れ、情報に奥行きと分かりやすさを持たせています。状況の把握を助ける表現として、グラフィックと立体感を使い分けました。
検証
表現を詰める過程では、いくつかの案を試しながら最適な形を探りました。光沢のある立体的なUIの案もあり、その検証を通じて「重要な情報」や「異常」をより際立たせる見せ方の大切さに気づけました。また、色数を絞るほど画面の一貫性が高まり、統一ルールを作りやすく、「多くの画面に展開できる設計基盤」に乗せやすくなります。
状況をひと目で見せる
稼働状況・エラー・在庫といった要素をカード状に整理し、必要な情報へ最短で辿り着けます。グラフや数値を大きく前面に配置することで、担当者がラインの状態を数値とビジュアルの両面で即座に把握でき、的確な判断につなげられます。
展開しても崩れない設計基盤
核となるメインページをPCとスマホの両方でしっかり作り込み、カラー・タイポグラフィ・レイアウトの原則をこの中に凝縮しました。大型モニタでの一覧表示から手元のスマホでの確認まで、同じデザインルールのまま無理なく広げられる設計です。最小限の飾りとシンプルなルールに支えられ、画面が増えても崩れず、統一感のあるHMIを実現しました。
HMI:A
たどり着いたのは、最小限の飾りとシンプルなルールで、多くの画面に展開できる設計基盤です。優先度を整理してグラフィックで見せることで、複雑な生産ラインの状況もひと目で把握できる画面になりました。表現を洗練させ、統一されたルールの上に組み立てたことで、画面が増えても一貫した分かりやすさを保てます。情報の多い画面をどう整理し、どう見せるか、その問いに確かな答えを出せました。
つくりたい体験の、その先まで。
事業に並走してUI/UXをデザインします。
お問い合せ
プロジェクトの課題をお聞かせください
イノベーションはコラボレーションを通して実現されます。
私たちがどのように新しい製品体験の創出をサポートできるかご提案いたします。
ご相談いただいた内容は、守秘義務契約の有無にかかわらず機密情報として取り扱いいたします。