このブログは「GUI for Embedded Applications: Expert Design Insights & Trends」の抄訳です。
現代の組み込みデバイスは、医療機器、自動車のダッシュボード、産業用制御システムなど、私たちの身の回りのさまざまな場面で使われています。しかしその一方で、組み込みアプリケーション向けの GUI を設計することは、製品開発の中でも特に難しい領域のひとつであり続けています。
そこで私たちは最近、合計 60 年以上の業界経験を持つ 4 名のエキスパートを招いたウェビナーを開催し、組み込み GUI デザインの現実について議論しました。
「何がうまくいっているのか」「何がまだ課題なのか」、そして「この分野はこれからどこへ向かうのか」――実践的な視点から率直な意見が交わされました。
登壇者:
• Shawn Dorsey - Qt UI/UX シニアマネージャー
• Jason Manns - Qt シニア・テクニカルアーティスト
• Dennis Lenard - Creative Navy 創業者 兼 マネージングディレクター
• Sven Heller - Create Next CEO
以下では、組み込みシステム向け GUI デザインの進化、直面している課題、そして今後の展望について、彼らが語った内容を紹介していきます。
Q: この 20 年間で、組み込み GUI デザインはどのように進化してきましたか？
Sven Heller: 本質的には、何も変わっていません。良いデザインとは今も昔も、明確さ、目的意識、そして実際に使う人のためにきちんと機能することだからです。
ただし、私たちを取り巻く環境は劇的に変化しました。対象となる分野は大きく広がり、システムの複雑さも増しています。また、ツールは以前とは比べものにならないほど高機能になりました。
さらに、組み込みデバイスのデザイナーと開発者の協業は、20 年前と比べてはるかに強固になっています。私たちは今も同じ根本的な課題に取り組んでいますが、現在ではそれをより優れた手法、技術、そして理解によって解決できるようになっています。
Dennis Lenard: 大きく変わったのは「ユーザー」です。20 年前、組み込みアプリケーション向けの GUI を設計するということは、デジタル地図を一度も見たことがなく、そもそもそれが何かも知らない人に向けてデジタル地図を設計するようなものでした。
しかしこの 20 年の間に、人々はさまざまな体験を通じて、一定の期待値を持つようになりました。
もはや「完全な初心者」を前提に設計する時代ではありません。もちろん、組み込みシステムでは今でも多くを前提にしすぎることはできませんが、ビジュアル言語はより洗練され、ニュアンスのあるものになっています。
レイヤー構造を持たせることができるようになり、デザイナーとしては、分かりやすさと親しみやすさを意図的に作り込めるようになりました。これは非常に面白い変化です。
また、目指すレベル自体も変わってきました。20 年前は「そもそもインターフェースをなくせないか？」という議論が多かったのに対し、今ではステークホルダーの側から「もっと良いインターフェースを作りたい」という要望が出てきます。
これは数値化しにくい変化ではありますが、非常に大きな転換点だと感じています。
Shawn Dorsey: 私自身は、映画やミュージックビデオのビジュアルエフェクトからキャリアをスタートし、その後は実験的なマーケティング分野で、モーションやビジュアル体験の制作に携わってきました。そして現在は組み込みデザインに取り組んでいますが、感情やインタラクションの原則は、これまで以上に重要になっていると感じています。ただし、そこにかかる「重み」はまったく異なります。ここでは一瞬の「すごい！」という驚きが目的ではありません。人々が日常的に頼り、場合によっては安全に直結する状況で使われるインターフェースを作ることが求められます。
私はずっと「体験」をデザインしてきましたが、制約や使われる文脈は、時代とともに常に変化し続けています。
Jason Manns: まさにそこが重要なポイントだと思います。私たちは皆、根っこではアーティストでありデザイナーですが、実際に作っているものは極めて機能的なものです。
特に医療、航空宇宙、防衛といった分野では顕著です。そこでは、人命を預かる立場の人たちが、私たちの作ったボタンを押し、私たちが設計した小さなデザインを見ながら判断を下しています。
そうした現実を意識すると、この仕事にはどこか確認されるような感覚や、大きなやりがいがあります。非常に満足感のある仕事だと感じています。
ウェビナー全編はこちら: Designing for Modern Devices - 組み込みアプリケーションのデザイナーが直面する課題と最新トレンド
Q: 組み込みGUIのワークフローにおいて、ツールはどのように進化してきましたか？
Sven Heller: 初期の頃は、ツールそのものが障害になることもありました。問題解決よりも、Photoshopと格闘している時間の方が長かったほどです。当時、組み込み機器向けUIデザインに使えるプロフェッショナルなツールは事実上それしかなく、しかも非常に扱いづらいものでした。コンポーネントもなく、再利用できる要素もありません。
例えば、同じボタンがデザイン内に50個あって、そのうち1つを変更したい場合、50個すべてを手作業で修正する必要がありました。開発者への引き渡しはJPG画像で、そのJPGの上に直接メモを書き込んでいたんです。
次のフェーズでは、SketchやAdobe XDといったツールが登場しました。これらによって、開発者とのコラボレーションが多少スムーズになり、初期段階からプロトタイピングを行って「この製品がどう動くのか」を体感できるようになりました。そしてこの流れの中で、事実上の勝者となったのがFigmaです。コンポーネントシステムやデザインシステム、そして優れたコラボレーション機能を備えています。
そして今、私たちはAIツールが協業パートナーになる新しい時代に入りつつあります。構造を生成し、選択肢を探索し、バリエーションを作り、検証を高速化してくれる。まだ始まったばかりですが、その進化スピードは驚異的です。
Jason Manns: アニメーションツールの進化も非常に大きいですね。コードを1行も書く前に、マイクロインタラクションをプロトタイプ化し、実際のデバイス上で「どんな感触か」を確認できるようになりました。これは本当に強力です。
Riveのようなアニメーションツールは人気が高まっていますし、Qt Design Studioは組み込み用途に特化して作られている点で、非常に革新的です。今後は、実機上での検証や、最適化を直接テストできるような、より組み込み向けの機能がツールに増えていくことを期待しています。
Q: 同じ期間において、変わっていないことは何でしょうか？
Sven Heller: 変わっていないものは3つあると思いますし、おそらく今後も変わらないでしょう。まず最も古いものから挙げると、約90年前に生まれたディズニーのアニメーション原則です。これは、漫画のキャラクターをより信頼できる、生き生きとした存在にするための最初の試みでした。ディズニーは12のアニメーション原則を定義しましたが、これは今でも映画制作で使われていますし、ユーザーインターフェース設計、特にインタラクションデザインの中にも見られます。
組み込みデバイスの画面でアニメーション作品を作るわけではありませんが、これらの原則はユーザーとのつながりを生み、魅力的で自然な動きを実現するうえで非常に役立ちます。
2つ目は、約50年前に提唱されたディーター・ラムスの「良いデザインの10原則」です。プロダクトをデザインする際、私たちは今でもこれらの“戒律”に従うべきですし、実際、私たちが愛用している製品、たとえばスマートフォンの中にもこれらの原則は息づいています。
そして最後に、個人的にいつも立ち返るのが、スティーブ・クルーグの著書
『Don’t Make Me Think』 です。
デザインが本当に良いかどうかを確かめたいとき、私は必ずこの本を基準にします。なぜなら、良いデザインは「分かりやすさ」を生み出すからです。
結局のところ、テクノロジーが進化しても、原則は変わらず、安定しています。それらは混沌とした時代における「錨（アンカー）」のような存在なのです。
Dennis Lenard: もうひとつ変わっていないのは、人間の思考そのものです。現在は、より多くの研究や調査があり、ルールやフレームワークも充実していますが、根本的に人間の脳の働き方は、技術や文化が変わっても変わりません。
そしてこれは二つのレベルで当てはまります。
ユーザーに対してだけでなく、製品を開発するチームの人たちに対しても同様です。私たちデザイナーは、エンドユーザーであれチームメンバーであれ、他者を理解することに長けた立場にいると思います。その理解を出発点として、組み込みGUIにとって非常に重要な「共通認識」を作り上げていくことができるのです。
Q: 組み込みGUI開発において、最も大きなデザイン上の課題は何ですか？
Dennis Lenard: 最大の課題は、すべてのデザインが固有であり、万能な方法論は存在しないという点です。これはとても重要なことだと思っています。というのも、新しいプロジェクトに対して、先入観や思い込みを持って取り組んでしまうと、そこから問題が生じやすくなるからです。
私自身は、ある意味で「自分がやるべきだと思っていることの逆」を試すようにしています。そうすることで、選択肢を狭めずに済むのです。本当のブレークスルーは、たいてい完全に想定外だった領域から生まれます。そこにこそ、前進の鍵があるのだと思います。
Q: 組み込みアプリケーション向けGUIの設計は、Webデザインとどう違いますか？
Sven Heller: 違いは本質的なものです。Webデザインはミスに対して比較的寛容ですが、組み込みデザインではそうはいきません。まず大きな違いとして挙げられるのが、ハードウェアの制約です。
Webデザインでは、さまざまな画面サイズに対応するレスポンシブレイアウトを前提に設計します。一方、組み込みGUIでは、解像度が固定されたディスプレイを扱うことが多く、さらに色数やリフレッシュレートが制限されている場合も少なくありません。
組み込みアプリケーション向けGUIは、強いストレス下や安全性が重要となる状況で使用されることが多く、明確さと信頼性を確実に伝える必要があります
利用される文脈（コンテキスト）も非常に重要です。Webインターフェースは、たいていオフィスや自宅といった落ち着いた環境で使われます。一方、組み込みGUIは、工場の現場、病院の手術室、あるいは車両のダッシュボード内など、まったく異なる環境で使われることがあります。
オンラインでピザを注文するようなリラックスした状況と、機械を操作するような強い緊張を伴う状況とでは、ユーザー体験の設計に求められる考え方は決定的に異なります。こうした違いを理解することが、組み込みGUIデザインでは極めて重要です。
Shawn Dorsey: 安全性が重要かどうかで、すべてが変わります。
Webデザインでは、何か問題が起きてもページがクラッシュして、ユーザーがイライラする程度で済みます。しかし組み込みデザインでは、操作ミスが現実世界での危険や重大な結果につながる可能性があります。
たとえば、温度表示や医療データの表示を誤れば、命に関わる事態になりかねません。
つまり、前提条件がまったく違うのです。重視されるのは、コンバージョン率やエンゲージメント指標ではなく、制御性・安全性・信頼性です。
Dennis Lenard: 期待値そのものも違うと思います。Webデザインでは、基本的には過去に誰かがやったことを踏襲し、少しだけ変える、という形になります。それは仕事が簡単という意味ではなく、Webインターフェースがどう動くかについて、人々の間に共通認識があるからです。一方、組み込みGUIでは状況がまったく異なります。そこには共通理解がなく、それを作り上げる責任をデザイナー自身が負う必要があります。
だからこそ、想定外のことも起こりやすいのです。
デザイナーであれば、これまでに何百ものWebサイトやモバイルアプリを目にしてきたでしょう。しかし、医療機器にどれだけ触れてきましたか？ フォークリフトの画面は？ おそらく、ほとんど、あるいはまったくないはずです。
Q: デザインのビジョンと技術的な実装のギャップを、どのように埋めていますか？
Shawn Dorsey:ここが本当に面白いところです。デザイナーとしては、美しく、魅力的な体験を作りたいと思っています。一方で、開発側とは「実際に何が実現可能か」という点について、常にすり合わせが必要になります。以前、心臓の3Dアニメーションを作ろうとしたプロジェクトがありました。心臓が回転し、さまざまな角度から見られる表現です。デザインの観点では完璧でした。視覚的に魅力があり、情報としても非常に分かりやすかったのです。ところが、3Dモデルの最適化という現実的な問題に直面しました。「実機のハードウェア上で、その心臓はピクセルが粗くなって崩れてしまわないだろうか？」という懸念です。開発側は「パフォーマンスは問題ないから大丈夫」と言いますが、デザイナーとしては描画品質そのものが気になります。
最終的には、画像シーケンスを使った2.5D表現で折り合いをつけました。
3Dモデルからレンダリングした画像を使うことで、見た目は3Dのように見せつつ、リアルタイム3Dレンダリングを行わないためパフォーマンスも良好です。こうした妥協点を一緒に見つけていくプロセスこそが、組み込みGUIデザインの難しさであり、同時にやりがいでもあると感じています。
Q: デザインが最終製品で正しく再現されるよう、どのようにしていますか？
Dennis Lenard: 以前、船舶用のダッシュボードを手がけたことがあります。そこでは、さまざまなセンサーから大量の情報を表示する必要がありました。私たちは「情報は常に一定の頻度で流れ、数秒ごとに正確な更新が得られる」という前提で設計していました。ところが、実際の環境でテストしてみると、それが成り立たないことが分かりました。情報の更新は不安定で、必ずしも常に最新・正確とは限らなかったのです。気づいた時点ではすでに工程のかなり後半で、その要素の見せ方を大きく見直し、インターフェース上での重要度を下げる必要がありました。
これは組み込みGUI設計では本当によくある話です。自分がこれまで一度も体験したことのない状況なので、事前にはなかなか想像できません。だからこそ、「インターフェースが実際に何をするのか」「どのように振る舞うのか」について、開発者との密なコミュニケーションが非常に重要になります。
Jason Manns: デザイナーと開発者は、どうしても注目するポイントが違います。私たちは見た目や表現、美しさといったアートの部分に目が向きがちです。一方で、開発者は「正しく動くこと」を最優先に考えます。あるプロジェクトでは、ロゴや配色、ブランド要素など、顧客から明確なデザイン要件が提示されていました。しかし、デザインを開発側に引き渡したところ、「その方が動作が良いから」という理由でフォントが変更されてしまったことがありました。開発者は、それがブランドの一部であり、勝手に変えてはいけないものだとは思っていなかったのです。
結局のところ、どのプロジェクトにも2つの異なる考え方が存在します。だからこそ、両方の視点を尊重し、すり合わせるための協業の場が必要なのです。
Sven Heller: 理想的なのは、最初の日からデザイナーと開発者が一緒に取り組むことです。そうすれば、双方が同じ全体像を共有できます。私たちはよく「デザインの引き渡し（ハンドオフ）」について話しますが、本来それは一度きりの作業ではなく、継続的なコラボレーションであるべきです。最も良いケースでは、そもそも「引き渡し」をしている感覚すらありません。最初から最後まで、一つのチームとして一緒に作っているのです。
Q: 今後、AIは組み込みGUIデザインにどのような影響を与えると思いますか？
Jason Manns: 私は基本的に、「アートやデザインを生み出すのは人間であるべきだ」と考えています。AIは、人間に足りない部分を補う存在であるべきです。たとえば、AIはプロトタイピングの分野で非常に有効です。現在でも、静的なデザインを作ると、AIがそれに基本的な動きを加えてプロトタイプにしてくれるツールが増えてきています。ただし、現時点ではAIが完全なアプリケーションを一から構築できる段階にはまだ達していません。
今後20年を見据えると、いずれはそこまで進化することになるでしょう。そのとき、デザイナーはAIと共存する方法を見つけていく必要があります。私は基本的には楽観的ですが、生成系AIの一部については少し不安を感じることもあります。それでも将来的には、組み込み分野に特化したAIツールがもっと登場してほしいと思っています。実機ハードウェア上での検証、最適化のテスト、より高度なアニメーション制御やプロトタイプ作成を支援してくれるようなツールですね。
パネルディスカッションの登壇者たちによると、AI は組み込み機器向け GUI の設計をより速く進める助けにはなるものの、デザイナーの持つ創造性や表現力そのものを置き換えることはないとされています (スクリーンショット: Qt Design Studio AI Assistant)
Sven Heller: 私は、健全な懐疑心を持ちつつも、全体としては楽観的に見ています。AIは多くの作業を肩代わりしてくれますし、開発スピードも大きく向上させてくれるでしょう。その結果、組み込み分野やHMI分野で増え続ける複雑さにも、より対応しやすくなります。ただし同時に、「AIがすべてやってくれるから」と、本来必要なデザイナーやエンジニアリングの仕事を置き換えようとする動きが出てくるリスクもあります。これは非常に危険な考え方です。なぜなら、最終的に使うのは人間であり、私たち自身が「安全で、理解しやすく、責任あるもの」を設計しなければならないからです。
だからこそ、優れたHMIや組み込み機器のデザイナーは、将来ますます重要になるのであって、その価値が下がることはありません。最終的な判断を下すのは人です。AIはあくまでツールであり、良いデザインを“加速”することはできても、“生み出す”ことはできません。
Dennis Lenard: 私もかなり楽観的に考えています。この分野に本気で取り組み、専門性を高めたいと考える人が増えてきています。そうした人たちは、より高い責任感を持ち、深く関与し、高度な専門性を身につけていくでしょう。それに合わせてツールも進化しています。これは単なる技術革新ではなく、文化そのもの、そしてエコシステム全体の変化です。そうした流れによって、全体としてより良いものが生まれていくと思います。今後6〜7年のうちに、次世代のツールを使いこなす次世代のデザイナーたちが、次世代のデバイスを生み出し、驚くような成果を見せてくれるはずです。
AIは、その流れを可能にし、後押ししてくれる存在になります。ただし、ここにも危険はあります。私たちは「AIが何をするか」だけでなく、「AIに何をさせたいのか」を考えなければなりません。「十分に安いからそれでいい」という考え方が広まり、専門家や品質への期待が下がってしまう文化に陥ることが最大のリスクです。もしその悪循環に入ってしまえば、技術そのものも衰退してしまいます。
私たちは、AIにすべてを簡単にさせることを求めるのではなく、この分野の技術やデザインをより高いレベルへと磨き続ける責任があるのだと思います。
以下の質問は、ウェビナー視聴者から寄せられたものですが、時間の都合によりライブ配信中には取り上げることができませんでした。これらの質問に対して、Sven と Shawn がそれぞれ回答を寄せており、その内容を以下に掲載します。
Q: 現在、組み込み GUI デザインではどのようなビジュアルトレンドが見られますか？
Sven Heller: 現代の組み込みインターフェースを形作っているトレンドはいくつかあります。まず挙げられるのが、タイポグラフィの大型化・太字化です。数メートル離れた場所から操作されるようなユースケースでは、視認性の高さが非常に重要になります。
次に、テーマ機能の標準化です。ダークモードは単なる見た目の好みではありません。画面の映り込みを抑え、消費電力を削減できるため、電力制約のある組み込み機器では特に重要です。
そして最後に、マイクロアニメーションです。これは機能的なフィードバックを与えるためのもので、組み込みシステムの GUI でボタンを押した際に、「操作が受け付けられた」という即時の視覚的確認をユーザーに提供します。
より広い視点で見ると、実装はますます洗練され、魅力的なデザインを通じて製品やブランドの品質を効果的に伝えるようになっています。インターフェースは大きくなっている一方で、同時によりシンプルでクリーンにもなっています。すべての情報を一度に表示するのではなく、文脈に応じて必要な情報を提示することで、ユーザーのストレスや疲労を軽減しています。
Shawn Dorsey: Sven が挙げた点に加えて、私が感じているのは 2.5D 表現やレイヤリングの利用が増えていることです。多くのプロジェクトでは、「2D にするか 3D にするか」という選択で行き詰まることがありますが、影やグラデーションを使うことで、重たい 3D レンダリングを使わずに視覚的な階層構造を表現できます。
このアプローチは、パフォーマンスを維持しながら奥行きや視覚的な魅力を加えられる点が大きなメリットです。
Q: 組み込みアプリケーション向け GUI をプロトタイピングする際、どのようなアプローチを取っていますか？
Sven Heller: 組み込み向けのプロトタイピングは、体験そのものを検証するプロトタイピングだと考えています。Web デザインであれば、初期の画面遷移やフローを確認する目的では、PC 上の単純なクリックダミーでも十分な場合があります。しかし、組み込みデザインはそれほど単純ではありません。画面だけでなく、その画面が使われる「環境」そのものをプロトタイプする必要があるからです。
つまり、組み込みプロトタイピングで検証すべきなのはインターフェースだけではなく、状況そのものです。照明条件、周囲の環境、ユーザーの動き、ストレス状態――これらはすべて、操作体験を大きく左右する要素です。スタジオではうまく機能していたものが、実際の現場ではまったく通用しないことも珍しくありません。
そのため私たちは、UI プロトタイプ実機ハードウェア、またはハードウェアのモック、センサー値のシミュレーション、実際の使用シーンでの検証、これらを組み合わせて使う必要があります。
こうしたアプローチを取って初めて、操作のタイミング、触感（ハプティクス）、そして利用コンテキストを正しく理解できるのです。
Q: 組み込みアプリケーション向け GUI デザインで成功するには、どのようなバックグラウンドが重要ですか？
Sven Heller: 優れた組み込み GUI デザイナーは、しっかりとした UX/UI の基礎を持っていることが多く、できれば基本的な技術知識やコーディングの理解があると理想的です。ユーザーを観察し、その行動を理解し、常にユーザーを中心に据えて考えられる能力は非常に重要です。また、考えるべき対象は「画面」だけではありません。人の行動やシステム全体を捉える視点が欠かせません。その意味では、デザインに関心を持つソフトウェアエンジニアも、十分にこの役割を担うことができます。重要なのは職種ではなく、どういう考え方（マインドセット）で取り組んでいるかなのです。