System Requirements Document for swift-anuncio

1. Introduction

swift-anuncio es una herramienta gratuita, en español y en lenguaje sencillo, que ayuda a un vendedor sin conocimientos técnicos a montar un sistema automatizado de venta de productos digitales desde el primer día. El sistema identifica los productos digitales más vendidos (3 en el mundo, 3 en México y 3 en Mérida, Yucatán), propone variaciones vendibles, selecciona el producto con mayor dolor resuelto y potencial de compra, crea el producto digital, redacta el anuncio con copy psicológico de compra compulsiva (título, edad, tipo de persona objetivo, género, identificación y urgencia), elabora la landing page o el enlace a WhatsApp Business, y entrega una guía paso a paso —para computadora y celular— para configurar WhatsApp Business y la campaña de Meta Ads de 2 dólares que el usuario publica manualmente.

Audiencia: Elito y cualquier vendedor principiante hispanohablante en Mérida, México o el mundo que quiera vender productos digitales sin experiencia técnica previa.

2. System Overview

swift-anuncio es una aplicación web con identidad propia de la aplicación. El vendedor principiante de productos digitales entra por una página pública (Landing), se autoinscribe y verifica su retorno (Login), y desde su Panel recorre un flujo ordenado y numerado: comparar IAs gratuitas (Asistentes IA), revisar la matriz 3×3 de productos más vendidos (Productos), elegir el producto con mayor dolor resuelto (Selección), generar el producto digital (Producto), generar el anuncio psicológico (Anuncio) y obtener la guía ejecutable de WhatsApp Business y Meta Ads de 2 dólares (Guía).

Actores:

• Humano (persona activa): Vendedor principiante de productos digitales.
• Actor no-persona (sistema): el motor de IA del backend que genera recomendaciones, productos, anuncios y guías.
• Actor no-persona (externo, responsabilidad del usuario): Meta Ads / Facebook (publicación de la campaña de $2) y WhatsApp Business (canal de venta), que el usuario configura y opera manualmente siguiendo la guía.

Exclusiones estrechas: el sistema no publica la campaña de Meta Ads por el usuario (esa parte la ejecuta él manualmente; el sistema entrega el paso a paso detallado). El producto no se limita a productos de Hotmart: el sistema crea el producto digital.

2a. Product Interpretation and Delivery Boundary

El producto es una herramienta operativa, no una plataforma de marketing. Su valor está en ordenar y ejecutar el flujo completo de venta de un producto digital: investigar, elegir, crear, anunciar, enrutar y lanzar. La entrega actual cubre todo el ciclo dentro de la aplicación, con la publicación de la campaña de Meta Ads y la operación de WhatsApp Business como responsabilidades externas del usuario, guiadas paso a paso. La identidad de la aplicación es necesaria para que el vendedor conserve sus productos, anuncios y entregables entre sesiones. No se incluyen capacidades adyacentes como gestión de cuentas, roles, permisos diferenciados ni integraciones automáticas con Meta o WhatsApp.

2b. Page Content and Component Coverage

Landing

• Información/estado: propuesta de valor de la herramienta ("Tu sistema de ventas, paso por paso"), para quién es (vendedor sin experiencia técnica en Mérida, México y el mundo), qué hace (identifica productos, crea el producto, el anuncio, la landing o WhatsApp, y guía la campaña de $2), y el flujo de 7 pasos.
• Acciones primarias: iniciar la autoinscripción del vendedor; ir a verificación de retorno (Login).
• Acciones de soporte: consultar el detalle de cada paso del flujo.
• Entidades de dominio: propuesta de valor, pasos del flujo, llamada a la acción.
• Responsabilidades de componentes: hero tipo panel frontal con titular grande, diagrama esquemático del embudo (Producto → Anuncio → Landing/WhatsApp → Meta Ads → Venta) y franja de instrumentos (IA recomendada / Producto / Anuncio / Campaña $2); rail numerado 01–07; botón naranja único de siguiente acción.
• Estados: carga (esqueleto del panel), vacío (no aplica, contenido estático), éxito (render completo), error (mensaje de reintento si falla la carga de contenido), recuperación (recargar).

Login

• Información/estado: formulario de autoinscripción para el primer uso y de verificación de retorno para el vendedor existente.
• Acciones primarias: crear acceso (autoinscripción); verificar identidad para volver a entrar.
• Acciones de soporte: corregir datos inválidos.
• Entidades de dominio: identidad del vendedor, credenciales.
• Responsabilidades de componentes: formulario con etiquetas en mayúsculas y valores alineados; mensajes de error en línea; botón de envío con estado de presión.
• Estados: carga (envío en curso), vacío (formulario limpio), éxito (acceso concedido y redirección al Panel), error (credenciales inválidas o datos incompletos con mensaje claro), recuperación (reintentar sin perder lo escrito).

Panel

• Información/estado: resumen del sistema completo y estado de cada etapa (IA recomendada, producto seleccionado, anuncio generado, landing/WhatsApp, campaña $2, checklist).
• Acciones primarias: entrar a cada etapa del flujo.
• Acciones de soporte: reanudar una etapa en curso.
• Entidades de dominio: progreso del vendedor, etapas del flujo, entregables.
• Responsabilidades de componentes: rail numerado 01–07 con paso activo en naranja y pasos completados con check; filas etiqueta/valor con reglas de 1px; indicador de estado.
• Estados: carga (esqueleto de filas), vacío (ninguna etapa iniciada, con invitación a empezar por Asistentes IA), éxito (etapas con estado), error (no se pudo cargar el progreso, con reintento), recuperación (recargar o reabrir etapa).

Asistentes IA

• Información/estado: comparación de IAs gratuitas (versiones gratis de Gemini, Claude, ChatGPT y cualquier otra gratuita mejor) y recomendación de la más adecuada para el flujo de venta.
• Acciones primarias: consultar la recomendación.
• Acciones de soporte: revisar la tabla comparativa por criterios.
• Entidades de dominio: asistentes de IA, criterios de comparación, recomendación.
• Responsabilidades de componentes: tabla etiqueta/valor con reglas de 1px; marca de la IA recomendada con punto de estado naranja.
• Estados: carga (tabla en preparación), vacío (sin comparación disponible, con reintento), éxito (tabla y recomendación visibles), error (no se pudo generar la comparación, con reintento), recuperación (volver a solicitar).

Productos

• Información/estado: matriz 3×3 con los 3 productos digitales más vendidos en el mundo, 3 en México y 3 en Mérida, Yucatán, más variaciones vendibles en México, Mérida o el mundo.
• Acciones primarias: seleccionar un producto para pasar a Selección.
• Acciones de soporte: revisar variaciones por región.
• Entidades de dominio: productos digitales, región (Mundo / México / Mérida), variaciones.
• Responsabilidades de componentes: tabla alineada con encabezados de columna Mundo / México / Mérida, reglas de 1px y un único control naranja "seleccionar" por fila.
• Estados: carga (tabla en preparación), vacío (sin resultados, con reintento), éxito (matriz completa), error (no se pudo analizar el mercado, con reintento), recuperación (volver a analizar).

Selección

• Información/estado: evaluación del producto digital con mayor dolor/problema resuelto rápido y mayor potencial de compra compulsiva, con justificación.
• Acciones primarias: confirmar el producto seleccionado para crear el producto digital.
• Acciones de soporte: comparar candidatos antes de confirmar.
• Entidades de dominio: producto candidato, dolor resuelto, potencial de venta, decisión.
• Responsabilidades de componentes: filas etiqueta/valor con reglas; botón naranja único de confirmación.
• Estados: carga (evaluación en curso), vacío (sin candidatos, volver a Productos), éxito (producto confirmado y paso a Producto), error (no se pudo evaluar, con reintento), recuperación (reevaluar o cambiar de producto).

Producto

• Información/estado: creación del producto digital seleccionado (no limitado a Hotmart), con su contenido y estructura.
• Acciones primarias: generar el producto digital.
• Acciones de soporte: revisar el resultado generado.
• Entidades de dominio: producto digital, contenido, estado de generación.
• Responsabilidades de componentes: panel de resultado con etiquetas y valores; indicador de progreso; botón naranja de generación.
• Estados: carga (generación en curso), vacío (sin producto seleccionado, volver a Selección), éxito (producto creado y guardado), error (fallo de generación, con reintento), recuperación (regenerar sin perder la selección).

Anuncio

• Información/estado: anuncio con copy psicológico de compra compulsiva: título, edad correcta, tipo de persona objetivo, género, identificación con el producto y urgencia de compra.
• Acciones primarias: generar el anuncio.
• Acciones de soporte: revisar los campos del anuncio.
• Entidades de dominio: anuncio, título, edad, tipo de persona, género, copy psicológico.
• Responsabilidades de componentes: filas etiqueta/valor con reglas; botón naranja de generación; estado de guardado.
• Estados: carga (generación en curso), vacío (sin producto, volver a Producto), éxito (anuncio generado y guardado), error (fallo de generación, con reintento), recuperación (regenerar).

Guía

• Información/estado: guía paso a paso para configurar WhatsApp Business y la campaña de Meta Ads de 2 dólares, en computadora y celular, en lenguaje sencillo; recomendación de vender por landing page, Hotmart o WhatsApp; y checklist ejecutable.
• Acciones primarias: seguir los pasos de la guía.
• Acciones de soporte: alternar entre instrucciones para computadora y celular; marcar pasos del checklist.
• Entidades de dominio: pasos de configuración, canal recomendado, presupuesto de $2, checklist.
• Responsabilidades de componentes: rail numerado; bandas de sección; medidor circular del presupuesto de $2; filas etiqueta/valor; banda negra de "ejecutar".
• Estados: carga (guía en preparación), vacío (sin anuncio ni producto, volver a etapas previas), éxito (guía completa y checklist), error (no se pudo generar la guía, con reintento), recuperación (regenerar o volver a la etapa faltante).

3. Functional Requirements

FR-01 — Herramienta gratuita y automatizada, explicada paso a paso (explicit) Como Vendedor principiante de productos digitales, quiero una herramienta gratuita que me ayude a crear un sistema automatizado de venta de productos digitales, explicado paso a paso y en lenguaje sencillo para alguien sin conocimientos técnicos, para poder ejecutarlo sin equivocarme.

• Disparador/entrada: el vendedor entra a la Landing y se autoinscribe.
• Resultado observable: el sistema presenta el flujo completo en pasos numerados y en lenguaje sencillo.
• Acceso: público en Landing; protegido tras identificación en las etapas internas.
• Fallo/recuperación: si el contenido no carga, se muestra un mensaje de reintento.
• Continuación: el vendedor avanza al Panel.

FR-02 — Recomendación de IA gratuita (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema me recomiende cuál IA gratuita (Gemini, Claude, ChatGPT u otra gratuita mejor) es la más adecuada para este flujo, comparando las versiones gratis, para saber con qué herramienta trabajar.

• Disparador/entrada: el vendedor abre Asistentes IA desde el Panel.
• Resultado observable: tabla comparativa de IAs gratuitas y una recomendación destacada.
• Acceso: requiere identificación.
• Fallo/recuperación: si la comparación no se genera, se ofrece reintento.
• Continuación: el vendedor pasa a Productos.

FR-03 — Matriz 3×3 de productos más vendidos y variaciones (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema me diga los 3 productos digitales más vendidos en el mundo, 3 en México y 3 en Mérida, Yucatán, y me proponga variaciones vendibles en México, Mérida o el mundo, para elegir con información real.

• Disparador/entrada: el vendedor abre Productos.
• Resultado observable: matriz 3×3 con encabezados Mundo / México / Mérida y variaciones por región.
• Acceso: requiere identificación.
• Fallo/recuperación: si el análisis falla, se ofrece reintento.
• Continuación: el vendedor selecciona un producto y pasa a Selección.

FR-04 — Selección del producto con mayor dolor resuelto (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema seleccione el producto digital con mayor dolor/problema resuelto rápido y mayor potencial de venta, para no dudar cuál crear.

• Disparador/entrada: el vendedor confirma un producto desde Productos.
• Resultado observable: evaluación con justificación y producto confirmado.
• Acceso: requiere identificación.
• Fallo/recuperación: si la evaluación falla, se puede reevaluar o cambiar de producto.
• Continuación: el vendedor pasa a Producto.

FR-05 — Creación del producto digital (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema cree el producto digital seleccionado, sin limitarse a productos de Hotmart, para tener un producto listo para vender.

• Disparador/entrada: el vendedor genera el producto desde Producto.
• Resultado observable: producto digital creado y guardado.
• Acceso: requiere identificación.
• Fallo/recuperación: si la generación falla, se puede regenerar sin perder la selección.
• Continuación: el vendedor pasa a Anuncio.

FR-06 — Anuncio con copy psicológico de compra compulsiva (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema genere el anuncio con copy psicológico de compra compulsiva —título, edad correcta, tipo de persona objetivo, género, identificación con el producto y urgencia de compra— para que el cliente sienta el impulso de comprar.

• Disparador/entrada: el vendedor genera el anuncio desde Anuncio.
• Resultado observable: anuncio con todos los campos solicitados, guardado.
• Acceso: requiere identificación.
• Fallo/recuperación: si la generación falla, se puede regenerar.
• Continuación: el vendedor pasa a Guía.

FR-07 — Landing page o enlace a WhatsApp Business (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema elabore una landing page de venta o dirija el tráfico a WhatsApp Business, para que todo lleve al cliente al canal de compra.

• Disparador/entrada: el vendedor consulta la salida de venta en la Guía.
• Resultado observable: landing page elaborada o enlace a WhatsApp Business listo para usar.
• Acceso: requiere identificación.
• Fallo/recuperación: si la salida no se genera, se ofrece reintento.
• Continuación: el vendedor configura el canal según la Guía.

FR-08 — Recomendación de canal y configuración de WhatsApp Business (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema me recomiende si conviene vender por landing page, Hotmart o WhatsApp y me explique cómo configurar WhatsApp Business, para elegir el canal con más resultados.

• Disparador/entrada: el vendedor abre la Guía.
• Resultado observable: recomendación de canal y pasos de configuración de WhatsApp Business.
• Acceso: requiere identificación.
• Fallo/recuperación: si la guía no se genera, se ofrece reintento.
• Continuación: el vendedor sigue los pasos y marca el checklist.

FR-09 — Guía paso a paso de la campaña de Meta Ads de $2 (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema me explique paso a paso cómo crear la campaña de Facebook/Meta Ads de 2 dólares y maximizar su rendimiento, ya que yo ejecuto esa parte manualmente, para que rinda lo más posible y me dé muchas ventas.

• Disparador/entrada: el vendedor abre la sección de Meta Ads $2 en la Guía.
• Resultado observable: pasos detallados de la campaña de $2 y checklist ejecutable.
• Acceso: requiere identificación.
• Fallo/recuperación: si la guía no se genera, se ofrece reintento.
• Continuación: el vendedor publica la campaña manualmente en Meta Ads.

FR-10 — Sistema completo, perfecto y ejecutable para vender desde el primer día (explicit) Como Vendedor principiante de productos digitales, quiero que el sistema entregue todo el flujo automatizado, perfecto y ejecutable, para generar ventas desde el primer día.

• Disparador/entrada: el vendedor recorre el flujo desde el Panel.
• Resultado observable: todas las etapas completadas y el checklist ejecutable disponible.
• Acceso: requiere identificación.
• Fallo/recuperación: cualquier etapa fallida se puede reintentar sin perder el progreso.
• Continuación: el vendedor ejecuta la campaña y atiende ventas por el canal elegido.

FR-11 — Instrucciones para computadora y celular (explicit) Como Vendedor principiante de productos digitales, quiero que las instrucciones cubran tanto computadora como celular, para poder ejecutar todo desde el dispositivo que tenga a mano.

• Disparador/entrada: el vendedor alterna el dispositivo en la Guía.
• Resultado observable: instrucciones específicas para computadora y para celular.
• Acceso: requiere identificación.
• Fallo/recuperación: si una vista no carga, se ofrece reintento.
• Continuación: el vendedor sigue los pasos en su dispositivo.

FR-12 — Autoinscripción del vendedor (required_inference) Como Vendedor principiante de productos digitales, quiero inscribirme para iniciar el flujo, para que mi trabajo quede guardado a mi nombre.

• Disparador/entrada: el vendedor inicia la autoinscripción desde la Landing.
• Resultado observable: acceso creado y redirección al Panel.
• Acceso: público (la Landing no exige identificación).
• Fallo/recuperación: datos inválidos muestran un mensaje claro y permiten corregir.
• Continuación: el vendedor entra al Panel.

FR-13 — Verificación de retorno (required_inference) Como Vendedor principiante de productos digitales, quiero verificar mi identidad al volver, para acceder a mis productos y entregables durables.

• Disparador/entrada: el vendedor vuelve y usa Login.
• Resultado observable: acceso concedido y entregables previos disponibles.
• Acceso: público en Login; protegido en las etapas internas.
• Fallo/recuperación: credenciales inválidas muestran un mensaje claro y permiten reintentar.
• Continuación: el vendedor reanuda su flujo en el Panel.

FR-14 — Selección de un producto antes de generar (required_inference) Como Vendedor principiante de productos digitales, quiero seleccionar un producto digital antes de generar el producto, el anuncio y la landing, para que todo se construya sobre la misma elección.

• Disparador/entrada: el vendedor confirma un producto en Selección.
• Resultado observable: producto seleccionado vinculado a las etapas siguientes.
• Acceso: requiere identificación.
• Fallo/recuperación: sin selección, las etapas posteriores muestran un vacío con enlace a Selección.
• Continuación: el vendedor genera el producto.

4. User Personas

Vendedor principiante de productos digitales

• Contexto de producto: persona hispanohablante en Mérida, Yucatán, México (o el mundo), sin experiencia técnica, que quiere vender productos digitales desde el primer día. No sabe configurar campañas ni canales de venta y teme equivocarse.
• Objetivo principal: tener todo listo y ejecutable —producto, anuncio, landing o WhatsApp y campaña de $2— para generar ventas desde el primer día.
• Responsabilidades aceptadas: iniciar el flujo (autoinscripción y verificación de retorno); consultar la IA gratuita recomendada; revisar la matriz 3×3 de productos y variaciones; seleccionar el producto con mayor dolor resuelto; generar el producto digital; generar el anuncio psicológico; obtener la landing o el enlace a WhatsApp; seguir la guía de WhatsApp Business y de la campaña de Meta Ads de $2 en computadora y celular; publicar la campaña manualmente en Meta Ads.
• Entradas y decisiones: elegir el producto de la matriz; confirmar la selección; decidir el canal de venta (landing, Hotmart o WhatsApp) según la recomendación; ejecutar los pasos del checklist.
• Interacciones con otros participantes: el motor de IA del sistema genera recomendaciones, productos, anuncios y guías; Meta Ads y WhatsApp Business son canales externos que el vendedor opera manualmente siguiendo la guía.
• Éxito observable: todas las etapas completadas, anuncio y landing/WhatsApp listos, guía y checklist ejecutables, y campaña de $2 publicada por el vendedor.
• Diferencia de rol: es el único actor humano; su trabajo combina decisión de producto, generación asistida y ejecución manual de canales externos, todo en lenguaje sencillo y paso a paso.

5. Core User Flows

Flujo A — Primer uso: de la Landing al Panel

1. El vendedor abre la Landing (público, sin identificación) y lee la propuesta "Tu sistema de ventas, paso por paso", el diagrama del embudo y la franja de instrumentos.
2. Pulsa el botón naranja de siguiente acción e inicia la autoinscripción en Login.
3. Completa sus datos; si hay un error, el sistema muestra un mensaje claro y le permite corregir sin perder lo escrito.
4. Al confirmar, el sistema crea su acceso y lo redirige al Panel, donde ve las etapas 01–07 sin iniciar y la invitación a empezar por Asistentes IA.
5. Continuación: el vendedor entra a Asistentes IA.

Flujo B — Vendedor que regresa

1. El vendedor abre Login y verifica su identidad.
2. Si las credenciales son inválidas, ve un mensaje claro y reintenta.
3. Al verificar, entra al Panel y ve el estado de sus etapas y entregables previos.
4. Continuación: reanuda la etapa pendiente.

Flujo C — Elegir la IA gratuita recomendada

1. Desde el Panel, el vendedor abre Asistentes IA.
2. El sistema muestra la tabla comparativa de IAs gratuitas (Gemini, Claude, ChatGPT y otras gratuitas) y destaca la recomendada con un punto naranja.
3. Si la comparación no se genera, el vendedor reintenta.
4. Continuación: el vendedor pasa a Productos.

Flujo D — Revisar la matriz 3×3 y seleccionar producto

1. El vendedor abre Productos y revisa la matriz con encabezados Mundo / México / Mérida y las variaciones vendibles por región.
2. Pulsa el control naranja "seleccionar" en la fila del producto que le interesa.
3. En Selección, revisa la evaluación del producto con mayor dolor resuelto y potencial de compra compulsiva.
4. Confirma el producto con el botón naranja; si la evaluación falla, reevalúa o cambia de producto.
5. Continuación: el vendedor pasa a Producto.

Flujo E — Crear el producto digital

1. En Producto, el vendedor genera el producto digital seleccionado (no limitado a Hotmart).
2. Ve el progreso de la generación; si falla, regenera sin perder la selección.
3. Al terminar, el producto queda creado y guardado.
4. Continuación: el vendedor pasa a Anuncio.

Flujo F — Generar el anuncio psicológico

1. En Anuncio, el vendedor genera el anuncio.
2. El sistema entrega título, edad correcta, tipo de persona objetivo, género, identificación con el producto y urgencia de compra.
3. Si la generación falla, regenera.
4. Continuación: el vendedor pasa a Guía.

Flujo G — Landing o WhatsApp y guía de canales

1. En Guía, el vendedor consulta la landing page elaborada o el enlace a WhatsApp Business.
2. Lee la recomendación de vender por landing page, Hotmart o WhatsApp.
3. Sigue los pasos de configuración de WhatsApp Business, alternando entre computadora y celular.
4. Marca los pasos del checklist a medida que los completa.
5. Continuación: el vendedor prepara la campaña de Meta Ads.

Flujo H — Campaña de Meta Ads de $2 (ejecución manual del vendedor)

1. En la sección Meta Ads $2 de la Guía, el vendedor revisa el medidor del presupuesto de $2 y las filas de audiencia y objetivo.
2. Sigue el paso a paso detallado para crear la campaña en Facebook/Meta Ads y maximizar su rendimiento.
3. El vendedor publica la campaña manualmente en Meta Ads (responsabilidad externa).
4. Continuación: el vendedor atiende las ventas por el canal elegido y completa el checklist.

6. Visuals Colors and Theme

Musa: Dieter Rams. Titular: "Tu sistema de ventas, paso por paso".

Modo: claro.

Paleta (tokens exactos):

• Fondo: #EDEAE4
• Superficie: #F7F5F0
• Texto: #1C1B18
• Primario: #2B2A26
• Acento (único color saturado): #E8541E
• Apagado (solo etiquetas y metadatos): #8C877C
• Reglas/bordes: #C9C4B8

El naranja Braun #E8541E se reserva para el único control de siguiente acción, los marcadores de paso activos y el punto de estado; nunca como relleno grande detrás de texto. Sin degradados; rellenos planos.

Tipografía:

• Titulares: Archivo 700–800, tracking -0.02em, sentence case.
• Etiquetas, números de paso y pies de datos: Archivo Narrow 600, mayúsculas, 11–12px, letterspacing +0.14em.
• Cuerpo: Archivo, 16–18px, line-height 1.55.
• Números en cifras tabulares de Archivo.
• Escala modular 1.25: 12 / 14 / 16 / 20 / 25 / 31 / 39 / 49 / 61 / 76px; titular display clamp(40px, 7.2vw, 76px); titular de sección clamp(28px, 4vw, 39px); mínimo móvil 40px.

Forma: controles rectangulares con radio 10px y borde de 1px; sin sombras salvo un brillo interior 0 1px 0 inset en controles presionados. Puntos de estado circulares de 8px y números de paso circulares de 28px como únicas formas redondas. Bandas de color a sangre completa separan secciones mayores; sin blobs, sin tarjetas suaves, sin botones píldora.

Layout: rejilla modular de 12 columnas con rail izquierdo persistente en escritorio (pasos 01–07) y rail horizontal desplazable en móvil. Filas etiqueta/valor alineadas con reglas de 1px; banda negra a sangre completa marca el momento de "ejecutar".

Imaginería: solo line art diagramático: embudo esquemático de rectángulos etiquetados, pictogramas Braun por paso, medidor circular para el "$2 bien gastados" y siluetas de producto en gris plano. Iconos de trazo 1.5px sobre rejilla de 24px. Sin fotografía ni personas de stock.

7. Signature Design Concept

Hero tipo panel frontal. La Landing se divide 7/5 a sangre completa sobre el campo cálido #EDEAE4. A la izquierda, un titular gigante alineado a la izquierda en Archivo 800 (clamp(40px, 7.2vw, 76px)) apilado en tres líneas —"Tu sistema de ventas, paso por paso"— con una etiqueta pequeña en mayúsculas encima: "GUÍA EJECUTABLE · MÉRIDA · MÉXICO · MUNDO", y el botón naranja de siguiente acción (radio 10px, borde inferior de 2px) fijado justo debajo. A la derecha, un diagrama plano del embudo: cinco rectángulos etiquetados (Producto → Anuncio → Landing/WhatsApp → Meta Ads → Venta) conectados por líneas de 1px, con un punto de estado naranja en el paso activo. Debajo del titular, una franja de instrumentos de cuatro celdas separadas por reglas de 1px (IA recomendada / Producto / Anuncio / Campaña $2) en etiqueta/valor con cifras tabulares. El hero se lee como el panel frontal de una máquina bien hecha, no como una página de marketing.

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: restrained Hero Dimensionality: flat

Landing Hero Motion Brief

• Sujeto focal: el diagrama plano del embudo de cinco rectángulos etiquetados con un punto de estado naranja en el paso activo.
• Tesis entrada → transformación → resultado: al cargar la Landing, el punto naranja se posiciona en el primer paso del embudo y la franja de instrumentos muestra sus valores; al pulsar el botón de siguiente acción, el punto avanza al paso correspondiente y el vendedor pasa a la autoinscripción. Solo se anima el estado aceptado del flujo.
• Vocabulario de movimiento: cambios de estado lineales de 120ms, presión de botón con traslación de 1px, números de paso que saltan al estado activo con un relleno naranja, conteo ascendente del presupuesto de $2 y de la cifra de ventas proyectadas que se detiene en seco (sin rebote), y un fundido de opacidad de 160ms al entrar en cada sección.
• Primer fotograma compuesto: titular a la izquierda, etiqueta en mayúsculas encima, botón naranja debajo, embudo a la derecha con el punto en el paso 01 y la franja de instrumentos con sus cuatro valores.
• Estado con movimiento reducido: se eliminan el conteo y el fundido, dejando los valores finales y el punto en su posición estática.

9. Non-Functional Requirements

• NFR-01 — Gratuidad de las IAs consideradas (explicit): las herramientas de IA comparadas y recomendadas deben ser gratuitas (versiones gratis de Gemini, Claude, ChatGPT u otra gratuita mejor). Razón: restricción dura del usuario.
• NFR-02 — Ejecución manual de Meta Ads (explicit): el sistema no publica la campaña de $2; entrega un paso a paso detallado para que el usuario la ejecute en Facebook/Meta Ads. Razón: restricción dura del usuario.
• NFR-03 — Producto no limitado a Hotmart (explicit): el sistema crea el producto digital sin limitarse a productos de Hotmart. Razón: restricción dura del usuario.
• NFR-04 — Claridad paso a paso (explicit): las explicaciones deben ser sencillas, paso a paso, para alguien sin conocimientos del tema, sin errores. Razón: restricción dura del usuario.
• NFR-05 — Cobertura computadora y celular (explicit): las instrucciones deben cubrir tanto computadora como celular. Razón: restricción dura del usuario.
• NFR-06 — Legibilidad y controles completos (explicit): titulares, etiquetas, números y controles permanecen completamente dentro del viewport y su contenedor a 375px, 768px y 1280px, con clamp(...) y sin solapamiento. Razón: dirección creativa.
• NFR-07 — Movimiento reducido (explicit): con prefers-reduced-motion se eliminan el conteo y el fundido, dejando los valores finales y un rail desplazable usable. Razón: dirección creativa.
• NFR-08 — Identidad y persistencia (required_inference): la aplicación conserva los productos, anuncios y entregables del vendedor entre sesiones, por lo que requiere identidad propia y almacenamiento durable. Razón: continuidad del flujo aceptado.

10. Tech Stack

• Frontend: React (aplicación web).
• Backend: Python / FastAPI, con el motor de IA para recomendaciones, productos, anuncios y guías.
• Almacenamiento: base de datos relacional para la identidad del vendedor y sus entregables durables.
• Contenedores: Docker / docker-compose con un frontend y un backend compartido.
• IA: proveedores de IA gratuitos (versiones gratis de Gemini, Claude, ChatGPT u otra gratuita mejor), según la recomendación del sistema.

11. Assumptions and Constraints

• A-01 (required_inference): el vendedor tiene acceso a una cuenta de Facebook/Meta Ads y a WhatsApp Business para ejecutar manualmente la campaña y el canal de venta.
• A-02 (required_inference): la identidad de la aplicación es necesaria para conservar productos, anuncios y entregables entre sesiones; no se establecen roles ni permisos diferenciados.
• A-03 (explicit): la publicación de la campaña de $2 y la operación de WhatsApp Business son responsabilidad externa del vendedor, guiadas paso a paso por el sistema.
• A-04 (explicit): el producto no se limita a Hotmart; el sistema crea el producto digital.
• A-05 (explicit): las IAs consideradas son gratuitas.
• A-06 (explicit): las instrucciones cubren computadora y celular y se redactan en lenguaje sencillo, paso a paso.

12. Glossary

• Producto digital: bien vendible sin inventario físico, creado por el sistema a partir de la selección del vendedor.
• Compra compulsiva / impulso de compra: enfoque psicológico del copy del anuncio que busca despertar el deseo inmediato de comprar.
• Matriz 3×3: tabla de 3 productos más vendidos en el mundo, 3 en México y 3 en Mérida, Yucatán.
• Variación vendible: adaptación de un producto digital para una región (México, Mérida o el mundo).
• Campaña de $2: campaña de Meta Ads con presupuesto de 2 dólares que el vendedor publica manualmente.
• WhatsApp Business: canal externo de venta que el vendedor configura siguiendo la guía.
• Hotmart: plataforma de venta de productos digitales mencionada como opción de canal, no como límite del producto.
• Checklist: lista de pasos ejecutables que el vendedor marca en la Guía.
• Rail numerado: navegación de pasos 01–07 que también funciona como indicador de progreso.