PTENES
MÓDULO 5.1

🖥️ Frontend y empaquetado

La Fábrica no es un script oscuro: es una pantalla con dos cuadros y un botón. Aquí subes la aplicación web, sigues el pipeline en tiempo real, descargas los assets y personalizas el paquete: listo para entregar.

6
Temas
~50
Minutos
Práctico
Nivel
Entrega
Tipo
1

🧾 La interfaz mínima

La pantalla de la Fábrica tiene solo cuatro elementos. Esta austeridad es intencional: la promesa «entrada mínima, salida máxima" debe parecer fácil. El cliente ve dos cajas y un botón, y recibe un paquete de consultoría.

localhost:8888 Nombre de la empresa Descripción (qué hace, sector) ⚡ quick / deep Enviar → 4 elementos · 1 clic

📊 Los cuatro elementos

  • •Nombre de la empresa — el objetivo del análisis (p. ej., «Stripe», «panadería del barrio»).
  • •Descripción — contexto breve: sector, modelo de negocio, tamaño.
  • •Profundidad — alternador quick (~US$0,05) vs deep (~US$0,50).
  • •Botón de enviar — activa el pipeline de 3 fases.
Nombre

el objetivo

Descripción

el contexto

Profundidad

el costo

Enviar

el detonante

2

🚀 Ejecutar la webapp local

Un comando inicia un servidor Flask y abre el navegador. A partir de ahí, la Fábrica deja de ser código y se convierte en una pantalla donde tú (o el cliente, en una demo) escribes y haces clic.

// terminal — iniciar la interfaz web

source venv/bin/activate          # macOS/Linux
python -m strategy_factory.webapp

# abre automaticamente em http://localhost:8888
# porta ocupada? ele acha outra, ou: --port 9000

💡 Consejo práctico

¿No sabes cómo ejecutarlo? Pídele a Claude Code: "inicia la aplicación web de la Fábrica y ábrela en el navegador". Activa el entorno, instala lo que falte y resuelve el error del puerto. Tú solo miras cómo aparece la pantalla.

🎬 Por qué importa ejecutar en vivo

En una reunión, escribir el nombre del cliente y ver trabajar a la Fábrica en el momento es una prueba irrefutable. Vale más que cualquier diapositiva que explique "cómo funciona", porque sucede frente a él.

Flask

servidor local

8888

puerto predeterminado

Se abre automáticamente

en el navegador

Demo en vivo

prueba al instante

3

📡 Progreso en tiempo real + descarga

Mientras se ejecuta el pipeline, la pantalla no se congela. El servidor usa Server-Sent Events (SSE) para enviar cada etapa al navegador. Al final, todos los assets aparecen listos para descargar.

1

POST /start

El envío inicia el pipeline en un hilo en segundo plano y el navegador te lleva a la página de progreso.

2

GET /progress/{job_id} (SSE)

Un flujo de eventos transmite «investigando…», «sintetizando…», «generando…»: la barra avanza en tiempo real.

3

Resultados + descarga

Al terminar, los archivos (markdown, PPTX, DOCX, PNGs) quedan disponibles para descargar individualmente o en un paquete.

💡 Por qué SSE y no solo "espera"

Una barra de progreso genera confianza: el usuario ve que ocurre algo real, no una pantalla congelada. En pipelines que duran minutos, la retroalimentación en vivo es lo que marca la diferencia entre «profesional» y «¿se habrá trabado?».

SSE

eventos en vivo

job_id

registra la sesión

Thread

se ejecuta en segundo plano

Descarga

recursos listos

4

🗂️ Organizar el paquete por carpetas

El resultado no es un montón de archivos: viene estructurado en output/{empresa}/ con subcarpetas por tipo. Un paquete organizado transmite cuidado, y el cuidado es parte de lo que compra el cliente.

// estructura generada por empresa

output/stripe/
├── markdown/          # 15 documentos .md
├── presentations/     # 2 decks .pptx
├── documents/         # 2 relatórios .docx (Relatório + SOW)
├── mermaid_images/    # diagramas estado atual vs futuro (.png)
├── research_cache.json
└── state.json         # progresso e custo total

✓ Paquete bien organizado

  • ✓Subcarpetas claras por tipo de entregable
  • ✓Nombres numerados en orden de lectura
  • ✓Decks e informes arriba, anexos abajo

✗ Paquete desordenado

  • ✗15 archivos sueltos en la misma carpeta
  • ✗Nombres técnicos en bruto (deliverable_07_v2.md)
  • ✗Sin indicaciones sobre por dónde empezar
markdown/

15 docs

presentations/

2 presentaciones

documents/

informe + SOW

state.json

progreso

5

🎨 Marca: dale tu toque personal

El paquete es el tu producto, no el de la herramienta open source. Cambiar el logo, los colores y la portada transforma «unos archivos generados» en «el entregable de [tu nombre] Consultoría». La marca es lo que el cliente recuerda.

1

Logo y portada

Agrega tu logo a la diapositiva de portada del deck y a la primera página de los documentos Word. Identidad desde el inicio.

2

Paleta de colores

En pptx_generator.py, los RGBColor definen la paleta de las diapositivas. Ajústala a los colores de tu marca.

3

Pie de página y contacto

Pie de página con tu nombre, sitio web y contacto en cada página. El cliente sabe a quién volver cuando quiera más.

// qué pedirle a Claude Code

No gerador de PPTX, troque a paleta para
azul-marinho (#0B1F3A) e dourado (#C9A24B),
ponha meu logo "logo.png" na capa e um rodapé
com "Acme Consultoria de IA · acme.com.br".
Logo

en la portada

Colores

RGBColor

Pie de página

tu contacto

Identidad

tu producto

6

📬 Alojar / entregar el paquete

El último paso es la entrega. Comprimirlo, alojarlo y enviarlo con una nota breve de lectura guiada hace que el cliente sienta que compró un servicio, no que recibió una carpeta de archivos.

🗜️ Comprimir

Un .zip con la carpeta organizada, con el nombre del cliente y la fecha: acme-estrategia-ia-2026.zip.

☁️ Alojar

Súbela a Drive, Notion o una carpeta con un enlace para compartir. El cliente puede acceder desde cualquier lugar.

📝 Nota guiada

Mensaje breve: "empieza por el Executive Summary, después el roadmap. SOW adjunto para la propuesta."

💡 Consejo de entrega

Nunca envíes un "aquí está, te paso el enlace". Guía la lectura: por dónde empezar, qué responde cada pieza y cuál es el siguiente paso. La curaduría de la entrega es parte del servicio y prepara el terreno para cerrar el trato.

Zip

paquete único

Enlace

acceso fácil

Nota

lectura guiada

Percepción

es un servicio

✅ Resumen del módulo

✓
La interfaz es mínima a propósito — dos cuadros, un toggle, un botón.
✓
Un comando inicia la aplicación web en localhost:8888 — y se convierte en demo en vivo.
✓
SSE muestra el progreso y habilita la descarga — feedback que genera confianza.
✓
Organizar + marcar + entregar bien — es lo que hace que parezca un servicio, no archivos.

🎯 Misión 5.1 — Paquete con tu identidad

Genera y empaqueta un paquete a tu medida:

  1. Inicia la webapp y ejecuta 1 empresa en modo rápido.
  2. Cambia el logo, los colores y el pie de página de la presentación por tu marca.
  3. Organiza la carpeta y comprímela en un .zip con nombre.
  4. Escribe la nota de lectura guiada (3-4 líneas).

Éxito: un .zip con tu identidad y una nota de entrega. Lo que obtuviste: un entregable que ya parece tu producto — listo para enviar a un cliente.

Siguiente módulo:

5.2 — Posicionamiento, oferta y precio (nicho, convertir en producto y cuánto cobrar)