LOG54HRI2026/2/2

Unityで構築する20の動くワイヤーフレーム規格

静止画のワイヤーフレームでは、ロボティクス特有の距離感や質感、そして次に何が起こるかという「インタラクションの予兆」を十分に伝えることができません。開発の現場でしばしば直面するのは、設計図と実機の間に横たわる「感覚的なズレ」というノイズです。私は、この断絶を埋めるためには、物理的な動きと論理的な設計を繋ぐための、新しいインターフェースの「型」が必要だと考えました。

本稿では、薬剤搬送ロボットハコブくん（以下、ハコブくん）をモデルに、UnityのShader GraphやVFX Graphでの実装を想定した20の規格を提案します。

※薬剤搬送ロボットハコブくんは技術検証用の仮想設定です。実用化目的ではなく、制御・UIデザイン・HRI（人間とロボットの相互作用）の本質を探求するコンセプトとして定義しています。

インタラクションの定義

周囲への「意識」を可視化する近接演出

ロボットが周囲を認識していることを非言語で伝えるために、まずは近接・対人インタラクションの規格を整理しました。

ID	規格名	振る舞いの詳細
01	プロキシミティ・グロウ	他のオブジェクトやアバターが接近した際、その方向のエッジが発光する。
02	ソーシャル・ディスタンス・ウェーブ	一定距離内に他者が侵入した際、足元から波紋（Ripple）が広がり警告する。
03	アテンション・パルス	ユーザーが注視（Gaze）した際、ワイヤーの太さが脈打つように変化する。
04	コンタクト・スパーク	ワイヤーフレーム同士が接触した点から、パーティクルが発生する。

アクション: Proximity Glow パラメータを制御し、他のオブジェクトが接近した方向のエッジのみが発光するようシェーダーを構築する。
設計の意図: ロボットの視線や注意を可視化し、周囲のユーザーに「自分は認識されている」という安心感を与えるため。

システム状態の改修

AIの「思考」を揺らぎで示す

ブラックボックスになりがちなAIの判断プロセスを、直感的な揺らぎとして提示するアプローチです。

ID	規格名	振る舞いの詳細
05	ロード・スキャン	データ読み込み中、上から下へ光のラインが走るエフェクトを発生させる。
06	ビジー・ディストーション	処理負荷が高い際、ワイヤーの直線がわずかにノイズで歪む表現を行う。
07	ライフサイクル・フェード	生成時は点から線へ組み上がり、消滅時は粒子となって霧散する。
08	エラー・レッド・グリッチ	エラー発生時、ワイヤーが赤く点滅し、一部の頂点がランダムに跳ねる。
09	アイドル・ブレス	待機状態時、全体がゆっくりと膨張・収縮を繰り返し「生存感」を出す。

アクション: Idle Breath 規格に基づき、待機中のワイヤーフレーム全体がゆっくりと膨張・収縮を繰り返すサイン波を Vertex Offset に適用する。
設計の意図: 完全に静止した停止ではなく、いつでも動ける待機であることを示し、ハコブくんに「機械的な死」ではなく「生存感」を持たせるため。

ナビゲーションの調整

未来の進路を先回りするガイド

ハコブくんが次にどこへ向かうのか。その意図を物理空間に投影するための調整を行います。

ID	規格名	振る舞いの詳細
10	フローイング・エッジ	進行方向を示す際、ワイヤーの線に沿って光の粒が流れる。
11	パス・ハイライト	目的地までの最短ルートにあるワイヤーフレームのみが太く表示される。
12	マグネティック・スナップ	配置時、吸着ポイントに近づくとワイヤーが磁力で引かれるように歪む。
13	オリエンテーション・アロー	視界外にある場合、ワイヤーの端が矢印状に変形して方向を示す。

アクション: Flowing Edge を適用し、進行方向を示すワイヤーの線に沿って FlowSpeed に同期した光の粒を流す。
設計の意図: 静止した矢印よりも直感的に流れを感じさせ、オペレーターがハコブくんの進路を「予兆」として捉えやすくするため。

環境・物理反応の同期

速度と死角のリアリティ

バーチャルなUIが物理空間の法則に即していることを示すための規格です。

ID	規格名	振る舞いの詳細
14	ベロシティ・ストレッチ	移動速度に応じて、進行方向とは逆にワイヤーが尾を引くように伸びる。
15	オクルージョン・ゴースト	壁の裏に隠れた際、透過度の高いドット状のワイヤーに切り替わる。
16	サウンド・リアクティブ	周囲の音量やピッチに合わせて、ワイヤーの頂点が振動する。
17	アンビエント・カラーシフト	環境光に合わせ、ワイヤーの色が補色に変化して視認性を保つ。

アクション: Occlusion Ghost を設定し、壁の裏に隠れたワイヤーを Dither ノードを用いた透過度の高い表現に切り替える。
設計の意図: 物理的な遮蔽を無視するのではなく「隠れているが把握している」という状態を表現し、空間の連続性を維持するため。

構造可視化の整理

データの密度を触覚的に伝える

複雑なシステムの構造を、直感的に理解可能な形に分解して提示する手法です。

ID	規格名	振る舞いの詳細
18	レイヤー・エクスプロージョン	詳細確認時、構造がパーツごとに離散（爆発分解）して内部を見せる。
19	コネクティブ・リンク	関連する2つのオブジェクト間に、動的に結ばれるワイヤー線が出現する。
20	データ・デンシティ・メッシュ	情報密度が高い箇所のポリゴン分割数が動的に増え、細かくなる。

これらの規格は、UnityのShader Graphによる共通化とVFX Graphとの連携によって、ハコブくんのシステム内に軽量かつ高品質に実装可能です。共通のカスタムシェーダーに GlowIntensity や FlowSpeed といったプロパティを持たせることで、コードを書かずに演出の微調整が行えるようになります。

「動くワイヤーフレーム」が共通言語として定着すれば、開発者は意図を正確に実装に落とし込め、運用者はロボットの振る舞いを直感的に理解できるようになるでしょう。この視覚的な信頼関係こそが、ロボティクスUXの質を向上させる鍵であるようです。