Guia do Usuário Cancelar

Adicionar sobreposições

Saiba como adicionar uma sobreposição para simular efeitos de deslizamento interativos.

O Adobe XD permite adicionar elementos sobrepostos a outra prancheta, em vez de duplicá-los em várias pranchetas, para simular efeitos de listas suspensas, teclados deslizantes e muito mais. 

Teclado exibido como sobreposição em uma prancheta
Teclado exibido como sobreposição em uma prancheta

  1. No modo de Design, selecione uma prancheta de origem e a outra prancheta com a qual deseja sobrepor a primeira. Você pode reutilizar uma prancheta de sobreposição várias vezes. 

  2. No modo de Protótipo, arraste e solte o conector da prancheta de origem na prancheta com o conteúdo de sobreposição. Clique no conector para exibir o painel Interação que aparece no Inspetor de propriedades e configure as seguintes opções:

    • Acionador: selecione uma opção.
    • Ação: selecione Sobreposição. Se você deseja atribuir duas ações a um único acionador, como Tocar, defina o primeiro botão Ação + no Inspetor de propriedades como Sobreposição e defina o segundo botão Ação + como uma ação não transitória, como Reprodução de áudio ou Reprodução de fala.
    • Animação: selecione o tipo de animação. Se você selecionar Deslizar para cima ou Deslizar para baixo, o XD posicionará automaticamente a sobreposição na borda da prancheta de origem.
    • Atenuação: selecione uma opção para aplicar efeitos de atenuação.
    • Duração: insira a duração de tempo. A duração máxima que pode ser definida para uma transição entre duas pranchetas é de cinco segundos. 
    Adicionar um teclado como sobreposição na prancheta de origem
    Adicionar um teclado como sobreposição na prancheta de origem

  3. Para ajustar a posição de uma sobreposição na prancheta de origem, clique, arraste e solte o botão de posição verde (+).

  4. Para visualizar as sobreposições em navegadores compatíveis, clique em 

Sobreposições aninhadas

O Adobe XD não aceita sobreposições aninhadas, isto é, quando você adiciona uma sobreposição sobre outra sobreposição. Nesses casos, quando você conecta a primeira prancheta de sobreposição à outra prancheta, a transição da primeira sobreposição ocorre antes da transição da segunda. 

Exemplos e arquivos de amostra

Você também pode consultar a comunidade do XD para encontrar mais tutoriais e arquivos de amostra.

Mais itens semelhantes

Receba ajuda com mais rapidez e facilidade

Novo usuário?