04 de 25 · EXPERIENCIA WEBGL
EL TIEMPO,DESARMADO.
Experiencia cinematográfica · reloj 3D que se desarma con el scroll
DEMOSTRACIÓNEN LÍNEA
CONTEXTO
Una foto quieta no justifica el precio. La mecánica, sí.
La relojería de lujo en la web casi siempre es foto de producto quieta, que no transmite la complejidad mecánica capaz de justificar el precio.
El AX-01 es un calibre 100% procedural que se desarma pieza por pieza con el scroll —caja, bisel, corona, esfera, agujas, tren de engranajes, espiral, escape, rotor, tourbillon— y se rearma por el camino inverso exacto.
QUÉ SE HIZO
Un reloj 100% procedural (Calibre AX-01 Tourbillon) que se desarma pieza por pieza según el scroll (caja, bisel, corona, esfera, manecillas, tren de engranajes, muelle real, escape, rotor y la jaula giratoria del tourbillon) y se rearma por el camino inverso exacto. Película en 15 escenas, configurador con cambio de material en tiempo real y galería 360° por arrastre.
15 ESCENAS · RELOJ 100% PROCEDURAL
SOLUCIONES
Sistema de explosión modular
Cada pieza con ventana propia de salida/retorno; el rearmado es el camino inverso exacto, no una animación separada.
Debug por raycast
El bug de geometría sólida tapando la esfera solo se encontró listando hits de un raycast, no por prueba y error visual.
Realismo vía CanvasTexture
La impresión de la esfera (minutería, marca) fue la mayor ganancia visual del proyecto, sin costo de geometría.
- 01 / PELÍCULAQuince escenas con canvas fijo, guion en un único archivo y cámara con damping: la arquitectura heredada de Aurex Motors.
02 / EXPLOSIÓNCada <Part> tiene posición de origen, desplazamiento, rotación y una ventana (delay/span). Un smoothstep lee el valor global de explosión y cada pieza sale y vuelve en cascada.
03 / CONFIGURARConfigurador con cambio de material en tiempo real y galería 360° por arrastre; cuatro expresiones del mismo calibre.
DETALLE TÉCNICO
SISTEMA DE EXPLOSIÓNVentana delay/span por pieza + smoothstep sobre un progreso global; el rearmado es el camino inverso, no otra animación.
Hereda la arquitectura de estado compartido de AUREX MOTORS (canvas fijo, guion de escenas en archivo único, cámara con damping), pero el diferencial es el sistema de desarme. Cada componente del reloj es un <Part> con posición de origen, desplazamiento, rotación y una ventana de progreso (delay/span) propia. Una función de smoothstep lee un valor global de 'explosión' y cada pieza sale y vuelve en cascada dentro de su ventana. El rearmado no es una animación separada: es el camino de salida recorrido al revés.
RELOJ PROCEDURALCaja en anillo (ExtrudeGeometry), 5 engranajes paramétricos con dientes instanciados, espiral de Arquímedes, escape, tourbillon.
El reloj es 100% procedural: caja en anillo (ExtrudeGeometry con agujero, no un cilindro sólido), bisel, corona estriada, esfera con índices instanciados, cinco engranajes paramétricos con dientes instanciados, muelle real como tubo en espiral de Arquímedes, escape oscilante y la jaula giratoria del tourbillon con su propio volante. Un bug real ilustra el valor de instrumentar en vez de adivinar. La caja empezó como cilindro sólido, y la tapa frontal, invisible para la intuición, tapó la esfera durante toda una sesión de trabajo. El diagnóstico solo vino de un raycast desde el centro de la pantalla listando los hits en orden, que expuso el cilindro a 6cm delante del dial.
RAYCAST DEBUGUna tapa invisible cubrió la esfera durante una sesión entera; un raycast desde el centro de la pantalla listó los hits y expuso el bug.
El mayor salto de realismo costó cero geometría extra: una CanvasTexture impresa sobre la esfera (minutería, nombre de la marca, numerales) resolvió lo que ningún cambio de material resolvía por sí solo. El vidrio también exigió un ajuste contraintuitivo. Un MeshPhysicalMaterial transparente en ángulo rasante refleja casi el 100% de la luz directa por Fresnel, creando un velo lechoso sobre la esfera independiente de la opacidad. La solución fue un MeshBasicMaterial con tinte constante, dejando los reflejos solo a cargo de los metales.
NÚMEROS
15
ESCENAS
10
PIEZAS QUE SE DESARMAN
05
ENGRANAJES PARAMÉTRICOS
360°
GALERÍA POR ARRASTRE
PANTALLAS
01 Configurador con cambio de caja, esfera, manecillas y correa en tiempo real 02 Vitrina de la colección con las cuatro expresiones del calibre
RESULTADO
Proyecto propio, en línea
RELOJ 100% PROCEDURAL EN R3F