3D CONFIGURATORポートフォリオとして制作したデモ
Furniture Configurator
ブラウザ上で家具のカラー・素材をリアルタイムに切り替えられる3Dコンフィギュレーターを、ポートフォリオとして制作したデモ。実際の導入イメージを体験できます。
Industry家具・インテリア
Project Typeポートフォリオとして制作
StackBlender / React Three Fiber / Three.js / Next.js / Vercel
Challenge
家具のECサイトでは、写真だけでは素材感やカラーバリエーションが伝わらず、購入の最後のひと押しができないという構造的な課題があります。
全バリエーションを撮影でカバーしようとするとコストが膨らみ、商品追加のたびに再撮影が発生します。
Approach
- 01
Blenderで家具を3Dモデル化し、木目・ファブリックの質感をPBRマテリアルで再現。
- 02
React Three Fiber (Three.js) でリアルタイム切替UIを実装。モバイルでも動作する軽量構成にしました。
- 03
既存サイトに埋め込める形で設計し、コンポーネント単位で組み込み可能にしています。
Deliverables
- —3Dモデル（カラー・素材バリエーション込み）
- —リアルタイム切替UI（React Three Fiber）
- —モバイル対応・軽量化済みのWebアプリ