Gemini permite realizar programas y páginas web utilizando canvas (o lienzo) que es un espacio separado del chat, pero integrado en él, donde tanto Gemini como el usuario pueden escribir.
Para ilustrar el proceso, haremos una aplicación que será un chatbot que admita texto y el programa nos haga preguntas sobre él para ver si lo hemos comprendido.
Pasos previos
Es muy importante seleccionar el modelo más potente, que en este momento es 2.5 Pro (preview).
y marcar la opción Canvas:
Las cuentas corporativas normalmente no tienen la opción para compartir el programa, lo cual será necesario más adelante para que otros lo puedan usar. Por lo tanto, asegúrate de que tu cuenta permita compartir el programa que hagas o tendrás que empezar de cero. Para ello, pídele cualquier programa que haga rápidamente (por ejemplo, un programa que muestre la hora actual) y asegúrate de que el botón compartir está activado:
Objetivo del chatbot y su creación
En primer lugar, debemos tener muy claro lo que queremos y, si no lo tenemos, trabajar hasta obtener una descripción que lo sea.
Para hacer el prompt ejemplo de este artículo he utilizado Claude, pero podemos usar el mismo Gemini o cualquier otra que queramos. Con la idea en mente de hacer un programa que sirviese para saber si hemos comprendido determinado texto de una materia, le he pedido a Claude tipos de preguntas que podríamos hacer y después he añadido que fuese un método socrático. La conversación completa hasta obtener el prompt final está aquí y este ha sido:
Crea una aplicación donde el usuario pegue un texto de estudio y especifique su edad. La IA debe leer el texto y hacer una primera pregunta abierta sobre lo que el usuario cree haber entendido. Basándose en cada respuesta, la IA formulará la siguiente pregunta para ayudar al estudiante a descubrir lagunas o contradicciones en su comprensión.
Límites: máximo 8 preguntas por sesión.
Finalización: el proceso termina cuando:
– El usuario demuestre comprensión sólida del texto.
– Reconozca honestamente lo que no entiende.
– Se alcance el límite de 8 preguntas.
Informe final: incluir un botón «Generar informe» que produzca un análisis de:
– Nivel de comprensión alcanzado.
– Puntos fuertes identificados.
– Áreas que necesitan refuerzo.
– Sugerencias de estudio adicional.
La IA debe adaptar el lenguaje a la edad del usuario.
Aquí tenemos una captura de pantalla después de pegar el prompt y de que Gemini haya trabajado un rato:
Depuración del chatbot
Lo siguiente que hay que hacer es probarlo en profundidad para encontrar errores o aspectos que no nos gusten. Cuando queramos cambiar algo, simplemente le explicamos a Gemini lo que queremos hacer y por qué, esto último ayuda a que la IA se haga una idea de lo que perseguimos realmente.
Un problema es que cuando se trabaja mucho tiempo en el mismo chat, Gemini empieza a arrastrar errores anteriores y se entra en un bucle difícil de salir. En este caso lo aconsejable es compartirlo, abrir la dirección compartida y pulsar el botón «Copiar Canvas» con lo que podremos empezar con el programa completo y el chat limpio.
Si trabajamos mucho tiempo en un programa, probablemente se nos acaben las interacciones gratuitas, en ese caso podemos esperar a que se restablezcan o utilizar la misma técnica explicada antes de compartir y empezar en un chat nuevo, pero esta vez cambiando de usuario. Los pasos serían: compartir el programa, cambiar de usuario, abrir el enlace compartido, pulsar «Copiar Canvas» desde el nuevo usuario y continuar con la mejora del programa.
Compartir el chatbot
Una vez tengamos la versión definitiva, hay que pulsar el botón para compartir y copiar la URL que nos dará.
Si hacemos algún cambio en el programa, tenemos que volver a compartirlo y esta dirección también cambiará. Esto puede ser un problema si ya se la hemos dado al alumnado. Por eso, es mejor usar un documento online u otro sistema que nos permita actualizar la URL sin tener que volver a difundirla. Así, los alumnos accederán siempre al mismo documento, donde encontrarán la dirección actual del programa.
Tutor socrático con IA
Puedes probar el programa en este enlace. Si lo deseas, cópialo y mejóralo. Por ejemplo, se me ocurre, no limitar a 8 las preguntas y que sea el usuario el que elija cuántas quiere, que el informe final se pueda copiar, que por defecto la edad sea de 14 años (que es la edad mínima legal para usar Gemini) o que podamos abrir archivos PDF, no solo pegar texto.
Recomendaciones
Actúa prudentemente, si le pides cosas demasiado complicadas, puede ser que el programa empiece a fallar y no consigas que vuelva a funcionar. Una forma de mitigar esto es compartirlo de vez en cuando e ir guardando estas direcciones, así podremos volver atrás en cualquier momento. También puedes volver a la versión anterior pulsando el botón indicado a continuación:
Si el programa da errores, aparecerá un mensaje indicándolo. Si el error es 401, actualiza la página. Este error normalmente indica que se ha perdido la conexión y es inútil decirle a Gemini que lo arregle. Si es otro tipo de error, un enlace te permitirá que Gemini lo arregle automáticamente. Si no lo consigues después de varios intentos, vuelve a una versión anterior.
Si, cuando acaba de hacer el programa, en lugar de aparecer la vista previa con el programa, esta está en blanco, actualiza el navegador y volverá a funcionar, después de hacerte confirmar que no eres un robot.
Puedes añadir más características basadas en IA, pulsando el botón con el símbolo de la IA que está en una pequeña barra de herramientas abajo a la derecha:
No pedirá confirmación, añadirá las características que a Gemini le parecen adecuadas. Si no nos gustan, podemos usar el botón para volver a la versión anterior.
Para terminar
Para poder usar estos programas hechos por Gemini se necesitan cuentas de Google que puedan acceder a Gemini, por lo tanto, es posible que algunas cuentas sin acceso no lo puedan usar. Esto pasa, por ejemplo, con algunas de las educativas.
La técnica que hemos usado para construir este chatbot se llama vibe coding, que consiste en explicar a la IA lo que queremos conseguir y ella nos haga el programa. Si te interesa el tema, participa en el grupo de Telegram: Vibe Coding Educativo.
Pódcast creado con NotebookLM
FAQ generada con NotebookLM
¿Qué es «canvas» en el contexto de Gemini y cómo se utiliza para crear un chatbot?
Canvas, o lienzo, es un espacio interactivo dentro de la interfaz de Gemini que funciona de forma separada del chat principal pero está integrado en él. Permite que tanto Gemini como el usuario interactúen directamente con elementos visuales o código. Para crear un chatbot, se selecciona la opción «Canvas» al iniciar un nuevo chat o proyecto en Gemini. Este lienzo actúa como el entorno donde se desarrollará y probará el programa del chatbot, permitiendo la visualización y depuración de su funcionamiento.
¿Cuál es el primer paso crucial al diseñar un chatbot en Gemini y por qué es importante seleccionar el modelo adecuado?
El primer paso esencial es tener una idea muy clara del objetivo y funcionalidad del chatbot. Si la idea inicial no es lo suficientemente precisa, se debe refinar hasta obtener una descripción detallada de lo que se quiere que el chatbot haga. Es fundamental seleccionar el modelo más potente disponible en ese momento, como 2.5 Pro (preview), ya que un modelo más avanzado ofrece mayores capacidades y un mejor rendimiento para el desarrollo del programa.
¿Qué consideraciones se deben tener en cuenta sobre las cuentas corporativas al crear y compartir un chatbot en Gemini?
Las cuentas corporativas a menudo no disponen de la opción para compartir programas o aplicaciones creadas en Gemini. Dado que la posibilidad de compartir es necesaria para que otros usuarios puedan acceder y utilizar el chatbot, es vital asegurarse de que la cuenta utilizada permita esta función. Se recomienda verificar esta capacidad creando un programa sencillo y comprobando si el botón de compartir está activado antes de invertir tiempo en el desarrollo de un chatbot complejo.
¿Cómo se utiliza un prompt efectivo para guiar a la IA en la creación de un chatbot de tutoría Socrática como el descrito?
Un prompt efectivo debe ser específico y detallado sobre la funcionalidad deseada. Para el chatbot de tutoría Socrática, el prompt incluyó instrucciones claras sobre la interacción con el usuario (pegar texto, especificar edad), el método de enseñanza (preguntas abiertas, ajuste a respuestas, método socrático), los límites (máximo 8 preguntas), las condiciones de finalización (reconocimiento de falta de comprensión o límite alcanzado), y la generación de un informe final con análisis detallado (nivel de comprensión, puntos fuertes, áreas a reforzar, sugerencias de estudio). También se especificó la adaptación del lenguaje a la edad del usuario.
¿Qué estrategias se recomiendan para depurar un chatbot en Gemini y solucionar problemas comunes?
Para depurar, se prueba el chatbot exhaustivamente y se explican a Gemini los cambios deseados y las razones detrás de ellos. Si Gemini empieza a arrastrar errores de interacciones anteriores, se aconseja compartir el programa, abrir la URL compartida y copiarlo para empezar con un chat limpio pero conservando el programa. Si se agotan las interacciones gratuitas, se puede compartir el programa, cambiar de usuario y continuar desde el nuevo usuario, abriendo el archivo compartido. Para errores de tipo 401, se debe actualizar la página. Para otros errores, Gemini puede intentar solucionarlos automáticamente a través de un enlace proporcionado; si no funciona, se recomienda volver a una versión anterior.
¿Cómo se gestiona la compartición de un chatbot en Gemini, especialmente si se realizan actualizaciones?
Una vez finalizada la versión del chatbot, se utiliza el botón de compartir para obtener una URL. Si se realizan cambios posteriores, es necesario volver a compartir para obtener una nueva URL, ya que la anterior dejará de funcionar para la versión actualizada. Para evitar tener que redifundir constantemente la nueva URL a los usuarios (como estudiantes), se sugiere utilizar un documento en línea o sistema similar donde se pueda actualizar la URL de forma centralizada. Así, los usuarios acceden siempre al mismo documento para obtener la dirección actualizada del programa.
¿Qué técnica de desarrollo se menciona y en qué consiste?
La técnica de desarrollo mencionada es «vibe coding». Consiste en describir a la inteligencia artificial lo que se desea conseguir o el resultado final esperado, y dejar que la IA se encargue de generar el código o el programa necesario para lograrlo. En lugar de dar instrucciones de programación paso a paso, se le comunica a la IA el «vibe» o la intención del proyecto.
¿Qué precauciones se sugieren al desarrollar un chatbot en Gemini y cómo se pueden mitigar posibles fallos?
Se recomienda actuar prudentemente y evitar pedirle a la IA cosas demasiado complicadas, ya que esto puede causar que el programa falle y sea difícil de recuperar. Una forma de mitigar esto es compartir el programa periódicamente y guardar las URLs de estas versiones intermedias. Esto permite volver a una versión anterior funcional si el desarrollo actual presenta problemas irresolubles. Además, Gemini ofrece un botón para volver a la versión anterior en caso de errores o cambios no deseados. Si aparece un mensaje de error, se debe prestar atención al tipo de error (ej. 401 indica pérdida de conexión).
Comentarios recientes