> ## Documentation Index > Fetch the complete documentation index at: https://docs.evo-ai.co/llms.txt > Use this file to discover all available pages before exploring further. # Chat Interface > Interface completa para conversar com seus agentes, acompanhar execuções em tempo real e gerenciar sessões de chat ## Visão Geral A **Interface de Chat** é onde você interage diretamente com seus agentes de IA. Mais do que uma simples conversa, é uma ferramenta completa que permite: * 💬 **Conversar** com qualquer agente criado * 🔍 **Acompanhar execuções** em tempo real (debug) * 📁 **Gerenciar sessões** com organização inteligente * 🎤 **Enviar áudio, texto e mídia** para interação rica * 🏷️ **Organizar conversas** com tags e filtros **Debug em Tempo Real**: Mesmo em agentes complexos (Sequential, Workflow, Loop), você vê cada passo da execução, chamadas de funções e retornos em tempo real, facilitando debugging e otimização. ## Navegando pela Interface de Chat ### Passo 1: Acessando o Chat 1. No menu principal da Evo AI, clique em **"Chat"** 2. Você verá uma interface dividida em duas partes: * **Painel esquerdo**: Lista de todas as sessões de chat * **Área principal**: Chat ativo ou tela inicial 3. Para começar, você pode criar um novo chat ou abrir uma sessão existente Lista de Sessões de Chat A interface salva automaticamente todas as conversas, permitindo que você retome qualquer sessão a qualquer momento. ### Passo 2: Gerenciando Sessões **Painel esquerdo - Todas as suas conversas:** Cada sessão mostra: * **Nome da sessão** (editável) * **Agente utilizado** * **Última mensagem** ou resumo * **Data da conversa** * **Tags** para organização **Funcionalidades da lista:** * 🔍 **Busca rápida** por nome, descrição ou conteúdo * 🏷️ **Filtro por tags** para organizar por projeto/tipo * 🤖 **Filtro por agente** para ver conversas específicas * 📅 **Ordenação** por data, nome ou atividade recente * ✅ **Seleção múltipla** para ações em lote **Como usar os filtros:** **Por Agente:** ``` Dropdown "Agente": Selecione agente específico Resultado: Mostra apenas conversas com aquele agente Exemplo: Filtro por "Assistente Vendas" → Lista apenas chats com esse agente ``` **Por Tags:** ``` Campo "Tags": Digite tag específica Resultado: Mostra sessões marcadas com essa tag Exemplo: Tags "cliente-vip", "suporte", "vendas" → Organização por categoria de atendimento ``` **Por Texto:** ``` Campo "Buscar": Digite palavra-chave Resultado: Busca em nomes, descrições e conteúdo Exemplo: Busca por "notebook" → Encontra todas as conversas sobre notebooks ``` **Combinação de filtros:** * Use múltiplos filtros simultaneamente * Refine resultados progressivamente * Salve filtros frequentes mentalmente **Como selecionar múltiplas sessões:** 1. **Marque as checkboxes** ao lado de cada sessão desejada 2. **Barra de ações** aparece no topo quando há seleção 3. **Selecionar tudo**: Checkbox geral para marcar todas visíveis Sessões Selecionadas **Ações em lote disponíveis:** **🗑️ Deletar Selecionadas:** * Remove múltiplas sessões de uma vez * Confirma antes de deletar permanentemente * Útil para limpeza periódica **🏷️ Adicionar Tags:** * Aplica tags a múltiplas sessões * Organiza conversas por projeto/cliente * Facilita filtros futuros **📁 Mover para Pasta:** (se disponível) * Organiza em categorias * Separa por cliente, projeto, tipo **💡 Dica:** Use seleção múltipla para organizar sessões antigas, aplicar tags em lote ou fazer limpeza de conversas teste. ### Passo 3: Criando Nova Sessão **Como criar uma nova conversa:** 1. Clique em **"New Chat"** no painel esquerdo 2. **Selecione o agente** que deseja usar na conversa 3. **Configure nome da sessão** (opcional, pode alterar depois) 4. **Adicione tags** para organização (opcional) 5. Clique em **"Criar"** para iniciar Criando Novo Chat **Configurações iniciais:** ``` Nome da Sessão: "Atendimento Cliente João - Notebooks" Agente: assistente_vendas_tech Tags: cliente-joao, vendas, notebook, 2024 Resultado: Chat organizado e fácil de encontrar depois ``` **Boas práticas para nomes:** * Use padrão consistente: "Tipo - Cliente - Assunto" * Inclua data se relevante: "Suporte-15Jan-ProblemaLogin" * Seja descritivo: "Demo-Produto-Cliente-ABC" * Evite nomes genéricos: "Chat 1", "Teste" ### Passo 4: Editando Informações da Sessão **Acessando opções de edição:** 1. **Na lista de sessões**: Clique no ícone de **"Editar"** (✏️) ao lado da sessão 2. **Ou dentro do chat**: Menu de opções da sessão 3. **Formulário de edição** abre com campos editáveis Editando Dados do Chat **Campos editáveis:** **Nome da Sessão:** * Altere para algo mais descritivo * Útil quando conversa evoluiu para assunto diferente * Ajuda na busca futura **Descrição:** * Resumo do que foi discutido * Detalhes importantes da conversa * Resultados ou próximos passos **Tags:** * Adicione novas tags conforme conversa evolui * Remova tags irrelevantes * Use tags para status: "resolvido", "pendente", "follow-up" **Agente:** (se permitido) * Troque agente durante conversa * Útil para escalar para especialista **Exemplo de organização:** ``` Antes: "Chat 1" Depois: "Cliente João - Compra Notebook Gaming" Tags: cliente-joao, vendas, notebook, gaming, orçamento-5k Descrição: "Cliente interessado em notebook gaming até R$ 5.000. Demonstrou interesse no modelo X. Aguardando proposta." ``` ## Conversando com os Agentes ### Tipos de Entrada **Entrada padrão mais comum:** * Digite sua mensagem na caixa de texto * Pressione **Enter** para enviar * **Shift + Enter** para quebra de linha * Suporta texto longo e formatação simples **Dicas para melhores resultados:** ``` ✅ Seja específico: "Preciso de notebook para design gráfico, orçamento R$ 4000" ❌ Muito genérico: "Quero um computador" ✅ Forneça contexto: "Sou fotógrafo e preciso editar RAW de 50MB" ❌ Sem contexto: "O que é melhor?" ✅ Inclua preferências: "Prefiro marcas nacionais com boa garantia" ❌ Sem direcionamento: "Me ajude a escolher" ``` **Anexar arquivos e imagens:** **Formatos suportados:** * 🖼️ **Imagens**: PNG, JPG, JPEG, GIF, WebP * 📄 **Documentos**: PDF, DOC, DOCX, TXT * 📊 **Planilhas**: XLS, XLSX, CSV * 🎵 **Áudio**: MP3, WAV, M4A, OGG **Como enviar:** 1. Clique no ícone de **"Anexar"** (📎) 2. **Selecione arquivo** do seu computador 3. **Ou arraste e solte** diretamente no chat 4. **Aguarde upload** e processamento 5. **Adicione texto** explicativo se necessário **Casos de uso:** ``` 📷 Foto de produto com defeito para suporte 📄 Contrato para análise jurídica 📊 Planilha de dados para análise 🖼️ Design para feedback ``` **Modelos que suportam mídia:** * GPT-4 Vision: Análise de imagens * Gemini Pro Vision: Multimodal completo * Claude 3: Documentos e imagens **Funcionalidade de voz:** **Como gravar:** 1. Clique no ícone de **"Microfone"** (🎤) 2. **Permita acesso** ao microfone se solicitado 3. **Fale sua mensagem** - indicador mostra gravação ativa 4. **Clique novamente** para parar gravação 5. **Áudio é enviado** automaticamente **⚠️ Importante - Para áudio funcionar:** **Opção 1: Modelo que aceita áudio** ``` Use modelos nativos com suporte a áudio: - Whisper (OpenAI) - especializado em transcrição - Gemini Pro - multimodal com áudio - Modelos específicos de cada provider ``` **Opção 2: Tool Speech to Text** ``` Configure tool speech_to_text no agente: 1. Vá em configurações do agente LLM 2. Seção "Tools" → Adicione "Speech to Text" 3. Configure provider (OpenAI, Groq, Google) 4. Agente converte áudio → texto → processa ``` **Qualidade do áudio:** * Ambiente silencioso para melhor transcrição * Fale claramente e em ritmo normal * Evite ruídos de fundo * Teste com frases curtas primeiro **Casos de uso:** ``` 🎤 Reportar problema detalhado por voz 🗣️ Fazer pedido complexo falando 🎙️ Entrevista ou coleta de feedback 📞 Simular atendimento telefônico ``` ### Debug e Acompanhamento em Tempo Real **O chat como ferramenta de debug:** A interface de chat não é apenas para conversar - é uma **ferramenta completa de debug** que mostra tudo que acontece "nos bastidores" da execução do agente. **O que você vê em tempo real:** * 🔄 **Cada passo da execução** em agentes Sequential * 🌐 **Chamadas para APIs** e ferramentas externas * 🤖 **Decisões do LLM** e raciocínio * ⚙️ **Execução de workflows** passo a passo * 🔁 **Iterações de Loop Agents** * 📞 **Chamadas de funções** e retornos * ⏱️ **Tempos de execução** de cada etapa **Acompanhando execução sequencial:** **Exemplo: Agente de vendas com 3 sub-agentes** ``` 🚀 Iniciando execução... 📍 Passo 1: Qualificador de Leads ├── Analisando necessidades do cliente... ├── Identificando orçamento: R$ 5.000 ├── Detectando urgência: Média └── ✅ Qualificação concluída 📍 Passo 2: Demonstrador de Produtos ├── Consultando base de produtos... ├── Filtrando por orçamento R$ 5.000 ├── Selecionando 3 opções adequadas └── ✅ Demonstração concluída 📍 Passo 3: Especialista em Fechamento ├── Analisando dados da qualificação ├── Criando proposta personalizada ├── Adicionando senso de urgência └── ✅ Proposta final gerada 🎯 Execução finalizada em 8.2s ``` **Informações visíveis:** * Status de cada sub-agente * Tempo gasto em cada etapa * Dados passados entre agentes * Erros ou falhas (se houver) **Acompanhando fluxos complexos:** **Exemplo: Workflow de aprovação de proposta** ``` 🔄 Workflow: Análise de Proposta 🟦 Node: Receber Dados ├── Input: Proposta comercial recebida ├── Validando formato... └── ✅ Dados válidos 🟦 Node: Agente Revisor ├── Executando análise de conteúdo... ├── Verificando valores e termos... ├── Score de qualidade: 8.5/10 └── ✅ Revisão aprovada 🔷 Node: Condição (Score > 8.0?) ├── Avaliando: 8.5 > 8.0 ├── Resultado: TRUE └── ➡️ Seguindo para aprovação 🟦 Node: Aprovação Automática ├── Gerando contrato final... ├── Aplicando templates... └── ✅ Contrato gerado ⏸️ Node: Delay (5 segundos) ├── Aguardando processamento... └── ✅ Delay concluído 💬 Node: Mensagem Final └── ✅ "Proposta aprovada e contrato enviado!" ``` **Detalhes mostrados:** * Tipo de cada node (Agent, Condition, Message, Delay) * Dados fluindo entre nodes * Decisões de condicionais * Tempo de delays * Erros em qualquer ponto **Acompanhando iterações:** **Exemplo: Loop de refinamento de conteúdo** ``` 🔁 Loop Agent: Refinador de Conteúdo === ITERAÇÃO 1 === 📝 Gerador: Criando conteúdo inicial ├── Baseado no pedido do usuário ├── Gerando primeira versão... └── ✅ Conteúdo v1 criado 📊 Analisador: Avaliando qualidade ├── Score clareza: 6.5/10 ├── Score persuasão: 7.0/10 ├── Score geral: 6.8/10 └── ❌ Abaixo do threshold (8.0) === ITERAÇÃO 2 === 📝 Gerador: Refinando conteúdo ├── Aplicando feedback da análise ├── Melhorando clareza... └── ✅ Conteúdo v2 criado 📊 Analisador: Reavaliando ├── Score clareza: 8.2/10 ├── Score persuasão: 8.5/10 ├── Score geral: 8.4/10 └── ✅ Acima do threshold! 🛑 Verificador: Usando exit_loop() └── ✅ Loop finalizado 📋 Finalizador: Gerando resposta final └── ✅ Resultado consolidado ``` **Visibilidade completa:** * Número da iteração atual * Progresso de cada sub-agente * Métricas de qualidade * Condições de parada * Momento exato do exit\_loop **Monitorando tools e APIs:** **Exemplo: Agente usando ferramentas externas** ``` 🔧 Chamada de Função: load_knowledge ├── Parâmetros: {"query": "garantia notebook", "tags": ["suporte"]} ├── Buscando na knowledge base... ├── Resultado: 3 chunks encontrados └── ✅ Conhecimento carregado 🔧 Chamada de Função: get_product_info ├── Parâmetros: {"product_id": "NB001", "include_price": true} ├── Consultando API de produtos... ├── Status: 200 OK ├── Dados: {"name": "Notebook Pro", "price": 4500, "stock": 12} └── ✅ Produto encontrado 🔧 Chamada de Função: send_email ├── Parâmetros: {"to": "cliente@email.com", "subject": "Proposta"} ├── Conectando com servidor SMTP... ├── Status: Email enviado └── ✅ Comunicação realizada ``` **Informações detalhadas:** * Nome da função chamada * Parâmetros enviados * Status da execução * Dados retornados * Tempo de resposta * Erros (se houver) **Vantagens para debugging:** * Identifica gargalos de performance * Detecta falhas em integrações * Valida parâmetros enviados * Confirma retornos esperados ## Gerenciamento Avançado de Sessões ### Organização e Produtividade **Estratégias de organização:** **Por cliente:** ``` cliente-joao, cliente-empresa-abc, cliente-vip → Facilita localizar conversas específicas ``` **Por tipo de atendimento:** ``` vendas, suporte, onboarding, demo, follow-up → Organiza por categoria de atividade ``` **Por status:** ``` pendente, resolvido, aguardando-cliente, escalado → Controla workflow de atendimento ``` **Por produto/serviço:** ``` notebook, smartphone, software, consultoria → Segmenta por área de negócio ``` **Por prioridade:** ``` urgente, alta, media, baixa → Prioriza atendimentos ``` **Combinações úteis:** ``` Exemplo: "cliente-vip + vendas + notebook + urgente" → Cliente VIP com demanda urgente de notebook ``` **Técnicas de busca eficiente:** **Busca por conteúdo:** ``` Digite palavras-chave do que foi discutido: "problema login", "orçamento 5000", "garantia" ``` **Busca por resultados:** ``` "proposta enviada", "problema resolvido", "compra realizada" ``` **Busca por datas:** ``` Use filtros de data para período específico "última semana", "dezembro 2024" ``` **Combinação de filtros:** ``` Agente: assistente_vendas Tag: cliente-vip Busca: "notebook gaming" → Conversas VIP sobre notebooks gaming ``` **Extraindo insights das conversas:** **Padrões de atendimento:** * Quais agentes são mais usados? * Que tipos de dúvidas são mais comuns? * Qual horário de maior atividade? **Performance dos agentes:** * Conversas que geraram vendas * Problemas resolvidos com sucesso * Tempo médio de resolução **Evolução do cliente:** * Histórico completo de interações * Preferências identificadas ao longo do tempo * Produtos ou serviços de interesse **Oportunidades:** * Clientes com potencial não explorado * Problemas recorrentes para melhorar * Agentes que precisam de ajustes ## Melhores Práticas **Para melhores resultados:** **Preparação:** * Escolha o agente certo para cada tipo de conversa * Configure nome e tags descritivas desde o início * Tenha contexto claro do que quer alcançar **Durante a conversa:** * Seja específico e forneça contexto adequado * Use mídia quando apropriado (imagens, documentos) * Acompanhe o debug para entender o raciocínio * Faça perguntas de follow-up para aprofundar **Após a conversa:** * Atualize tags baseado no que foi discutido * Adicione descrição resumindo resultados * Marque status (resolvido, pendente, etc.) * Documente próximos passos se necessário **Cuidados importantes:** **Informações sensíveis:** * Evite compartilhar dados pessoais desnecessários * Use códigos ou iniciais quando possível * Considere implicações de privacidade **Organização segura:** * Use tags que não exponham informações confidenciais * Seja criterioso com nomes de sessões * Faça limpeza periódica de conversas antigas * Configure retenção adequada de dados **Backup e continuidade:** * Exporte conversas importantes se necessário * Documente insights valiosos externamente * Mantenha histórico de decisões importantes **Compartilhando conhecimento:** **Padronização:** * Use convenções consistentes de nomenclatura * Defina padrão de tags para a equipe * Documente boas práticas da organização **Colaboração:** * Compartilhe sessões relevantes quando apropriado * Use tags de status para coordenação * Documente aprendizados para reutilização **Treinamento:** * Use conversas de exemplo para treinar novos usuários * Analise conversas bem-sucedidas para replicar * Identifique padrões de sucesso ## Resolução de Problemas **1. Áudio não funciona:** * ✅ Verifique permissões do microfone no navegador * ✅ Configure tool speech\_to\_text no agente se modelo não suporta áudio nativo * ✅ Teste com frase curta primeiro * ✅ Verifique se provider de speech\_to\_text está configurado **2. Upload de mídia falha:** * ✅ Verifique tamanho do arquivo (limites por tipo) * ✅ Confirme formato suportado * ✅ Teste conexão de internet * ✅ Tente arquivo menor para testar **3. Agente não responde como esperado:** * ✅ Use funcionalidade de debug para entender execução * ✅ Verifique se agente está configurado corretamente * ✅ Seja mais específico na pergunta * ✅ Forneça mais contexto sobre o que precisa **4. Busca não encontra conversas:** * ✅ Experimente palavras-chave diferentes * ✅ Verifique filtros ativos * ✅ Use tags em vez de busca por texto * ✅ Ajuste período de data se aplicável **5. Performance lenta:** * ✅ Limite número de sessões carregadas * ✅ Use filtros para reduzir lista * ✅ Faça limpeza de sessões antigas * ✅ Verifique conexão de internet ## Próximos Passos Crie e configure agentes para suas conversas Configure base de conhecimento para agentes mais precisos Entenda debug de workflows complexos Configure ferramentas e integrações *** 💬 **Agora você domina a interface de chat!** Use essas funcionalidades para ter conversas produtivas, debugar agentes complexos e organizar seu histórico de forma eficiente!