Desafío
Flex Cards necesitaba que padres, entrenadores y equipos diseñaran tarjetas coleccionables reales y de nivel profesional para sus atletas — béisbol, fútbol americano, soccer, lucha, porristas — directamente en el navegador, no eligiendo entre un puñado de templates estáticos. Cada tarjeta necesitaba una foto real del atleta, recortada limpiamente de su fondo, colocada en un marco tipo foil con nombre y equipo. Los plugins de ecommerce o diseño estándar no hablan con hardware físico de producción; esto tenía que construirse como software real, de punta a punta.
Enfoque
Construimos Flex Cards como una aplicación full-stack: un frontend en Next.js con un editor canvas basado en Konva para diseño de tarjetas en vivo — color de marco, posición de la foto del atleta, texto de nombre y equipo — con remoción de fondo por IA para que una foto de celular se convierta automáticamente en un recorte limpio. Stripe maneja el checkout del lado del cliente. En el backend, un plugin a medida de WordPress/WooCommerce procesa los pedidos y entrega los archivos listos para producción directamente al hardware físico — una impresora Canon Arizona vía ONYX y una cortadora Zünd — para que un pedido completado se convierta en una tarjeta coleccionable impresa y troquelada sin que un diseñador toque un solo archivo a mano.
Entregables
- Editor de diseño de tarjetas coleccionables en canvas con Next.js + Konva (color de marco, posición de foto, texto)
- Remoción de fondo con IA para fotos de atletas subidas
- Checkout con Stripe integrado directamente al flujo de diseño
- Plugin a medida de WooCommerce como backend de procesamiento de pedidos
- Pipeline directo de hardware hacia ONYX (impresora Canon Arizona) y cortadora Zünd
- Flujo de punta a punta del diseño en navegador a la tarjeta física troquelada, sin manejo manual de archivos
Resultados
- [TBD: tarjetas producidas / volumen de pedidos a través del sistema]
- [TBD: tiempo de entrega, del diseño a la salida física]
- Un pipeline completo lanzado del canvas en navegador al hardware físico de impresión — prueba de que esto no es trabajo de plugin templado
- [TBD: tasa de error/reimpresión desde el lanzamiento]
