DeskForge
Un configurador 3D de puestos de trabajo para tiendas de tecnología: el comprador monta su espacio sobre su escritorio real y añade todo el conjunto al carrito.


Reto
Quien compra online un monitor, un brazo y un escritorio no sabe si todo cabrá y funcionará junto, así que duda, compra un artículo cada vez o devuelve lo que no encaja.
Solución
- Configurador 3D: una escena realista con materiales PBR, sombras suaves y oclusión ambiental, bordes redondeados, teclados con distribuciones reales, colores reales de los productos, modelos de Blender y archivos GLB, iluminación RGB, pantallas mate o brillantes; un presupuesto de renderizado con mallas fusionadas y un modo de calidad para móviles.
- Escritorio y habitación: escritorios paramétricos (rectos, con recorte, en L), la posición del escritorio en la habitación, muebles, ventana, decoración y seis preajustes de interior.
- Motor de reglas: colocación, ergonomía y compatibilidad de montaje (VESA, carga, abrazadera) con avisos y correcciones en un clic; distribuciones de uno a tres monitores; brazos y soportes; un modo de cotas.
- Catálogo y venta: una API de catálogo con administración, importación y OpenAPI; 38 productos de demostración reales con fotos en 14 categorías; variantes, descuentos y artículos agotados; sugerencias de productos compatibles y «what’s missing»; todo el puesto añadido al carrito con un clic.
- Integración en una tienda: un script de carga de menos de 10 KB comprimido con gzip, un modo de inserción con CSP frame-ancestors y una tienda de demostración, un widget compacto para las páginas de producto.
- Configuraciones: guardadas con un enlace corto, con nombre, «My setups», una página para compartir con vista previa Open Graph, exportación a PNG y PDF; deshacer y rehacer.
- Analítica: un plan de eventos, ingesta y embudo, envío a GA4 y Meta Pixel con consentimiento, atribución de pedidos y ticket medio.
- Seguridad: contenedores que no se ejecutan como root, límites de tamaño de las peticiones, limitación de peticiones compatible con IPv6, orígenes permitidos para la inserción.
- Arquitectura: once registros de decisiones de arquitectura (ADR), incluida una comparativa de motores de renderizado antes de elegir uno.
Resultado
El configurador, el catálogo, la inserción y la analítica están terminados y cubiertos por pruebas; Shopify es la primera integración con tiendas prevista. Mediciones: 60 fotos de productos pasaron de 18,8 MB a 124,5 KB como miniaturas; la carga diferida del marco de inserción redujo el LCP en 35–40 ms; los preajustes de interior cambian en menos de 135 ms.