Convierte cualquier enunciado de programación en un diagrama de flujo, antes de escribir código

Puedes pedirle a Claude que dibuje el diagrama de flujo completo de un programa antes de escribir ni una sola línea de código — y esa misma página no se queda encerrada en el chat: se descarga como una web normal, funciona en cualquier sitio, y hasta se puede insertar directamente en una entrada de WordPress para que el alumnado la use sin depender de tener una cuenta abierta.

La motivación de este ejemplo es muy concreta: una alumna de Programación y Computación de 2º de Bachillerato se atascó al empezar con listas en Python. Cuando un enunciado mezcla una lista, un bucle y una condición a la vez, es fácil liarse con el orden de los pasos antes incluso de tocar el teclado. La solución no es programar más rápido, sino planear antes: plantear el algoritmo como diagrama de flujo separa con claridad el bucle (que se repite) de la condición (que decide), que es justo la mezcla que más cuesta ver cuando se intenta escribir el código directamente.

El enunciado de la demostración

“Recibe una lista de las notas de una clase, calcula la media, indica nota a nota si cada alumno aprueba o suspende, y al final muestra cuántos aprobados y cuántos suspensos ha habido en total.”

Pedir el diagrama como Artifact

Al pasarle el enunciado y pedir el diagrama como Artifact, el resultado llegó casi al instante, con una simulación paso a paso integrada: un botón de “siguiente paso” que va iluminando cada caja del diagrama a la vez que muestra la nota que se está procesando y actualiza en vivo los contadores de aprobados y suspensos. Se ve exactamente lo que hace el algoritmo nota a nota — la nota número uno, un 8, suma al contador de aprobados; la nota número dos, un 3, suma al de suspensos — hasta terminar la lista completa.

El fallo que se detectó en directo (y por qué merece la pena contarlo)

Al revisar la simulación con calma, salta a la vista que falta algo: el enunciado pide calcular la media, pero el diagrama no tenía ningún paso que la calculara de verdad. Es un error fácil de cometer, y precisamente por eso vale la pena mostrarlo: revisar el resultado frase a frase contra el enunciado original es tan importante como pedirlo bien la primera vez. Al pedir la corrección, Claude añadió el paso usando una función que suma directamente todos los números de la lista, en vez de un bucle escrito a mano — una forma distinta pero igual de válida de resolver el mismo problema, y una buena ocasión para explicar en clase que casi siempre hay más de un camino correcto.

De la pantalla a cualquier sitio

Una de las partes más útiles de este tipo de Artifact es que se puede descargar como una página web independiente. Al abrirla por primera vez puede que el ordenador intente abrirla con un programa que no es el navegador — un tropiezo habitual que se resuelve con un simple “abrir con Chrome”. A partir de ahí, el alumnado puede llevarse esa página y verla funcionar de forma interactiva sin depender de Claude en ese momento.

Para insertarla directamente en una web de WordPress hace falta un detalle técnico importante: en vez de una página completa, hay que pedir solo el fragmento de dentro, listo para pegar en un bloque de “HTML personalizado” — con los estilos aislados para que no interfieran con el diseño del resto del sitio.

La idea para llevarse a casa

Este mismo proceso —enunciado real, diagrama como Artifact, revisión crítica frase a frase, y descarga o inserción en la web— funciona con cualquier ejercicio que mezcle estructuras de control. El fallo de la media es la prueba de que ese repaso final merece la pena, incluso cuando el resultado parece correcto a primera vista.