Saltar navegación

Activa JavaScript para disfrutar de los vídeos de la Mediateca.

Generar mapas conceptuales a partir de draw.io

Ajuste de pantalla

El ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:

Subido el 3 de agosto de 2018 por Dg fp-ere

733 visualizaciones

Draw.io es una herramienta libre, no necesita registro y permite descarga y exportación sin limitaciones, y con el que se pueden hacer mapas conceptuales.

Descargar la transcripción

Vamos a ver en este video tutorial cómo generar un mapa conceptual, cómo pasarlo, cómo crear uno con este mismo como ejemplo, con una herramienta que nos va a facilitar un poco la vida. 00:00:00
después de ver unas cuantas, la que yo recomiendo es la de draw.io 00:00:14
esta es online, no hace falta ni registrarse, es completamente libre 00:00:24
se puede exportar a lo que haga falta, se puede descargar el propio fichero que se está haciendo 00:00:29
con lo cual no va a depender de una cuenta en la que por ejemplo alguien sea propietario 00:00:34
y que luego no se puede pasar al profesor que necesita editarlo en un momento dado. 00:00:41
Hay un montón de cosas en este sentido que aunque se pueda exportar en unos casos o en otros, 00:00:47
pero se necesita desde luego libertad completa para el funcionamiento y para editar. 00:00:54
Cualquier cosa que no sea así, al final nos va a estar poniendo barreras. 00:01:01
Entonces la mejor herramienta que he encontrado es esta de aquí, draw.io. Aquí directamente, como he accedido, nuevo diagrama. 00:01:05
Entonces fijaos que no me registraban, eso es lo primero, pero bueno, nuevo diagrama. Hay una serie de plantillas aquí que nos van a ayudar bastante. 00:01:18
bastante. Por ejemplo, vamos a ver, diagramas de flujo, ingeniería, gráficos o simplemente 00:01:27
organigramas, está fenomenal. Pero concretamente vamos a utilizar el de Maps. Aquí como veis 00:01:37
hay algunos predefinidos que están bastante bien. En este caso voy a utilizar este de 00:01:45
Vale, pues tenemos aquí ya directamente esto cargado. 00:01:53
Entonces, ¿dónde empieza? La autoorientación profesional. 00:01:58
Vale, pues me vengo aquí y la autoorientación profesional. 00:02:01
Vale, está con guión. Vale, sí. 00:02:12
Es un proceso de búsqueda de información. 00:02:16
Vale, pues lo puedo poner aquí. 00:02:19
es un 00:02:22
puede empezar, bueno, más o menos 00:02:23
vamos a ver 00:02:29
vamos a ponerlo aquí 00:02:30
luego quito el otro 00:02:32
es un 00:02:34
proceso de búsqueda de información 00:02:36
y toma de decisiones 00:02:41
vamos a ver 00:02:42
toma de decisiones 00:02:46
profesionales 00:02:57
Aquí, por ejemplo, esto se pasa de lo que es el tamaño en sí mismo. 00:03:00
Lo que es el texto podemos abrir por aquí y lo vamos ajustando. 00:03:08
Con lo cual este es fácil. 00:03:13
Aquí se acaba, no hay nada más. Realmente lo podría haber puesto aquí que me lo hubiera facilitado. 00:03:16
Ahora fijaos que aquí, esto, a ver, lo voy a suprimir, suprimir, suprimir, suprimir, y este me lo traigo aquí. 00:03:22
Fijaos esa línea, ya me dice que lo estoy poniendo ahí justo alineado. 00:03:32
Vale, fenomenal. 00:03:37
Siguiente punto, permite conocer. 00:03:38
Bueno, vamos a ver esta línea, si se quiere hacer tal cual. 00:03:40
Lo seleccionamos, estilo, la línea, ya la tenemos con los guiones. 00:03:43
Y aquí no quiero flechas. 00:03:52
Vale, fenomenal. Pues ya lo tengo. 00:03:56
Permite conocer. 00:03:59
Bueno, aquí está continua, aquí está discontinua, pero bueno, es igual. 00:04:02
Permite conocer el ciclo formativo. 00:04:07
Vale, pues vámonos para acá. 00:04:10
Aquí. 00:04:13
Permite conocer el ciclo formativo. 00:04:15
Una vez finalizado, se obtiene, se obtiene, esto siempre también, bueno, vamos a ver, no lo voy a hacer completo porque al final se tarda mucho para lo que es este videotutorial, pero bueno, quiero que por lo menos veáis un poquito. 00:04:24
Aquí de nuevo, le quitamos la flecha, el título y su futuro, vale, aquí, copio, pego, entonces aquí hemos dicho el título y su futuro, vale, fenomenal, y aquí el título y su futuro, vale, fenomenal. 00:04:47
¿Cómo ponemos la línea? Pues muy fácil, desde ese punto verde extendemos una hasta allá, aunque en este caso no ha quedado justo como esta. 00:05:18
¿Aquí qué podemos hacer para dejarla igual? Pues fijarnos en cómo está configurado, el rounded, el color este, vamos a ver, este aquí no es el sharp, el rounded este. 00:05:31
Vamos a ver qué más hay por aquí. 00:05:43
6 puntos. 00:05:49
6 puntos también está. 00:05:53
El directo este. 00:06:01
¿Qué más había por aquí que no he fijado? 00:06:05
Acá hay una flecha. 00:06:09
este vamos a ponerlo aquí así 00:06:13
y ahora faltaría 00:06:18
lo que es el 00:06:19
color 00:06:20
que copio 00:06:22
y aquí 00:06:26
por ejemplo pego 00:06:29
y faltaría el grosor 00:06:31
de la línea, que esto 00:06:34
aquí está en 3, pues aquí vamos a ponerlo 00:06:35
en 3 00:06:38
vale, pues ya tenemos esto 00:06:40
ahora si lo muevo 00:06:41
la línea se mueve también con lo que yo estoy haciendo 00:06:43
así que nada, fenomenal 00:06:47
aquí voy a necesitar un poquito de espacio 00:06:49
muevo esto también 00:06:51
lo muevo 00:06:53
¿qué más? 00:06:54
una vez finalizado 00:06:57
se tiene, vale, ciclo formativo que incluye 00:06:59
libro académico 00:07:02
aquí por ejemplo 00:07:04
que incluye 00:07:11
pues vamos a ver, lo acortamos 00:07:13
un poco 00:07:17
aquí, copio y pego 00:07:17
tengo este de aquí, el nivel académico 00:07:25
y el nivel profesional 00:07:29
estoy pensando en varias cosas, nivel académico 00:07:30
y nivel profesional 00:07:37
vale, pues 00:07:38
este de aquí 00:07:44
incluso podemos decirle que le ponga 00:07:47
por defecto, que ya está 00:07:49
y ahora me vengo 00:07:50
aquí 00:07:53
a cualquiera de ellos 00:07:55
por ejemplo desde aquí 00:07:57
un punto verde de estos 00:07:58
y que señale a cualquiera 00:08:01
de estos puntitos 00:08:03
vale, fenomenal, pues ya la tengo ahí 00:08:04
así que así poco a poco 00:08:07
la voy dando forma 00:08:09
este 00:08:09
quizá me puede gustar más desde otro punto 00:08:11
desde aquí, y así me permite también 00:08:16
ir modificando según voy cayendo 00:08:18
bueno, aquí como veis 00:08:23
se pueden establecer flechas de todo tipo, esto no es una flecha 00:08:34
pero se puede poner aquí por ejemplo 00:08:37
el inicio de este, se puede poner la flecha bidireccional, en fin, permite un montón de opciones que es una maravilla. 00:08:42
Una vez terminado esto, aquí siempre se pueden meter nuevos recuadros, círculos, lo que se quiera, hay muchísimas más figuras también por aquí, de todo tipo, 00:08:56
de todo tipo 00:09:08
que también se pueden utilizar 00:09:09
aquí en el avanzado pues también para diagrama de flujo y lo que haga falta 00:09:14
incluso más por ahí 00:09:17
pero aquí como veis 00:09:19
hay para ratón 00:09:23
incluso para símbolos eléctricos 00:09:25
eeeeh 00:09:30
vamos a ver entonces 00:09:32
sin meterme en más 00:09:35
temas de edición 00:09:37
Por no alargarme, lo que es el copiar, lo que es este mapa conceptual a este de aquí, como veis, es fácil. 00:09:38
Es prácticamente ir modificando lo que son las flechas, hacer copia-pega de lo que son los elementos. 00:09:48
Estas flechitas se ponen como, vamos, lo que es por defecto para que no haga falta casi ni copiar. 00:09:55
Es establecer los vínculos entre uno y otro. 00:10:02
Y bueno, poco más. 00:10:05
es decir, que esto debería ser fácil 00:10:06
entonces, lo que sí sería importante es que se utilice esto 00:10:09
guardar 00:10:14
ahora, guardar donde? 00:10:16
aquí 00:10:19
esto del XML 00:10:20
esto debería estar incluido en el aula virtual 00:10:21
de forma que el profesor en cuestión pueda modificarlo siempre que lo necesite 00:10:26
esto siempre se puede poner como un fichero que quede oculto simplemente 00:10:30
o en el área de recursos generales 00:10:35
vamos a ver dónde 00:10:39
aquí de recursos generales en recursos para el profesor 00:10:40
aunque está este de materiales originales 00:10:44
se puede crear un recurso carpeta 00:10:48
que es simplemente recursos para el profesor 00:10:50
en el que meter los ficheres que se están utilizando 00:10:52
los ficheres originales para luego poder tocar las cosas 00:10:56
ahora mismo no está puesto pero lo crearé en cuanto termine este video 00:10:59
vale, pues nada 00:11:02
se guarda 00:11:04
con lo cual 00:11:06
este luego se puede tocar perfectamente 00:11:08
este queda guardado 00:11:10
por ahí, vale 00:11:14
exportar 00:11:16
entonces aquí 00:11:17
permite un montonazo de formatos 00:11:20
como se puede ver 00:11:22
hay libertad total, entonces bueno 00:11:24
por ejemplo el PNG 00:11:26
aquí también hay varias opciones 00:11:28
y aquí en el device 00:11:32
aquí elegimos descargarlo 00:11:38
guardar como 00:11:40
y aquí ejemplo 00:11:41
draw 00:11:44
entonces esto si vamos a buscarlo 00:11:48
lo tengo por aquí 00:11:54
esto como veis 00:11:55
es una imagen normal y de corriente 00:11:58
que ya bueno sabéis como 00:12:00
incluirla en cualquier contenido del libro Moodle. Hay otros vídeos donde 00:12:01
también lo tengo bastante bien explicado. Así que bueno, como veis es bastante 00:12:06
sencillo este proceso. 00:12:09
Hay otras opciones aquí también que merecen la pena, que es, vamos a ver, 00:12:14
edit-link, aquí por ejemplo, htps://fp-distancia-educa.mxg.rg, por poner un caso. 00:12:23
Entonces aquí, en este diagrama incluso, se pueden poner enlaces. 00:12:38
Si fuera este el caso, a la hora de exportar, NSVG conserva los enlaces. 00:12:44
Entonces, aquí, vamos a ver, tenemos aquí el dispositivo, guardar como, ejemplo, droguio.svg, entonces aquí en el svg, lo único, esto va a tener que verse sobre un navegador, 00:12:53
Para lo cual, para este ejemplo, lo arrastro aquí. Fijaos, he estado viendo una imagen, pero esta imagen contiene enlaces. 00:13:14
Si pincho aquí, voy precisamente a nuestra plataforma. 00:13:25
Entonces, bueno, si uno no quiere complicaciones, PNG o JPG, pero si uno quiere incluir enlaces, que en momentos dados puede venir bien, ya habéis visto cómo se hace. 00:13:32
así que bueno, espero que por lo menos esta parte sea un poquito más fácil ahora 00:13:42
Autor/es:
Víctor Eugenio Nuño Nuño
Subido por:
Dg fp-ere
Licencia:
Reconocimiento - No comercial
Visualizaciones:
733
Fecha:
3 de agosto de 2018 - 14:30
Visibilidad:
Público
Enlace Relacionado:
http://draw.io/
Centro:
EST ADMI D.G. DE FORMACION PROFESIONAL Y ENSEÑANZAS DE REGIMEN ESPECIAL
Descripción ampliada:
Se cuenta en este videotutorial:


  • Cómo comenzar con draw.io.

  • Cómo ir copiando contenidos de otro mapa conceptual.

  • Cómo crear y copiar elementos del mapa conceptual.

  • Cómo establecer las relaciones entre los elementos.

  • Cómo cambiar el estilo de las relaciones o flechas entre elementos.

  • Cómo exportar a imagen PNG (aunque se admiten otras).

  • Cómo incluir un enlace en un elemento.

  • Cómo exportar a SVG y que conserver el enlace introducido.

Duración:
13′ 53″
Relación de aspecto:
16:10 El estándar usado por los portátiles de 15,4" y algunos otros, es ancho como el 16:9.
Resolución:
1440x900 píxeles
Tamaño:
31.58 MBytes

Del mismo autor…

Ver más del mismo centro


EducaMadrid, Plataforma Educativa de la Comunidad de Madrid

Plataforma Educativa EducaMadrid