3Dシミュレータが作れるシステムだれでも
シミュレータ

COLUMN

だれでもシミュレータ：コラム記事

シミュレーターの作り方：組み合わせは無限大。ダイナミック機能で実現する、多数バリエーション対応WebARの作り方

2024.08.15

「色違いや形状違いの商品をすべてAR化するのは手間がかかる」と思っていませんか？

だれでもシミュレータの「ダイナミック3Dオブジェクト」と「ダイナミックマテリアル」機能を使えば、膨大なバリエーションも効率的にAR化できます。

本記事では、ユーザーがブラウザ上で選んだ「自分だけの組み合わせ」を、瞬時にiOS・Android対応のWebARとして表示させる設定手順を具体的に解説します。

ー

多数のバリエーションに対応したWebARが作れる理由

理由①
3Dデータを瞬時にWEB変換しパーツ化。そのパーツそれぞれを自由に組み合わせられる
理由②
Web変換した3DをiOS用、Android用それぞれに自動でWebARに変換するシステムだから

ー

だれでもシミュレータを使ったWebARの作り方

ステップ1：3Dデータの準備

RhinocerosやSketchUpから書き出したOBJファイルを活用します。
この際、パーツごとに分割して書き出すことで、後の『ダイナミック3Dオブジェクト』の設定がスムーズになります。

登録した3Dメッシュデータ一覧

作り方の基本
3DCGやCADソフトから「obj」形式の3D形状データを出力します。この時、形状やカラーなどのバリエーションがある場合はそのバリエーションの数だけ、objデータを用意します。

形状にバリエーションがある場合
objデータをバリエーションの数だけ用意し「3Dメッシュデータ」として登録します。

色・素材にバリエーションがある場合
マテリアルをバリエーションの数だけ「マテリアルデータ」として登録します。

3Dオブジェクトとして登録
「3Dメッシュデータ」と「マテリアルデータ」を組み合わせ、ウェブで表示できる「3Dオブジェクト」として登録します。
この時、形状が違っても素材・色は同じ、というケースなら、異なる「3Dメッシュデータ」に同じ「マテリアルデータ」を何度でも組み合わせられます。つまり一つの「マテリアルデータ」を複数の「3Dオブジェクト」に使い回しができるのです。
逆に、形状が同じで「色・素材にバリエーション」にバリエーションがある場合は、同一の「3Dメッシュデータ」を使い回せます。

ステップ2：だれでもシミュレータで設定

だれでもシミュレータ：シミュレータ画面でバリエーション選択
シミュレータ上でのバリエーション表示

形状違いの場合
「ダイナミック3Dオブジェクト」を使うことで、1つのシミュレーター内で形状を切り替えてAR表示できます。

色・素材違いの場合
「ダイナミックマテリアル」を使うことで、3Dモデルを増やすことなく、テクスチャの切り替えだけで無限のバリエーションに対応できます。

ステージに「ダイナミック3Dオブジェクト」「ダイナミックマテリアル」を登録
「ダイナミック3Dオブジェクト」「ダイナミックマテリアル」の登録が済んだら、最後にステージ設定を行います。
ステージ設定で「ダイナミック3Dオブジェクト」「ダイナミックマテリアル」（ダイナミックマテリアルの場合は組み合わせた「3Dオブジェクト」も一緒に）を登録する事で、使用可能になります。

ステップ3：WebARを表示・シェアする

保存したURLをクライアントに送れば、相手のスマホでも、選んだ仕様のままAR表示が可能です。非対面営業での強力なプレゼンツールになります。

WebARの表示方法
ステージ設定で構築されたシミュレータ画面を「公開URL」で開きます。
シミュレータ画面が開くので、あとは自由に組み合わせを選択。組み合わせができたら、画面内の「AR」ボタンをクリック（またはタップ）するだけ。それだけでWebARに変換されて表示されます。WebARはiOS・Androidどちらでも表示可能です。

WebARのシェア・配布方法
だれでもシミュレータにはシミュレーション結果を「お気に入り」として保存する機能と、そのシミュレーション結果を「コード」でシェアする機能があります。
シミュレータ画面で組み合わせができたら、その組み合わせを画面内の「♡」マークでお気に入り保存。お気に入り一覧で保存したお気に入りが確認できるので、そこからURLをコピペすれば、組み合わせ内容をそのままシェアできます。

ー

「そもそも、CADデータをWebサイトに埋め込む基本手順から知りたい」という方はこちらをご覧ください。

関連記事： [3DCADをWebサイトへ埋め込み・活用するための完全ガイド]

　　　　　　　　　

ランキング

機能アップデート

もっと見る

シミュレーターの作り方

もっと見る

おすすめの使い方

もっと見る

商品画像からシミュレータを作る。3Dモデルがなくても始められる2Dシミュレータ

商品画像から2Dシミュレータを作る方法をご紹介。だれでもシミュレータを活用すれば、商品の色やデザインを切り替える仕組みを試せます。

3Dにする意味は？写真は「見る」だけ。3Dなら商品を「体験」してもらえる

写真では伝えきれない商品の形や質感、さまざまな角度からの見え方を、3Dなら実際に動かしながら確かめてもらえます。

3Dで何ができる？「見るだけの商品」を、「選べる・試せる商品」に変える

色や素材、パーツの組み合わせを変えながら商品を試せる。3Dシミュレーターなら、商品を見る体験を選ぶ体験に変えられます。

うちの商品でも作れる？シミュレータに向いてる商品・向かない商品

3Dシミュレーターは幅広い商品に利用できます。ただし、選択肢によって見た目が変わり、結果を3Dで確認する価値がある商品に向いています。

実際、いくらかかる？3Dシミュレーターの費用を「何を実現するか」で決める

3Dシミュレーターの費用は、システムだけで決まるものではありません。3Dデータや商品登録、運用まで含めて考えることが大切です。

作ったあと運用できる？3Dシミュレーターを「使い続ける」ための仕組み

3Dシミュレーターは、作って終わりではありません。新商品の追加や価格変更、販売終了など、商品情報を継続して更新できる仕組みが重要です。

どうやって業務につなげる？商品体験を「問い合わせ・見積・注文」につなげる

シミュレーションで選んだ内容を、そのまま問い合わせや見積、注文につなげる。商品選びのデータを次の商品企画に活かすこともできます。

「3Dを置けば使われる」は本当？ お客様が使いたくなる体験をつくる

3Dを置くだけでは、必ずしも使ってもらえるとは限りません。おすすめの組み合わせなど、最初の一歩をつくることが利用につながります。

3Dモデルは、どう用意する？3Dモデルがなくても大丈夫。3Dデータの作り方

3Dモデルがなくても、写真や図面、寸法などをもとにWeb用の3Dデータを用意できます。大切なのは必要な精度と情報を決めることです。

今のWebサイトに入れられる？サイトを作り直さず「選ぶ・買う」につなげる

既存のWebサイトをすべて作り直す必要はありません。商品ページからシミュレーターへ誘導し、選んだ内容を問い合わせや購入につなげられます。

「3Dシミュレーターを作りたい」その前に。相談時に整理しておきたい10のこと

何をシミュレーションするのか、何を選べるようにするのか。始める前に整理しておきたい10のポイントを、順番に確認していきます。

Blenderで3Dシミュレータを作る｜その③ マテリアルの準備

Blenderで3Dモデルに色や質感を設定する方法から、UV・テクスチャ・ベイク、Web用データの書き出しまで紹介します。
コラム記事一覧
TOPへ戻る