El diagrama que nadie actualiza, la planilla que nadie mira y el documento que nadie encuentra, en una sola cosa. Aquí el dibujo es la documentación y es el inventario: se dibuja a partir de los datos, y editarlo edita los datos.
Se entra con tu cuenta de Google y se crea sola, la primera vez: no hay formulario ni contraseña nueva. Crear, editar y guardar exige cuenta; sin ella puedes recorrer el catálogo entero y probar el lienzo, pero lo que dibujes no se guarda.
Lee lo que ya tienes. .bpmn de Bizagi, Camunda
o bpmn.io con la notación BPMN 2.0 completa, y .md con diagramas
Mermaid dentro. Ninguno se aplana a cajas genéricas: cada elemento entra
como la pieza que es.
Toda organización acaba con lo mismo repartido en tres sitios que no se hablan: un diagrama en una herramienta de dibujo, la explicación en un documento y los datos en una planilla. Los tres describen la misma realidad y los tres se desincronizan el primer día que algo cambia. Esta plataforma los junta en un único objeto editable.
Cada pieza del lienzo es una entrada real con su tipo, su color, sus campos y su historia. No se dibuja «un rectángulo que representa un servidor»: se coloca el servidor. Editar el diagrama edita el inventario, así que no hay dos versiones que cuadrar.
Notas, notas de voz, imágenes y capturas van sobre el propio nodo, no en un archivo aparte. Cuando alguien abra esto dentro de un año, la explicación estará donde está lo explicado —que es la única forma de que se encuentre—.
Al estar todo enlazado —el proceso con el sistema, el sistema con la máquina, la máquina con el rack—, las preguntas de dependencia se contestan siguiendo líneas en vez de preguntando a quien se acuerde.
No es una herramienta de diagramas de red con cosas añadidas: el catálogo cubre desde el concepto y la hipótesis hasta el rack y la máquina virtual, pasando por el proceso BPMN, la pantalla de la aplicación, el modelo de datos, el equipo que lo mantiene y la decisión que lo justificó. Todo se dibuja en el mismo lienzo y todo se enlaza con todo.
Y por debajo de cada pieza: sus campos propios —cada tipo declara los suyos, de la VLAN de un switch al criterio de aceptación de una historia—, las notas y notas de voz pegadas al nodo, las imágenes y capturas incrustadas, las etiquetas, las colecciones transversales a las categorías y los proyectos que agrupan tableros.
El recorrido completo, de la pieza vacía al tablero guardado. Nada de esto pasa por un formulario: se hace sobre el lienzo.
El buscador mira nombre, descripción, categoría y sinónimos, así que asterisk encuentra la Central PBX, swimlane el Carril y 2fa el Segundo factor. Ocho familias, treinta y dos subcategorías y grupos propios transversales a la taxonomía.
Arrastrando o con doble clic. La pieza llega con su forma, su icono, su color, su tamaño y los campos que ese tipo declara —la VLAN y la IP de un equipo de red, lo que corresponda en cada caso—.
Se tira del borde de un nodo al otro. El inspector de la conexión ajusta sentido —incluido bidireccional—, cinco trazados, color, grosor, continua o discontinua, etiqueta y animación del flujo. Donde dos líneas se cruzan sin unirse, una dibuja un puente, como en los esquemas de toda la vida.
Los grupos son nodos contenedores: los hijos se mueven y se recortan con ellos. Agrupar calcula el rectángulo que envuelve la selección y pasa a los hijos a coordenadas relativas; desagrupar deshace el camino.
Notas de texto y de voz sobre el nodo, imágenes y capturas incrustadas en el lienzo, y grabaciones de cámara. El permiso lo da el tablero: quien puede editarlo puede grabar, quien puede verlo puede reproducir.
El cliente envía el grafo completo y el servidor lo reconcilia contra lo persistido: actualiza, inserta y borra lo que desapareció. Antes de tocar la base rechaza identificadores repetidos y conexiones a nodos que no existen.
| Ctrl + K | Enfocar el buscador de activos |
| Ctrl + S | Guardar |
| Ctrl + Z / Ctrl + Y | Deshacer y rehacer |
| Ctrl + G / Ctrl + Shift + G | Agrupar y desagrupar la selección |
| Supr | Eliminar la selección |
| Doble clic | Añadir el activo al centro del lienzo, sin arrastrar |
Partir de un lienzo en blanco es lo que hace que un diagrama no se llegue a hacer nunca. Hay tres formas de empezar con algo ya montado y corregir desde ahí, que es mucho más rápido que construir desde cero.
Se describe en lenguaje natural y el modelo devuelve el primer borrador. La diferencia con pedirle un diagrama a un chat está en lo que se le pide: claves del catálogo propio, no formas sueltas. El resultado sale con los iconos, colores y tamaños que cada pieza ya tiene definidos, en lugar de un dibujo genérico que habría que traducir a mano.
Lo que devuelve el modelo pasa un filtro: se descartan las claves que no existen, las conexiones a nodos ausentes y los padres inventados. Vale más un diagrama algo más pobre que uno que rompe el editor al abrirlo. El borrador se limita a cuarenta piezas —por encima de eso un lienzo deja de leerse de un vistazo—.
Se suelta un .md y se extraen sus bloques Mermaid, con su
recuento de nodos y líneas, para elegir cuáles importar. La disposición
la calcula dagre y las formas del original tienen su equivalente en el
lienzo: estadio, subrutina, cilindro, rombo, hexágono, trapecios.
Se suelta un .bpmn de Bizagi, Camunda o bpmn.io y entra con su
notación: pools y carriles con el nombre en banda vertical, eventos con el
borde fino, doble y grueso, compuertas con su marcador y el objeto de datos
con la esquina doblada. Nada se aplana a una caja genérica: una tarea de
usuario, una de servicio y una de guion llegan como tres piezas distintas.
Se respetan las coordenadas del propio fichero, así que la composición que
dibujaste es la que sale.
Por encima de tres diagramas o cuarenta y cinco nodos, el diálogo propone separarlos en un tablero por diagrama, con alias numerado y una etiqueta común. En el editor aparece entonces un 3/16 con anterior, siguiente y salto directo, sin volver al listado.
| Formato | Qué se hace al importarlo |
|---|---|
BPMN 2.0 (.bpmn) | La notación completa: pools, carriles, subprocesos, las seis clases de tarea, las cinco compuertas y los eventos por disparador —mensaje, temporizador, señal, error, terminación—. Los flujos de secuencia, mensaje y asociación conservan su significado, y se respetan las coordenadas del propio dibujo. |
| flowchart / graph | Formas, subgrafos, etiquetas, discontinuas, gruesas, bidireccionales y dirección LR/TB. |
| stateDiagram-v2 | [*] pasa a círculo Inicio / Fin; los eventos, a etiquetas de línea. |
| erDiagram | Entidades y relaciones con su cardinalidad. |
| classDiagram | Una caja por clase con sus miembros; <<interface>> y <<abstract>> cambian la forma. Herencia, composición y agregación etiquetadas. |
| mindmap | Jerarquía por indentación, la raíz en círculo y las ramas colgando. |
| journey | Cada section es un grupo; el color codifica la satisfacción. |
| timeline | Cada periodo es un grupo con sus eventos encadenados. |
| gantt | Secciones como fases; done, active y crit tiñen la tarea y after genera la dependencia. |
| quadrantChart | Respeta las coordenadas del original: cada idea en su posición exacta. |
| gitGraph | Un grupo por rama, commits encadenados y las fusiones en discontinua. |
| sankey-beta | El caudal como etiqueta; los flujos grandes con trazo grueso. |
| pie | El título al centro y una porción por dato, con su porcentaje. |
| sequenceDiagram | Se omite a propósito, y se dice por qué: es una línea temporal entre participantes, no un grafo. Forzarlo daría un dibujo que no dice lo mismo. |
Hay explicaciones que en texto ocupan tres párrafos y contadas en voz alta duran veinte segundos. La grabación se pega al nodo que explica y viaja con el tablero: quien lo abra dentro de un año la tendrá delante, no en un adjunto de un correo que ya nadie encuentra.
Se graba desde el propio lienzo y queda colgada del elemento del que habla. Para el porqué de una decisión, la advertencia que no cabe en una etiqueta o el contexto que sólo tiene una persona.
La misma idea, con cara. Sirve para presentar un tablero a quien lo recibe sin haber estado en la reunión donde se dibujó.
Enseñar el sistema real funcionando, junto al nodo que lo representa. El diagrama dice qué hay; la grabación, cómo se comporta.
Se incrustan en el lienzo como un elemento más: la pantalla de la aplicación, la foto del rack, el pantallazo del error. Se mueven, se agrupan y se exportan con el resto.
El permiso lo da el tablero y no la grabación: quien puede editarlo puede grabar, quien puede verlo puede reproducir. Así no hay una segunda regla de acceso que mantener en sincronía con la de los tableros —y una grabación no se puede alcanzar por su enlace desde fuera—.
Un tablero se comparte por correo con otra cuenta, eligiendo si puede editar o sólo mirar. Compartir no cede la propiedad: renombrar, volver a repartir y borrar siguen siendo de quien lo creó.
El flujo se abre siempre en lectura. Pulsar Editar lo reserva —y antes trae los últimos cambios, para no dibujar sobre una versión vieja—. Mientras tanto, a los demás les dice quién lo tiene.
Quien está mirando ve aparecer lo que el otro guarda, sin recargar. Y quien edita ve quién más tiene el tablero delante: saber que hay alguien mirando cambia cómo se trabaja.
La reserva se suelta al salir, y caduca sola si alguien cierra el portátil. Si aun así dos guardan a la vez, el segundo recibe un aviso en lugar de borrar el trabajo del primero.
Si quien te compartió un flujo lo elimina, te llega un aviso al panel diciendo quién y cuándo. Antes simplemente desaparecía de tu lista sin explicación.
Cuatro de las pantallas, con una topología de demostración cargada.
Un tablero que no se puede sacar de la herramienta acaba siendo un rehén. De aquí sale como imagen, como vectorial, como documento imprimible, como texto o como enlace.
| Formato | Para qué | Fondo |
|---|---|---|
| Imprimir o repartir. La página se dimensiona al diagrama, sin recortes ni franjas en blanco. | Del tema | |
| PNG | Montar sobre otro documento o una presentación. | Transparente |
| SVG | Vectorial: escala sin perder nitidez y conserva el texto seleccionable. | Del tema |
| Markdown | Se arma desde el grafo, no desde la pantalla: ni rasteriza ni se queda corto de resolución. | — |
Además de la imagen, el tablero genera un informe en PDF: el servidor redacta el contenido con la IA —que es donde vive la clave— y el navegador lo compone, porque ya trae el motor de PDF para exportar el lienzo. El archivo vuelve al servidor y queda guardado con el tablero, listo para volver a descargarse.
Un tablero se comparte por código, no por nombre: /b/{código}.
Renombrarlo no cambia la dirección, así que lo que ya repartiste sigue
abriendo. Y un tablero entero se duplica de una vez cuando hace falta
partir de él sin tocarlo.
Un navegador no puede generar una imagen de más de 16 384 px de lado ni de unos 24 megapíxeles, y un tablero de varios cientos de nodos se va muy por encima. La escala se recorta hasta que quepa, se avisa de que ha habido reducción y se sugiere el SVG, que no la sufre.
Las bibliotecas de captura y de PDF son casi 600 kB y sólo hacen falta al exportar, así que se cargan en ese momento y no antes. Abrir un tablero no paga el coste de una función que quizá no se use.
El acceso con Google está activo: crear, editar y guardar exige cuenta. Cada persona ve únicamente sus propios tableros y proyectos, y el filtro no vive en la pantalla sino en la consulta: esconder un botón no protege nada.
Pedir un tablero ajeno devuelve 404. Un 403 sería más exacto pero ya confirmaría que ese tablero existe, que es justo lo que no se quiere decir.
Es una cookie HttpOnly y Secure emitida por el
servidor tras el intercambio con Google. El secreto de cliente nunca sale
del servidor y el navegador no maneja tokens, así que un XSS no tiene nada
que robar. La clave de la IA sigue el mismo camino: sólo servidor.
Se guarda el identificador de Google, no la dirección: cambiar de correo no crea una cuenta nueva ni deja los tableros huérfanos. El acceso se puede restringir a dominios concretos.
El catálogo base es compartido —no tiene sentido duplicar cientos de piezas por persona— y cada cuenta añade encima las suyas, con sus categorías y sus grupos, sin tocar el de nadie. Los tableros se organizan en proyectos y se etiquetan.
| Qué haces | Sin cuenta | Con tu cuenta |
|---|---|---|
| Recorrer esta página y el catálogo entero | Sí | Sí |
| Probar el lienzo de muestra | Sí, no se guarda nada | Sí |
| Crear tableros y proyectos | No | Sí |
| Editar y guardar | No | Sí |
| Adjuntar notas, notas de voz e imágenes | No | Sí |
| Compartir con otras cuentas y generar informes | No | Sí |
No hay formulario de registro: la cuenta se crea sola la primera vez que entras con Google, y desde ese momento lo que dibujes es tuyo y sólo lo ves tú. Ninguna contraseña nueva que recordar —DRAWVIEW.CL no guarda ninguna— y nada que rellenar antes de empezar.
Dentro puedes abrir un lienzo de prueba con todo el catálogo cargado para ver de qué es capaz sin partir de cero. Para conservar lo que dibujes, entra con tu cuenta de Google: se crea la primera vez, y desde ahí tus tableros son privados.