何を試したか

Web ブラウザだけで動作する 3D 空間で、子どもたちの作品を「会場を歩いて巡る」体験として鑑賞できる仕組みを試作。メタバースではなく「バーチャルミュージアム / バーチャル作品展示会」 という位置づけで、以下を組み合わせている:

  • 匿名でのマルチプレイ対応: 同じ展示室に最大 10 人程度まで同時入場可能。サーバー負荷と端末(特にスマホ)の性能に応じて同時接続数は自動的に調整される。プロフィール登録不要の匿名入場
  • クライアント側レンダリング: 3D 空間はブラウザで描画、サーバーに個別ワールドを持たない軽量構成
  • 会場構成は柔軟に組み替え可能: ロビー → 学年別ホール → 展示室の階層構造を保ちつつ、部屋の数・1 部屋あたりの展示作品数は運営側で自動調整可能。会場規模・作品数に合わせて構成をフレキシブルに変えられる
  • AI ガイドアバター(オプション層): 会場案内・作品解説を自然な音声対話で担う

アバターは VRM 1.0 + MToon、VRMA で歩行・会話・着席などのアニメーションを切替えている。

何が分かったか

  • 「ブラウザ + Three.js + VRM」で数百点規模の作品展示は十分実用に乗る。サーバー側は静的ファイル配信 + 軽量 API + Socket.IO のみで成立する
  • 部屋数 / 1 部屋あたりの展示数を 運営側で動的に組み替えられる 仕組みにしたことで、年度ごとの応募数の波や端末性能差に対して同じ実装のまま対応できる
  • マルチプレイ時の同時接続数は、端末(特にスマホ)側の描画負荷で実質的に決まる。サーバー側の制限よりクライアント側のフレームレートが先に頭打ちになる
  • 個別 ID で「自分の作品の前に直接入場」できる動線は、子ども・保護者の体験設計上きわめて重要

技術スタック

  • フロント: Three.js + @pixiv/three-vrm + VRMA(クライアント 3D)
  • サーバー: Node.js + Express + Socket.IO
  • AI 層(オプション): OpenAI gpt-4o-mini + tts-1(ガイド対話・音声合成)
  • 永続化: JSON ファイル(外部 DB 不要、軽量配信構成)

制限・位置づけ

本試作はクライアント提案フェーズのデモであり、現時点では Basic 認証付きの限定公開 としている。スマートフォン向けの最適化(描画負荷・操作系)が次の最重要課題として残っている。

本試作で得た「Web ブラウザでの 3D 鑑賞体験設計」「個別 ID アクセス動線」「AI ガイドアバターの台本設計」は、自社の AI-Kata 系プロダクト・受託案件の体験設計レイヤーに還流させる前提。

デモ環境について

クライアント向けに Basic 認証付きのデモ環境を常時稼働しています。見学・導入のご相談は お問い合わせフォーム よりご連絡ください。

関連プロダクト

本試作で活用している基盤技術はそれぞれ社内で運用中: