Dappas Web — Plataforma de Diseño y Comercio Personalizado
Descripción General
Dappas Web es una aplicación moderna de comercio electrónico que combina un estudio de diseño asistido por IA, visualización 3D de productos y un flujo de compra integrado. El objetivo es permitir a cualquier empresa o usuario crear diseños personalizados (por ejemplo, empaques como vasos, bolsas y cajas), previsualizarlos en tiempo real y llevarlos a producción con assets técnicamente correctos.La plataforma integra un editor 2D interactivo para composición gráfica, un visor 3D para inspección fotorrealista de modelos y un conjunto de servicios de IA para asistencia creativa (generación de paletas y ajustes) y mejora de calidad de imágenes. El backend coordina persistencia en base de datos, almacenamiento en la nube y generación de arte final en PDF listo para impresión.
Características Principales
Estudio de Diseño con IA: Asistente que guía la creación del diseño, sugiere paletas basadas en logotipos y soporta ajustes automáticos.
Editor 2D Interactivo: Herramientas para manipular capas, imágenes, textos y vectores con precisión.
Visualización 3D en Tiempo Real: Modelos 3D interactivos para revisar materiales, texturas y colocaciones en 360°.
E‑commerce integrado: Catálogo, carrito, precios dinámicos, checkout seguro y gestión de pedidos.
Autenticación y Cuenta: Inicio de sesión con OAuth, gestión de perfiles, historial de pedidos y diseños guardados.
Generación de Arte Final/PDF: Pipeline server-side con Sharp y servicios de PDF para producir archivos con perfiles ICC, sangrías y resoluciones adecuadas.
Upscaling y Mejora de Imágenes: Servicios de mejora de calidad (upscaling) para asegurar resultados de impresión.
Monitoreo y Analítica: Observabilidad y analítica para rastrear errores y comportamiento de usuarios.
Pruebas y Calidad: Pruebas unitarias y E2E, con herramientas de linting y formateo para gobernanza.
Tecnologías Utilizadas
Bash
# Build System & Monorepo
Turbo (Turborepo)
# Frontend
Next.js
# AI Framework & Providers
Mastra
Bria / Recraft / TopazLabs (upscaling)
# E‑commerce
Shopify
# Database & Storage
Drizzle ORM
PostgreSQL
Google Cloud Storage
# Infra & DevOps
Docker
Desafíos y Aprendizajes
Sincronización Editor 2D ↔ Visor 3D: Alinear la representación 2D (capas y coordenadas) con UVs/materiales en modelos 3D para lograr una previsualización fiel.
Generación de Arte Final: Estandarizar perfiles ICC, resolución y sangrías, y automatizar reparaciones (p. ej., upscaling, normalización de SVGs) para cumplir con imprentas.
Orquestación de IA Multimodelo: Diseñar flujos que alternen entre diferentes proveedores de IA según la tarea, con tolerancia a fallos y costos controlados.
E‑commerce Integrado: Mantener coherencia de precios/inventario y estados de carrito/pedido entre cliente, servidor y la plataforma de comercio.
Rendimiento y UX: Optimizar rendering 3D/2D, reducir peso de assets y aplicar técnicas de memoización/carga diferida para tiempos de respuesta fluidos.
Resultados e Impacto
Diseño a Producción sin Fricción: Desde idea hasta arte final listo para imprenta en un solo flujo.
Mayor Conversión: Previsualización 3D inmersiva y asistencia de IA elevan la confianza del usuario y reducen dudas.
Eficiencia Operativa: Automatización de tareas técnicas (arte final, upscaling, validaciones) reduce tiempos y errores humanos.
Escalabilidad Técnica: Arquitectura modular y monorepo con Turbo facilita la evolución del producto y la incorporación de nuevos SKUs/modelos.
