Telas de chat, formulário e cards em um app PWA

Um aplicativo de atendimento não precisa ser complicado. A maioria dos projetos se resolve combinando poucos tipos de tela, cada um com uma função clara. Entender esses blocos ajuda a planejar um app simples de usar e fácil de manter. Neste artigo, você entenderá os tipos de tela mais comuns e como combiná-los. --- ## 1. Tela de chat É a conversa direta com o agente de IA. Serve para tirar dúvidas, orientar, acompanhar e conduzir etapas, como a qualificação inicial. É a tela mais flexível, pois o usuário escreve com suas próprias palavras. **Quando usar:** como porta de entrada do atendimento e como canal de apoio contínuo. --- ## 2. Tela de diário Permite registrar o dia a dia, como refeições, treinos, sintomas de uso de um serviço ou atividades. O usuário informa, e o agente pode organizar e resumir. **Quando usar:** em acompanhamentos contínuos, em que a regularidade dos registros importa. --- ## 3. Tela de formulário Coleta informações estruturadas, como dados de cadastro ou pesquisas. É útil quando as perguntas têm respostas definidas e precisam ser comparáveis. **Quando usar:** quando a informação é objetiva e não precisa de conversa. --- ## 4. Telas de cartões e conteúdo estruturado Exibem informações organizadas em blocos visuais: planos, resumos, calendários, tabelas e relatórios gerados pelo agente. Ficam disponíveis para consulta posterior, sem depender de rolar a conversa. **Quando usar:** para entregar resultados que o usuário vai consultar mais de uma vez. --- ## 5. Onboarding Um app costuma ter uma etapa inicial de boas-vindas e qualificação, geralmente em formato de chat, em que o agente conduz as primeiras perguntas. É recomendável que exista apenas uma tela com essa função, para manter o fluxo claro. --- ## 6. Princípios para combinar telas - **Poucas telas, bem nomeadas:** o usuário deve entender rápido onde encontrar cada coisa. - **Uma função por tela.** - **Ordem coerente:** onboarding primeiro, depois as telas de uso diário. - **Consistência visual,** com ícones e títulos claros. --- ## 7. Comportamento no agente, aparência no app Lembre-se: o que cada tela faz em termos de conteúdo e regras vem do agente. O app define títulos, ícones, tema e a estrutura das telas. --- ## Conclusão Com chat, diário, formulário e cartões, é possível montar aplicativos completos e fáceis de usar. Planeje as telas pela necessidade do cliente, mantenha a estrutura simples e deixe a inteligência para o agente.