{"id":106,"date":"2022-12-01T09:12:44","date_gmt":"2022-12-01T09:12:44","guid":{"rendered":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/?page_id=106"},"modified":"2023-10-05T15:45:49","modified_gmt":"2023-10-05T15:45:49","slug":"drag-and-drop-actividades-de-arrastra-y-suelta","status":"publish","type":"page","link":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/drag-and-drop-actividades-de-arrastra-y-suelta\/","title":{"rendered":"Drag and drop: actividades de arrastra y suelta"},"content":{"rendered":"<p id=\"yui_3_17_2_1_1669885735882_1659\" dir=\"ltr\">El tipo de contenido Drag and Drop permite a los alumnos arrastrar un fragmento de texto o una imagen y soltarlo en una o m\u00e1s zonas de colocaci\u00f3n correspondientes.<\/p>\n<p><iframe loading=\"lazy\" title=\"Tutorial Drag and Drop\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/G0H0sDhryxg?feature=oembed&#038;wmode=opaque\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe><\/p>\n<p>&nbsp;<\/p>\n<h2 id=\"guides-header-2\">Cu\u00e1ndo usar Drag and Drop<\/h2>\n<p id=\"yui_3_17_2_1_1669885735882_1666\">Drag and drop es un tipo muy utilizado de actividad. Con ella puedes hacer m\u00faltiples acciones:<\/p>\n<ul id=\"yui_3_17_2_1_1669885735882_1667\">\n<li id=\"yui_3_17_2_1_1669885735882_1668\">Agrupar elementos que van juntos o tienen algo en com\u00fan.<\/li>\n<li id=\"yui_3_17_2_1_1669885735882_1669\">Relacionar texto con im\u00e1genes.<\/li>\n<li id=\"yui_3_17_2_1_1669885735882_1670\">Poner los elementos en el orden correcto.<\/li>\n<li id=\"yui_3_17_2_1_1669885735882_1671\">Colocar los elementos en una posici\u00f3n correcta.<\/li>\n<\/ul>\n<p id=\"yui_3_17_2_1_1669885735882_1672\">Las actividades de arrastrar y soltar se pueden utilizar&nbsp; como una variaci\u00f3n de las preguntas de opci\u00f3n m\u00faltiple.Drag and drop se puede usar de forma independiente o se puede incluir en actividdades H5p como <a id=\"yui_3_17_2_1_1669885735882_1673\" href=\"https:\/\/h5p.org\/question-set\" target=\"_blank\" rel=\"noopener noreferrer\">conjuntos de preguntas <\/a>, <a id=\"yui_3_17_2_1_1669885735882_1674\" href=\"https:\/\/h5p.org\/interactive-video\" target=\"_blank\" rel=\"noopener noreferrer\">videos interactivos <\/a>o <a id=\"yui_3_17_2_1_1669885735882_1675\" href=\"https:\/\/h5p.org\/presentation\" target=\"_blank\" rel=\"noopener noreferrer\">presentaciones <\/a>.<\/p>\n<h2 id=\"guides-header-3\">&nbsp;<\/h2>\n<p id=\"yui_3_17_2_1_1669885735882_1679\">&nbsp;<\/p>\n<h2 id=\"guides-header-4\">Paso 1: Crea una pregunta de arrastrar y soltar<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-256 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido.png\" alt=\"\" width=\"1920\" height=\"798\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido.png 1920w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido-300x125.png 300w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido-1024x426.png 1024w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido-768x319.png 768w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/banco-de-contenido-1536x638.png 1536w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/p>\n<h2 id=\"guides-header-5\">Paso 2: editor de preguntas de arrastrar y soltar<\/h2>\n<p>Este es el editor de una actividad Drag and drop.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/01_1.jpg\" alt=\"\" width=\"1580\" height=\"883\"> La creaci\u00f3n de contenido<\/p>\n<p>Hay dos pasos para crear una pregunta de arrastrar y soltar: <strong>configuraci\u00f3n <\/strong>y <strong>trabajo <\/strong>. Puedes clicar las pesta\u00f1as en la parte superior del editor en cualquier momento para navegar entre las vistas.<\/p>\n<div>\n<div>\n<div>\n<div>\n<h2 id=\"guides-header-6\">Paso 4: Configuraci\u00f3n<\/h2>\n<p><strong>La configuraci\u00f3n se <\/strong>ocupa de la configuraci\u00f3n general, como la imagen de fondo y el tama\u00f1o.<\/p>\n<p>&nbsp;<\/p>\n<p>Haz clic en&nbsp; <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/dnd-add-image_0.jpg\" alt=\"\" width=\"104\" height=\"41\">para a\u00f1adir una imagen de fondo.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-258 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/imagen-drag-and-drop.png\" alt=\"\" width=\"801\" height=\"517\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/imagen-drag-and-drop.png 801w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/imagen-drag-and-drop-300x194.png 300w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/imagen-drag-and-drop-768x496.png 768w\" sizes=\"(max-width: 801px) 100vw, 801px\" \/><\/p>\n<p>Ahora que hemos agregado una imagen de fondo, podemos definir el <strong>tama\u00f1o <\/strong>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/03_4.jpg\" alt=\"\" width=\"365\" height=\"129\"><\/p>\n<p>Dado que queremos que se&nbsp; pueda realizar la actividad varias veces, en lugar de intentarlo solo una vez, <strong>marcaremos la opci\u00f3n \u00abReintentar\u00bb <\/strong>.<\/p>\n<p>La opci\u00f3n <strong>Give one point for the whole task (dar pu<\/strong><strong>nto para toda la tarea<\/strong> )es m\u00e1s relevante cuando agregamos preguntas de arrastrar y soltar a <a href=\"https:\/\/h5p.org\/question-set\" target=\"_blank\" rel=\"noopener noreferrer\">conjuntos de preguntas <\/a>, <a href=\"https:\/\/h5p.org\/interactive-video\" target=\"_blank\" rel=\"noopener noreferrer\">videos interactivos <\/a>o <a href=\"https:\/\/h5p.org\/presentation\" target=\"_blank\" rel=\"noopener noreferrer\">presentaciones <\/a>. Esta opci\u00f3n controla la puntuaci\u00f3n que obtiene el alumno por resolver la pregunta de arrastrar y soltar cuando se coloca en una secuencia de varias tareas. Dado que estamos creando una pregunta de arrastrar y soltar independiente, no importa si dejaremos esta opci\u00f3n marcada o no.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/04_3.jpg\" alt=\"\" width=\"431\" height=\"189\"><\/p>\n<h2 id=\"guides-header-7\">Paso 5: Trabajo<\/h2>\n<p>Haz clic en&nbsp; la&nbsp; pesta\u00f1a <strong>Trabajo<\/strong> en la mitad superior derecha del editor para comenzar a crear la tarea en s\u00ed.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-259 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/zona-trabajo-drag-and-drop.png\" alt=\"\" width=\"804\" height=\"663\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/zona-trabajo-drag-and-drop.png 804w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/zona-trabajo-drag-and-drop-300x247.png 300w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/zona-trabajo-drag-and-drop-768x633.png 768w\" sizes=\"(max-width: 804px) 100vw, 804px\" \/><\/p>\n<p>La barra de herramientas te permite insertar:<\/p>\n<table border=\"0\" cellspacing=\"5\" cellpadding=\"5\">\n<tbody>\n<tr>\n<td><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/dnd-dropzone.jpg\" alt=\"\" width=\"68\" height=\"58\"><\/td>\n<td>Zonas de descenso<\/td>\n<\/tr>\n<tr>\n<td><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/dnd-text.jpg\" alt=\"\" width=\"68\" height=\"58\"><\/td>\n<td>Textos<\/td>\n<\/tr>\n<tr>\n<td><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/h5p.org\/sites\/default\/files\/dnd-image.jpg\" alt=\"\" width=\"68\" height=\"58\"><\/td>\n<td>e Im\u00e1genes<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><strong>Las&nbsp; <\/strong>zonas de&nbsp;<strong>colocaci\u00f3n<\/strong> son \u00e1reas en las que se pueden colocar elementos arrastrables de&nbsp; <strong>texto <\/strong>e <strong>imagen<\/strong>&nbsp; .<\/p>\n<h2 id=\"guides-header-8\">Paso 6: Zona de descenso<\/h2>\n<p>Haz clic en&nbsp; el bot\u00f3n <strong>Dropzone <\/strong>en la barra de herramientas, arr\u00e1stralo a la imagen de fondo y su\u00e9ltalo en alg\u00fan lugar.<\/p>\n<p>Las opciones de Dropzone aparecen cuando lo sueltas. A\u00f1adimos la <strong>Etiqueta, donde escribiremos el texto que queramos desplazar a la imagen.<\/strong><\/p>\n<p><strong><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-344 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/2-5.png\" alt=\"\" width=\"895\" height=\"490\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/2-5.png 895w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/2-5-300x164.png 300w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/2-5-768x420.png 768w\" sizes=\"(max-width: 895px) 100vw, 895px\" \/><\/strong><\/p>\n<p>Ahora ver\u00e1s una zona de ca\u00edda blanca colocada sobre la imagen de fondo. Mueve y cambia el tama\u00f1o de la zona de colocaci\u00f3n para que se coloque aproximadamente sobre la zona de la imagen deseada.. Mueve la zona de colocaci\u00f3n clic\u00e1ndola y arrastr\u00e1ndola hasta donde desees colocarla. Puedes cambiar el tama\u00f1o de la zona de colocaci\u00f3n presionando la esquina inferior derecha de la zona de colocaci\u00f3n y arrastrando hacia arriba\/abajo o hacia la izquierda\/derecha para escalar la zona de colocaci\u00f3n en las proporciones correctas.<strong><br \/>\n<\/strong><\/p>\n<h2 id=\"guides-header-9\"><strong>Paso 7: Agregar texto <\/strong><\/h2>\n<p>Ahora agregaremos el texto que tendremos que desplazar.<\/p>\n<p>Haz clic en&nbsp; el bot\u00f3n <strong>Texto<\/strong>&nbsp; en la barra de herramientas y arr\u00e1stralo a la imagen de fondo. Puedes colocarlo a la derecha de la imagen. Las opciones de texto aparecen cuando lo sueltas.<\/p>\n<p>En la etiqueta <strong>Texto<\/strong>, escribe <em>la palabra o frase a mover<\/em>. En<strong> Seleccionar zonas de colocaci\u00f3n<\/strong> , marca la casilla de verificaci\u00f3n que corresponda.<\/p>\n<p>La<strong> opacidad<\/strong> define c\u00f3mo veremos el recuadro. Si la ponemos&nbsp; a 0, no se ver\u00e1 nada.<\/p>\n<p>Mueve y cambia el tama\u00f1o del objeto arrastrable como desees. Lo mueves presionando sobre \u00e9l y luego lo arrastras a donde quieras. Puedes cambiar el tama\u00f1o presionando en la esquina inferior derecha del objeto y luego tirar en cualquier direcci\u00f3n para escalar.<strong><br \/>\n<\/strong><\/p>\n<p><strong><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-345 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/3-2.png\" alt=\"\" width=\"791\" height=\"473\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/3-2.png 791w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/3-2-300x179.png 300w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/10\/3-2-768x459.png 768w\" sizes=\"(max-width: 791px) 100vw, 791px\" \/><\/strong><\/p>\n<\/div>\n<div><strong>&nbsp;<\/strong><\/div>\n<div>\n<h2 id=\"guides-header-10\">Paso 8: Definir la coincidencia correcta<\/h2>\n<p>Hac doble click sobre los espacios en blanco para editar la zona de caida correcta, es decir, donde debe c<strong>aer el texto que has seleccionado. <\/strong>Selecciona el texto correcto.<\/p>\n<p><strong><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-260 size-full\" src=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/drag-and-drop-3.png\" alt=\"\" width=\"761\" height=\"501\" srcset=\"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/drag-and-drop-3.png 761w, https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/files\/2023\/01\/drag-and-drop-3-300x198.png 300w\" sizes=\"(max-width: 761px) 100vw, 761px\" \/><\/strong><\/p>\n<\/div>\n<div><strong>&nbsp;<\/strong><\/div>\n<div><strong><img decoding=\"async\" role=\"presentation\" src=\"https:\/\/educacionadistancia.juntadeandalucia.es\/centros\/sevilla21\/draftfile.php\/645952\/user\/draft\/983646916\/Captura%20de%20pantalla%202022-01-16%20a%20las%2020.24.31.png\" alt=\"\"><br \/>\n<\/strong><\/div>\n<div><strong>Por \u00faltimo guarda la actividad terminada.<\/strong><\/div>\n<div><code><div class=\"h5p-iframe-wrapper\"><iframe id=\"h5p-iframe-19\" class=\"h5p-iframe\" data-content-id=\"19\" style=\"height:1px\" src=\"about:blank\" frameBorder=\"0\" scrolling=\"no\" title=\"Drag and Drop Locomotor system2\"><\/iframe><\/div><\/code><\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>El tipo de contenido Drag and Drop permite a los alumnos arrastrar un fragmento de texto o una imagen y soltarlo en una o m\u00e1s zonas de colocaci\u00f3n correspondientes. &nbsp; Cu\u00e1ndo usar Drag and&#46;&#46;&#46;<\/p>\n","protected":false},"author":10977,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ngg_post_thumbnail":0,"footnotes":""},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/pages\/106"}],"collection":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/users\/10977"}],"replies":[{"embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/comments?post=106"}],"version-history":[{"count":8,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/pages\/106\/revisions"}],"predecessor-version":[{"id":343,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/pages\/106\/revisions\/343"}],"wp:attachment":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/creah5p\/wp-json\/wp\/v2\/media?parent=106"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}