Tutorial y Guía Completa de OmniPortal

A diferencia de ChatGPT o chatbots convencionales donde el usuario tiene que enfrentarse a una ventana en blanco y debe redactar instrucciones complejas (Prompt Engineering), OmniPortal utiliza Micro-Apps guiadas por formulario:

Al navegar a http://localhost:3000/login, encontrarás los siguientes elementos:

• CAMPO 1 Correo Electrónico: Ingresa el correo con el que te diste de alta (por ejemplo, admin@portal.com).
• CAMPO 2 Contraseña: Ingresa tu clave secreta. Puedes pulsar el icono del ojo 👁️ para verificar los caracteres ingresados.
• BOTÓN Pulsa Ingresar: Autentica tus datos con Supabase y te lleva directamente al Dashboard.
• ENLACE ¿Olvidaste tu contraseña?: Te dirige a /forgot-password. Al introducir tu correo, el sistema genera y te envía un enlace seguro de recuperación (Magic Link). Al hacer clic en tu correo, el sistema valida tu token y te redirige directamente a /update-password para que ingreses tu nueva clave de inmediato.
• ENLACE ¿No tienes cuenta? Regístrate: Te conduce a /signup para crear tu cuenta gratuita.

• BOTÓN ☰ Menú Móvil: Abre o cierra el panel lateral cuando navegas en pantallas reducidas.
• BUSCADOR 🔍 Búsqueda Rápida (⌘K o Ctrl+K): Encuentra cualquier herramienta de IA al instante escribiendo su nombre o función (ej. propuestas, emails, artículos, guiones, etc.). Despliega un menú en vivo con navegación por flechas (↑ / ↓) y, al presionar Enter ↵ o hacer clic, te transporta directo al espacio de trabajo de la herramienta.
• SELECTOR 🌐 Conmutador de Idioma (con flecha animada): Cambia toda la interfaz entre Español, English, Français y Português en tiempo real.
• BOTÓN 🔔 Campana de Notificaciones: Despliega un menú emergente con eventos del sistema (altas de usuario, respaldos).
• AVATAR 👤 Menú de Perfil (Círculo con Iniciales o Foto): Al hacer clic despliega 3 opciones:
  • Perfil: Edición de nombre, apellido y foto.
  • Configuración: Cambio de contraseña.
  • Cerrar Sesión: Cierre seguro de sesión.

• LOGOTIPO 'O' OmniPortal: Regresa en cualquier momento a la pantalla principal del Dashboard.
• BOTÓN ❮ / ❯ Contraer / Expandir: Oculta los textos del menú lateral para dejar más espacio al espacio de trabajo.
• ENLACE 🏠 Dashboard: Vista global de actividad, métricas, tutorial y FAQ.
• ENLACE ⊞ Micro Apps: Catálogo con todas las herramientas de IA disponibles.
• ENLACE 💎 Planes: Comparativa de membresías y cuotas de uso.
• ADMIN 🛡️ Módulo Administrador (Solo Administradores): Submenú con Admin (usuarios), Webhooks, Email y Material Comercial.

• BOTÓN ⬇ Exportar Datos (esquina superior derecha): Genera y descarga a tu computadora un archivo dashboard-export-[fecha].json con el resumen de métricas del sistema.
• BANNER PVU Contiene el botón Lanzar una Micro-App → para ir directo al catálogo.
• 4 TARJETAS Indicadores en tiempo real de Usuarios, Sesiones, Conversiones e Ingresos con porcentajes de variación semanal.
• GRÁFICOS Línea SVG de tendencia de actividad y barras interactivas con porcentajes en hover.
• STEPPER 1-4 Guía de Inicio Rápido (3 Clics): Pestañas interactivas explicadas con botón Siguiente Paso →.
• FAQ Acordeón con dudas comunes desplegables con un clic.

En el menú lateral haz clic en Micro Apps y pulsa en la tarjeta deseada.

• OPCIÓN 1 CLIC Haz clic en insignias como Ej. Clínica Dental o Ej. Agencia SEO: El formulario completo se llenará con un caso real de muestra.
• MANUAL Rellena los campos guiados: Cliente, Sector, Beneficios e Inversión estimada.

Pulsa en el idioma en el que deseas el resultado redactado por Gemini:

Español 🇪🇸 English 🇺🇸 Français 🇫🇷 Português 🇧🇷

Haz clic en el botón Generar con Gemini. El botón mostrará un indicador de carga y en pocos segundos el entregable aparecerá en el panel derecho.

En la esquina superior derecha del recuadro gris "PARÁMETROS ENVIADOS" (arriba del resultado generado), encontrarás estos 4 botones:

• PESTAÑA En cualquier micro-app, pulsa la pestaña Historial ubicada arriba a la izquierda.
• LISTADO Verás todas tus generaciones anteriores ordenadas cronológicamente.
• RECUPERAR Haz clic sobre cualquier generación previa: se recargará automáticamente en el panel derecho lista para leer, copiar o descargar de nuevo sin consumir cuota adicional.

Para cambiar de plan, haz clic en Seleccionar Plan y luego en Confirmar Activación.

• /profile Foto y Datos: Haz clic en el icono de cámara para subir una foto de avatar o usar Gravatar. Cambia tu nombre y pulsa Guardar Cambios.
• /update-password Cambiar Clave: Accesible desde la opción Configuración del menú del avatar o directamente desde el enlace del correo de recuperación. Escribe tu nueva contraseña (mínimo 6 caracteres), confírmala y pulsa Actualizar Contraseña. El formulario cuenta con soporte multilingüe (Español, English, Français, Português) y validación en tiempo real.

Te permite gestionar a cada usuario registrado, cambiar su plan contratado y concederle o revocarle acceso a herramientas individuales (overrides) con un solo clic, sin importar las restricciones de su plan.

• PASO 1 Entra al menú lateral en Admin 🛡️ o ve a http://localhost:3000/admin.
• PASO 2 En la tabla de usuarios, ubica al cliente y haz clic en su nombre o en el botón 👁️ Ver Detalle.
• PASO 3 Cambiar Plan General: En la sección Plan Asignado, puedes elegir en el selector un plan superior (ej. Profesional o Intermedio) y pulsar Guardar Plan.
• PASO 4 Desbloquear Herramientas Individuales: En la sección Apps Accesibles, haz clic en cualquier app que tenga el botón + Conceder. Se activará de inmediato iluminándose en cian con la etiqueta ★ Especial.
• REVOCAR Para quitarle el permiso especial, basta pasar el cursor sobre la app y pulsar ✕ Revocar. El guardado es automático en tiempo real.

Permite conectar OmniPortal a un servidor de correo SMTP para que el sistema envíe correos automáticos de bienvenida, recuperación de contraseñas y confirmación de pagos.

• PRESETS SMTP Botones de Proveedor: Botones rápidos (SendGrid, Gmail SMTP, Mailgun, Amazon SES) que rellenan solos el host y el puerto adecuado (587).
• CAMPOS TÉCNICOS Configuración del Host, Puerto, Usuario, Contraseña y datos de remitente (Nombre y correo visible al cliente).
• CASILLA DE PRUEBA Enviar correo de prueba a: Escribe tu correo personal para verificar el envío antes de guardar.
• BOTÓN DE GUARDAR Pulsa Probar y Guardar Configuración: Realiza una prueba en vivo, envía un correo de diagnóstico y marca el servicio como Verificado.

Es tu Centro de Ventas para ofrecer las micro-apps de OmniPortal a clientes, clínicas o imprentas sin que tengan que registrarse previamente.

• PROPUESTA UNIVERSAL /propuesta-universal.html: Presentación interactiva multisector (Clínicas Dentales, Talleres de Preprensa, Agencias) con una demo en vivo de la IA en 2.2 segundos.
• PREPRENSA Y CTP /presentacion-preprensa.html: Diseñada específicamente para talleres de artes gráficas e imprentas offset para soporte de preflight.
• BOTÓN 👁️ Ver Propuesta: Abre la presentación en una pestaña nueva para proyectarla en una reunión de ventas.
• BOTÓN 🔗 Copiar Enlace: Copia el link directo de la presentación para enviárselo a un prospecto.
• BOTÓN 💬 Copiar Guión para WhatsApp: Copia un texto comercial persuasivo listo para pegar en el chat de tu cliente.
• BOTÓN ✉️ Copiar Correo Electrónico: Copia un correo formal de propuesta con asunto y cuerpo listo.

En OmniPortal, la acción de «Exportar» significa extraer la información generada adentro de la plataforma para usarla externamente. Se presenta en dos niveles distintos: