volverPRY 001 · 2023

Nissan

Un configurador 3D de un clásico deportivo japonés, en el navegador y en tiempo real.

  • Configurador 3D
  • 3D en tiempo real

  • Three.js
  • WebGL
  • React
  • React Three Fiber
  • TypeScript
  • CSS

Un configurador web en el que el auto es el protagonista: un modelo 3D detallado, montado en un estudio virtual con piso cuadriculado, luces suaves y reflejos que corren por la carrocería mientras lo girás. Todo corre en el navegador, sin instalar nada.

Tres cámaras predefinidas llevan la mirada a donde importa: una vista panorámica para recorrerlo entero, una vista frontal y una vista desde el asiento del conductor, con el tablero, el volante y el espejo retrovisor en primer plano. Las transiciones entre cámaras son continuas, sin cortes.

Un selector de color repinta la carrocería al instante y un panel de ajustes permite afinar la escena en vivo. La idea fue probar hasta dónde puede llegar un configurador web con React Three Fiber: calidad de presentación de producto, con la respuesta inmediata de una aplicación.

Qué hace

  • Cámaras panorámica, frontal y desde el interior
  • Color de carrocería en vivo con selector
  • Materiales y reflejos en tiempo real
  • Panel de ajustes de la escena
  • Funciona en escritorio y celular
Plataforma
Web (escritorio y celular)
Tecnología
React Three Fiber · Three.js · TypeScript
Tipo
Configurador 3D

Explorá más

proyecto 01 / 08
Tuxdi