# Como criar atividades de arrastar e soltar > Com o arrastar e soltar você pode criar atividades para associar classificar ou combinar elementos arrastandoos até a área de destino correta Imagine se Source: https://help.genially.com/pt_br/como-criar-atividades-de-arrastar-e-soltar-SJIMkHnmbx Last updated: 2026-04-20T11:53:53.544Z Com o arrastar e soltar, você pode criar atividades para **associar, classificar ou combinar elementos**, arrastando-os até a área de destino correta. Imagine seus alunos posicionando cada palavra na categoria certa ou seus clientes colocando a chave na fechadura correta para desbloquear um desafio. Essa atividade tem inúmeras possibilidades criativas! Siga este tutorial se você quiser criar uma dinâmica poderosa que ative, ao mesmo tempo, o aprendizado visual, motor e cognitivo. ## **Principais características** 1. **Os elementos arrastáveis** são os protagonistas da atividade. **Eles podem** ser textos, imagens e GIFs, formas e silhuetas, ícones, ilustrações, personagens, botões e stickers. Vale lembrar que, mesmo que um elemento esteja bloqueado no editor, você pode selecioná-lo como arrastável. Além de arrastar, você pode mover os elementos usando a navegação por teclado ou clicando neles e, em seguida, clicando na área de destino. 2. **As áreas de destino** são as zonas onde os elementos arrastáveis devem ser soltos. **Elas podem** ser imagens e GIFs, formas e silhuetas, ícones, ilustrações, personagens, mas também áreas invisíveis, textos, botões e stickers. O tamanho da área vai depender do elemento que você escolher como destino. Cada elemento arrastável **pode ter uma ou várias áreas de destino**, e uma mesma área pode receber **vários elementos arrastáveis diferentes**. * Se um elemento for solto na **área correta**, a conexão é estabelecida e um pequeno efeito de animação é acionado, reforçando a sensação de conquista. * Se um elemento for solto na **área incorreta**, um pequeno efeito aparece e o elemento volta para a posição inicial. Você pode configurar o que acontece **a cada acerto, em caso de erro ou ao concluir a atividade**: abrir uma janela, reproduzir um áudio, ir para outra página, abrir um link, acionar um efeito, mostrar e/ou ocultar elementos ou rolar até um elemento (somente em criações no formato mobile). [Combine essas ações como preferir.](https://help.genially.com/en_us/how-to-combine-several-interactions-in-genially-H1uc9Dr2j) ## **Como criar uma atividade de arrastar e soltar** Siga estes passos: 1. **Crie o design da sua atividade** Crie a cena ou a composição visual da atividade, posicionando cada elemento arrastável em seu ponto inicial. Inclua também as áreas de destino. 2. **Use a interatividade Arrastar e soltar** Clique no elemento que você quer tornar arrastável, clique no botão _Interatividade_ e selecione _Arrastar e soltar_. Pronto! Seu primeiro elemento arrastável já está configurado. 3. **Defina as conexões uma a uma** Agora, basta clicar no segundo quadrado e selecionar a área de destino correspondente para finalizar a primeira conexão. Repita esse processo para todos os elementos arrastáveis (um elemento arrastável → uma área de destino). Não há limite. ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/5adc7ebe6992e84c6103a65b05805a25.gif) 4\. **Personalize as ações** Decida o que deve acontecer em cada situação: 1. **A cada conexão correta.** Por exemplo, você pode reproduzir um áudio de acerto sempre que uma conexão for concluída corretamente e/ou mostrar uma janela. Isso é útil se você quiser dar um feedback personalizado para cada elemento arrastável. 2. **Em caso de erro.** Por exemplo, você pode mostrar uma janela com uma mensagem genérica ou reproduzir um áudio de erro sempre que uma conexão estiver incorreta. 3. **Ao concluir a atividade.** Por exemplo, você pode comemorar com um efeito de confete e desbloquear a próxima tela. ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/3c007962373eab0d922fffb23f4d8814.gif) 5\. **Escolha quando validar** Você prefere verificar todas as conexões de uma vez ou à medida que arrasta? Você pode ativar o **botão de validação** para confirmar se os elementos foram posicionados corretamente apenas quando todos estiverem no lugar. Escolha a cor do botão de acordo com sua preferência. Dica: se você preferir validar as conexões uma a uma, sem usar o botão, pode criar elementos arrastáveis que não estejam associados a nenhuma área de destino. Ao arrastá-los, você receberá um feedback de erro. ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/544085760192bc9903b1ac9ce48c007b.gif) Tudo certo? Visualize a prévia para ver como funciona sua atividade de arrastar e soltar. ### Sobre acessibilidade O recurso de arrastar e soltar é compatível com leitores de tela e navegação por teclado. Isso significa que qualquer pessoa, independentemente de suas habilidades, pode concluir esse tipo de atividade no Genially. ## **Ideias e dicas para aproveitar ao máximo** Ao ler este tutorial, com certeza algumas ideias já surgiram. Mas, se precisar, aqui vão alguns exemplos inspiradores. Quer começar com algo simples? Então siga estas dicas: 1. **Nível fácil:** use poucos elementos arrastáveis na sua atividade de arrastar e soltar. Você também pode usar cores ou sombras sutis para indicar onde ficam as áreas de destino. 2. **Nível ultra fácil:** indique quais elementos são arrastáveis. Ative essas dicas visuais no menu principal **☰** (canto superior esquerdo), clique em _Preferências_ e, em seguida, ative _Indicar se é possível arrastar_.