Guia do Usuário Cancelar

Adicionar um widget accordion a um projeto do Adobe Captivate

Saiba como adicionar um widget accordion que permite que os alunos interajam com o conteúdo clicando nas seções para revelar informações adicionais

O que é um accordion?

Um accordion é uma interface flexível que organiza o conteúdo em seções ou guias. Os alunos podem clicar para expandir uma guia, revelando informações enquanto mantêm outras guias ocultas para uma exibição mais focada e organizada.

Adicionar um accordion

Selecione Adicionar novo widget e selecione Accordion.

Adicionar um accordion

Personalizar o widget accordion

Um accordion inclui um título, corpo, subtítulo e botões de navegação. Além disso, você também pode selecionar os componentes dentro de cada guia, como imagem, título, subtítulo, corpo e cartão. Você também pode personalizar o plano de fundo do widget com uma cor sólida ou uma imagem, bem como adicionar bordas e sombras.

  1. Adicione o número de accordions no widget. Você pode adicionar no máximo 20 accordions.

    Selecionar o número de accordions no slide

  2. Na seção Componentes de Propriedades visuais, você pode adicionar o seguinte:

    • Título – Selecione esta opção para adicionar um título ao widget accordion.
    • Corpo – Selecione esta opção para adicionar uma pequena descrição do procedimento ou das etapas que o accordion cobrirá.
    • Instrução – Selecione esta opção para orientar os alunos a interagirem com as guias dentro do accordion.
    • Botões de navegação: selecione os botões anterior e próximo para permitir que os usuários naveguem entre os slides.
  3. Expanda a seção Alinhamento e espaçamento para ajustar o preenchimento ou o espaçamento do conteúdo. Use o controle deslizante de Largura do conteúdo para alinhar o conteúdo horizontalmente ou definir individualmente os valores de preenchimento. Use o controle deslizante de Espaçamento de conteúdo para tornar o conteúdo mais compacto ou difuso.

    Ajustar o alinhamento e o espaçamento de um widget accordion

    Além disso, selecione cada componente em cada guia para ajustar seu preenchimento. Saiba mais sobre adicionar preenchimento no Adobe Captivate.

  4. Personalize o plano de fundo do widget, o conteúdo dentro de cada guia ou a aparência do cartão. 

    Na seção Aparência , você pode personalizar o plano de fundo do widget alterando o tipo da borda, a cor do plano de fundo e a sombra interna.

    alterar a aparência de um widget accordion

  5. Expanda a seção Configurações para permitir a alternância automática para o próximo slide assim que todas as seções do widget accordion tiverem sido visitadas pelo menos uma vez.

    Habilitar a opção de alternância para o próximo slide após a conclusão do accordion

Personalizar cada guia do accordion

Cada guia do accordion no widget tem um título, um ícone que pode ser expandido/recolhido, imagens, títulos, subtítulos, corpo de texto e um cartão. É possível personalizar cada objeto dentro de cada guia selecionando-o.   

  1. Na seção Accordion, selecione os componentes dentro de uma guia, como Imagem, Título, Subtítulo, Corpo e Cartão.

    Componentes em uma guia do accordion
    Componentes de um accordion

    • Imagem: selecione esta opção para adicionar uma imagem dentro da guia. Você pode adicionar uma imagem de ativos ou do sistema. Saiba mais sobre como editar imagens no Captivate. 
    • Cabeçalho: selecione esta opção para adicionar um título para cada guia. 
    • Subtítulo: selecione esta opção para informações adicionais sobre o conteúdo na guia. 
    • Corpo: selecione esta opção para adicionar uma descrição de texto do conteúdo na guia. 
    • Cartão: selecione esta opção para adicionar ou remover o cartão em relação ao texto.  
  2. Selecione Conteúdo nas configurações de Aparência para alterar o plano de fundo da área de conteúdo dentro de uma guia.

    Alterar o plano de fundo da área de conteúdo
    Alterar a aparência de um accordion

  3. Selecione Cartão nas configurações de Aparência para personalizar o visual do cartão.

    Personalizar a aparência do cartão dentro de uma guia do accordion
    Alterar a aparência do cartão em relação ao conteúdo em um accordion

  4. Para adicionar um ícone ao accordion, selecione a guia e habilite-o na seção Componentes.

    Personalizar o ícone do accordion
    Habilitar o ícone do accordion

    Personalize a aparência do ícone e a direção na qual ele será virado quando selecionado. Você pode alterar o ícone substituindo o arquivo SVG do sistema ou dos ativos. Você também pode permitir que os usuários cliquem na caixa delimitadora de ícones. Saiba mais sobre como trabalhar com SVGs no Captivate.

    Personalizar o ícone substituindo o SVG ou alterando sua aparência
    Substituir o SVG do ícone de um accordion

  5. Para aprimorar a navegação do aluno, personalize os comportamentos da guia do accordion para os estados normal, hover e visitado.  Selecione Mostrar para exibir os estados. Em seguida, selecione cada estado e altere sua aparência.

    Personalizar os estados do accordion
    Alterar a aparência de cada estado de um accordion

    Personalize a aparência de cada estado ajustando sua cor, borda, raio dos vértices e sombra para distinguir visualmente um estado do outro. Os estados permitem que você modifique o comportamento de um objeto com base nas interações do aluno. Saiba mais sobre como usar estados no Adobe Captivate.

  6. Além disso, você também pode selecionar objetos individuais e personalizar a aparência deles no painel Propriedades visuais.

    • Selecione a imagem na guia do accordion e escolha uma imagem ou aplique filtros e outras personalizações.
    Personalizar a imagem dentro de um accordion
    Personalizar cada objeto no painel Propriedades visuais

    •  Selecione qualquer texto dentro do accordion e personalize a fonte, aplique predefinições, altere a cor e altere outras opções de formatação.
    personalizar qualquer texto dentro de uma guia do accordion
    Personalizar qualquer texto em um accordion

    • Selecione os botões para exibir outras opções de design disponíveis ou altere o formato, o texto ou a aparência do ícone do botão.
    Personalizar os botões de um accordion
    Personalizar os botões do widget accordion

Receba ajuda com mais rapidez e facilidade

Novo usuário?