Com a Interface interativa, seu Agente de IA mostra ao contato um formulário, botões, um carrossel ou mídia no chat, em vez de apenas fazer perguntas em texto simples. Ao final deste guia, você terá uma ação que o Agente de IA usa nos momentos certos: por exemplo, o contato escolhe uma data em um calendário ou toca em uma resposta, e o Agente de IA continua imediatamente com base nessa escolha.
Você precisa de um Agente de IA e de uma função com permissão para editar as configurações do Connect AI: na página "Roles", na aba "Connect AI", a linha "Administration" deve estar definida como "Edit". Sem essa permissão, você não verá os botões "Add". Opcionalmente, adicione uma ação de API ou MCP que forneça dados, como horários disponíveis, ou salve as respostas.
Antes de começar, é importante saber: um formulário só aparece de forma interativa no Website Messenger. Nos outros canais de texto, o contato recebe uma pergunta em texto simples; em chamadas, o Agente de IA não oferece a ação. Consulte "On which channels does each element appear?".
Cada elemento interativo é uma ação própria, do tipo "Show interactive element". Você encontra essas ações no menu Connect AI, em Actions > "Interactive UI". A Interface interativa está disponível apenas para Agentes de IA, não para o Copilot.
Quais elementos estão disponíveis?
Uma ação mostra exatamente um destes elementos:
- Formulário: você define um título e os campos, por exemplo, um período de datas, uma opção de escolha e um campo de texto. O contato preenche o formulário e envia todas as respostas de uma só vez.
- Botões: o Agente de IA escreve uma mensagem com respostas rápidas e links nos quais o contato pode tocar. No Website Messenger e, opcionalmente, no WhatsApp, pode haver uma imagem ou um vídeo acima da mensagem.
- Carrossel: o Agente de IA apresenta opções em cartões que podem ser deslizados, com uma imagem, uma descrição e botões.
- Mídia: o Agente de IA compartilha uma imagem, um vídeo ou um documento com uma legenda.
Em cada conversa, o Agente de IA redige o conteúdo no idioma do contato: para um formulário, as opções, os horários disponíveis e os limites de datas; para os outros elementos, todo o texto, incluindo cartões e botões. No campo "How to execute this action", você define as orientações que o agente deve seguir.
Uma nova ação sempre começa como um formulário. "+ Add element manually" permite adicionar campos de formulário, botões, um carrossel ou mídia; o grupo "Interactive elements" desse menu contém apenas essas três últimas opções.
Em quais canais cada elemento aparece?
Os elementos aparecem de forma interativa nos canais abaixo, ou seja, o contato vê e usa o próprio elemento. Quando um elemento não aparece de forma interativa, o contato recebe uma pergunta em texto simples.
- Formulário: interativo apenas no Website Messenger; nos outros canais, aparece como pergunta em texto no WhatsApp, no Facebook e em todos os demais canais de texto.
- Botões: interativos no Website Messenger, no WhatsApp e no Facebook; nos outros canais de texto, aparecem como uma pergunta em texto.
- Website Messenger: todas as respostas e os links aparecem diretamente na mensagem, opcionalmente com uma imagem ou um vídeo acima.
- WhatsApp: até três respostas aparecem como botões; de quatro a dez respostas aparecem em uma lista que o contato abre com um botão. Uma imagem ou um vídeo aparece acima da mensagem. Os dois primeiros links chegam como mensagens separadas; os links adicionais chegam juntos em uma única mensagem de texto.
- Facebook: até três respostas aparecem como botões; mais de três aparecem como respostas rápidas, isto é, sugestões tocáveis junto com a mensagem. Não há imagem ou vídeo, e todos os links chegam juntos em uma única mensagem de texto.
- Carrossel e Mídia: interativos no Website Messenger e no WhatsApp; no Facebook e nos outros canais de texto, aparecem como uma pergunta em texto. No WhatsApp, cada cartão precisa de uma imagem ou um vídeo e da mesma quantidade de respostas rápidas, no máximo duas; se algo estiver faltando, o Agente de IA recebe a instrução de corrigir os cartões. A seção "How do I show buttons, a carousel or media?" explica de onde podem vir as imagens, os vídeos e os arquivos.
Os outros canais de texto são Instagram, Telegram, SMS, e-mail, Threema e canais personalizados. Em chamadas, o Agente de IA não oferece nenhuma ação da Interface interativa.
O Agente de IA redige a pergunta em texto de forma que ela solicite as mesmas informações que o elemento. Por exemplo, para um formulário com um período de datas e a escolha de um quarto, ele envia uma mensagem perguntando em quais dias e qual quarto o contato deseja reservar. Imagens, vídeos e botões são omitidos; somente no caso de mídia, o link do arquivo é incluído no texto.
O contato responde com uma mensagem normal, o Agente de IA a avalia e não envia o elemento novamente.
Se o WhatsApp ou o Facebook não puder exibir um elemento, o contato recebe a pergunta em texto, como nos outros canais. Isso pode acontecer, por exemplo, quando o WhatsApp rejeita a mensagem ou não consegue carregar um arquivo de mídia, ou quando os botões no Facebook contêm apenas links, sem respostas.
Na página de configurações de cada ação, uma nota acima do formulário ou do elemento mostra como ele será exibido. Ela lista todos os tipos de canal, inclusive os que você ainda não configurou:
- "Interactive on:" lista os canais em que o contato vê o próprio elemento. A nota chama o Website Messenger de "Website".
- "Shown as a text question on:" lista os canais em que o contato recebe a pergunta em texto simples.
- "Not offered on:" lista os canais em que o Agente de IA não oferece a ação, ou seja, "Phone".
Confira "Interactive on:" antes de salvar a ação, pois depois disso não será possível alterar o elemento. Se ele deve aparecer de forma interativa no WhatsApp, escolha botões, um carrossel ou mídia.
O que preciso saber antes de salvar?
O elemento de uma ação fica definido assim que você a salva. Depois, não é possível transformar um formulário em carrossel nem botões em mídia. Para usar outro elemento, crie uma nova ação.
No momento, não é possível combinar botões, um carrossel ou mídia com campos de formulário. Enquanto o formulário tiver campos, o grupo "Interactive elements" no menu ficará esmaecido, com uma nota abaixo. Antes de salvar, remova os campos; depois de salvar, crie uma nova ação.
Todo o restante continua editável: o nome, os campos "When to trigger this action" e "How to execute this action" e, no caso de um formulário, o título e os campos. Também é possível adicionar, renomear, reordenar e remover campos depois de salvar.
Como criar uma ação da Interface interativa?
No menu Connect AI, abra Actions > "Interactive UI" e clique em "Add". A página de configurações da nova ação "Show interactive element" será aberta imediatamente.
Você também pode criar a ação a partir de um Agente de IA: na aba "Actions" do agente, clique em "Add", escolha a categoria "Interactive UI" na janela "Create a new action" e, em seguida, o cartão "Show interactive element". A mesma página de configurações será aberta; isso não ativa a ação para esse Agente de IA.
Em "Action name", dê à ação um nome claro de até 64 caracteres, pois é assim que o Agente de IA identifica a finalidade dela. O nome deve começar com uma letra de a a z, maiúscula ou minúscula, e terminar com uma letra ou um número; entre elas, também são permitidos números, espaços, hífens e sublinhados, mas não tremas, acentos ou outros caracteres. Caso contrário, o campo exibirá "Only letters, numbers, spaces, hyphens, and underscores are allowed."
Em "When to trigger this action", descreva quando o Agente de IA deve mostrar o elemento em vez de perguntar em texto simples, por exemplo, quando o contato precisa escolher uma data, um horário ou uma entre várias opções.
Se o Agente de IA precisar trabalhar com dados reais, a ação de API ou MCP correspondente já deve existir; as páginas API Actions e MCP explicam como criá-las. Em seguida, descreva em "How to execute this action" de onde vêm os dados e para onde vão as respostas: por exemplo, uma ação que fornece as opções ou os horários disponíveis e outra que salva as respostas do contato. Você também pode definir valores fixos e regras em "How to execute this action". As dicas à direita da página de configurações trazem exemplos para os dois campos.
Se você não indicar uma fonte de dados, o Agente de IA escolherá limites razoáveis por conta própria, como um calendário para os próximos dias. Nesse caso, ele não saberá sua disponibilidade real.
Observe que o Agente de IA pode repassar aos contatos, nas respostas, textos dos campos "When to trigger this action" e "How to execute this action". Uma regra para oferecer apenas datas da sua ação de API é adequada; credenciais, números de telefone internos ou dados de clientes específicos não devem ser incluídos nesses campos.
Como criar um formulário?
Na parte inferior da página de configurações, em "Describe what you need and let AI build it for you", descreva as informações que deseja coletar e clique em "Generate". A interface não dá um nome específico a essa caixa; neste guia, ela é chamada de criador de formulários com IA. Ela ajuda apenas durante a configuração da ação, não durante a conversa.
O criador de formulários com IA adiciona campos correspondentes e os marca como "AI generated". Se o título ainda estiver vazio, também sugere um. Os campos existentes são mantidos, e nenhum campo cujo título já esteja no formulário é adicionado novamente.
Se aparecer a mensagem "Could not build a form from that description. Try naming the details you want to collect.", especifique melhor quais informações você precisa.
A nota acima dos campos mostra em quais canais o formulário aparece de forma interativa, conforme descrito em "On which channels does each element appear?".
Para adicionar campos manualmente, clique em "+ Add element manually" e escolha um tipo de campo. O menu mostra uma breve dica ao lado de cada tipo.
- Datas e horários: "Calendar" para uma única data, "Date range" para uma data inicial e final, "Time slots" para escolher um horário entre várias opções oferecidas
- Opções: "Single choice" quando o contato escolhe uma opção, "Multiple choice" quando pode escolher várias
- Entrada livre: "Text" para uma resposta curta, "Number" para um valor dentro de limites definidos, "Long text" para uma descrição
Cada campo mostra uma prévia com valores de exemplo. Durante a conversa, o Agente de IA preenche as opções, os horários disponíveis, os limites de datas e os intervalos permitidos, conforme as instruções em "How to execute this action".
Clique no título de um campo para alterá-lo. Inicialmente, um campo novo recebe o nome do seu tipo. Dê um título exclusivo a cada campo, pois o contato o verá acima do campo e a resposta aparecerá no Message Center com esse título.
Altere a ordem dos campos arrastando e soltando. Remova um campo pelo ícone da lixeira.
Em "Headline", insira o texto que o contato deve ler acima do formulário inteiro. O título aparece uma vez acima do formulário; o título de cada campo aparece diretamente acima dele.
O título do formulário e os títulos dos campos são exibidos exatamente como você os escreve e não são traduzidos para contatos que falam outros idiomas. Escreva-os no idioma dos seus contatos.
O título do formulário é obrigatório e todos os campos também: não é possível tornar um campo opcional, e o contato só pode enviar o formulário depois de preencher todos os campos.
Se faltar algo ao salvar, a página de configurações informa o motivo:
- "Add at least one field to save this action." aparece quando o formulário ainda não tem campos.
- "Add a headline to save this action." aparece quando o título está vazio.
- "Give this field a title to save this action." aparece em um campo sem título.
- "Another field already uses this title. Give each field its own title." aparece quando dois campos têm o mesmo título, mesmo que a diferença seja apenas entre letras maiúsculas e minúsculas.
Como exibir botões, um carrossel ou mídia?
Clique em "+ Add element manually" e, no grupo "Interactive elements", escolha "Buttons" (Tap to answer), "Carousel" (Swipeable cards) ou "Media" (Image, video or file).
Isso só funciona enquanto o formulário não tiver campos. Enquanto houver campos, o grupo ficará esmaecido com a nota "Interactive elements can’t be combined with form fields yet. Create a separate action for them." Antes de salvar, remova os campos pelo ícone da lixeira para que o grupo possa ser selecionado novamente; depois de salvar, crie uma nova ação.
A página de configurações passará a mostrar o elemento escolhido no lugar do formulário, com uma prévia de conteúdo de exemplo e a nota sobre os canais acima dele. Enquanto a ação não estiver salva, você poderá remover o elemento pelo ícone da lixeira e criar um formulário no lugar.
Em "How to execute this action", descreva o que o Agente de IA deve exibir, por exemplo, quais produtos o carrossel deve apresentar ou quais respostas os botões devem oferecer. Um carrossel tem de 2 a 10 cartões, e os botões podem oferecer até 10 respostas ou links.
O Agente de IA só inclui imagens, vídeos e arquivos por meio de links que começam com https e apenas destas fontes:
- Botões (imagem ou vídeo acima da mensagem): links nas suas instruções, no resultado de outra ação (como uma ação de API) ou na conversa
- Carrossel (imagem ou vídeo em cada cartão): as mesmas fontes que para os botões
- Mídia (o arquivo): links nas suas instruções ou na conversa; para isso, insira o link do arquivo em "How to execute this action"
"Na conversa" significa um link que alguém enviou no chat.
Como ativar e testar a ação no meu Agente de IA?
Clique em "Save" quando o formulário ou o elemento estiver pronto. Uma nova ação não é ativada para nenhum Agente de IA, nem mesmo para aquele em cuja aba "Actions" ela foi criada.
Se você criou a ação em Actions > "Interactive UI", voltará à visão geral. A coluna "Setups" mostra quais Agentes de IA usam a ação; neste contexto, setups são os seus Agentes de IA. Clique em "No setup" e, na janela "Connected setups", selecione os Agentes de IA que devem usar a ação. A coluna passará a mostrar, por exemplo, "1 AI Agent".
Se você criou a ação a partir de um Agente de IA, voltará à aba "Actions" do agente. Ative a ação nessa aba, na coluna "Status".
Para testar, você precisa de um widget do Website Messenger. O botão "Test Agent" só aparece se o Agente de IA tiver um chatbot. Depois de ativar a ação para esse agente, clique em "Test Agent", à direita das abas do Agente de IA, escolha um widget em "Widget" e clique em "Open test conversation".
Na conversa de teste, escreva uma mensagem que corresponda ao texto de "When to trigger this action". Se o elemento não aparecer, verifique se a ação está ativada para o Agente de IA e se o texto em "When to trigger this action" corresponde à sua mensagem.
O teste é executado no Website Messenger. Não é possível usá-lo para testar como o elemento aparece no WhatsApp ou como pergunta em texto.
O que o contato vê no Website Messenger?
No Website Messenger, o elemento aparece diretamente na conversa. O contato preenche um formulário e o envia clicando em "Confirm".
Se faltar uma resposta, o formulário destaca o campo em vermelho, e o contato só pode enviá-lo depois de preencher tudo.
Depois do envio, o formulário mostra as respostas do contato e não pode mais ser alterado.
Se o contato já tiver fornecido uma resposta anteriormente na conversa, o Agente de IA poderá preenchê-la previamente no formulário.
Nos botões e no carrossel, o contato responde tocando em uma opção.
Quando a conversa termina, o contato ainda vê o elemento, mas não pode mais usá-lo.
O que o operador vê no Message Center?
No Message Center, o elemento aparece como uma mensagem do Agente de IA, com a pergunta em texto simples e o rótulo "Interactive element" abaixo dela. Assim que o contato responder pelo elemento, será acrescentado o rótulo "Answered".
A resposta do contato aparece em uma mensagem separada; no caso de um formulário, há uma linha por campo, com o título e a resposta.
E quanto a "Show carousel" e "Show media and buttons"?
Os tipos de ação antigos "Show carousel" e "Show media and buttons", em Actions > "System", têm o rótulo "LEGACY". Eles continuam funcionando, você ainda pode criar ações desse tipo e nada é convertido automaticamente.
Para novas ações, use aqui o elemento "Carousel" em vez de "Show carousel". No lugar de "Show media and buttons", use o elemento "Buttons" ou, para uma imagem, um vídeo ou um arquivo, o elemento "Media" ("Image, video or file"). Ao passar o cursor sobre o rótulo LEGACY, a dica menciona apenas "Buttons" e "Carousel"; para uma imagem, um vídeo ou um arquivo, use "Media".
Os botões podem exibir uma imagem ou um vídeo acima da mensagem, mas não um arquivo. Com a Interface interativa, o Agente de IA mostra apenas um elemento por resposta; portanto, um arquivo e os botões nunca chegam em uma única mensagem. Você precisará de duas ações: uma com "Media" e outra com "Buttons". Já a ação antiga "Show media and buttons" pode enviar um arquivo junto com botões em uma única mensagem e ainda atende a esse caso.
Não ative uma ação antiga e uma nova para a mesma finalidade.
Leia mais sobre o rótulo LEGACY na página System Actions, na seção "What does the LEGACY label mean?".