Product Staging Pro

Aplicación web para crear composiciones publicitarias de productos usando generación de imágenes y texto asistida por IA. Permite cargar productos con fondo transparente, generar escenarios automáticos, añadir logotipos, crear eslóganes y exportar diseños finales listos para redes sociales o campañas promocionales.

Características

• Carga de imágenes de producto en formato PNG/WebP.
• Integración con IA para generación automática de escenarios.
• Generación automática de eslóganes publicitarios.
• Soporte para múltiples relaciones de aspecto:
  • 1:1
  • 16:9
  • 9:16
• Inserción de logotipos personalizados.
• Ajuste dinámico de sombras.
• Diferentes tipografías y colores para textos.
• Movimiento y escalado interactivo mediante arrastrar y rueda del ratón.
• Exportación de la composición final en PNG.

Flujo de uso

1. Subir una imagen del producto (preferiblemente PNG con transparencia).
2. Escribir una descripción del escenario.
3. Generar el fondo mediante IA.
4. Crear o redactar un eslogan.
5. Ajustar posición, tamaño y sombras.
6. Descargar el diseño final.

Tecnologías utilizadas

• HTML5
• CSS3
• JavaScript
• Canvas API
• TailwindCSS
• Pollinations API (a través de backend seguro)
• Google Fonts

Servicios IA utilizados

Generación de imágenes

Endpoint:

POST /api/ia/image

Parámetros usados:

• prompt
• model
• seed
• width
• height

Generación de texto

Endpoint:

POST /api/ia/text

Parámetros usados:

• prompt
• model
• system
• json

Interacciones

Ratón

• Arrastrar → mover producto, logo o texto.
• Rueda → escalar elemento seleccionado.

Móvil

• Arrastrar → mover elementos.
• Pellizcar → cambiar escala.

Estructura general

Producto
 ├── Fondo generado por IA
 ├── Producto principal
 ├── Logotipo
 └── Texto publicitario

Recomendaciones

• Usar imágenes PNG con fondo transparente.
• Utilizar prompts descriptivos:

Ejemplo:

Superficie de mármol negro con iluminación cinematográfica y ambiente premium

• Mantener eslóganes cortos para mejorar la composición visual.

Autor

Diseñado por Ángel Cabezudo Bueno con ayuda de Gemini. README generado automáticamente a partir del análisis de la aplicación.