Gemini Pro Studio: Construye tu Asistente IA Especializado & Agente Personalizable
Instructor
playcodelatam
Categoría
- Descripción
- Currículum
- Reseñas
Aprende a programar tu propia aplicación de Inteligencia Artificial conversacional conectada a la API de Google Gemini, capaz de procesar texto, analizar imágenes, resumir documentos PDF y actuar como un agente especializado.
Ya no dependes de interfaces de terceros ni de suscripciones mensuales para aprovechar el verdadero poder de los Modelos de Lenguaje Grandes (LLMs). En este curso práctico bajo la metodología ABP (Aprendizaje Basado en Proyectos) y la filosofía de Vibecoding, aprenderás a construir tu propia plataforma de Inteligencia Artificial personalizada desde cero.
Utilizando la API gratuita de Google AI Studio y tecnologías web modernas, conectarás el cerebro de Gemini a una interfaz fluida e intuitiva estilo ChatGPT. Comenzarás enviando tus primeros mensajes y evolucionarás paso a paso hasta dotar a tu asistente de visión artificial para leer fotos, extracción de texto para resumir PDFs completos, memoria de conversación, notas de voz y un panel de configuración para diseñar “Agentes Especializados” con personalidades y reglas a medida.
Al finalizar el curso, no te quedarás con ejercicios sueltos: tendrás tu propia aplicación web de IA desplegada en internet, lista para usar en tu día a día, compartir con colegas o comercializar como solución a medida para empresas y profesionales.
🎯 Lo que aprenderás a dominar:
- Integración con Google AI Studio: Obtención, configuración y consumo seguro de la API de Gemini (modelos Flash y Pro) sin costos ocultos.
- Procesamiento Multimodal Real: Cómo enviar imágenes (JPG/PNG en Base64) y documentos extensos (PDFs) para que la IA extraiga conclusiones y resúmenes.
- Memoria y Contexto Conversacional: Gestión de hilos de chat, persistencia en el navegador (
LocalStorage) y exportación de historiales. - Prompt Engineering de Sistema (System Instructions): Cómo programar la personalidad, tono, restricciones y directivas de la IA para crear agentes a medida.
- Seguridad y Despliegue: Cifrado y resguardo de API Keys en el cliente, prevención de Prompt Injections y publicación gratuita en la nube.
📚 Estructura del Curso: Módulos y Unidades
💬 MÓDULO 1: Interfaz de Chat Multimodal & Conexión Gemini
Proyecto: OmniChat AI
Objetivo: Desarrollar una aplicación web de chat inteligente con interfaz moderna en modo oscuro, conectada en vivo a la API de Gemini, con memoria de chat y soporte para adjuntar imágenes y PDFs.
| Unidad | Título | Desafío del Alumno | Prompt Base Clave |
|---|---|---|---|
| U1 | Interfaz de Chat Moderna (UI/UX) | Diseñar un entorno oscuro con barra lateral para historiales y burbujas de diálogo. | “Crea una interfaz de chat web moderna en modo oscuro estilo ChatGPT con barra lateral izquierda colapsable, área central de mensajes y campo de texto con botones de enviar y adjuntar.” |
| U2 | Conexión con Google AI Studio | Conectar el formulario a la API de Gemini usando la API Key y mostrar la respuesta. | “Crea una modal para ingresar la API Key de Google AI Studio y programa la petición POST a la API de Gemini para enviar el mensaje del usuario y mostrar la respuesta de la IA en pantalla.” |
| U3 | Memoria Conversacional | Evitar la pérdida de contexto enviando el historial completo en cada turno de conversación. | “Modifica el envío a la API para acumular el historial de mensajes de la sesión y enviarlo en cada consulta, logrando que Gemini recuerde lo conversado anteriormente.” |
| U4 | Renderizado Markdown & Streaming | Dar formato profesional a textos, títulos y bloques de código con botón para copiar. | “Integra Marked.js para formatear respuestas en Markdown con bloques de código legibles y botón de copiar, e incluye un indicador animado de ‘Pensando…’ mientras responde.” |
| U5 | Visión por Computadora (Imágenes) | Adjuntar fotografías o capturas para que Gemini las analice y responda dudas. | “Permite arrastrar o subir imágenes al chat, conviértelas a Base64 y envíalas a la API de Gemini junto con el mensaje del usuario para que describa o analice la foto.” |
| U6 | Análisis y Resumen de PDFs | Cargar documentos PDF extensos y solicitar resúmenes en puntos clave o extracción de datos. | “Agrega un botón para subir archivos PDF, procesa su contenido para enviarlo a Gemini y haz que devuelva un resumen estructurado con las conclusiones más importantes del documento.” |
| U7 | Modo Mobile & Notas de Voz | Adaptar la experiencia a pantallas táctiles e integrar dictado por voz del navegador. | “Optimiza la web para celulares evitando que el teclado tape los mensajes, y agrega un botón de micrófono con la Web Speech API para dictar mensajes por voz y transcribirlos al input.” |
| U8 | Persistencia de Chats & Exportación | Guardar conversaciones en el navegador y permitir descargar los chats en Markdown. | “Guarda el historial de chats en LocalStorage para cargarlos al volver a abrir la web, y agrega un botón para exportar cualquier conversación en un archivo de texto o Markdown.” |
⚙️ MÓDULO 2: Asistente Especializado & Agente Personalizable
Proyecto: ExpertAI Studio
Objetivo: Transformar el chat básico en una suite de Agentes de IA a medida con control de temperatura, instrucciones de sistema (System Prompts), biblioteca de perfiles y seguridad de claves.
| Unidad | Título | Desafío del Alumno | Prompt Base Clave |
|---|---|---|---|
| U1 | Panel de Ajustes del Modelo | Controlar la creatividad (temperatura) y seleccionar modelos (Flash vs Pro). | “Crea un panel lateral de ajustes con selector de modelo de Gemini (Flash/Pro), deslizador de temperatura de 0 a 1 y control de cantidad máxima de tokens de respuesta.” |
| U2 | Instrucciones del Sistema (System Prompt) | Fijar la identidad, tono y reglas estrictas del bot mediante systemInstruction. |
“Agrega en los ajustes un campo para el ‘Prompt de Sistema’ e intégralo en la llamada de Gemini para obligar al asistente a adoptar un rol profesional específico y respetarlo siempre.” |
| U3 | Galería de Asistentes Preconfigurados | Crear un selector de 4 agentes listos (Tutor de Idiomas, Programador, Legal, Copywriter). | “Diseña tarjetas seleccionables de asistentes rápidos (Tutor, Programador, Asesor Legal, Copywriter) que al elegirse cambien automáticamente el System Prompt y el avatar del bot.” |
| U4 | Comandos Rápidos (Prompts de 1 Clic) | Botones sobre el input para acelerar tareas frecuentes (“Resumir”, “Simplificar”, “Corregir”). | “Agrega botones de atajo rápido sobre el campo de texto (‘Resumir’, ‘Traducir’, ‘Explicar simple’) que apliquen automáticamente esa acción sobre el último mensaje o consulta.” |
| U5 | Extracción de Datos & Gráficos en Vivo | Hacer que la IA responda tablas estructuradas y renderizarlas en gráficos con Chart.js. | “Crea una directiva para que cuando la IA devuelva estadísticas lo haga en JSON, detecta esos datos en el frontend y dibuja un gráfico de barras o pastel con Chart.js en el chat.” |
| U6 | Búsqueda Web con Google (Grounding) | Habilitar el módulo de Google Search de Gemini para citar fuentes con enlaces reales. | “Activa la herramienta de Grounding (búsqueda con Google) en la API de Gemini para que responda con datos de actualidad e incluya las fuentes consultadas al pie de la respuesta.” |
| U7 | Optimización Responsive del Panel | Diseñar una experiencia táctil impecable para configurar agentes desde tablets o celulares. | “Adapta el panel de ajustes y la galería de asistentes para móviles usando una hoja inferior deslizante (bottom sheet) con controles táctiles grandes y sin cierres accidentales.” |
| U8 | Auditoría de Seguridad & Despliegue | Proteger la API Key del usuario, evitar inyecciones XSS y publicar gratis la app web. | “Audita la app: resguarda la API Key para que nunca quede en código duro, sanitiza salidas Markdown contra ataques XSS, añade protección contra Prompt Injections y déjala lista para Vercel o Netlify.” |
📦 Entregables Finales del Alumno:
- OmniChat AI: Chatbot multimodal publicado en la web capaz de mantener memoria, entender imágenes y resumir documentos PDF en tiempo real.
- ExpertAI Studio: Plataforma de agentes donde cualquier usuario puede alternar entre tutores de idiomas, programadores senior o analistas de contratos con un solo clic.
MÓDULO 1: Interfaz de Chat Multimodal & Conexión Gemini (HTML5 / JS / Gemini API)
-
1
Objetivo -
2
Unidad 1: La Interfaz de Chat Moderna (UI/UX estilo ChatGPT/Claude)
-
3
Unidad 2: Conexión con Google AI Studio (API Key & Primer Saludo)
-
4
Unidad 3: Memoria Conversacional (Historial de Mensajes / Contexto)
-
5
Unidad 4: Efecto Streaming & Renderizado Markdown (Código y Negritas)
-
6
Unidad 5: Visión por Computadora: Adjuntar y Analizar Imágenes
-
7
Unidad 6: Análisis y Resumen Inteligente de Documentos PDF
-
8
Unidad 7: Experiencia Móvil & Notas de Voz (Voice-to-Text)
-
9
Unidad 8: Persistencia en LocalStorage y Descarga del Chat
MÓDULO 2: Asistente IA Especializado & Agente Personalizable (Prompt Engineering & Settings)
-
10
Objetivo
-
11
Unidad 1: Panel de Ajustes y Configuración del Modelo (Settings Modal)
-
12
Unidad 2: Instrucciones del Sistema (System Prompt / Personalidad Base)
-
13
Unidad 3: Biblioteca de Asistentes Preconfigurados (Presets / Roles)
-
14
Unidad 4: Sistema de Prompts Rápidos (Slash Commands & Chips)
-
15
Unidad 5: Modo Análisis de Datos & Gráficos Interactivos
-
16
Unidad 6: Modo Búsqueda Web / Grounding (Simulación o API externa)
-
17
Unidad 7: Auditoría y Optimización Responsive del Panel de Agentes
-
18
Unidad 8: Auditoría de Seguridad & Protección de la API Key (Lanzamiento)
Por favor, inicia sesión para dejar una reseña
Detalles del curso
Conferencias
18
Nivel
Principiante
