Hoy veremos un tutorial de Draw.io, la herramienta para hacer diagramas online que tienes a tu alcance de manera gratuita.
Cuando necesitas hacer un diagrama, por inercia tiendes a coger papel y boli para ponerte a dibujar. Pasa lo mismo cuando decides crear un funnel de ventas estilo flywheel.
Vamos, que al final es una pérdida de tiempo y por qué no decirlo, un malgasto de papel.
Y claro, cuando te equivocas, toca hacer tachones y tirar el diagrama o el funnel a la basura para volver a comenzar desde el principio.
Por eso, para ahorrar tiempo y papel, vamos a ver a fondo una herramienta gratuita y online llamada Draw.io.
Pero, ¿qué pasa si lo que quieres es diseñar un diagrama?
Eso sí, en todo momento vamos a enfocarlo en cómo diseñar una página estratégica. Por cierto, si puedes registrarte al mini-curso de diseño web para ampliar tus conocimientos sobre este tema.
¿Qué es Draw.io?
Draw.io es una aplicación web con la que podrás crear diagramas online, sin necesidad de descargar ningún software ni adquirir licencias.
Un ejemplo de uso puede ser cuando comienzas a diseñar una web. En este caso podríamos usarlo para hacer un diagrama sobre la estructura de la web de marca personal y el enlazado interno que tendrá dicha web.
Características de Draw.io
La herramienta cuenta con una serie de características y funcionalidades que no quiero dejar pasar por alto.
En primer lugar, destacaría las plantillas o diseños predeterminados que trae. Si te encuentras un poco perdido a la hora de hacer el diseño del diagrama, puedes usar una de las plantillas como guía y modificarla a tu gusto.
Podríamos decir que es como las plantillas que trae el Elementor.
En este caso, Draw.io dispone de una gran variedad de formas. Puedes diseñar tus diagramas en blanco a partir de círculos, líneas de conexión, tablas, imágenes y muchas figuras más aparte de las plantillas de que he mencionado en el punto anterior.
Permite insertar imágenes externas. Es decir, que puedes subir tus imágenes a Draw.io y colocarlas en el diagrama para darle un toque más realista.
Además, puedes configurar el texto cambiando el formato. Tienes una opción para elegir la tipografía y cambiarla de acorde con tu imagen corporativa.
Puedes exportar y guardar el diagrama en diferentes formatos, entre los que se encuentran los formatos PNG, GIF, JPG o PDF. También puedes guardar el esquema en formato.XML para seguir editando y modificando más adelante.
Es más, incluso puedes imprimirlo.
Y esto no esto, si quieres insertar el diagrama en una página web, puedes hacerlo a través de un código que obtienes desde el programa.
Para terminar con la serie de características, cabe destacar que la aplicación puedes conectarla con Google Drive en un solo clic, para tener todos tus diagramas bien organizados y al alcance en cualquier momento.
Ventajas de Draw.io
En resumen, las ventajas de esta aplicación son las siguientes:
- Es una herramienta muy intuitiva y de fácil manejo.
- Lo haces todo online, sin necesidad de descargar e instalar ningún software.
- La aplicación es gratuita, por lo que no necesitas ninguna licencia.
- Y cómo no, la mejor ventaja de todas, es que está en español.
¿Cómo funciona Draw.io?
Esta herramienta de diagramas online te lo pone fácil. A continuación te dejo un vídeo tutorial en el que te explico cómo puedes empezar a crear tus diagramas online.
Mini-curso de diseño web estratégico
Paso a paso
Aunque tienes todo explicado en el vídeo, quizá la primera parte, la de acceder al editor de la herramienta sea un poco más compleja. Por eso te voy a explicar el paso a paso detallado con imágenes:
1.- Entra a draw.io desde tu navegador de internet.
2.- Elige con cual de las 3 aplicaciones quieres conectarte. La que te recomiendo es Google Drive. Así podrás tener todos tus diagramas en un mismo sitio.
3.- Autoriza a la herramienta de diagramas online a acceder a tu Google Drive.
4.- Elige con qué cuenta de Gmail quieres acceder.
5.- Ahora tienes dos opciones. Abrir un diagrama ya existente o crear uno nuevo. Si es la primera vez que vas a utilizar la herramienta, dale a crear uno nuevo.
6.- En esta pantalla, haciendo clic en las categorías, podrás acceder a las diferentes plantillas.
7.- Puedes crear un diagrama en blanco, como el que te muestro en el vídeo, o puedes editar una de las plantillas.
Para seleccionar una plantilla tan solo tienes que elegir una de las categorías y escoger el diagrama que más te guste o se adapte a tu idea.
8.- No me detengo en cómo puedes editar el diagrama, porque encontrarás una explicación mucho más extensa en el vídeo.
Instalar Draw.io en tus aplicaciones de Google
Si quieres tener un acceso más rápido a esta herramienta de diagramas online, puedes instalarla junto con las aplicaciones de Google. Las aplicaciones de Google que puedes utilizar por defecto son Google Drive, Hojas de cálculo, Google Keep, entre otras.
Para instalar esta herramienta junto con las demás aplicaciones, tan solo tienes que poner draw.io para escritorio en tu buscador de Google y entrar el la primera página.
A continuación le darías al botón azul de la derecha que dice Añadir a Chrome y ya está. Tendrías esta herramienta instalada junto con las demás aplicaciones de Google para que te sea más fácil utilizarla cuando la necesites.
Conclusión
Para terminar, me gustaría animarte a que utilices esta herramienta para diagramas online. Tiene muchas características que hacen de ella una herramienta muy potente.
Además, no deja de actualizarse, por lo que cada vez podrás encontrar nuevas funcionalidades.
Hola Beatriz, una pregunta, puedo instalar Draw.io en mi computadora?
vale la pena hacerlo? o es mejor trabajarlo directo en línea?
y me podrias ayudar con un tutorial donde me pudieras explicar más detallado como ingresar a Darw.io sin tener riesgos al utilizarlo en mi mac o pc.?
Muchas gracias
saludos desde México
Hola Eduardo.
Sinceramente instalarlo en tu computadora o no es una decisión tuya, depende del trabajo que tengas que realizar con Draw.io.
Me explico, si vas a usarlo todos los días a lo mejor es más cómodo descargarlo. Si vas a usarlo de vez en cuando, puedes usarlo en línea.
Muchas gracias por dejar tu comentario!
Un saludo!
Hola Beatriz! Sabes si se puede trabajar en equipo en un mismo diagrama?
Gracias por la información que nos compartes 🙂
Hola. Me gustaría conocer cuál es la historia de Draw.io.
Hola!!
Seguro que en la web oficial de Draw.io encuentras la historia, esto tan solo es un tutorial para aprender a manejarlo.
Suerte!
como coloco una imagen como fondo, existen imagenes que no se acoplan como fondo por el tamaño
Hola Beatriz, excelente aplicacion!!
Tengo una duda, como puedes agregar hojas a mi mapa?
si tengo que hacer 3 en un mismo archivo
¿Cómo puedo descargas mis trabajos en la compu que hago en esa pagina?
Podrías decirme como se modifica el espacio de interlineado?
Hola! Gracias por el tutorial.
LO vengo manejando desde hace poco tiempo y me parece una pasada. Tengo un problema desde hace relativamente poco que no me pasaba antes. Cuando exporto a PDF, se me guardan los esquemas pero sin las letras. ¿Tengo que activar algo que no he activado? Gracias!
Hola Eva,
Pues la verdad es que no sé lo que te puede estar pasando, a lo mejor es algún error de la propia herramienta.
Si no consigues solucionarlo te recomiendo que les escribas un email directamente a ellos explicándoles tu problema.
Muchas gracias por pasarte!
Hola,
Te recomiendo que lo descargues como JPG o imagen de esa manera será mejor vista, de lo contrario me parece que en PDF, no puedes pasarte de los márgenes
Cree un flujo y lo había publicado y era visible para todos, sin que que me salga el mensaje de «Requiere autorización de GOOGLE DRIVE». Sin embargo, hice lo mismo pero ahora lo publico y me sale, ese mensaje ¿Por que pasa eso? ¿Cómo lo corrijo?
Es espectacular para mi necesidad. Una pregunta:
Como puedo hacer para «marcar un texto» de forma que le pueda dar formato luego de que ya está escrito.
Alguna vez lo conseguí como si fuese un procesador de texto, pero no se como lo hice, hay algún comando o conjunto de teclas que te permitan hacerlo
Jorge
Hola, Beatriz, una consulta, cómo hacer para que todas mis fuentes de letras se descarguen cuando exporto mi diagrama en PDF, muchas veces me pasa que uso diversas fuentes de GoogleFonts mientras hago mi diagrama, pero cuando lo exporto, las fuentes que usé, desaparecen
Parece una herramienta muy practica. boy a ensayar con ella para hacer un mapa conceptual. Muchas gracias.
Hola buenas noches
Consulta
Cómo puedo convertir a Word?