照明コンフィギュレーターは、製品のすべてのオプションを体験できるインタラクティブなディスプレイとして機能します。コンセプト設計の段階から、ウェブサイト上でのセールスツールに至るまで幅広く活用可能です。特にライトのオン・オフを切り替えて影の変化を表示できる機能は、実店舗の環境では再現が難しいディテールを強調するために不可欠です。さらにAR機能を使用することで、顧客は購入前に実際の空間で照明のデザインをプレビューできます。
この照明コンフィギュレーターの目的は、製品ラインナップ内のさまざまなバリエーションを展示し、それらをシームレスに切り替えて確認できるようにすることです。各バージョンには以下の特徴があります:
最終的なバリエーションは、ARでプレビューして実際の空間に配置した様子を確認することもできます。
モデルはRhinoで作成され、その後 インポート .fbxファイルとしてVectaryにインポートされました。RhinoはNURBSジオメトリを使用しますが、Vectaryはメッシュジオメトリをサポートしているため、これらのフォーマット間の変換を検証することが重要になります。今回のケースでは、モデルのサーフェスが比較的シンプルだったため、Vectary内でシーン全体をスムーズに保つためのジオメトリの特別な調整は必要ありませんでした。
ライティングは重要な役割を果たすため、最初のステップでは、 ライトの強度を調整して 環境設定で手動配置したライトの効果を優先させます。通常、レクタングルライトは精密なライティングと影の表現が可能ですが、今回のプロジェクトのように 電球をシミュレートする場合は、ポイントライトが最適な選択肢となります。
2つのポイントライトを作成しました。1つは高強度のライトで、「Light on」ボタンが選択されたときに表示されます。もう1つは、やわらかく控えめな強度のライトで、「Light off」の状態用です。
マテリアルに関しては、ざらつきのあるプラスチックやメタリックパネルといったシンプルなテクスチャを用いて、ニュートラルな質感に仕上げることを目指しました。電球(ガラス)の部分には特にこだわりを持たせました。現実世界では、ライトが点灯しているときは電球がすりガラスのように見え、消灯しているときはガラスが透明になって内部のワイヤーが見えるようになります。
このオン/オフの状態を3Dで再現するため、電球のガラス部分用に2つのマテリアルを作成しました:
「Lights on」ボタンを選択したときに表示される、すりガラス調のエミッシブマテリアル。「Lights off」ボタンを選択したときに表示される、わずかな傷が入った透明マテリアル。



インタラクションは、ライトのオン/オフの切り替えから始まります。この効果を実現するには、Floating UIで作成した2つのボタンをトリガーポイントとして使用する必要があります。インタラクションは、ライトをオンにするものとオフにするものの2つが設定されています。
ライトをオンにするには、「point light 1」(明るく発光するライト)を表示し、「point light 2」を非表示にします。さらに、電球ガラスのマテリアルを発光するすりガラス調のものに切り替えます。ライトをオフにする場合も同様の手順ですが、今回は「point light 2」を表示し、電球ガラスのマテリアルを透明なものに切り替えます。
ライトのオン/オフ機能が完成したら、次はシェードの変更に移ります。まず、3つの異なるシェードオプションを持つバリアントをセットアップします。次に、表示されるシェードをコントロールするために、3つのボタンを備えた別のFloating UIを作成します(ボタンまたは「name 1」をクリックするとシェード1が表示されるように設定し、他の2つのシェードについても同様のインタラクションを複製します)。
最後に、このプロジェクトでは各シェードのアニメーションを表示し、さまざまな光と影の効果をデモします。各シェードの「開く/展開(open/unfold)」および「閉じる/折りたたむ(closed/folded)」を含む、合計6つのステートを用意します。各シェードには、それぞれのアニメーションをトリガーするための専用グラフィックを持つ2つのFloating UIを配置します。あとは、表示/非表示(visibility)機能を使用して、関連するアニメーションをトリガーする適切なグラフィックが、適切なタイミングで表示されるように設定するだけです。
すべてのインタラクションが完了し、プロジェクトを共有する準備ができたら、全体の体験をさらに高める最後のステップであるAR(拡張現実)を設定しましょう。この機能を有効にすることで、ユーザーは実際の空間でプロジェクトを確認できるようになります。今回のケースでは、ランプが特定のインテリアにマッチするかどうかを確かめたり、「開く(open)」から「閉じる(close)」へのアニメーションがどのように動くかを視覚的に確認したりするのにARが非常に役立ちます(VectaryはARでのアニメーション再生に対応しています)。

