自社開発の 3D 製品ビューア自社開発

KARAKURI Viewer

伝わりにくい製品を、見て確かめられる形に。

製品の内部・構造・動きを、ブラウザで分解して見せる 3D ビューア。展示会から、持ち帰った後の社内検討まで使えます。

V12 航空エンジンを KARAKURI Viewer で表示。

課題

カタログや写真では、伝わらないことがあります。

製品の中身や仕組み、動きの理由。言葉と写真だけでは、相手に届く前に抜け落ちていきます。

  • 展示会で

    伝わりにくかったこと
    その場では伝わっても、説明員がいないと伝わらない。
    見る人に分かること
    来場者が触っても崩れない展示用の画面で、製品の中身と動きを、自分で確かめられる。
    この場面の機能を見る
  • 商談で

    伝わりにくかったこと
    内部の構造や、部品どうしの動きの関係が、図面や写真では想像しにくい。
    見る人に分かること
    分解・断面・働きごとの表示で、製品の違いを、相手が自分で確かめられる。
    この場面の機能を見る
  • 持ち帰って

    伝わりにくかったこと
    上司や関係者への説明で、ブースで見た内容が抜け落ちる。
    見る人に分かること
    会場で見た内容のまま、上司や関係者にそのまま見せられる。
    この場面の機能を見る

できること

場面ごとに、伝え方を変えられる。

画面は、V12 航空エンジンを表示したものです。数値は目安です(下の注意をご覧ください)。

展示会

展示会で、引き込み、見せる。

人を呼び込み、説明員の話を助ける。一度開けば、ネットがなくても動く。

排気炎

各気筒が点火する瞬間に、その気筒の排気管から、管の向きに沿って炎が出る。

寸法・回転数・比は、このモデルにもとづく目安です(実在のエンジンの仕様ではありません)。

プレゼンモードとカンペ

場面 1〜5 をボタンかキーで呼び出す。説明員の画面にだけトークの台本が出る。

展示用の全画面表示。右上に「はじめから」「見た内容を持ち帰る」
寸法・回転数・比は、このモデルにもとづく目安です(実在のエンジンの仕様ではありません)。

キオスク

来場者が触っても崩れない、展示用の全画面表示。

そのほかの機能

  • 組み上がる導入アニメ

    開いた瞬間に、部品が順に組み上がって全体像になる。

  • 稼働アニメ

    製品が動くところを見せる。再生・停止と、速さ(0.25〜2 倍)を変えられる。V12 では、点火を実機どおりの順番と間隔(60°ごと・左右交互)で見せる。

  • 客寄せの自動再生

    誰も触らないと見せ場を自動でくり返し、触ればすぐ操作に戻る。

  • 大画面連動

    1 台の端末で、手元の操作画面と大きなモニター用の画面を連動させる(大画面側には台本を出さない)。

  • 低電力

    触っていない間は、描画の回数を減らす。

  • ネットがなくても動く

    一度開けば、ネットにつながらない状態でも動く(通信を切った状態を、自動テストで再現して確かめています)。

  • 環境の切替

    背景と照明を、スタジオ/工場/和の書斎の 3 つから選ぶ。

  • 読み込みの軽さを数字で

    読み込み中の画面に、実際のデータ量と読み込みにかかった時間を出す。

商談

商談で、中身と仕組みを確かめる。

分解・断面・働きごとの表示で、製品の違いを、相手が自分で確かめられる。

分解と組立

スライダーやスクロールで、部品をばらしたり組み戻したりする。ばらす順番は実物の組立手順に沿う。

スマートフォンで開いた空気の流れ。上に 1〜7 の段、下に番号札のついた半透明のエンジン
空気の流れの粒子と色は、経路を見せるための表現です(流量や温度の値ではありません)。

空気の流れ

右の列のボタンで本体を半透明にし、外気が気筒に届くまでを 1〜7 の順(吸い込む→燃料が混ざる→圧縮する→ためる→下りる→配る→気筒へ)に、パネルと 3D の番号札で追う。粒子の色で、外気・混合気・圧縮後を見分ける。

条件V12 のように、経路のデータを持つ製品で使えます。キオスクでは表示しません。

仕組みのパネル。12本のピストンを照らし、クランク回転数・プロペラ回転数・減速比を示す
寸法・回転数・比は、このモデルにもとづく目安です(実在のエンジンの仕様ではありません)。

仕組み

力の入口から出口までを段ごとにたどり、回転数と比を 1 枚のパネルで見せる。

条件表示される 2:1 は、このモデルの動きの比です。実在するエンジンの仕様ではありません。キオスクでは表示しません。

そのほかの機能

  • 3D 表示と操作

    指で回す・拡大する。動ける範囲を決めてあり、ボタン一つで最初の視点に戻れる。

  • 働きごとに見せる

    「吸気・過給」「排気」のような働きのまとまりを選ぶと、その働きの部品だけが残る。

  • 部品をタップして説明

    部品に触れると、名前・説明・寸法が銘板風の札で出る。

    条件V12 航空エンジンでは 43 部品(吸気ファン・過給機の羽根車を含む)。部品の解説は暫定、寸法は推定の縮尺による目安です。

  • 断面

    製品を切って、中の構造を見せる。

  • 過給機の回転

    クランクの 8 倍で回る羽根車 2 基(吸気ファン・過給機)を、回転のブレつきで見せる。

  • 材質・色の切替

    金属の色味を 3 種類から切り替える。

  • オプション部品の付け外し

    オプション部品を付けた姿・外した姿を切り替える。

  • 部品から問い合わせ

    気になった部品の札から、部品名入りの問い合わせ票を作る。キオスクでは QR で来場者のスマートフォンへ渡す。

    条件送り先は、導入のときに設定します。

持ち帰り

持ち帰って、そのまま共有する。

会場で見た内容を、来場者が持ち帰り、上司や関係者にそのまま見せられる。

展示会のモード。説明した内容が自動で記録され、「ここ重要」の印と一言を付けられる

展示会を持ち帰る(KARAKURI Session)

会場で見せた部品・分解・構成を自動で記録する。来場者は QR で「本日ご覧いただいた内容」を持ち帰り、共有できる。

大きさを比べる。人の背丈と並べ、全長・全幅・全高を図面の書き方で示す
寸法・回転数・比は、このモデルにもとづく目安です(実在のエンジンの仕様ではありません)。

大きさを比べる

人や 350ml 缶を実寸で隣に立て、外形の寸法を図面の書き方で引く。

条件人と比べられます(全長 2,239 × 全幅 1,383 × 全高 1,399 mm)。縮尺が推定のため、画面にも「サンプル値」と表示します。

そのほかの機能

  • 構成の URL 共有

    選んだ材質・オプション・環境を URL に残して送れる。

  • 埋め込みコード

    自社サイトに貼るためのコードをコピーできる。

社内説明

社内の説明と、次の改善に。

部品を一覧で探し、測り、画像で資料に貼る。

働きごとの表示で「主運動」を選び、ピストンとクランクだけを残した姿。左に部品の一覧

部品の一覧

全部品を一覧にし、検索や表示/非表示の切替ができる。

KARAKURI Viewer で表示した V12 航空エンジン(製品の高解像度スクリーンショット機能で書き出した画像)
製品のスクリーンショット機能で書き出した画像。

高解像度スクショ

今の画面を高解像度の画像で保存し、社内資料に貼れる。

そのほかの機能

  • 寸法を測る

    2 点をタップすると、その間の距離を mm で出す(最大 5 本)。

    条件値は推定の縮尺にもとづく目安です。

導入と運用

自社の製品を、軽く、すぐに載せる。

重い 3D データを軽くし、決まった作り方のモデルなら、ほぼ設定なしで取り込める。

スマートフォンで開いた KARAKURI Viewer。V12 航空エンジンと操作のボタン

スマホから大画面まで・サイトへの埋め込み

画面の大きさに合わせて表示が組み変わり、ほかのサイトの中にも埋め込める。

そのほかの機能

  • 軽量化

    重い 3D データを、スマートフォンでもすぐ開ける大きさまで圧縮する。

  • 入稿の自動取り込み

    決まった作り方に沿ったモデルなら、ほぼ設定なしで取り込める。

  • 製品の切替

    複数の製品を、1 つのビューアの中で切り替える。

使う場面

展示会から、社内の検討まで。

お客様の製品の 3D データから、その製品のためのビューアをつくります。

  1. 展示会で

    来場者を引き込み、説明員の説明を助ける。

    ネットがなくても動く

  2. 商談で

    分解・断面・仕組みで、製品の違いを見せる。

    相手が自分で確かめる

  3. 持ち帰って

    見ていた内容のまま、社内の検討に使う。

    QR・URL で共有

どの部分を、どの順番で見せると理解が進むかの設計と、モデルの軽量化を含みます。

V12 航空エンジンの表示について

  • 寸法は推定の縮尺によるもので、目安です。
  • 部品の解説文は暫定です。
  • 「仕組み」に表示される 2:1 は、このモデルの動きの比で、実在するエンジンの仕様ではありません。
  • 公開しているデモには、まだ載せていません。
  • このページの画像と動画のクレジットは、下の 1 行にまとめています。

Model: “V12 Aero Engine” by takaya3d / Blender / No reuse

設計の判断を詳しく見る
全部を見せない
製品ごとに、理解に必要な部分と順番を決めます。見せる量より、伝わる順番を優先しています。
軽くする
展示会の回線と来場者の端末で動くことが先です。見た目を保ったまま、元のデータを軽くします(V12 航空エンジンの表示用データは約 1MB。目安。公式一覧 10-18)。
状態を URL に持たせる
材質・オプション・環境を URL に残すことで、誰が開いても同じ構成から始められます。
技術
Three.js、WebGL2、TypeScript、Vite、PWA、Cloudflare

自社の製品で、どう見せられるか。

製品と、伝えたい相手を伺い、見せる部分と順番から一緒に考えます。展示会を控えたメーカーの方からのご相談を承ります。

相談する