🎓 Aula 03 – Agente de Vendas com IA Gratuita
🎓 Aula 03 – Agente de Vendas com IA Gratuita
Agentes
Voltar para página principal do blog
Todas as aulas desse curso
Aula 02 Aula 04
Redes Sociais do Código Fluente:
Scarlett Finch
Scarlett Finch é uma influenciadora virtual criada com IA.
Ela é 🎤 cantora e 🎶compositora pop britânica.
Siga a Scarlett Finch no Instagram:
Conecte-se comigo!
LinkedIn: Fique à vontade para me adicionar no LinkedIn.
Ao conectar-se comigo, você terá acesso a atualizações regulares sobre desenvolvimento web, insights profissionais e oportunidades de networking no setor de tecnologia.
GitHub: Siga-me no GitHub para ficar por dentro dos meus projetos mais recentes, colaborar em código aberto ou simplesmente explorar os repositórios que eu contribuo, o que pode ajudar você a aprender mais sobre programação e desenvolvimento de software.
Recursos e Afiliados
Explorando os recursos abaixo, você ajuda a apoiar nosso site.
Somos parceiros afiliados das seguintes plataformas:
- https://heygen.com/ – Eleve a produção de seus vídeos com HeyGen! Com esta plataforma inovadora, você pode criar vídeos envolventes utilizando avatares personalizados, ideal para quem busca impactar e conectar com audiências em todo o mundo. HeyGen transforma a maneira como você cria conteúdo, oferecendo ferramentas fáceis de usar para produzir vídeos educativos, demonstrações de produtos e muito mais. Descubra o poder de comunicar através de avatares interativos e traga uma nova dimensão para seus projetos. Experimente HeyGen agora e revolucione sua forma de criar vídeos!
- letsrecast.ai – Redefina a maneira como você consome artigos com Recast. Esta plataforma transforma artigos longos em diálogos de áudio que são informativos, divertidos e fáceis de entender. Ideal para quem está sempre em movimento ou busca uma forma mais conveniente de se manter informado. Experimente Recast agora.
- dupdub.com – Explore o universo do marketing digital com DupDub. Esta plataforma oferece ferramentas inovadoras e soluções personalizadas para elevar a sua estratégia de marketing online. Ideal para empresas que buscam aumentar sua visibilidade e eficiência em campanhas digitais. Descubra mais sobre DupDub.
- DeepBrain AI Studios – Revolucione a criação de conteúdo com a tecnologia de inteligência artificial da DeepBrain AI Studios. Esta plataforma avançada permite que você crie vídeos interativos e apresentações utilizando avatares digitais gerados por IA, que podem simular conversas reais e interações humanas. Perfeito para educadores, criadores de conteúdo e empresas que querem inovar em suas comunicações digitais. Explore DeepBrain AI Studios.
- Audyo.ai – Transforme a maneira como você interage com conteúdo auditivo com Audyo.ai. Esta plataforma inovadora utiliza inteligência artificial para criar experiências de áudio personalizadas, melhorando a acessibilidade e a compreensão de informações através de podcasts, transcrições automáticas e síntese de voz avançada. Ideal para profissionais de mídia, educadores e qualquer pessoa que deseje acessar informações auditivas de maneira mais eficiente e envolvente. Descubra Audyo.ai e suas possibilidades.
- Acoust.io – Transforme sua produção de áudio com Acoust.io. Esta plataforma inovadora fornece uma suite completa de ferramentas para criação, edição e distribuição de áudio, ideal para artistas, produtores e empresas de mídia em busca de excelência e inovação sonora. Acoust.io simplifica o processo de levar suas ideias à realidade, oferecendo soluções de alta qualidade que elevam seus projetos de áudio. Experimente Acoust.io agora e descubra um novo patamar de possibilidades para seu conteúdo sonoro.
- Hostinger – Hospedagem web acessível e confiável. Ideal para quem busca soluções de hospedagem de sites com excelente custo-benefício e suporte ao cliente robusto. Saiba mais sobre a Hostinger.
- Digital Ocean – Infraestrutura de nuvem para desenvolvedores. Oferece uma plataforma de nuvem confiável e escalável projetada especificamente para desenvolvedores que precisam de servidores virtuais, armazenamento e networking. Explore a Digital Ocean.
- One.com – Soluções simples e poderosas para o seu site. Uma escolha ideal para quem busca registrar domínios, hospedar sites ou criar presença online com facilidade e eficiência. Visite One.com.
Educação e Networking
Amplie suas habilidades e sua rede participando de cursos gratuitos e comunidades de desenvolvedores:
- Digital Innovation One – Cursos gratuitos com certificado.
- Workover – Aprenda Python3 gratuitamente.
- Comunidades de desenvolvedores para networking:
Canais do Youtube
Explore nossos canais no YouTube para uma variedade de conteúdos educativos e de entretenimento, cada um com um foco único para enriquecer sua experiência de aprendizado e lazer.
Toti
Toti: Meu canal pessoal, onde posto clips artesanais de músicas que curto tocar, dicas de teoria musical, entre outras coisas.
Scarlett Finch
Scarlett Finch: Cantora e influenciadora criada com IA.
Lofi Music Zone Beats
Lofi Music Zone Beats: O melhor da música Lofi para estudo, trabalho e relaxamento, criando o ambiente perfeito para sua concentração.
Backing Track / Play-Along
Backing Track / Play-Along: Acompanhe faixas instrumentais para prática musical, ideal para músicos que desejam aprimorar suas habilidades.
Código Fluente
Código Fluente: Aulas gratuitas de programação, devops, IA, entre outras coisas.
Putz!
Putz!: Canal da banda Putz!, uma banda virtual, criada durante a pandemia com mais 3 amigos, Fábio, Tatá e Lula.
PIX para doações
PIX Nubank
🎓 Aula 03 – Agente de Vendas com IA Gratuita
Código da aula: Github
🧭 Introdução
Nesta aula, vamos criar um agente especialista em vendas para um produto digital – o livro NeuroZen – Guia da Mente Criativa com IA – e integrá-lo diretamente em uma landing page simples, usando apenas HTML, JavaScript, CSS e uma API de LLM (modelo de linguagem).
Esse agente será capaz de responder dúvidas sobre o conteúdo do livro, além de atuar ativamente como um vendedor inteligente, aplicando técnicas de persuasão, gatilhos mentais (como escassez, urgência, autoridade e prova social) para incentivar os visitantes a comprar o livro.
Também adicionaremos um formulário simples para captar e-mails dos interessados, armazenando-os automaticamente numa planilha do Google Sheets via Google Apps Script, tudo sem backend ou infraestrutura complexa.
⚡ Por que optar por uma solução simples?
Nosso objetivo neste tutorial é ensinar os conceitos práticos de inteligência coletiva e sistemas multi-agentes de maneira clara, acessível e progressiva.
Por isso, vamos evitar:
- Uso de servidores backend
- Banco de dados ou armazenamento persistente complexo
- Técnicas avançadas como RAG (Retrieval-Augmented Generation)
- Infraestrutura ou hospedagem complicada
✅ O que vamos criar nesta aula
- Um agente especialista em vendas focado no livro NeuroZen – Guia da Mente Criativa com IA
- Integração direta desse agente numa landing page HTML com JavaScript puro
- Uso de uma LLM acessada via API (OpenRouter, Groq ou Together.ai)
- Treinamento do agente via prompt com o conteúdo do livro e técnicas de vendas
- Formulário integrado ao Google Sheets para captura automática de leads
📚 O Agente Especialista em Vendas (NeuroZen – Guia da Mente Criativa com IA)
O agente será treinado com um prompt específico, abordando não apenas o conteúdo do livro NeuroZen, mas também estratégias e técnicas de vendas como:
- Gatilho mental da escassez (“últimas unidades disponíveis”)
- Urgência (“promoção limitada”)
- Autoridade (“baseado em pesquisas científicas comprovadas”)
- Prova social (“centenas de leitores satisfeitos”)
O prompt será enviado em cada interação com o usuário através da API da LLM, garantindo respostas consistentes e efetivas do agente.
🎯 Exemplo do prompt de sistema do agente vendedor:
js/agent.js
export const agentPrompt = `
Você é Rafa, da equipe do NeuroZen. Fale de forma amigável, natural e levemente descontraída, como um brasileiro simpático explicando um produto que conhece bem.
## LIVRO: NeuroZen - Guia da Mente Criativa com IA
- Autor: Dr. Alexandre Neural
- 280 páginas, PDF + EPUB
- Preço: R$ 97 → HOJE: R$ 47 (promoção limitada)
- 8 capítulos práticos sobre criatividade + IA
## PRINCIPAIS BENEFÍCIOS:
- Aumenta velocidade criativa em 300%
- 15 técnicas para destravar bloqueios
- Funciona com IAs gratuitas (ChatGPT, Claude)
- Técnica dos "5 Cérebros Artificiais"
- 500+ prompts criativos inclusos
- Masterclass 2h + comunidade VIP
- Garantia 30 dias
## DEPOIMENTOS:
"Criei mais em 30 dias que no ano todo!" - Ana Silva, Designer
"Agência aumentou 400% faturamento" - Carlos Mendonça
"Indispensável para criativos" - Mariana Costa
## COMO VOCÊ DEVE FALAR:
### LINGUAGEM NATURAL BRASILEIRA:
- Use ocasionalmente: "cara", "olha", "nossa"
- Use: "legal", "bacana", "show", "muito bom"
- Use: "tá", "né", "pra", "que nem"
- Seja amigável mas não exagerado
- Mantenha naturalidade sem forçar gírias
### FORMATO DAS RESPOSTAS:
- Responda em 1-2 mensagens curtas
- Máximo 2-3 frases por mensagem
- NUNCA use asteriscos (*) ou formatação
- Seja entusiasta mas profissional
- Use emojis muito raramente
### EXEMPLOS DE COMO RESPONDER:
Se perguntarem sobre conteúdo:
"Nossa, o NeuroZen é muito bom mesmo! Ele ensina desde como funciona a criatividade no cérebro até técnicas práticas com IA."
"O que eu acho mais interessante é a Técnica dos 5 Cérebros Artificiais - você conversa com 5 personalidades diferentes de IA pra gerar ideias."
Se perguntarem sobre preço:
"Olha, o preço normal é R$ 97, mas hoje tem uma promoção especial por R$ 47."
"Pelo que vem incluso vale muito a pena! Livro completo, 500 prompts, masterclass, comunidade VIP..."
Se perguntarem sobre funcionamento:
"Fica tranquilo, o livro é feito justamente pra quem está começando com IA."
"O Dr. Alexandre explica tudo de forma bem didática, sem complicação."
## REGRAS IMPORTANTES:
❌ NUNCA responda tudo de uma vez
❌ NUNCA use listas com asteriscos
❌ NUNCA seja muito formal ou muito gíria
✅ SEMPRE quebre em mensagens pequenas
✅ SEMPRE seja natural e amigável
✅ SEMPRE mantenha equilíbrio entre profissional e descontraído
`;
📂 Estrutura dos Arquivos
O projeto terá nove arquivos principais organizados da seguinte forma:
🏠 Páginas HTML:
- index.html: página principal com chat e formulário de cadastro
- thanks.html: página de agradecimento após cadastro no e-mail
- terms-of-use.html: termos de uso e condições de serviço
- privacy-policy.html: política de privacidade e proteção de dados
🎨 Estilização:
- styles.css: arquivo único que estiliza todas as páginas HTML
⚙️ Funcionalidades JavaScript:
- chat.js: comunicação com a API da LLM e controle do chat
- agent.js: definição do prompt e comportamento do agente vendedor
- ui.js: controle visual e feedback das mensagens do chat
- form.js: captura e salva os e-mails no Google Sheets
📁 Estrutura de Pastas:
neurozen-website/
├── index.html
├── thanks.html
├── terms-of-use.html
├── privacy-policy.html
├── styles.css
├── js/
│ ├── chat.js
│ ├── agent.js
│ ├── ui.js
│ └── form.js
└── images/
└── book-cover.png
🔗 Conexões entre Arquivos:
- Todas as páginas HTML usam o mesmo styles.css
- Apenas o index.html carrega os arquivos JavaScript
- Navegação consistente entre todas as páginas
- Design unificado em todo o projeto
O js/agent.js foi mostrado acima.
Vamos aos outros arquivos.
index.html
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>NeuroZen - Guia da Mente Criativa com IA</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header>
<nav>
<div class="logo">NeuroZen</div>
<ul class="nav-links">
<li><a href="index.html">Início</a></li>
<li><a href="terms-of-use.html">Termos de Uso</a></li>
<li><a href="privacy-policy.html">Privacidade</a></li>
<li><a href="thanks.html">Obrigado</a></li>
</ul>
</nav>
</header>
<section class="hero">
<div class="hero-content">
<div class="text">
<h1>NeuroZen</h1>
<p>
O guia essencial para liberar o poder da sua mente criativa com
Inteligência Artificial.
</p>
<form id="email-form">
<input
type="email"
name="entry.YOUR_EMAIL_ENTRY_ID"
placeholder="Seu melhor e-mail"
required
/>
<button type="submit">Quero receber novidades</button>
</form>
</div>
<div class="cover">
<img
class="animated-book"
src="images/book-cover.png"
alt="Capa do livro NeuroZen"
/>
</div>
</div>
</section>
<section class="testimonials">
<h2>O que dizem sobre o livro</h2>
<div class="testimonial-cards">
<div class="card">
<p>
"completamente minha forma de pensar criatividade com IA!"
</p>
<span>Juliana M.</span>
</div>
<div class="card">
<p>"verdadeiro desbloqueio mental criativo."</p>
<span>Pedro L.</span>
</div>
<div class="card">
<p>
"melhor conteúdo que já li sobre mente criativa e inteligência
artificial."
</p>
<span>Carla V.</span>
</div>
</div>
</section>
<section id="chat-area" class="chat-section">
<h2>Tem dúvidas sobre o livro?</h2>
<h2>💬 Converse com nosso especialista</h2>
<div id="chat-window">
<div id="chat-messages">
</div>
<div id="chat-input">
<input
type="text"
id="user-input"
placeholder="Digite sua mensagem aqui..."
required
/>
<button id="send-btn">Enviar</button>
</div>
</div>
</section>
<footer>
<p>© 2025 NeuroZen. Todos os direitos reservados.</p>
</footer>
<script type="module" src="js/agent.js"></script>
<script type="module" src="js/ui.js"></script>
<script type="module" src="js/chat.js"></script>
<script type="module" src="js/form.js"></script>
</body>
</html>
privacy-policy.html
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Política de Privacidade - NeuroZen</title>
<link rel="stylesheet" href="styles.css">
<style>
.content-page {
max-width: 800px;
margin: 0 auto;
padding: 4rem 2rem;
background: #fff;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
margin-top: 2rem;
margin-bottom: 2rem;
}
.content-page h1 {
font-size: 2.5rem;
color: #0d1117;
margin-bottom: 1rem;
text-align: center;
}
.content-page h2 {
font-size: 1.5rem;
color: #2563eb;
margin-top: 2rem;
margin-bottom: 1rem;
border-bottom: 2px solid #e2e8f0;
padding-bottom: 0.5rem;
}
.content-page p {
margin-bottom: 1rem;
line-height: 1.7;
color: #475569;
}
.content-page ul {
margin-bottom: 1rem;
padding-left: 2rem;
}
.content-page li {
margin-bottom: 0.5rem;
color: #475569;
}
.last-updated {
text-align: center;
color: #64748b;
font-style: italic;
margin-bottom: 2rem;
}
.page-wrapper {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
min-height: calc(100vh - 140px);
}
</style>
</head>
<body>
<header>
<nav>
<div class="logo">NeuroZen</div>
<ul class="nav-links">
<li><a href="index.html">Início</a></li>
<li><a href="terms-of-use.html">Termos de Uso</a></li>
<li><a href="privacy-policy.html">Privacidade</a></li>
<li><a href="thanks.html">Obrigado</a></li>
</ul>
</nav>
</header>
<div class="page-wrapper">
<div class="content-page">
<h1>Política de Privacidade</h1>
<p class="last-updated">Última atualização: 26 de julho de 2025</p>
<h2>1. Informações que Coletamos</h2>
<p>Coletamos as seguintes informações quando você utiliza nossos serviços:</p>
<ul>
<li><strong>Informações fornecidas voluntariamente:</strong> Como seu endereço de e-mail quando você se inscreve para receber novidades sobre o NeuroZen</li>
<li><strong>Informações de uso:</strong> Dados sobre como você navega em nosso site, incluindo páginas visitadas e tempo de permanência</li>
<li><strong>Informações técnicas:</strong> Endereço IP, tipo de navegador, sistema operacional e informações do dispositivo</li>
</ul>
<h2>2. Como Usamos Suas Informações</h2>
<p>Utilizamos suas informações pessoais para:</p>
<ul>
<li>Enviar novidades e atualizações sobre o livro NeuroZen</li>
<li>Melhorar nossos serviços e experiência do usuário</li>
<li>Responder às suas dúvidas e solicitações</li>
<li>Cumprir obrigações legais e regulamentares</li>
</ul>
<h2>3. Compartilhamento de Informações</h2>
<p>Não vendemos, alugamos ou compartilhamos suas informações pessoais com terceiros, exceto:</p>
<ul>
<li>Quando necessário para prestação de serviços (ex: plataformas de e-mail)</li>
<li>Para cumprir obrigações legais</li>
<li>Com seu consentimento explícito</li>
</ul>
<h2>4. Segurança dos Dados</h2>
<p>Implementamos medidas de segurança adequadas para proteger suas informações pessoais contra acesso não autorizado, alteração, divulgação ou destruição. Isso inclui:</p>
<ul>
<li>Criptografia de dados em trânsito e em repouso</li>
<li>Controles de acesso rigorosos</li>
<li>Monitoramento regular de segurança</li>
</ul>
<h2>5. Seus Direitos</h2>
<p>De acordo com a LGPD, você tem os seguintes direitos:</p>
<ul>
<li>Acesso aos seus dados pessoais</li>
<li>Correção de dados incompletos ou desatualizados</li>
<li>Eliminação dos seus dados pessoais</li>
<li>Portabilidade dos dados</li>
<li>Revogação do consentimento</li>
</ul>
<h2>6. Retenção de Dados</h2>
<p>Mantemos suas informações pessoais apenas pelo tempo necessário para cumprir as finalidades descritas nesta política, salvo quando a retenção for exigida por lei.</p>
<h2>7. Cookies</h2>
<p>Utilizamos cookies para melhorar sua experiência em nosso site. Você pode gerenciar suas preferências de cookies através das configurações do seu navegador.</p>
<h2>8. Alterações nesta Política</h2>
<p>Podemos atualizar esta Política de Privacidade periodicamente. Notificaremos sobre mudanças significativas através do nosso site ou por e-mail.</p>
<h2>9. Contato</h2>
<p>Se você tiver dúvidas sobre esta Política de Privacidade ou quiser exercer seus direitos, entre em contato conosco:</p>
<ul>
<li><strong>E-mail:</strong>neurozenbook@gmail.com</li>
<li><strong>Endereço:</strong>[Seu endereço completo]</li>
</ul>
</div>
</div>
<footer>
<p>© 2025 NeuroZen. Todos os direitos reservados.</p>
</footer>
</body>
</html>terms-of-use.html
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Termos de Uso - NeuroZen</title>
<link rel="stylesheet" href="styles.css">
<style>
.content-page {
max-width: 800px;
margin: 0 auto;
padding: 4rem 2rem;
background: #fff;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
margin-top: 2rem;
margin-bottom: 2rem;
}
.content-page h1 {
font-size: 2.5rem;
color: #0d1117;
margin-bottom: 1rem;
text-align: center;
}
.content-page h2 {
font-size: 1.5rem;
color: #2563eb;
margin-top: 2rem;
margin-bottom: 1rem;
border-bottom: 2px solid #e2e8f0;
padding-bottom: 0.5rem;
}
.content-page p {
margin-bottom: 1rem;
line-height: 1.7;
color: #475569;
}
.content-page ul {
margin-bottom: 1rem;
padding-left: 2rem;
}
.content-page li {
margin-bottom: 0.5rem;
color: #475569;
}
.last-updated {
text-align: center;
color: #64748b;
font-style: italic;
margin-bottom: 2rem;
}
.page-wrapper {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
min-height: calc(100vh - 140px);
}
</style>
</head>
<body>
<header>
<nav>
<div class="logo">NeuroZen</div>
<ul class="nav-links">
<li><a href="index.html">Início</a></li>
<li><a href="terms-of-use.html">Termos de Uso</a></li>
<li><a href="privacy-policy.html">Privacidade</a></li>
<li><a href="thanks.html">Obrigado</a></li>
</ul>
</nav>
</header>
<div class="page-wrapper">
<div class="content-page">
<h1>Termos de Uso</h1>
<p class="last-updated">Última atualização: 26 de julho de 2025</p>
<h2>1. Aceitação dos Termos</h2>
<p>Ao acessar e usar este site, você aceita e concorda em cumprir os termos e condições estabelecidos neste documento. Se você não concordar com qualquer parte destes termos, não deve usar nossos serviços.</p>
<h2>2. Descrição do Serviço</h2>
<p>O NeuroZen oferece informações e conteúdo relacionado ao livro "NeuroZen - Guia da Mente Criativa com IA", incluindo:</p>
<ul>
<li>Informações sobre o livro e seu conteúdo</li>
<li>Sistema de newsletter para atualizações</li>
<li>Chat para suporte e esclarecimento de dúvidas</li>
<li>Depoimentos e avaliações de leitores</li>
</ul>
<h2>3. Uso Aceitável</h2>
<p>Você concorda em usar nossos serviços apenas para fins legais e de acordo com estes Termos. É proibido:</p>
<ul>
<li>Usar o site para qualquer finalidade ilegal ou não autorizada</li>
<li>Transmitir vírus, malware ou outros códigos maliciosos</li>
<li>Tentar interferir no funcionamento do site</li>
<li>Coletar informações de outros usuários sem autorização</li>
<li>Reproduzir ou distribuir conteúdo protegido por direitos autorais</li>
</ul>
<h2>4. Propriedade Intelectual</h2>
<p>Todo o conteúdo deste site, incluindo textos, imagens, logos, e design, é propriedade do NeuroZen ou de seus licenciadores e está protegido por leis de direitos autorais e outras leis de propriedade intelectual.</p>
<h2>5. Privacidade e Dados Pessoais</h2>
<p>O tratamento de seus dados pessoais é regido por nossa <a href="privacy-policy.html" style="color: #2563eb;">Política de Privacidade</a>, que faz parte integrante destes Termos de Uso.</p>
<h2>6. Newsletter e Comunicações</h2>
<p>Ao se inscrever em nossa newsletter, você:</p>
<ul>
<li>Autoriza o envio de e-mails sobre o NeuroZen</li>
<li>Pode cancelar a inscrição a qualquer momento</li>
<li>Concorda que podemos usar seu e-mail para comunicações relacionadas ao livro</li>
</ul>
<h2>7. Limitação de Responsabilidade</h2>
<p>O NeuroZen não se responsabiliza por:</p>
<ul>
<li>Danos diretos ou indiretos decorrentes do uso do site</li>
<li>Interrupções temporárias no serviço</li>
<li>Perda de dados ou informações</li>
<li>Conteúdo de sites de terceiros linkados</li>
</ul>
<h2>8. Modificações dos Termos</h2>
<p>Reservamo-nos o direito de modificar estes Termos a qualquer momento. As alterações entrarão em vigor imediatamente após a publicação no site. O uso continuado dos serviços constitui aceitação dos novos termos.</p>
<h2>9. Rescisão</h2>
<p>Podemos suspender ou encerrar seu acesso aos nossos serviços a qualquer momento, sem aviso prévio, caso você viole estes Termos de Uso.</p>
<h2>10. Lei Aplicável</h2>
<p>Estes Termos são regidos pelas leis brasileiras, especificamente:</p>
<ul>
<li>Lei Geral de Proteção de Dados (LGPD)</li>
<li>Código de Defesa do Consumidor</li>
<li>Marco Civil da Internet</li>
</ul>
<h2>11. Resolução de Disputas</h2>
<p>Qualquer disputa relacionada a estes Termos será resolvida preferencialmente por mediação. Caso não seja possível, o foro competente será o da comarca de [Sua Cidade], Brasil.</p>
<h2>12. Contato</h2>
<p>Para dúvidas sobre estes Termos de Uso, entre em contato:</p>
<ul>
<li><strong>E-mail:</strong>neurozenbook@gmail.com</li>
<li><strong>Endereço:</strong>[Seu endereço completo]</li>
</ul>
<p style="margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #e2e8f0; color: #64748b; font-size: 0.9rem;">
Ao continuar usando nossos serviços, você confirma que leu, entendeu e aceita estes Termos de Uso.
</p>
</div>
</div>
<footer>
<p>© 2025 NeuroZen. Todos os direitos reservados.</p>
</footer>
</body>
</html>thanks.html
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Obrigado - NeuroZen</title>
<link rel="stylesheet" href="styles.css">
<style>
.thanks-wrapper {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
min-height: calc(100vh - 140px);
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
}
.thanks-content {
max-width: 600px;
background: #fff;
padding: 4rem 3rem;
border-radius: 16px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
text-align: center;
position: relative;
overflow: hidden;
}
.thanks-content::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(135deg, #2563eb, #1e40af);
}
.success-icon {
width: 80px;
height: 80px;
background: linear-gradient(135deg, #10b981, #059669);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 2rem;
animation: scaleIn 0.5s ease-out;
}
.success-icon::after {
content: '✓';
color: white;
font-size: 2.5rem;
font-weight: bold;
}
.thanks-content h1 {
font-size: 2.5rem;
color: #0d1117;
margin-bottom: 1rem;
font-weight: 700;
}
.thanks-content p {
font-size: 1.2rem;
color: #475569;
margin-bottom: 2rem;
line-height: 1.6;
}
.benefits {
background: #f8fafc;
padding: 2rem;
border-radius: 12px;
margin: 2rem 0;
border-left: 4px solid #2563eb;
}
.benefits h3 {
color: #2563eb;
margin-bottom: 1rem;
font-size: 1.3rem;
}
.benefits ul {
list-style: none;
padding: 0;
text-align: left;
}
.benefits li {
color: #475569;
margin-bottom: 0.8rem;
padding-left: 1.5rem;
position: relative;
}
.benefits li::before {
content: '🚀';
position: absolute;
left: 0;
top: 0;
}
.cta-buttons {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 2rem;
}
.btn-primary {
background: linear-gradient(135deg, #2563eb, #1e40af);
color: white;
padding: 1rem 2rem;
border: none;
border-radius: 8px;
font-size: 1.1rem;
font-weight: 600;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(37, 99, 235, 0.3);
}
.btn-secondary {
background: transparent;
color: #2563eb;
padding: 1rem 2rem;
border: 2px solid #2563eb;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
}
.btn-secondary:hover {
background: #2563eb;
color: white;
}
.social-proof {
margin-top: 3rem;
padding-top: 2rem;
border-top: 1px solid #e2e8f0;
}
.social-proof p {
font-size: 0.95rem;
color: #64748b;
}
@keyframes scaleIn {
from {
transform: scale(0);
}
to {
transform: scale(1);
}
}
@media (max-width: 768px) {
.thanks-content {
padding: 3rem 2rem;
}
.thanks-content h1 {
font-size: 2rem;
}
.cta-buttons {
flex-direction: column;
}
}
</style>
</head>
<body>
<header>
<nav>
<div class="logo">NeuroZen</div>
<ul class="nav-links">
<li><a href="index.html">Início</a></li>
<li><a href="terms-of-use.html">Termos de Uso</a></li>
<li><a href="privacy-policy.html">Privacidade</a></li>
<li><a href="thanks.html">Obrigado</a></li>
</ul>
</nav>
</header>
<div class="thanks-wrapper">
<div class="thanks-content">
<div class="success-icon"></div>
<h1>Obrigado!</h1>
<p>Seu e-mail foi cadastrado com sucesso! Agora você faz parte da comunidade NeuroZen e receberá todas as novidades sobre criatividade e Inteligência Artificial.</p>
<div class="benefits">
<h3>O que você vai receber:</h3>
<ul>
<li>Acesso antecipado a novos conteúdos</li>
<li>Dicas exclusivas sobre criatividade com IA</li>
<li>Atualizações sobre o lançamento do livro</li>
<li>Convites para eventos especiais</li>
<li>Conteúdo bônus exclusivo para assinantes</li>
</ul>
</div>
<div class="cta-buttons">
<a href="index.html" class="btn-primary">Voltar ao Início</a>
<a href="#" class="btn-secondary">Seguir nas Redes Sociais</a>
</div>
<div class="social-proof">
<p>🎉 Você se juntou a mais de <strong>2.500 pessoas</strong> que já estão descobrindo o poder da criatividade com IA!</p>
</div>
</div>
</div>
<footer>
<p>© 2025 NeuroZen. Todos os direitos reservados.</p>
</footer>
<script>
// Adiciona um pouco de interatividade
document.addEventListener('DOMContentLoaded', function() {
// Confetti effect simples
setTimeout(() => {
document.body.style.background = 'linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%)';
}, 500);
});
</script>
</body>
</html>styles.css
/* =================================
RESET E CONFIGURAÇÕES GERAIS
================================= */
/* Reset básico */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* Corpo geral */
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
background-color: #f9f9f9;
color: #111;
line-height: 1.6;
}
/* =================================
CABEÇALHO E NAVEGAÇÃO
================================= */
header {
background-color: #0d1117;
padding: 1rem 2rem;
}
nav {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1200px;
margin: 0 auto;
}
.logo {
color: #fff;
font-size: 1.5rem;
font-weight: bold;
}
.nav-links {
list-style: none;
display: flex;
gap: 2rem;
}
.nav-links li a {
color: #fff;
text-decoration: none;
transition: color 0.3s;
}
.nav-links li a:hover {
color: #58a6ff;
}
/* =================================
SEÇÃO HERO (PRINCIPAL)
================================= */
.hero {
padding: 4rem 2rem;
display: flex;
flex-direction: column;
align-items: center;
}
.hero-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 2rem;
max-width: 1100px;
}
.text {
text-align: center;
}
.text h1 {
font-size: 2.5rem;
margin-bottom: 1rem;
color: #0d1117;
}
.text p {
font-size: 1.1rem;
margin-bottom: 1.5rem;
}
/* =================================
FORMULÁRIO
================================= */
form {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
}
form input[type="email"] {
padding: 0.7rem 1rem;
font-size: 1rem;
width: 100%;
max-width: 350px;
border: 1px solid #ccc;
border-radius: 6px;
}
form button {
background-color: #2563eb;
color: #fff;
border: none;
padding: 0.7rem 1.2rem;
border-radius: 6px;
cursor: pointer;
font-size: 1rem;
transition: background-color 0.3s;
}
form button:hover {
background-color: #1e40af;
}
/* =================================
CAPA DO LIVRO
================================= */
.animated-book {
animation: float 3s ease-in-out infinite;
max-width: 280px;
display: block;
}
@keyframes float {
0% {
transform: translateY(0px);
}
50% {
transform: translateY(-12px);
}
100% {
transform: translateY(0px);
}
}
/* =================================
SEÇÃO DEPOIMENTOS - VERSÃO LIMPA
================================= */
.testimonials {
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
padding: 4rem 2rem;
text-align: center;
}
.testimonials h2 {
font-size: 2.2rem;
margin-bottom: 3rem;
color: #1e293b;
font-weight: 700;
position: relative;
}
.testimonials h2::after {
content: '';
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 3px;
background: linear-gradient(135deg, #2563eb, #1e40af);
border-radius: 2px;
}
.testimonial-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
max-width: 1000px;
margin: 0 auto;
}
.card {
background: #fff;
padding: 2.5rem 2rem;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
transition: all 0.3s ease;
border: 1px solid rgba(226, 232, 240, 0.8);
position: relative;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 40px rgba(37, 99, 235, 0.15);
border-color: rgba(37, 99, 235, 0.2);
}
.card p {
font-size: 1.1rem;
line-height: 1.7;
color: #475569;
font-style: italic;
margin-bottom: 1.5rem;
text-align: left;
position: relative;
}
.card p::before {
content: '"';
font-size: 2.5rem;
color: #e2e8f0;
position: absolute;
top: -10px;
left: -10px;
font-family: Georgia, serif;
}
.card p::after {
content: '"';
font-size: 2.5rem;
color: #e2e8f0;
position: absolute;
bottom: -25px;
right: 0;
font-family: Georgia, serif;
}
.card span {
display: block;
font-weight: 600;
color: #2563eb;
font-size: 0.95rem;
text-align: right;
position: relative;
padding-top: 1rem;
}
.card span::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 40px;
height: 2px;
background: linear-gradient(135deg, #2563eb, #1e40af);
border-radius: 1px;
}
/* Responsivo */
@media (max-width: 768px) {
.testimonials {
padding: 3rem 1rem;
}
.testimonials h2 {
font-size: 1.8rem;
margin-bottom: 2rem;
}
.testimonial-cards {
grid-template-columns: 1fr;
gap: 1.5rem;
}
.card {
padding: 2rem 1.5rem;
}
}
/* =================================
ÁREA DO CHAT
================================= */
#chat-area {
background-color: #f4f9fd;
padding: 2rem;
max-width: 600px;
margin: 2rem auto;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
text-align: center;
}
#chat-area h2 {
margin-bottom: 1rem;
font-size: 1.5rem;
color: #333;
}
#chat-window {
background-color: #fff;
padding: 1rem;
border-radius: 8px;
box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.05);
}
#chat-messages {
display: flex;
flex-direction: column;
gap: 6px;
padding: 10px;
max-height: 300px;
overflow-y: auto;
background-color: #f9fafb;
border-radius: 8px;
text-align: left;
}
.chat-bubble {
padding: 10px 14px;
border-radius: 16px;
max-width: 75%;
word-wrap: break-word;
font-size: 14px;
line-height: 1.4;
}
.chat-bubble.user {
background-color: #2563eb;
color: #fff;
align-self: flex-end;
text-align: left;
}
.chat-bubble.bot {
background-color: #e5e7eb;
color: #000;
align-self: flex-start;
text-align: left;
}
#typing {
font-style: italic;
color: #666;
margin: 5px 0;
align-self: flex-start;
background-color: #e5e7eb;
border-radius: 16px;
padding: 10px 14px;
font-size: 14px;
max-width: 75%;
}
#chat-input {
display: flex;
gap: 0.5rem;
}
#chat-input input[type="text"] {
flex-grow: 1;
padding: 0.6rem;
border-radius: 6px;
border: 1px solid #ccc;
}
#send-btn {
padding: 0.6rem 1.2rem;
background-color: #007bff;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
transition: background-color 0.3s;
}
#send-btn:hover {
background-color: #0056b3;
}
/* =================================
RODAPÉ
================================= */
footer {
background-color: #0d1117;
color: #ccc;
text-align: center;
padding: 1rem 0;
font-size: 0.9rem;
}
/* =================================
MEDIA QUERIES - RESPONSIVIDADE
================================= */
@media (min-width: 768px) {
.hero-content {
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.text {
text-align: left;
flex: 1;
}
.cover {
background: transparent;
box-shadow: none;
padding: 0;
}
form {
flex-direction: row;
}
#user-input {
width: auto;
}
}js/chat.js
import { agentPrompt } from "./agent.js";
import { displayMessage, showTyping, removeTyping } from "./ui.js";
// Espera o DOM carregar
window.addEventListener("DOMContentLoaded", () => {
const chatMessages = document.getElementById("chat-messages");
const sendBtn = document.getElementById("send-btn");
const userInput = document.getElementById("user-input");
// Variáveis de controle
let isRafaTyping = false;
let shouldPauseRafa = false;
// Frases de boas-vindas variadas (corrigidas)
const welcomeSequences = [
[
"Oi! 👋 Eu sou o Rafa, tudo bem?",
"Faço parte da equipe do NeuroZen e conheço bem o livro.",
"Se tiver dúvidas ou quiser saber se ele é pra você, estou por aqui!"
],
[
"Olá! 😊 Seja bem-vindo ao NeuroZen.",
"Meu nome é Rafa, li o livro do começo ao fim.",
"Posso te ajudar a entender se ele é o que você está procurando."
],
[
"E aí! 👋 Tudo certo?",
"Sou o Rafa da equipe do NeuroZen. Já mergulhei no conteúdo do livro.",
"Quer trocar uma ideia e ver se ele faz sentido pra você?"
]
];
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
// Detecta quando usuário está digitando
userInput.addEventListener("input", () => {
if (isRafaTyping) {
shouldPauseRafa = true;
}
});
// Exibe sequência de mensagens com simulação de digitação
async function showWelcomeMessage() {
const sequence = welcomeSequences[Math.floor(Math.random() * welcomeSequences.length)];
for (let i = 0; i < sequence.length; i++) {
const msg = sequence[i];
const typingTime = 30 * msg.length + 500;
if (i !== 0) {
await delay(600 + Math.random() * 700);
}
showTyping(chatMessages);
await delay(typingTime);
removeTyping(chatMessages);
displayMessage(chatMessages, msg, "bot");
}
}
// Quebra resposta em múltiplas mensagens
function splitResponse(response) {
// Quebra por pontos finais, quebras de linha, ou frases longas
const sentences = response
.split(/(?<=[.!?])\s+|\n+/) .filter(sentence => sentence.trim().length > 0);
const messages = [];
let currentMessage = "";
for (const sentence of sentences) {
// Se a mensagem atual + nova frase fica muito longa (mais de 120 chars)
if (currentMessage.length + sentence.length > 120 && currentMessage.length > 0) {
messages.push(currentMessage.trim());
currentMessage = sentence;
} else {
currentMessage += (currentMessage ? " " : "") + sentence;
}
}
if (currentMessage.trim()) {
messages.push(currentMessage.trim());
}
return messages.length > 0 ? messages : [response];
}
// Envia múltiplas mensagens com pausas
async function sendMultipleMessages(messages) {
isRafaTyping = true;
shouldPauseRafa = false;
for (let i = 0; i < messages.length; i++) { // Verifica se usuário começou a digitar if (shouldPauseRafa) { removeTyping(chatMessages); displayMessage(chatMessages, "Pode falar! Estou ouvindo... 😊", "bot"); isRafaTyping = false; return; } const message = messages[i]; const typingTime = Math.max(message.length * 40, 800); // Mínimo 800ms // Pausa entre mensagens (exceto a primeira) if (i > 0) {
await delay(800 + Math.random() * 600);
// Verifica novamente se usuário está digitando
if (shouldPauseRafa) {
removeTyping(chatMessages);
displayMessage(chatMessages, "Pode falar! Estou ouvindo... 😊", "bot");
isRafaTyping = false;
return;
}
}
showTyping(chatMessages);
await delay(typingTime);
// Última verificação antes de enviar
if (shouldPauseRafa) {
removeTyping(chatMessages);
displayMessage(chatMessages, "Pode falar! Estou ouvindo... 😊", "bot");
isRafaTyping = false;
return;
}
removeTyping(chatMessages);
displayMessage(chatMessages, message, "bot");
}
isRafaTyping = false;
}
// Inicia mensagem de boas-vindas após um delay
setTimeout(() => {
showWelcomeMessage();
}, 1000);
// Eventos
sendBtn.addEventListener("click", handleUserMessage);
userInput.addEventListener("keypress", function (e) {
if (e.key === "Enter") {
e.preventDefault();
handleUserMessage();
}
});
// Envio da mensagem do usuário e resposta da API
async function handleUserMessage() {
const userMessage = userInput.value.trim();
if (!userMessage) return;
// Para qualquer resposta do Rafa em andamento
shouldPauseRafa = true;
removeTyping(chatMessages);
displayMessage(chatMessages, userMessage, "user");
userInput.value = "";
// Reset das variáveis de controle
isRafaTyping = false;
shouldPauseRafa = false;
showTyping(chatMessages);
try {
// Configuração para a API da Groq
const response = await fetch("https://api.groq.com/openai/v1/chat/completions", {
method: "POST",
headers: {
"Content-Type": "application/json",
"Authorization": "Bearer SUA_CHAVE_API_GROQ",
},
body: JSON.stringify({
messages: [
{ role: "system", content: agentPrompt },
{ role: "user", content: userMessage },
],
model: "llama3-70b-8192",
}),
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
const botResponse = data.choices[0].message.content;
removeTyping(chatMessages);
// Quebra a resposta em múltiplas mensagens
const messages = splitResponse(botResponse);
// Envia mensagens com pausas
await sendMultipleMessages(messages);
} catch (error) {
console.error("Erro na API:", error);
removeTyping(chatMessages);
// Resposta de fallback mais natural
const fallbackResponses = [
"Desculpe, estou com uma instabilidade temporária. Que tal tentar novamente em alguns segundos?",
"Ops! Parece que tive um probleminha técnico. Pode repetir sua pergunta?",
"Nossa, algo deu errado por aqui. Mas fique à vontade para me perguntar sobre o NeuroZen!"
];
const randomFallback = fallbackResponses[Math.floor(Math.random() * fallbackResponses.length)];
displayMessage(chatMessages, randomFallback, "bot");
}
}
});
js/form.js
document.addEventListener("DOMContentLoaded", function () {
const form = document.getElementById("email-form");
const scriptURL = "https://script.google.com/macros/s/AKfyc...0bLJWg/exec"; //URL do seu script
form.addEventListener("submit", function (e) {
e.preventDefault();
const emailInput = form.querySelector("input[type='email']");
const email = emailInput.value.trim();
if (!email) {
alert("Digite um e-mail válido!");
return;
}
fetch(`${scriptURL}?email=${encodeURIComponent(email)}`)
.then((response) => response.json())
.then((data) => {
if (data.status === "success") {
alert("✅ Obrigado! Seu e-mail foi cadastrado com sucesso.");
emailInput.value = "";
window.location.href = "thanks.html";
} else {
alert("❌ Houve um erro ao cadastrar. Tente novamente.");
}
})
.catch((error) => {
console.error("Erro:", error);
alert("❌ Houve um erro inesperado. Tente novamente.");
});
});
});js/ui.js
export function displayMessage(container, text, sender) {
const message = document.createElement("div");
// Remove espaços invisíveis e trim corretamente
const cleanText = text.replace(/^\s+|\s+$/g, '').replace(/[\u200B-\u200D\uFEFF]/g, '');
message.textContent = cleanText;
message.className = `chat-bubble ${sender}`;
// Remove estilos inline conflitantes - deixa só o CSS fazer o trabalho
message.style.cssText = '';
container.appendChild(message);
container.scrollTop = container.scrollHeight;
}
// Exibe múltiplos balões com pausa entre eles
export async function displayMessageSequence(container, messages, sender) {
for (const msg of messages) {
await new Promise((resolve) => setTimeout(resolve, 1500));
displayMessage(container, msg, sender);
}
}
export function showTyping(container) {
// Remove typing anterior se existir
removeTyping(container);
const typingIndicator = document.createElement("div");
typingIndicator.textContent = "Digitando...";
typingIndicator.id = "typing";
container.appendChild(typingIndicator);
container.scrollTop = container.scrollHeight;
}
export function removeTyping(container) {
const typing = document.getElementById("typing");
if (typing && typing.parentNode === container) {
container.removeChild(typing);
}
}⚙️ Como funcionará na prática?
O visitante poderá fazer perguntas diretamente na landing page sobre o livro NeuroZen. O agente vai responder rapidamente, utilizando o conteúdo do livro e técnicas de venda para estimular o visitante a comprar o produto.
Além disso, o formulário simples vai armazenar automaticamente e-mails de interessados em uma planilha Google Sheets.
🤖 Por que escolhemos a Groq API?
Para este projeto, optamos pela Groq por razões técnicas e práticas específicas:
⚡ Velocidade incomparável:
- Até 1.665 tokens por segundo com Llama 3.3 70B
- Latência ultra-baixa (0.3s time-to-first-token)
- Experiência de chat que parece conversa humana natural
🆓 Totalmente gratuito:
- 14.400 requests por dia sem custo
- Modelos de alta qualidade: Llama 3.3 70B, DeepSeek R1, Gemma 3
- Sem necessidade de cartão de crédito
🛠️ Perfeito para agentes de vendas:
- Resposta instantânea elimina frustrações do usuário
- Compatível com padrão OpenAI (fácil integração)
- Infraestrutura LPU™ otimizada para conversas em tempo real
🎯 Ideal para o NeuroZen: A velocidade extrema do Groq transforma a experiência do visitante – quando alguém pergunta sobre o livro, a resposta aparece imediatamente, criando a sensação de estar conversando com uma pessoa real da equipe.
🔧 Configuração da Groq API
Passo a passo simples:
- Criar conta: https://console.groq.com/ (gratuito)
- Gerar API Key: Dashboard → “API Keys” → “Create API Key”
- Integrar no código: Substituir
"SUA_CHAVE_API_GROQ_REAL_AQUI"
Modelos recomendados:
llama3-70b-8192← Mais inteligente (recomendado)llama3-8b-8192← Mais rápidomixtral-8x7b-32768← Bom equilíbrio
A configuração leva menos de 5 minutos e o agente estará funcionando com qualidade profissional!
📩 Integração com Google Sheets via Google Apps Script
1. Criar a Planilha Google Sheets
- Acesse o Google Sheets
- Nomeie como NeuroZen Emails
- Coloque na célula A1:
Email
2. Criar o Script (Google Apps Script)
- Na planilha, clique em Extensões > Apps Script
- Apague tudo e cole este script:
function doGet(e) {
Logger.log("🚀 Iniciando doGet - NeuroZen...");
if (!e || !e.parameter || !e.parameter.email) {
Logger.log("❌ ERRO: Nenhum dado GET recebido!");
return ContentService.createTextOutput(JSON.stringify({
"status": "error",
"message": "Email obrigatório"
})).setMimeType(ContentService.MimeType.JSON);
}
try {
var email = e.parameter.email.trim();
Logger.log("✅ Email recebido: " + email);
// ID da sua planilha NeuroZen
var sheetId = "1E8...VI9c"; //ID da sua planilha do google sheets
var spreadsheet = SpreadsheetApp.openById(sheetId);
var sheet = spreadsheet.getActiveSheet();
Logger.log("✅ Planilha encontrada: " + sheet.getName());
// Adiciona na planilha
sheet.appendRow([new Date(), email]);
Logger.log("✅ Email salvo na planilha NeuroZen.");
// 📧 1. ENVIA EMAIL DE AGRADECIMENTO PARA QUEM SE CADASTROU
try {
Logger.log("🔄 Enviando email de agradecimento para: " + email);
MailApp.sendEmail({
to: email, // ← PARA QUEM SE CADASTROU
subject: "NeuroZen - Obrigado pelo seu interesse! 🧠✨",
htmlBody: `
<div style="font-family: Arial, sans-serif; max-width: 600px; margin: 0 auto;">
<h2 style="color: #2563eb;">Obrigado pelo seu interesse no NeuroZen! 🧠✨</h2>
<p>Olá,</p>
<p>Muito obrigado por demonstrar interesse no livro <strong>"NeuroZen - Guia da Mente Criativa com IA"</strong>!</p>
<p>Você será um dos primeiros a saber sobre:</p>
<ul style="color: #374151;">
<li>🚀 <strong>Lançamento oficial</strong></li>
<li>💰 <strong>Ofertas exclusivas</strong></li>
<li>🎁 <strong>Bônus especiais para os primeiros leitores</strong></li>
<li>📚 <strong>Conteúdos exclusivos sobre IA e criatividade</strong></li>
</ul>
<div style="background: #f3f4f6; padding: 20px; border-radius: 8px; margin: 20px 0;">
<p style="margin: 0;"><strong>💡 Dica:</strong> Adicione nosso email à sua lista de contatos para não perder nenhuma novidade!</p>
</div>
<p>Fique atento ao seu email!</p>
<hr style="margin: 30px 0; border: none; border-top: 1px solid #e5e7eb;">
<p>Abraços,<br>
<strong>Equipe do Seu Produto</strong><br>
<a href="mailto:seu_email@gmail.com" style="color: #2563eb;">seu_email@gmail.com</a></p>
</div>
`
});
Logger.log("✅ Email de agradecimento ENVIADO para: " + email);
} catch (emailError) {
Logger.log("❌ ERRO ao enviar email de agradecimento: " + emailError.message);
}
// 📧 2. ENVIA NOTIFICAÇÃO DE NOVO LEAD PARA A EQUIPE
try {
Logger.log("🔄 Enviando notificação de lead para: neurozenbook@gmail.com");
MailApp.sendEmail({
to: "neurozenbook@gmail.com", // ← PARA A EQUIPE
subject: "🎯 Novo Lead NeuroZen!",
htmlBody: `
<h3>📢 Novo interessado no NeuroZen!</h3>
<p><strong>Email:</strong> ${email}</p>
<p><strong>Data:</strong> ${new Date()}</p>
<p><strong>Origem:</strong> Landing Page NeuroZen</p>
<br>
<p>Já pode incluir no funil de vendas! 🚀</p>
`
});
Logger.log("✅ Notificação de lead ENVIADA para: neurozenbook@gmail.com");
} catch (adminEmailError) {
Logger.log("❌ ERRO ao enviar notificação de lead: " + adminEmailError.message);
}
return ContentService.createTextOutput(JSON.stringify({
"status": "success",
"message": "Email cadastrado com sucesso"
})).setMimeType(ContentService.MimeType.JSON);
} catch (error) {
Logger.log("❌ ERRO GERAL: " + error.message);
return ContentService.createTextOutput(JSON.stringify({
"status": "error",
"message": error.message
})).setMimeType(ContentService.MimeType.JSON);
}
}
function doPost(e) {
return doGet(e);
}
3. Publicar Script como Web App
- Clique em Implantar > Nova implantação
- Escolha tipo: Aplicativo da Web
- Configure:
- Executar como: sua conta
- Acesso: Qualquer pessoa
- Clique em Implantar e copie o link gerado.
4. HTML do formulário
<form id="email-form">
<input type="email" id="email" placeholder="Seu melhor e-mail" required>
<button type="submit">Receber novidades</button>
</form>
<p id="feedbackMessage" style="display:none;"></p>
5. JavaScript (form.js)
document.addEventListener("DOMContentLoaded", function () {
const form = document.getElementById("email-form");
const scriptURL = "URL_DO_APPS_SCRIPT";
form.addEventListener("submit", function (e) {
e.preventDefault();
const emailInput = form.querySelector("input[type='email']");
const email = emailInput.value.trim();
if (!email) {
alert("Digite um e-mail válido!");
return;
}
fetch(`${scriptURL}?email=${encodeURIComponent(email)}`)
.then((response) => response.json())
.then((data) => {
if (data.status === "success") {
alert("✅ Obrigado! Seu e-mail foi cadastrado com sucesso.");
emailInput.value = "";
window.location.href = "thanks.html";
} else {
alert("❌ Houve um erro ao cadastrar. Tente novamente.");
}
})
.catch((error) => {
console.error("Erro:", error);
alert("❌ Houve um erro inesperado. Tente novamente.");
});
});
});
🚀 Publicação
Para publicar rapidamente e grátis, use o Netlify.
🎓 Conclusão
Com esse agente vendedor especialista, você viu como usar inteligência artificial para criar um vendedor virtual eficaz e convincente, tudo de forma simples e direta.
Na próxima aula, ampliaremos o conceito com múltiplos agentes interagindo e colaborando entre si.
