Crea un diagrama de flujo de programas online: editor gratuito
Con este editor puedes crear diagramas de flujo de programas (PAP) según DIN 66001 a partir de bloques o pseudocódigo. El editor organiza los símbolos automáticamente: si escribes, por ejemplo, «WHILE x < 10», obtienes un rombo, el cuerpo del bucle y una línea de retorno. Con un clic puedes mostrar el mismo flujo como diagrama de Nassi-Shneiderman y exportarlo como PNG, SVG o PDF.
Creado por Justin Schuessler
Gratis, sin registro ni instalación: el editor funciona íntegramente en tu navegador y no nos envía tus diagramas.
¿Ya tienes el proceso? Prueba el código directamente en tu propio VPS o espacio web.
Bloques de construcción
Teclado en el diagrama: ↑/↓ seleccionar bloque, Intro editar texto, Alt+↑/↓ mover, Supr eliminar, Ins insertar bloque, Ctrl+Z/Ctrl+Y deshacer/rehacer, Ctrl+X/C/V cortar/copiar/pegar.
Sintaxis del pseudocódigo
PROGRAM Name INPUT x / OUTPUT x CALL procedure(x) IF condition THEN … ELSE IF … ELSE … END IF SWITCH x CASE 1: … DEFAULT: … END SWITCH WHILE condition … END WHILE REPEAT … UNTIL condition FOR i FROM 1 TO n STEP 1 … END FOR LOOP name … BREAK name … END LOOP
Cualquier otra línea es una instrucción; si empieza por \, siempre es una instrucción, aunque comience con una palabra clave.
La indentación y las mayúsculas no importan, y puedes mezclar palabras clave en alemán e inglés. No se genera ni se ejecuta código real.
Haz clic en un bloque del diagrama para editarlo aquí. Haz doble clic para editar el texto directamente en el diagrama.
Guardar y exportar
Todo funciona en tu navegador: el estado actual solo se guarda localmente y el enlace para compartir contiene el propio diagrama. No se nos envía ningún dato.
Funciones
Diagramas de flujo sin arrastrar bloques
Tú describes el proceso y el editor coloca los símbolos según DIN 66001, traza las líneas y mantiene actualizadas ambas vistas.
Símbolos según DIN 66001
Terminal, proceso, decisión, entrada/salida y subproceso, conectados mediante líneas de flujo y retornos para los bucles.
Cambiar al diagrama Nassi-Shneiderman
El mismo proceso como diagrama Nassi-Shneiderman según DIN 66261, sin tener que dibujarlo de nuevo.
Editor visual por clics
Coloca bloques antes, después o dentro de otro bloque; edita los textos directamente en el diagrama, mueve o elimina elementos y deshaz cambios.
Pseudocódigo en ambos sentidos
El texto y el diagrama se mantienen sincronizados. El editor indica la línea y muestra una pista si hay un error de escritura; el diagrama permanece visible.
Exportación y archivo de proyecto
PNG y SVG para documentos, PDF en A4 para imprimir y archivo de proyecto (JSON) para guardar y volver a abrir.
Comparte sin cuenta
El enlace para compartir incluye el diagrama en la dirección. No se guarda nada en nuestros servidores.
Cómo funciona
Cómo crear un diagrama de flujo de programas
Empieza con una plantilla o un flujo vacío y trabaja como prefieras.
Paso 1
Cargar una plantilla o empezar desde cero
Elige una de las nueve plantillas de ejemplo, como factorial, año bisiesto u ordenación de burbuja, o empieza un flujo vacío con «Nuevo».
Paso 2
Construye el flujo con clics
Elige un bloque en el editor y colócalo antes, después o dentro de otro bloque. Haz doble clic para editar el texto directamente en el diagrama.
Paso 3
O escribe pseudocódigo
Escribe el flujo en el campo de pseudocódigo con palabras clave en alemán o inglés. El diagrama se organiza automáticamente y el editor señala los errores de escritura con el número de línea.
Paso 4
Exportar o compartir
Descarga el diagrama de flujo como PNG, SVG o PDF (A4), guarda el archivo de proyecto (JSON) o copia un enlace para compartirlo.
DIN 66001
Los símbolos principales del diagrama de flujo
Los símbolos de DIN 66001 que utiliza el editor para los diagramas de flujo. El flujo se organiza automáticamente; no tienes que mover nada.
Terminal (inicio/fin)
El óvalo marca el inicio y el final del diagrama de flujo.
Operación
Un rectángulo representa un paso de procesamiento, p. ej., una asignación o un cálculo.
Entrada/salida
El paralelogramo muestra dónde se leen o se emiten datos.
Bifurcación
El rombo contiene una condición. Según el resultado, el flujo continúa por la salida Sí o No.
Subprograma
Un rectángulo con líneas laterales dobles llama a un subprograma que tiene su propio diagrama de flujo.
Línea de flujo
Las líneas con flecha conectan los símbolos e indican el orden. El flujo normal va de arriba abajo.
Bifurcación con unión
Después de una bifurcación, ambas rutas vuelven a unirse en un punto antes de que continúe el flujo.
Límite del bucle (bucle infinito)
Un hexágono con las esquinas superiores biseladas marca el inicio del bucle; otro con las esquinas inferiores biseladas marca el final. El editor usa este par para el bucle infinito.
Punto de salida
Un círculo con una letra conecta dos puntos sin una línea larga. La salida del bucle termina en el círculo A y el flujo continúa en el círculo A situado después del bucle.
Bucle con retorno
Un bucle se crea mediante una bifurcación y una línea de retorno que vuelve a un punto anterior a la condición.
Estructuras de control
Bucles y decisiones en diagramas de flujo de programas
Así dibuja el editor las estructuras de control habituales y así puedes escribirlas en pseudocódigo, con palabras clave en alemán o inglés.
Bifurcación
El rombo contiene la condición; las ramas se separan hacia la izquierda y la derecha y después vuelven a unirse. Pseudocódigo: SI … ENTONCES … SINO … FIN SI o IF … THEN … ELSE … END IF.
Selección múltiple (switch case)
Un rombo con la expresión y una rama por cada caso, con una rama opcional para los demás casos. Pseudocódigo: SEGÚN x … CASO 1: … OTRO CASO: … FIN SEGÚN o SWITCH x … CASE 1: … DEFAULT: … END SWITCH.
Bucle con condición al inicio
El rombo aparece antes del cuerpo; la línea de retorno vuelve por la izquierda hasta antes de la condición y la salida «No» continúa por la derecha. Pseudocódigo: MIENTRAS … FIN MIENTRAS o WHILE … END WHILE.
Bucle con condición al final
El cuerpo se ejecuta al menos una vez y el rombo con la condición aparece después. Pseudocódigo: REPETIR … HASTA … o REPEAT … UNTIL ….
Bucle de conteo
Se dibuja con una asignación inicial, una condición, el cuerpo y el incremento del contador. Pseudocódigo: PARA i DESDE 1 HASTA 10 … FIN PARA o FOR i FROM 1 TO 10 … END FOR, opcionalmente con PASO o STEP.
Bucle infinito con salida
El par de símbolos que delimita el bucle rodea su cuerpo; una salida pasa por un conector y continúa después del bucle. Pseudocódigo: BUCLE … ROMPER … FIN BUCLE o LOOP … BREAK … END LOOP.
Ejemplos
Ejemplos de diagramas de flujo de programas para practicar
Hay nueve ejercicios habituales de la escuela, la formación profesional y la universidad incluidos como plantillas. Elige uno en «Cargar plantilla de ejemplo», examina el diagrama de flujo terminado y su pseudocódigo, y modifícalo.
- Factorial
- Cálculo de notas
- Inicio de sesión con 3 intentos
- Año bisiesto
- Máximo de una lista
- Ordenación de burbuja
- Máquina expendedora de bebidas
- Prueba de primalidad
- Adivinar el número
DIN 66261
Los símbolos principales del diagrama de Nassi-Shneiderman
Los bloques estructurales de Nassi-Shneiderman que puede dibujar el editor. Cada bloque tiene exactamente una entrada arriba y una salida abajo. El editor no ofrece el procesamiento paralelo de DIN 66261.
Instrucción (bloque estructural)
Un rectángulo representa un paso de procesamiento individual, p. ej., una asignación o un cálculo.
Secuencia
Los bloques colocados uno debajo de otro se ejecutan de arriba abajo, uno tras otro. Las entradas y salidas son bloques de instrucciones normales.
Bifurcación (selección)
Un triángulo con la condición divide el flujo en una rama Sí y otra No. Una rama vacía se marca con ∅.
Selección de casos (selección múltiple)
Según el valor de una expresión, se ejecuta exactamente uno de los casos. Los valores de cada caso aparecen justo debajo de la diagonal; el último caso (a menudo «si no», para los demás valores) aparece en el triángulo derecho.
Bucle con condición al inicio
La condición está arriba y se comprueba antes de cada iteración. Si es falsa desde el principio, el cuerpo no se ejecuta ni una vez.
Bucle con condición al final
La condición está abajo: el cuerpo se ejecuta al menos una vez y se repite hasta que se cumple la condición.
Bucle de conteo
Un bucle con condición al inicio, variable de conteo, valores inicial y final e incremento opcional.
Llamada a subprograma
Un bloque con líneas laterales dobles llama a un subprograma independiente descrito en otro lugar.
Bucle infinito
Una repetición sin condición: banda superior (con etiqueta opcional), barra izquierda y banda inferior. Solo se sale de ella mediante una salida del bucle.
Salida del bucle (interrupción)
La cuña de la izquierda sale del bucle envolvente más interno; la etiqueta indica el bloque del que se sale. Después, la ejecución continúa con el bloque posterior a ese bucle.
Descubrir más
Más herramientas
Probador de Regex
Prueba expresiones regulares en tiempo real con el motor nativo de JavaScript, con resaltado de coincidencias, grupos de captura y modo de reemplazo, directamente en el navegador.
Creado por Jakub Martyniak
Editor de diagramas de Nassi-Shneiderman
NuevoCrea diagramas Nassi-Shneiderman (DIN 66261) online: con un editor por bloques o pseudocódigo, cambio a diagramas de flujo de programas, 9 plantillas de examen y exportación a PNG, SVG y PDF.
Creado por Justin Schuessler
Convertir hexadecimal a decimal (binario, hexadecimal, decimal y octal)
NuevoConversor de sistemas numéricos: de hexadecimal a decimal, de binario a decimal y viceversa, además de octal y cualquier base hasta 36. Incluye los pasos del cálculo, complemento a dos y bits interactivos.
Creado por Luca Stanek
FAQ
Preguntas frecuentes
Respuestas breves sobre diagramas de flujo, DIN 66001 y este editor.
Un diagrama de flujo de programas, o PAP, representa el desarrollo de un programa o algoritmo mediante una secuencia de símbolos normalizados unidos por flechas. Muestra el orden de las instrucciones, entradas, salidas y decisiones, con independencia del lenguaje de programación. También se conoce como flujograma o diagrama de flujo.
Carga una plantilla de ejemplo en el editor o empieza un flujo vacío con «Nuevo». Añade bloques con clics o escribe el flujo en pseudocódigo; ambos se mantienen sincronizados. El editor organiza automáticamente los símbolos: las ramas se separan hacia la izquierda y la derecha y después vuelven a unirse; las líneas de retorno de los bucles pasan por la izquierda del cuerpo. Por último, exporta el resultado como PNG, SVG o PDF. Es gratis y no requiere registro.
Los símbolos están definidos en DIN 66001 y, a nivel internacional, en ISO 5807. El editor usa el terminal (óvalo) para el inicio y el fin, el proceso (rectángulo), la decisión (rombo), la entrada/salida (paralelogramo), el subproceso (rectángulo con líneas laterales dobles), líneas de flujo con flechas, el conector (círculo con una letra) y un par de símbolos para delimitar el bucle infinito.
Un bucle se forma con una decisión y una línea de retorno. En un bucle con condición inicial, el rombo aparece antes del cuerpo: si se cumple la condición, se ejecuta el cuerpo y la línea vuelve hasta antes del rombo; de lo contrario, el flujo continúa por la derecha. En un bucle con condición final, el rombo aparece después del cuerpo. Un bucle con contador se dibuja con una asignación inicial, una condición, el cuerpo y el incremento del contador. Para el bucle infinito, el editor utiliza un par de símbolos que lo delimitan; una salida pasa por un conector y continúa después del bucle. Una selección múltiple (switch case) se representa con un rombo y una rama por cada caso, además de una rama opcional para los demás casos.
Una línea por paso y bloques con palabras clave: SI … ENTONCES … SINO … FIN SI, SEGÚN x con CASO 1: y OTRO CASO: hasta FIN SEGÚN, MIENTRAS … FIN MIENTRAS, REPETIR … HASTA …, PARA i DESDE 1 HASTA 10 … FIN PARA, BUCLE … FIN BUCLE con ROMPER, además de ENTRADA, SALIDA y LLAMAR. También funcionan las palabras clave en inglés (IF, SWITCH, WHILE, REPEAT, FOR, LOOP, BREAK, INPUT, OUTPUT, CALL); puedes alternar entre ambos idiomas en el campo de pseudocódigo. El editor no reconoce palabras clave de otros idiomas y convierte esas líneas en instrucciones simples. Si has escrito pseudocódigo en otro lugar, solo tienes que pegarlo en el campo. Si hay un error de escritura, el editor señala la línea y conserva el último diagrama válido.
Ambos describen el mismo flujo. El diagrama de flujo de programas conecta símbolos mediante flechas; los bucles se forman con líneas de retorno. El diagrama de Nassi-Shneiderman (DIN 66261) anida bloques y no admite saltos, por lo que es más compacto y obliga a una solución estructurada. En este editor puedes alternar entre ambas vistas, ya que se generan a partir del mismo flujo.
Sí. Expórtalo como PNG de alta resolución o como SVG e inserta el archivo en Word, PowerPoint u otro documento. Para imprimirlo, tienes el PDF en una página A4. El archivo de proyecto (JSON) te permite guardar el flujo y volver a abrirlo más tarde en el editor.
El editor es gratuito y puedes usarlo sin registrarte. Funciona íntegramente en tu navegador: el estado actual solo se guarda en el almacenamiento local de tu navegador y las exportaciones se generan directamente en tu dispositivo. En el enlace para compartir, el diagrama se encuentra en la parte de la dirección posterior a #, que no se transmite al servidor.
¿Tienes más preguntas?
Contactar con soportePrueba el código de tu diagrama de flujo en tu propio servidor
En un VPS de ZAP-Hosting tienes acceso root completo para cualquier lenguaje; en un espacio web, PHP y MySQL funcionan de inmediato.
Sin configuración. Sin riesgos. En línea en segundos.
¿Buscas más herramientas? Ver todas las herramientas para desarrolladores
