Bienvenidos al curso
En este espacio encontrarán todos los recursos, herramientas y actividades que iremos utilizando a lo largo de las 10 sesiones.
Dr. Jorge Cruz-Angeles
Profesor de la EIC · Tec de Monterrey · Campus Monterrey
Investigador en IA aplicada a educación · SNI Nivel 1
📋 Estructura del curso
🎯 ¿Qué vamos a lograr?
Al finalizar el curso, cada participante tendrá:
- Una actividad rediseñada con el framework del Arquitecto de Preguntas
- Una herramienta tecnológica (app web o chatbot) creada por ustedes
- Una estrategia de evaluación alineada a la era de la IA
🛠️ Herramientas del curso
Estas son las plataformas que usaremos. No necesitan cuentas de pago.
Sesión 1 — La Crisis de la Evaluación y el Arquitecto de Preguntas
📝 Padlet: ¡Quiero conocerlos!
Cuéntanos en un post:
1. Tu nombre y tu rol — ¿a qué te dedicas en tu día a día?
2. Si enseñas o diseñas instrucción: ¿crees que las actividades y evaluaciones que diseñas hoy están preparadas para la nueva realidad con IA?
3. Si produces, gestionas o desarrollas: ¿crees que los briefs, propuestas, productos o procesos que generas hoy están preparados para esa misma realidad?
📝 Padlet: Identifiquemos lo que diseñamos
Piensa en algo que tú diseñas o produces para que alguien más interactúe con ello (un alumno, un espectador, un usuario, un comité, un equipo) y respóndenos en un post:
1. ¿Qué es ese algo? ¿Qué pides, propones o produces? ¿En qué momento esa persona se desconecta? ¿Por qué crees que pasa?
2. ¿Qué herramienta digital crees que te ayudaría a rediseñar eso?
📘 Resumen breve de la sesión
Arrancamos con dos historias reales — Daniel (estudiante excelente que confiesa no poder trabajar sin ChatGPT) y Miguel (alumno que cede a la IA porque ve la actividad como relleno) — para mostrar las dos formas de desconexión que la IA produce: la oculta y la declarada. El argumento central: el problema no es tecnológico, es pedagógico. Los detectores de IA no funcionan ni funcionarán (~4% de falsos positivos con sesgo contra neurodivergentes), usar IA no es plagio sino falsa autoría, lo que se evalúa ya no es el producto sino el proceso, y las taxonomías de Bloom revisada y SOLO siguen siendo la guía. De ahí emerge el framework: el rol de quien diseña como Arquitecto de Preguntas. El menti del grupo lo confirmó: 22 de 27 ya intuían que usar IA no es plagio. Cerramos con el punto que más nos dejó pensando: en una implementación previa, cuando se rediseñaron las actividades bajo este framework y se hizo énfasis explícito en la reflexión metacognitiva, los alumnos llegaron a relacionar conceptos por sí mismos — incluso conceptos que el profesor nunca les enseñó directamente.
🔑 5 ideas clave que nos deja esta sesión
- El problema no es tecnológico, es pedagógico. Nunca vamos a alcanzar a la IA — sale un modelo mejor cada semana. La solución no es perseguirla con más tecnología, sino regresar a las bases pedagógicas y rediseñar desde ahí.
- Los detectores de IA no funcionan — y nunca lo harán. La misma OpenAI bajó su detector. Los mejores actuales tienen ~4% de falsos positivos con sesgo contra personas neurodivergentes y no-nativos del inglés. Encima existe la "humanización" como práctica para evadirlos.
- Usar IA no es plagio — es "falsa autoría". El plagio implica robo de un texto existente; la IA genera texto nuevo. El modelo opera como el viejo "escritor fantasma". La discusión productiva es concientizar, no prohibir: el riesgo real es la atrofia cognitiva, no la copia.
- El producto ya no se evalúa — el proceso sí. El entregable final se puede hacer con IA en minutos. Lo que no se puede falsificar fácilmente: borradores, mapas conceptuales, decisiones tomadas, reflexiones metacognitivas. Ahí va la ponderación nueva.
- El framework: Arquitecto de Preguntas. Toda actividad nace de una pregunta detonadora. Si la pregunta es "¿qué es la fotosíntesis?", ChatGPT la responde en 2 segundos y el aprendizaje no ocurre. Hay que rediseñar la pregunta apuntando a niveles altos: crear/evaluar (Bloom), relacional/abstracto extendido (SOLO).
1. Lleguen pensando en su pregunta detonadora — si diseñan actividades educativas, esa pregunta de la que parte una actividad; si producen contenidos, briefs o productos, también una pregunta detonadora o el objetivo del contenido.
2. ⭐ Próximo tema: vamos a poner esa pregunta a prueba en la plataforma del Arquitecto de Preguntas.
Sesión 2 — Viviendo la Experiencia del Arquitecto
🏗️ WebApp: El Arquitecto de Preguntas
La herramienta central del curso tiene dos versiones — usa la que mejor te describa. Ambas siguen el mismo flujo y usan la taxonomía SOLO de Biggs; la diferencia está en el lenguaje del consumidor de tu pregunta.
Versión clásica
Pensada para profesores. Habla de "tu estudiante", "tu clase", "tu actividad".
🏗️ Abrir clásicaVersión multi-perfil
Misma actividad, lenguaje adaptado a audiovisual, PMO, dev, innovación educativa o profesor. Eliges tu perfil al inicio.
🎨 Abrir multi-perfil📝 Padlet: Evidencia del Arquitecto
Sube aquí la evidencia que descargaste de la webapp del Arquitecto de Preguntas (tu pregunta detonadora original, las iteraciones y el nivel final que alcanzaste). En una sola línea: ¿qué descubriste sobre tu pregunta? ¿qué cambió de tu versión original a la final? Piensa en quien consume tu trabajo — alumno, espectador, usuario, cliente o equipo.
Abrir Padlet📘 Resumen breve de la sesión
En esta segunda sesión los participantes pasaron de la teoría a la práctica, utilizando por primera vez la webapp del Arquitecto de Preguntas para transformar una pregunta detonadora propia. Jorge presentó una versión "multiperfil" de la herramienta diseñada para quienes no son directamente profesores audiovisual, desarrollo, PMO, innovación educativa. Durante 20 minutos cada persona trabajó individualmente, recibiendo retroalimentación iterativa hasta generar su archivo de transformación. La discusión posterior reveló que la mayor fricción surgió al recibir retroalimentación que señalaba que sus preguntas iniciales eran demasiado simples. José Manuel compartió cómo la herramienta lo movió de pensar en lo técnico a considerar qué debía saber previamente el estudiante; Adriana planteó que si la IA puede responder preguntas de alto nivel cognitivo, debemos diseñar para la acción, no solo para la articulación de ideas.
🔑 5 ideas clave que nos deja esta sesión
- La fricción es parte del diseño, no un error. La mayoría reportó que el momento de mayor fricción fue al recibir retroalimentación. Jorge enfatizó que las experiencias de aprendizaje deben provocar una emoción esa sensación es señal de que algo está sucediendo cognitivamente.
- Nuestras preguntas suelen respondernos a nosotros, no al estudiante. José Manuel articuló que su pregunta inicial "solo respondía a mí". El framework ayuda a separar lo que nosotros necesitamos saber de lo que activará el pensamiento del estudiante.
- El siguiente nivel: que la pregunta detonadora dispare una acción, no solo una respuesta. Si la pregunta puede contestarse hablando o tecleando, la IA la cubre. Adriana lo nombró: hay que mover el diseño hacia experiencias donde el estudiante decida, construya o intervenga, no solo articule.
- La herramienta multiperfil permite que diferentes roles se apropien del framework. Profesionales de audiovisual, desarrollo, PMO e innovación educativa pudieron aplicar el mismo framework a sus contextos específicos gracias a la adaptación por rol.
- Siempre ofrecer la opción de no usar IA cuando no es parte del plan analítico. Ya existe un número de estudiantes que prefieren no usar IA. La recomendación: cuando no está en el temario, debe existir alternativa; cuando sí lo está, es parte del aprendizaje.
1. Verificar acceso a Canva AI: entrar con cuenta TEC, buscar el botón "Canva AI", confirmar que aparezca la opción "Programar" y probar con una instrucción simple.
2. Si no tienen acceso: crear nueva cuenta con correo @itesm.mx (en lugar de @tec.mx) y seleccionar que son de educación.
⭐ Próximo tema: Comenzaremos a trabajar directamente con Canva AI para crear sus primeras aplicaciones web.
Sesión 3 — Canvas Code: Tu Primera App Web
🌱 Prompt Semilla — Dashboard FTE (ejemplo en vivo)
Materializa la pregunta transformada de Ezel Escobar (Planeación / PMO) en S02: "Desarrollar un dashboard donde pueda revisar la eficiencia de cada proyecto y los FTEs empleados, para pronosticar el siguiente periodo anual." El consumidor (director) deja de leer un reporte y empieza a operar una herramienta.
🌱 Prompt Semilla alternativo — "Detective de Normas"
Este es el prompt completo que usamos para crear la app de ejemplo. Cópialo y pégalo en Canvas Code para ver el resultado.
🔄 Meta-Prompt — Adapta el ejemplo a tu materia
Pega primero el Prompt Semilla de arriba en Canvas Code, y después agrega este meta-prompt para que la herramienta lo adapte a tu propia actividad.
⚠️ Limitaciones de Canva AI a tener presentes
Canva AI es excelente para generar una primera versión funcional en minutos, pero tiene fronteras concretas que conviene anticipar antes de la sesión:
-
Longitud de la instrucción (lo más importante): Canva AI corta silenciosamente los prompts largos. En nuestras pruebas, prompts mayores a ~1000 caracteres / ~170 palabras se truncan sin avisar. Si tu prompt es más largo, la app llega incompleta (faltan pantallas, falta lógica, falta el botón final).
→ Recomendación: mantener el prompt semilla compacto (5 pantallas máximo, oraciones cortas) y agregar el resto como meta-prompts iterativos en turnos siguientes (ej. "ahora agrega una pantalla de reporte ejecutivo", "ahora cambia la paleta de colores"). - Sin persistencia: Lo que el usuario captura se pierde al cerrar la pestaña. No hay base de datos. Para guardar resultados se requiere otra herramienta (lo veremos en sesiones de Replit).
- Sin login ni multiusuario: Todos los visitantes ven la misma app. No hay perfiles, ni cuentas, ni roles profesor/alumno diferenciados.
- Gráficas básicas: Canva genera gráficas con canvas crudo, no librerías profesionales tipo D3 o Chart.js. Para visualizaciones pulidas conviene exportar el código y refinarlo en otra plataforma.
- "PDF descargable" es print del navegador: cuando pides un botón de descarga, normalmente abre la ventana de impresión. Si necesitas un PDF con diseño propio, eso lo veremos con otras herramientas.
🤖 Generador de Prompt Semilla para Canva AI
Llena 5 campos sobre la app que quieres y obtén un prompt semilla optimizado para Canva (≤1000 caracteres, listo para copiar y pegar). Usa Claude Sonnet en el backend con las reglas que aprendimos en clase.
▶ Abrir generador
📝 Padlet: Mis Creaciones
Sube una captura de pantalla de tu app (aunque esté en proceso). Incluye el nombre de la app y para qué materia o disciplina es.
Abrir Padlet📘 Resumen breve de la sesión
La tercera sesión dio el salto desde la transformación de preguntas hacia la creación de aplicaciones web funcionales. Jorge introdujo el concepto de Vibe Coding: programar sin saber programar formalmente, apoyándose en lenguaje natural y modelos que traducen la intención del diseñador a código ejecutable. El centro de la práctica fue Canva AI (antes Canva Code), presentado como puerta de entrada porque oculta deliberadamente el código para reducir la barrera de quienes no tienen perfil técnico. Se ofrecieron dos rutas para construir la app: usar un prompt semilla (Detective de Normas o Dashboard FTE como plantilla) o usar un generador de prompts vía formulario alojado en la página de recursos. Después de unos 20 minutos cerca de la mitad del grupo publicó su aplicación en el Padlet. Se revisaron tres casos en vivo: el simulador de evaporación de electrones de Mauricio Martínez, la herramienta de planeación y evaluación de videos educativos de José Manuel, y el dashboard de priorización de portafolio de Carolina Lara.
🔑 5 ideas clave que nos deja esta sesión
- Canva AI es punto de entrada, no destino final. Las aplicaciones generadas son borradores funcionales, no productos terminados. Sirven para validar la idea pedagógica antes de escalarla con desarrolladores o con herramientas más potentes como Gemini.
- La calidad del primer prompt define cuántas iteraciones se necesitan. Canva AI tiene un límite claro en la extensión de la instrucción inicial. Eso obliga a ser muy preciso desde el inicio. Las dos estrategias ofrecidas, prompt semilla y formulario generador, buscan compensar esa limitación generando prompts bien estructurados antes de llegar a Canva.
- La aplicación web amplía el rango de uso del framework. Varios participantes están encontrando aplicaciones que no son experiencias profesor-alumno, sino herramientas para flujos paralelos: planeación de videos, dashboards de gestión, simuladores técnicos. El framework de preguntas sigue siendo el insumo, pero el output ya no es solo una actividad de clase.
- Cuando el código se oculta, también se ocultan sus límites. Canva no muestra líneas de código para evitar el bloqueo psicológico de perfiles no técnicos. La contraparte es que tampoco vemos qué modelo está detrás ni qué ventana de contexto tiene. Conviene mantenerlo presente al evaluar resultados.
- Publicar es parte del ejercicio, no un extra. La publicación con dominio de Canva permite compartir la aplicación de inmediato. La vigencia aproximada es de un año y se puede republicar. La integración con hojas de cálculo existe pero todavía no es funcional al nivel necesario para registrar datos reales.
1. Quienes no alcanzaron a publicar su aplicación en el Padlet de S03, hacerlo antes del miércoles para retomar los casos no revisados.
2. Quienes siguen sin acceso a Canva AI Pro: contactar a Etna para definir alternativa antes de S04.
3. Revisar las aplicaciones publicadas por compañeros en el Padlet para llegar con referencias.
⭐ Próximo tema: Gemini como siguiente nivel después de Canva AI. Qué permite hacer Gemini que Canva no resuelve, manteniendo el framework de preguntas como insumo central.
Sesión 4 — De Canva a Gemini
✨ Práctica: Gemini en dos pasos
Antes de empezar: abre gemini.google.com (Gmail personal si la institucional bloquea) y en Herramientas → activa Canvas (paso más importante).
Pega en Gemini el mismo prompt que usaste en Canva AI. Esta es tu 1ª iteración. Dale enviar, espera 1–2 min, y con Compartir → copiar enlace obtén la liga pública. Compárala con tu versión de Canva: ¿cuál hace mejor trabajo con la misma instrucción?
Ahora usa a Gemini para mejorar el prompt antes de volver a construir. Copia y pega esta instrucción:
Responde las preguntas, deja que reconstruya la app y vuelve a obtener la liga pública. Esta es tu versión mejorada.
💬 Padlet: Mis Apps en Gemini (2 versiones)
Publica las ligas de tus dos versiones, cada una en su columna, con una reflexión breve:
- Columna 1 — 1ª iteración (mismo prompt que Canva): ¿qué diferencias notas frente a Canva?
- Columna 2 — Versión mejorada con Gemini: ¿qué cambió al dejar que Gemini afinara el prompt?
🖼️ Diapositiva del flujo
📘 Resumen breve de la sesión
La sesión continuó el recorrido por herramientas para crear aplicaciones web sin ser experto en código. El grupo dio el salto a Gemini, aprovechando que el TEC ya habilitó el acceso institucional al modelo. Jorge explicó la diferencia entre trabajar con un intermediario como Canva (que probablemente corre sobre Claude con ventana de contexto limitada) y trabajar directamente con un modelo de lenguaje como Gemini, que ofrece hasta un millón de tokens de ventana de contexto: prompts más largos, inclusión de documentos, mejores resultados.
🔑 5 ideas clave que nos deja esta sesión
- Saltarse al intermediario amplía el poder creativo. Trabajar directo con Gemini, en lugar de pasar por Canva AI, libera la ventana de contexto, permite prompts largos y abre la puerta a documentos como insumo del modelo.
- La cuenta institucional tiene un costo oculto. En Gemini con cuenta TEC no se pueden compartir ligas, no se pueden borrar conversaciones y no se accede a notebooks ni ciertos modelos. Para el curso conviene usar una cuenta de Gmail no institucional.
- Usar el mismo modelo como copiloto para mejorar el prompt. Pedirle a Gemini que haga cinco preguntas antes de generar la app produce instrucciones redactadas en los términos que el propio modelo entiende mejor, y eso eleva visiblemente la calidad del resultado.
- Agente no es lo mismo que chatbot. Un chatbot responde; un agente planifica, crea archivos, ejecuta herramientas y resuelve un objetivo con cierta autonomía. Repl.it introduce ese paradigma al curso.
- La ventana de contexto cambia lo que es posible. Un millón de tokens en Gemini no es solo un número más grande: significa poder pegar un syllabus completo, varios PDFs o una transcripción larga, y que el modelo los integre. Las aplicaciones que diseñas dejan de ser plantillas para volverse contextuales.
1. Crear una cuenta en Repl.it (preferentemente con correo personal) y llegar lista para no perder tiempo en registro.
2. Quien quiera, puede subir al Padlet de Gemini su versión mejorada del prompt y comparar resultados.
3. Explorar por cuenta propia funciones de Gemini que no se cubrirán en clase: notebooks, generación de imágenes (Nano Banana 2), Canvas para SVG, conexión con Google Drive.
⭐ Próximo tema: inicio del trabajo con Repl.it como entorno agéntico, para construir aplicaciones con funcionalidades imposibles en Canva o Gemini (descarga de PDFs, uso de librerías, publicación con liga).
Sesión 5 — Hiperpersonalización del Aprendizaje
🎯 El concepto: hiperpersonalización
De adaptar para grupos a adaptar para cada estudiante, en tiempo real. Lo que la habilita: telemetría (señales del proceso) + IA generativa (decisiones contextuales) + bucle continuo.
📡 El cómo: telemetría
Las señales que el alumno deja al trabajar — tecleo y pausas, copiar-pegar, tiempo por respuesta, iteraciones — son la materia prima de la hiperpersonalización. Es uso pedagógico y transparente: el alumno sabe que su proceso se registra; la evidencia la desbloquea el profesor.
🔍 Práctica: Creador de Prompts con telemetría
Esta herramienta te guía paso a paso para crear una instrucción (prompt) que genera una app web educativa que registra cómo trabaja el alumno. Al final, el alumno descarga una evidencia que solo tú puedes desbloquear con un código secreto.
🔍 Abrir Creador de Prompts1. Llena los datos de tu clase y objetivo de aprendizaje
2. Escribe tu pregunta (la que diseñaste como Arquitecto)
3. Configura las preguntas de tu actividad
4. Pon tu código secreto de profesor
5. Genera el prompt → cópialo → pégalo en Gemini con Canvas activado
💬 Padlet: Hiperpersonalización del aprendizaje
Publica el link de tu webapp con telemetría + responde brevemente: ¿qué señal de telemetría te parece más reveladora del proceso del alumno y por qué?
Abrir Padlet👀 Lo que viene: Replit
Canva AI y Gemini son excelentes para validar la idea pedagógica rápido, pero tienen techo: sin persistencia, sin login, sin base de datos. En S06 entramos a Replit, donde tu app ya guarda datos, distingue alumno y profesor, y vive en una URL permanente. Es el siguiente nivel cuando tu prototipo está listo para usarse con un grupo real.
📘 Resumen breve de la sesión
La sesión retomó el trabajo con Gemini, pero con un giro conceptual: Jorge introdujo el concepto de telemetría aplicado al aprendizaje y lo vinculó con la hiperpersonalización. Para ilustrarlo, hizo una demostración en vivo simulando ser un estudiante que copia y pega respuestas de Gemini en una actividad de reflexión sobre el impacto ético de la IA. Al final, el supuesto profesor podía desbloquear un panel con métricas (tiempo dedicado, teclas presionadas, caracteres copiados, velocidad de escritura), evidenciando el patrón de uso de IA. En la segunda mitad, los participantes usaron un generador de prompts construido por Jorge para crear su propia aplicación de telemetría en Gemini. La sesión transitó hacia Replit, donde Jorge explicó la diferencia entre chatbot y agente, y los participantes pegaron el prompt de su aplicación para que el agente empezara a construirla. Por el tiempo, la actividad quedó en proceso para retomar en S06.
🔑 5 ideas clave que nos deja esta sesión
- Telemetría como huella del proceso de aprendizaje. No se trata solo de vigilar al estudiante, sino de capturar cómo interactúa: tiempo dedicado, ritmo de escritura, iteraciones, copy-paste. Esa información cuenta una historia del proceso, no solo del resultado.
- De personalización a hiperpersonalización. La personalización del aprendizaje sonaba bien en papel pero era difícil de operar. Con IA y telemetría ahora es viable adaptar realmente la enseñanza al comportamiento individual del estudiante.
- El giro de Violeta: usar los datos para mí, no contra el otro. La telemetría tiene más valor cuando alimenta decisiones pedagógicas del profesor que cuando se usa como prueba acusatoria. El alumno puede evidenciarse solo si la siguiente actividad está bien diseñada.
- Un agente no es un chatbot. Un agente planifica, ejecuta acciones, itera, corrige, conecta componentes y crea archivos. Esa diferencia es la que abre el salto entre Canva o Gemini y Replit.
- Iterar y migrar de cuenta como estrategia frente a los límites gratuitos. Construir aplicaciones complejas en Replit consume créditos rápidamente. Descargar el zip y migrar a una cuenta nueva es una forma honesta de seguir avanzando sin pagar, asumiendo que llegar a un sistema robusto toma varias iteraciones.
1. Dejar el agente de Replit terminando la construcción de la aplicación (no cerrar la ventana mientras trabaja, pero una vez terminada se puede dejar y retomar).
2. Quien haya terminado, puede darle a Publish desde ahora; quien no, lo retomará en S06.
3. Revisar la noticia sobre el pronunciamiento del Vaticano y el Papa respecto al uso de inteligencia artificial (recomendación opcional).
⭐ Próximo tema: continuación con Replit, iteración sobre la aplicación generada por el agente y publicación. Habrá un nuevo Padlet específico para compartir las apps construidas en Replit.
Sesión 6 — Replit: publicación y primer chatbot con Gemini
💬 Padlet: Mis apps publicadas (Replit) + lo que les falta
Comparte tu app publicada en Replit con la siguiente reflexión estructurada:
- Link público (URL de Replit, ya publicada)
- Para qué sirve tu app (1 frase)
- ¿Qué hace bien? (1 cosa concreta)
- 3 mejoras que le harías
- ¿Qué te sorprendió del proceso con el agente? (1 frase)
- ¿Para quién es tu app? (perfil del usuario)
🏗️ Desarrollo vs Producción
Desarrollo es donde editas dentro de Replit: solo tú entras, cambias libremente, se duerme si cierras la pestaña. Producción es la URL pública que sale después de dar Publish: cualquiera con el link entra, queda como versión congelada hasta que vuelvas a publicar.
El aha: editar no es publicar. Cada vez que quieras que el mundo vea un cambio, vuelves a darle Publish.
🚀 Cómo publicar tu app en Replit
- Botón Publish arriba a la derecha
- Nombre del proyecto + descripción corta
- Tipo de despliegue: Autoscale (gratis, despierta on demand)
- Genera URL pública (
.replit.app) - Abrir en pestaña incógnita para comprobar que funciona sin tu sesión
🤖 Anatomía de un chatbot con Gemini (intro)
Cerramos la sesión mostrando el siguiente gran paso: conectar tu app con un modelo de lenguaje. Un chatbot tiene tres piezas:
- Frontend — la pantalla del chat con la que interactúas
- Backend — el código que recibe tu mensaje y llama a Gemini
- Modelo de lenguaje — Gemini, conectado al backend
Se personaliza en dos lugares: el config.json (nombre, color, emoji) y el SYSTEM_PROMPT dentro de app.py, que es donde defines cómo se comporta.
Seguridad (gracias, Mauricio): la API key es como tu tarjeta de crédito. Nunca va en el código ni en el frontend; vive en los Secrets de Replit, y tu backend la usa por ti.
📘 Resumen breve de la sesión
La sesión retomó el trabajo con Replit donde quedó la S05. Un Menti de apertura mostró el estatus del grupo: 9 personas ya tenían su app terminada pero sin publicar, 3 a medias, 3 con algún error y 3 ya publicadas. A partir de ahí, Jorge enseñó a publicar (desplegar) la aplicación y ancló el concepto clave de desarrollo vs producción: editar no es publicar, y los cambios solo llegan al usuario al darle Republicar. Tras una plenaria de las apps publicadas en el Padlet (con casos de Luisa, Rey y Silvia que abrieron una conversación sobre privacidad de datos y ejecución local), la sesión cerró introduciendo el siguiente gran paso: conectar la app con un modelo de lenguaje, mostrando un chatbot simple en Replit conectado a Gemini y dónde se personaliza su comportamiento.
🔑 5 ideas clave que nos deja esta sesión
- Editar no es publicar. Toda app tiene dos estados: desarrollo (donde editas y te puedes equivocar, solo tú lo ves) y producción (lo que ven todos con la liga). Los cambios no llegan al usuario hasta que vuelves a darle Republicar.
- La primera iteración es un cascarón. No hay que conflictuarse con que la app salga perfecta del primer prompt. El primer prompt construye una base; las funciones se agregan iterando con el agente. Publicar no cuesta créditos, las modificaciones sí.
- El grupo construye herramientas, no contenido. El análisis del Padlet confirmó que la mayoría está creando herramientas para su trabajo diario (validar, medir, visualizar), no contenido para alumnos. La democratización del código permite crear tu propia herramienta a la medida.
- Anatomía de un chatbot. Son tres piezas: frontend (la pantalla), backend (el código) y modelo de lenguaje (Gemini, conectado al backend). Se personaliza desde el config.json (nombre, color) y el SYSTEM_PROMPT (cómo se comporta).
- La API key es secreta como una tarjeta de crédito. Si alguien más la usa, te gasta tus créditos. Nunca va escrita en el código ni expuesta en el frontend: vive en los Secrets de Replit, ocultos incluso al publicar.
1. Quien quiera adelantar: descarga el zip del proyecto base del chatbot desde esta página y sigue el paso a paso (no es obligatorio).
2. Consigue una API key gratuita de Google AI Studio para usar Gemini.
⭐ Próximo tema: construir paso a paso, cada quien, su propio chatbot conectado a un modelo de lenguaje, y darle su propia personalidad con el SYSTEM_PROMPT.
Sesión 7 — Construye tu chatbot con Gemini
🎯 Qué hacemos hoy
En S06 vimos la anatomía de un chatbot (frontend, backend, Gemini) y dónde se personaliza. Hoy lo construye cada quien, paso a paso, desde un proyecto base ya armado. No empiezas de cero: importas el zip, pegas tu API key y te concentras en lo que de verdad importa, el comportamiento de tu chatbot (su SYSTEM_PROMPT).
Meta de hoy: salir con tu chatbot funcionando, con tu propia personalidad, idealmente publicado en una URL pública.
🤖 Construye tu chatbot paso a paso
Para que no tengas que pelearte con el agente desde cero (ni gastes créditos en construir lo mismo que ya tenemos), partes de un proyecto base. Lo descargas, lo subes a Replit y te enfocas en definir el comportamiento de tu chatbot.
📦 Proyecto base (zip)
⬇️ Descargar chatbot-base-gemini.zip~13 KB · contiene app.py, config.json, requirements.txt, .replit y templates/chat.html
- Entra a replit.com e inicia sesión.
- Arriba a la izquierda, dale clic a + Create Repl.
- En el diálogo que abre, busca la pestaña Import (también aparece como "Import from GitHub / Zip").
- Elige Upload .zip y selecciona el archivo
chatbot-base-gemini.zipque descargaste. - Replit detecta que es Python (por el archivo
.replitincluido) y crea el proyecto. - Cuando termine, verás los archivos en el panel izquierdo y estarás listo para el paso 2 (agregar tu API key en Secrets).
Si la opción Upload .zip no te aparece (la UI de Replit cambia), también puedes: crear un Repl en blanco de Python, descomprimir el zip en tu computadora y arrastrar los archivos al panel izquierdo del Repl.
Es una "contraseña" personal que Google te da para que tu código pueda usar Gemini. Es tuya: lo que se consuma con esa key cuenta en tu cuenta de Google, y los límites diarios también son de tu cuenta. Por eso nunca se comparte ni se pega visible en el código. Vive en un lugar protegido (Secrets de Replit) y solo tu backend la lee.
📋 Pasos para usarlo
- Importa el zip a Replit. Sigue los pasos de la caja verde de arriba ("Cómo importar el zip en Replit"). Cuando termine la importación, tendrás el proyecto listo para editar.
- Obtén tu API key gratis. Entra a Google AI Studio, inicia sesión con tu cuenta de Google y dale a Create API key. Cópiala completa (empieza con
AIza...). - Pégala en los Secrets de Replit. En tu Repl, panel izquierdo → ícono de candado 🔒 Secrets → + New Secret.
- Key:
GEMINI_API_KEY(respeta mayúsculas y los guiones bajos_, no son guiones medios) - Value: pega la clave que copiaste de Google AI Studio
- Key:
- Personaliza la apariencia y la personalidad. Abre
config.jsony cambia:bot_name: nombre que verá el usuario (ej. "Tutor de Cálculo")bot_emoji: ícono que aparece al lado del nombre (ej.📐)primary_color: color principal en formato#RRGGBB(ej.#10b981verde,#f59e0bnaranja,#8b5cf6morado)theme:lightodarkpersonality: texto corto que ajusta el tono del chatbot (ej. "Soy paciente y explico con analogías cotidianas")
- Define el comportamiento (lo más importante). Abre
app.pyy busca el bloque marcado como🧠 SYSTEM PROMPT(más o menos a un tercio del archivo). Reemplaza el texto entre las comillas triples"""..."""con la descripción de tu chatbot:- quién es ("Eres un tutor de...")
- a quién atiende ("para estudiantes de...")
- qué temas cubre
- qué tono usa
- qué nunca debe hacer
- (Opcional) Cambia el modelo. En
app.py, dentro de la funciónget_gemini_model, está la líneamodel_name='gemini-3.1-flash-lite'. Puedes probar otros modelos de la familia Gemini:gemini-3.1-flash-lite— rápido y barato (default, ideal para chat)gemini-3.1-flash— más capaz, un poco más lentogemini-3-pro— el más capaz, mejor para razonamiento complejo
- Ejecuta. Dale clic al botón verde Run arriba. Replit instala dependencias (espera ~30 seg la primera vez) y abre la vista del chat dentro del IDE.
- Itera. Si el chatbot no se comporta como quieres, regresa al
SYSTEM_PROMPT, refínalo, guarda y vuelve a probar (no hace falta volver a darle Run, Flask recarga solo el contenido del system prompt al recargar la página). - Publica. Cuando estés conforme, dale al botón Publish (arriba a la derecha) y elige Autoscale para obtener tu URL pública compartible.
🚨 Problemas comunes y cómo arreglarlos
1) "API Key no configurada" aunque ya la pegaste en Secrets
Esto suele pasar cuando agregas el Secret después de haber dado Run. El programa solo lee los Secrets cuando arranca, así que necesitas reiniciarlo:
- Abre la consola de Replit (pestaña Console en la parte de abajo).
- Detén el proceso con Ctrl + C (o el botón Stop rojo arriba).
- Verifica en la consola que dice algo como "Process stopped".
- Dale Run de nuevo. Ahora sí leerá la API key.
2) "API key not valid" o "Invalid API Key"
- Revisa que la Key esté escrita exactamente como
GEMINI_API_KEY: todo en mayúsculas, con guiones bajos_(no guiones medios-, no espacios). - Revisa que la Value sea la clave completa (empieza con
AIza) y que no incluya espacios al inicio o al final. - Si copiaste mal, borra el Secret y créalo de nuevo. Luego reinicia el Run (paso 1 de arriba).
3) "model not found" o "404 model"
El nombre del modelo cambió o lo escribiste mal. Vuelve a la lista de modelos válidos en el paso 6 y cópialo tal cual.
4) "Quota exceeded" o "Rate limit"
Pegaste demasiados mensajes seguidos. El free tier de Gemini tiene límites por minuto y por día. Espera unos minutos o usa otro modelo más ligero.
- Nunca la pegues dentro del código (
app.py,config.jsono el HTML). - Nunca la mandes por chat, correo o WhatsApp.
- Si crees que se filtró, ve a Google AI Studio, bórrala y crea una nueva.
- Si publicas tu Repl, los Secrets no se comparten con quien forkee tu proyecto: cada quien debe poner la suya.
El código de app.py está completamente comentado en español, pensado para personas que no programan. Léelo: vas a entender cómo se conecta cada pieza.
📸 Padlet: Mi chatbot — personalidad + respuesta
Comparte la evidencia de tu primer chatbot con Gemini. En tu publicación incluye:
- Una captura de tu chatbot funcionando
- La personalidad que le diste (en 1 frase, o pega tu SYSTEM_PROMPT)
- Una respuesta destacada del chatbot
📘 Resumen breve de la sesión
La sesión se dedicó por completo a que cada participante construyera su propio chatbot conectado a Gemini, paso a paso, desde el proyecto base. El flujo: descargar el zip, importarlo a Replit, identificar los tres puntos que sí se tocan (apariencia en config.json, el SYSTEM_PROMPT y el modelo), conseguir una API key gratis en Google AI Studio, guardarla como Secret GEMINI_API_KEY y darle Run. Buena parte fue soporte uno a uno (claves mal copiadas, reiniciar el proceso en la consola). Cerró con una demostración de iteración con el agente: convertir el chatbot en un analizador de datos con gráficas, incluyendo cómo depurar un error 404 copiándolo al agente.
🔑 5 ideas clave que nos deja esta sesión
- Importar una base que ya existe y conectarle un modelo. El valor no está en el chatbot en sí, sino en aprender la mecánica reutilizable: tomar un proyecto (importándolo como zip a Replit), entender sus piezas y conectarle un modelo de lenguaje. Eso aplica a cualquier herramienta, no solo a un chatbot.
- El SYSTEM_PROMPT es el alma del chatbot. Se personaliza en el
config.json(nombre, color, personalidad) y, sobre todo, en elSYSTEM_PROMPTdentro deapp.py. Ante la misma pregunta, tres chatbots con system prompts distintos responden distinto: ahí defines si es tutor de cálculo, de redacción, o hasta un personaje conocido. - La API key vive en Secrets, nunca en el código. Se guarda como Secret
GEMINI_API_KEY(mayúsculas y guiones bajos, tal cual la espera el código) y el código la llama desde ahí. Cuidarla no es solo por los créditos: cada petición queda registrada en los servidores del modelo vinculada a tu cuenta. - Reiniciar el proceso resuelve la mayoría de los bloqueos. El error más común ("API key no configurada" o cambios que no se reflejan) se arregla casi siempre igual: consola (botón Más → console), detener con el botón rojo y volver a darle Run. El programa lee los Secrets solo al arrancar. El nombre del bot se cambia en el
config.json. - Iterar con el agente y depurar copiando el error. El chatbot base es un punto de partida que el agente puede transformar (entre más específica la instrucción, mejor). Cuando algo falla, como un error 404 porque Replit cambió el modelo, el flujo es copiar el mensaje completo y pedirle al agente que primero identifique el error y luego lo resuelva.
1. Continúa la iteración de tu chatbot con el agente (la función que quieras: análisis de datos, leer archivos, etc.).
2. Llega listo para compartir qué modificación le hiciste a tu chatbot y cómo funcionó.
⭐ Próximo tema: Agent Studio (la plataforma del TEC) para crear chatbots sin tocar código, con el mismo concepto del SYSTEM_PROMPT que vimos hoy.
Sesión 8 — Agent Studio: Chatbots Educativos
📘 Resumen breve de la sesión
La sesión cerró el trabajo con el chatbot de Replit y abrió la puerta a Agent Studio. En el repaso vimos dónde se cambia la personalidad (config.json y el SYSTEM_PROMPT del app.py), cómo reiniciar el proceso desde la consola para que apliquen los cambios, y una estrategia para no gastar créditos: bajar el archivo con problema y depurarlo en Gemini. La segunda mitad fue un recorrido completo por Agent Studio (parte del ecosistema TECgpt): qué es, en qué se diferencia de un agente, y el constructor paso por paso (modelo, creatividad, pre-prompting, RAG y conocimiento).
🔑 5 ideas clave que nos deja esta sesión
- Agent Studio crea asistentes, no agentes. En Replit usamos un agente: ese tipo de herramienta toma acciones, crea archivos y se conecta con otras herramientas. En Agent Studio, en cambio, construimos chatbots conversacionales. Vale la pena cuidar la palabra: si le decimos "agente" a un alumno cuando es un asistente, generamos una confusión que después cuesta.
- El ecosistema TECgpt te quita la API key y el código de encima. TECgpt (chat privado donde la info no sale a los servidores del modelo), Skill Studio (formularios) y Agent Studio (asistentes). Llegas a un resultado muy parecido al chatbot que hicimos en Replit, pero sin preocuparte por la API key ni por programar: todo tu esfuerzo se va al prompt del sistema.
- Hay una jerarquía de prioridades que conviene tener clara. Manda primero quien creó el modelo (OpenAI), luego tu prompt del sistema, luego el conocimiento que cargas vía RAG, y al final, en la prioridad más baja, lo que escribe el usuario. Por eso el comportamiento del asistente se define arriba, en tu prompt, no en lo que pida quien lo usa.
- RAG y la ventana de contexto se configuran, no se dejan al azar. Cargas documentos (mejor PDF o Markdown, no Word; máx 20 MB), se parten en fragmentos (chunks) y el modelo usa solo los más relevantes: ese número arranca en 4, conviene subirlo (recomendado 10, rango 2–20). Los "mensajes anteriores" son la memoria del chat (15 por defecto, ajustable 6–50). Más es más preciso, pero más lento y costoso: hay que balancear.
- Alineación, consistencia y "si no existe la herramienta, constrúyela". Alineación = que el asistente siga tus reglas al pie de la letra; consistencia = que la experiencia sea la misma para los 30 alumnos. Y el espíritu del curso, que aportó el grupo: pasar los PDF a Markdown rinde mucho más, y si te falta una herramienta (por ejemplo, una que convierta PDF a Markdown), la puedes construir tú mismo con Canvas o Gemini.
1. Piensa qué actividad o proceso tuyo se beneficiaría de un asistente, para construirlo en Agent Studio.
2. Si vas a usar conocimiento (RAG), ten listos tus documentos en PDF o Markdown.
⭐ Próximo tema: construcción guiada, paso a paso, de tu propio asistente en Agent Studio.
Sesión 9 — Construye tu asistente en Agent Studio
🎯 De qué va esta sesión
Hoy construyes, paso a paso, tu propio asistente en Agent Studio. Es el mismo concepto del chatbot que armamos en Replit, pero dentro del ecosistema TECgpt: sin preocuparte por la API key ni por el código. Todo tu esfuerzo se concentra en el prompt del sistema. Al final lo publicas y lo compartes en el Padlet del grupo.
🧠 Antes de construir: 3 conceptos que sostienen tu asistente
- Alineación y consistencia. Alineación = que el asistente siga tus reglas al pie de la letra. Consistencia = que la experiencia sea la misma para los 30 alumnos. Ambas se logran con un prompt del sistema bien estructurado.
- Jerarquía de prioridades. Manda primero quien creó el modelo (OpenAI), luego tu prompt del sistema, luego el conocimiento (RAG) y, al final, lo que escribe el usuario. Por eso el comportamiento se define en tu prompt, no en lo que pida quien lo usa.
- Asistente, no agente. Agent Studio crea chatbots conversacionales. Los agentes (como el de Replit) toman acciones y se conectan a herramientas. Cuidar la palabra evita confusiones con los alumnos.
🔧 El constructor, paso a paso
Entra desde mi Tec → TECgpt → Agent Studio. Luego Crear nuevo y sigue estos pasos:
📝 Prompt de referencia: Marca Personal Plus
Usa este prompt como ejemplo de estructura para tu pre-prompting. Adáptalo a tu materia y objetivo de aprendizaje.
▶ Ver prompt completo
📚 Documentos de ejemplo para tu RAG (marca personal)
Si quieres que tu asistente responda con base en literatura real, carga estos artículos como conocimiento (RAG) en Agent Studio. Son un ejemplo del tema "marca personal"; para tu asistente usa los documentos de tu propia materia o proceso.
Súbelos en Agent Studio en la sección de Conocimiento. Recuerda: PDF o Markdown (no Word), máx 20 MB por archivo.
✉️ Déjame tu correo del TEC
Para compartirte un asistente de Agent Studio, déjame tu correo institucional (@tec.mx).
💬 Padlet: Mis Asistentes en Agent Studio
Publica la liga de tu asistente creado en Agent Studio y una breve descripción de lo que hace. Incluye el nombre del asistente y para qué materia o proceso es.
Abrir Padlet🛡 Prompt negativo para blindar tu asistente
Agrega este texto al final de la instrucción de tu asistente para protegerlo contra Prompt Injection.
▶ Ver prompt negativo
1. Deja tu asistente publicado en el Padlet.
⭐ Próximo tema: síntesis, proyecto integrador y cierre del curso.
Sesión 10 — Síntesis y Cierre del Curso
💬 Padlet: Cierre del curso — Lo que me llevo
Antes de cerrar, deja tu marca: una acción concreta que aplicarás esta semana y una exploración que quieres seguir. Pega una nota en cada columna.
Abrir Padlet🛡 Respalda tus asistentes
Agent Studio es una plataforma en desarrollo activo: pueden ocurrir cambios inesperados o pérdidas al editar. Guarda una copia de tus asistentes (personalidad, instrucciones, configuración) en un Google Doc, Word o notas — para poder restaurarlos si algo se rompe.
🏗 Proyecto Integrador: compartir lo que construimos
Durante el curso, cada uno de ustedes ya construyó piezas reales: el framework del Arquitecto de Preguntas, apps en Replit, asistentes en Agent Studio, prototipos en Canvas Code y Gemini. El proyecto integrador no es empezar de cero — es tomar lo que ya hicieron, conectarlo con un propósito pedagógico claro, y compartirlo con el grupo.
▶ Ver detalles del proyecto
Elige una actividad real de tu trabajo — algo que ya exista o que estés diseñando — y cuéntanos cómo la transformaste usando lo que aprendimos. Tres preguntas guían tu publicación:
¿Qué actividad tomaste y qué no funcionaba como querías? ¿Qué cambiaste para que el alumno piense, no solo responda?
Canvas Code, Gemini, Replit, Agent Studio — o una combinación. Lo importante no es cuál, sino por qué esa herramienta resuelve tu problema.
¿Qué evidencia de pensamiento genuino vas a buscar? No basta con "que lo entreguen" — ¿cómo distingues entre quien pensó y quien copió?
Compartir con el grupo — publica en el Padlet
1. El nombre de tu proyecto y la liga a tu app o asistente
2. Qué actividad tomaste y cuál era el problema original
3. Qué construiste y por qué elegiste esa herramienta
4. Cómo planeas saber si funciona — qué evidencia de aprendizaje vas a buscar