diff --git a/src/features/docs/pages/getting-started.tsx b/src/features/docs/pages/getting-started.tsx new file mode 100644 index 0000000..1dfbbd3 --- /dev/null +++ b/src/features/docs/pages/getting-started.tsx @@ -0,0 +1,360 @@ +import { motion } from 'framer-motion' +import { h1, h2, p, ul, li, pre } from '@/shared/components/typography' + +export function GettingStartedPage() { + return ( + + {h1({ children: 'Comece a Usar o Knowly' })} + + {p({ + children: ( + <> + Siga este guia passo a passo para começar a usar a plataforma Knowly + e criar sua primeira base de conhecimento de IA. + + ) + })} + + {h2({ children: 'Passo 1: Criar uma Conta' })} + {p({ + children: ( + <>Para começar, você precisa criar uma conta gratuita no Knowly: + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Acesse a página de{' '} + + cadastro + + + ) + })} + {li({ + children: <>Preencha seus dados: nome, e-mail e senha + })} + {li({ + children: <>Confirme seu e-mail através do link enviado + })} + {li({ + children: ( + <> + Faça login com suas credenciais + + ) + })} + + ) + })} + + {h2({ children: 'Passo 2: Criar uma Base de Conhecimento' })} + {p({ + children: ( + <> + Após fazer login, você pode criar sua primeira base de conhecimento: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Acesse "Minhas Bases" no menu do + usuário + + ) + })} + {li({ + children: ( + <> + Clique em "Nova Base" + + ) + })} + {li({ + children: ( + <> + Escolha um nome para sua base + + ) + })} + {li({ + children: ( + <> + Selecione o modelo de IA que deseja usar (ex: + Amazon Bedrock) + + ) + })} + {li({ + children: ( + <> + Faça upload dos documentos PDF que servirão + como base de conhecimento + + ) + })} + {li({ + children: ( + <> + Clique em "Criar Base" + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Aguarde alguns instantes enquanto o sistema processa seus + documentos. O tempo varia conforme a quantidade e tamanho dos + arquivos. + + ) + })} + + {h2({ children: 'Passo 3: Obter a Chave da Base' })} + {p({ + children: ( + <> + Depois que sua base estiver pronta, você precisa obter a chave de + API para integrá-la: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: <>Na lista de bases, clique na base que você criou + })} + {li({ + children: ( + <> + Na página de detalhes, copie a Chave da Base{' '} + (Base ID) + + ) + })} + {li({ + children: ( + <> + Copie também sua Chave de API (API Key) nas + configurações da conta + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Importante: Guarde essas chaves em um local seguro. + Você precisará delas para fazer requisições à API. + + ) + })} + + {h2({ children: 'Passo 4: Testar no Playground' })} + {p({ + children: ( + <> + Antes de integrar, você pode testar sua base de conhecimento no + Playground: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Clique em "Testar no Playground" na + página da base + + ) + })} + {li({ + children: ( + <> + Digite perguntas relacionadas aos documentos que você enviou + + ) + })} + {li({ + children: ( + <> + Veja as respostas geradas pela IA com base no conhecimento da + sua base + + ) + })} + + ) + })} + + {h2({ children: 'Passo 5: Integrar com seu Código' })} + {p({ + children: ( + <> + Agora você pode integrar a base de conhecimento ao seu sistema + usando nossa API REST: + + ) + })} + + {pre({ + children: `# Exemplo usando cURL +curl -X POST https://api.knowly.dev.br/chat \\ + -H "Content-Type: application/json" \\ + -d '{ + "kb_key": "knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd", + "model": "MISTRAL_SMALL", + "prompt": "Qual é o horário de atendimento?" + }'` + })} + + {p({ + children: ( + <> + Exemplo em JavaScript/Node.js: + + ) + })} + + {pre({ + children: `fetch('https://api.knowly.dev.br/chat', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + kb_key: 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + model: 'MISTRAL_SMALL', + prompt: 'Qual é o horário de atendimento?' + }) +}) + .then(response => response.json()) + .then(data => console.log(data.response));` + })} + + {p({ + children: ( + <> + Exemplo em Python: + + ) + })} + + {pre({ + children: `import requests + +response = requests.post( + 'https://api.knowly.dev.br/chat', + headers={ + 'Content-Type': 'application/json', + }, + json={ + 'kb_key': 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + 'model': 'MISTRAL_SMALL', + 'prompt': 'Qual é o horário de atendimento?' + } +) + +data = response.json() +print(data['response'])` + })} + + {h2({ children: 'Próximos Passos' })} + {p({ + children: ( + <> + Agora que você já sabe como começar, explore mais recursos da + plataforma: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Aprenda mais sobre{' '} + + Modelos de Fundação + + + ) + })} + {li({ + children: ( + <> + Veja detalhes sobre{' '} + + + Gerenciamento de Bases de Conhecimento + + + + ) + })} + {li({ + children: ( + <> + Explore opções avançadas de{' '} + + Integração + + + ) + })} + {li({ + children: ( + <> + Gerencie sua{' '} + + Assinatura + + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Precisa de ajuda? Consulte nossa{' '} + + página de FAQ + {' '} + ou entre em{' '} + + contato + + . + + ) + })} + + ) +} + +export default GettingStartedPage diff --git a/src/features/docs/pages/integration-api.tsx b/src/features/docs/pages/integration-api.tsx new file mode 100644 index 0000000..52f5d09 --- /dev/null +++ b/src/features/docs/pages/integration-api.tsx @@ -0,0 +1,84 @@ +import { motion } from 'framer-motion' +import { h1, h2, p, ul, li, pre } from '@/shared/components/typography' + +export function IntegrationApiPage() { + return ( + + {h1({ children: 'Integração via API' })} + + {h2({ children: 'Integração simples via API' })} + {p({ + children: ( + <> + Depois de criar sua base de conhecimento no Knowly, você pode + integrá-la facilmente ao seu sistema usando nossa API. O + funcionamento é parecido com a API da OpenAI, muito usada em + chatbots de atendimento, como no WhatsApp. + + ) + })} + + {h2({ children: 'Como funciona?' })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Você envia um prompt (mensagem ou pergunta) + para a API, junto com sua chave de acesso. + + ) + })} + {li({ + children: ( + <> + A API responde com a melhor resposta baseada nos documentos + que você enviou para sua base. + + ) + })} + {li({ + children: ( + <> + É possível usar essa integração em sites, sistemas internos, + chatbots e muito mais. + + ) + })} + + ) + })} + + {h2({ children: 'Exemplo de requisição' })} + {pre({ + children: `POST https://api.knowly.dev.br/chat +Headers: + Content-Type: application/json +Body: +{ + "kb_key": "knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd", + "model": "MISTRAL_SMALL", + "prompt": "Como faço para atualizar meus dados cadastrais?" +}` + })} + + {p({ + children: ( + <> + A resposta virá em formato JSON, com o texto gerado pela IA usando o + conhecimento da sua base. Assim, você pode automatizar atendimentos, + responder dúvidas de clientes ou integrar a IA ao seu sistema de + forma simples e eficiente. + + ) + })} + + ) +} + +export default IntegrationApiPage diff --git a/src/features/docs/pages/integration-instagram.tsx b/src/features/docs/pages/integration-instagram.tsx new file mode 100644 index 0000000..234c1ab --- /dev/null +++ b/src/features/docs/pages/integration-instagram.tsx @@ -0,0 +1,426 @@ +import { motion } from 'framer-motion' +import { h1, h2, p, ul, li, pre } from '@/shared/components/typography' + +export function IntegrationInstagramPage() { + return ( + + {h1({ children: 'Integração com Instagram' })} + + {p({ + children: ( + <> + Automatize respostas nas mensagens diretas (DMs) do Instagram usando + a API do Knowly para responder automaticamente perguntas dos + usuários com base na sua base de conhecimento. + + ) + })} + + {h2({ children: 'Passo 1: Configurar Instagram Business Account' })} + {p({ + children: ( + <> + Para usar a API do Instagram, você precisa ter uma{' '} + Conta Business do Instagram conectada a uma{' '} + Página do Facebook: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Acesse{' '} + + Meta Business Suite + + + ) + })} + {li({ + children: ( + <>Conecte sua conta do Instagram a uma Página do Facebook + ) + })} + {li({ + children: ( + <> + Converta para uma Conta Business no Instagram + + ) + })} + {li({ + children: ( + <> + Configure as permissões necessárias:{' '} + instagram_basic,{' '} + instagram_manage_messages + + ) + })} + + ) + })} + + {h2({ children: 'Passo 2: Obter Token de Acesso' })} + {p({ + children: ( + <> + No{' '} + + Meta for Developers + + , crie um app e obtenha um token de acesso com as permissões + necessárias para gerenciar mensagens do Instagram. + + ) + })} + + {h2({ children: 'Passo 3: Configurar Webhook' })} + {p({ + children: ( + <> + Configure um webhook para receber notificações de mensagens diretas: + + ) + })} + + {pre({ + children: `# URL do Webhook +https://seu-servidor.com/webhook/instagram + +# Assine o evento: messages +# Receberá notificações quando usuários enviarem DMs + +# Exemplo de payload recebido: +{ + "object": "instagram", + "entry": [{ + "id": "INSTAGRAM_BUSINESS_ACCOUNT_ID", + "time": 1704116400, + "messaging": [{ + "sender": { "id": "USER_ID" }, + "recipient": { "id": "PAGE_ID" }, + "timestamp": 1704116400, + "message": { + "mid": "MESSAGE_ID", + "text": "Qual é o horário de funcionamento?" + } + }] + }] +}` + })} + + {h2({ children: 'Passo 4: Integrar com Knowly API' })} + {p({ + children: ( + <> + Quando receber uma mensagem via webhook, consulte a API do Knowly e + envie a resposta de volta ao usuário: + + ) + })} + + {p({ + children: ( + <> + Exemplo em Node.js: + + ) + })} + + {pre({ + children: `const express = require('express'); +const app = express(); + +app.post('/webhook/instagram', async (req, res) => { + const { entry } = req.body; + + // Processar cada mensagem recebida + for (const event of entry) { + for (const messaging of event.messaging) { + const senderId = messaging.sender.id; + const messageText = messaging.message?.text; + + if (!messageText) continue; + + // Consultar API do Knowly + const knowlyResponse = await fetch('https://api.knowly.dev.br/chat', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + kb_key: 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + model: 'MISTRAL_SMALL', + prompt: messageText + }) + }); + + const data = await knowlyResponse.json(); + const aiResponse = data.response; + + // Enviar resposta via Instagram Messaging API + await sendInstagramMessage(senderId, aiResponse); + } + } + + res.sendStatus(200); +}); + +// Função para enviar mensagem pelo Instagram +async function sendInstagramMessage(recipientId, message) { + const pageId = 'SEU_INSTAGRAM_BUSINESS_ACCOUNT_ID'; + + await fetch(\`https://graph.facebook.com/v18.0/\${pageId}/messages\`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': 'Bearer SEU_TOKEN_INSTAGRAM' + }, + body: JSON.stringify({ + recipient: { id: recipientId }, + message: { text: message } + }) + }); +} + +// Endpoint de verificação do webhook (obrigatório) +app.get('/webhook/instagram', (req, res) => { + const mode = req.query['hub.mode']; + const token = req.query['hub.verify_token']; + const challenge = req.query['hub.challenge']; + + if (mode === 'subscribe' && token === 'SEU_TOKEN_DE_VERIFICACAO') { + res.status(200).send(challenge); + } else { + res.sendStatus(403); + } +});` + })} + + {p({ + children: ( + <> + Exemplo em Python: + + ) + })} + + {pre({ + children: `from flask import Flask, request +import requests + +app = Flask(__name__) + +@app.route('/webhook/instagram', methods=['POST']) +def instagram_webhook(): + data = request.json + + # Processar mensagens + for entry in data.get('entry', []): + for messaging in entry.get('messaging', []): + sender_id = messaging['sender']['id'] + message_text = messaging.get('message', {}).get('text') + + if not message_text: + continue + + # Consultar API do Knowly + knowly_response = requests.post( + 'https://api.knowly.dev.br/chat', + headers={ + 'Content-Type': 'application/json', + }, + json={ + 'kb_key': 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + 'model': 'MISTRAL_SMALL', + 'prompt': message_text + } + ) + + ai_response = knowly_response.json()['response'] + + # Enviar resposta pelo Instagram + send_instagram_message(sender_id, ai_response) + + return '', 200 + +def send_instagram_message(recipient_id, message): + page_id = 'SEU_INSTAGRAM_BUSINESS_ACCOUNT_ID' + + requests.post( + f'https://graph.facebook.com/v18.0/{page_id}/messages', + headers={ + 'Content-Type': 'application/json', + 'Authorization': 'Bearer SEU_TOKEN_INSTAGRAM' + }, + json={ + 'recipient': {'id': recipient_id}, + 'message': {'text': message} + } + ) + +@app.route('/webhook/instagram', methods=['GET']) +def verify_webhook(): + mode = request.args.get('hub.mode') + token = request.args.get('hub.verify_token') + challenge = request.args.get('hub.challenge') + + if mode == 'subscribe' and token == 'SEU_TOKEN_DE_VERIFICACAO': + return challenge, 200 + return '', 403` + })} + + {h2({ children: 'Passo 5: Testar a Integração' })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Envie uma mensagem direta para sua conta Business do Instagram + + ) + })} + {li({ + children: <>Verifique se o webhook está recebendo a notificação + })} + {li({ + children: ( + <> + Confirme que a API do Knowly está retornando respostas + adequadas + + ) + })} + {li({ + children: ( + <> + Valide se as respostas estão sendo enviadas corretamente ao + usuário + + ) + })} + + ) + })} + + {h2({ children: 'Funcionalidades Avançadas' })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Respostas rápidas: Configure botões de + resposta rápida para melhorar a experiência + + ) + })} + {li({ + children: ( + <> + Mídia: Envie imagens ou vídeos junto com as + respostas quando apropriado + + ) + })} + {li({ + children: ( + <> + Templates: Use templates pré-aprovados para + respostas frequentes + + ) + })} + {li({ + children: ( + <> + Horário comercial: Configure respostas + automáticas apenas fora do horário comercial + + ) + })} + + ) + })} + + {h2({ children: 'Boas Práticas' })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Transparência: Informe aos usuários que estão + interagindo com um assistente automático + + ) + })} + {li({ + children: ( + <> + Escalação: Ofereça opção de falar com + atendente humano quando necessário + + ) + })} + {li({ + children: ( + <> + Tempo de resposta: Configure timeout adequado + (máx. 10 segundos) + + ) + })} + {li({ + children: ( + <> + Monitoramento: Acompanhe métricas de + satisfação e qualidade das respostas + + ) + })} + {li({ + children: ( + <> + Políticas do Instagram: Respeite as + diretrizes de mensagens automatizadas da plataforma + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Com essa integração, você poderá responder automaticamente mensagens + diretas no Instagram, melhorando o engajamento com sua audiência e + fornecendo suporte instantâneo 24/7. + + ) + })} + + ) +} + +export default IntegrationInstagramPage diff --git a/src/features/docs/pages/integration-whatsapp.tsx b/src/features/docs/pages/integration-whatsapp.tsx new file mode 100644 index 0000000..7e43943 --- /dev/null +++ b/src/features/docs/pages/integration-whatsapp.tsx @@ -0,0 +1,296 @@ +import { motion } from 'framer-motion' +import { h1, h2, p, ul, li, pre } from '@/shared/components/typography' + +export function IntegrationWhatsAppPage() { + return ( + + {h1({ children: 'Integração com WhatsApp Business' })} + + {p({ + children: ( + <> + Automatize o atendimento no WhatsApp Business usando a API do Knowly + para responder automaticamente mensagens de clientes com base na sua + base de conhecimento. + + ) + })} + + {h2({ children: 'Passo 1: Configurar o WhatsApp Business API' })} + {p({ + children: ( + <> + Primeiro, você precisa ter acesso à{' '} + WhatsApp Business API. Você pode configurar através + de: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Meta Business Platform - Acesse{' '} + + business.facebook.com + {' '} + e configure sua conta + + ) + })} + {li({ + children: ( + <> + Provedores terceiros - Como Twilio, + 360Dialog, ou MessageBird + + ) + })} + + ) + })} + + {h2({ children: 'Passo 2: Configurar Webhook' })} + {p({ + children: ( + <> + Configure um webhook para receber mensagens dos clientes. Este + endpoint receberá as mensagens enviadas ao seu número do WhatsApp + Business. + + ) + })} + + {p({ + children: ( + <> + Exemplo de configuração de webhook: + + ) + })} + + {pre({ + children: `# URL do Webhook +https://seu-servidor.com/webhook/whatsapp + +# Método: POST +# Receberá mensagens no formato: +{ + "from": "5511999999999", + "message": "Qual é o horário de atendimento?", + "timestamp": "2025-01-15T10:30:00Z" +}` + })} + + {h2({ children: 'Passo 3: Integrar com Knowly API' })} + {p({ + children: ( + <> + No seu servidor, ao receber uma mensagem via webhook, faça uma + requisição para a API do Knowly para obter a resposta: + + ) + })} + + {p({ + children: ( + <> + Exemplo em Node.js: + + ) + })} + + {pre({ + children: `// Servidor Express recebendo webhook do WhatsApp +app.post('/webhook/whatsapp', async (req, res) => { + const { from, message } = req.body; + + // Consultar API do Knowly + const knowlyResponse = await fetch('https://api.knowly.dev.br/chat', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + kb_key: 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + model: 'MISTRAL_SMALL', + prompt: message + }) + }); + + const data = await knowlyResponse.json(); + const aiResponse = data.response; + + // Enviar resposta de volta para o WhatsApp + await sendWhatsAppMessage(from, aiResponse); + + res.sendStatus(200); +}); + +// Função para enviar mensagem pelo WhatsApp Business API +async function sendWhatsAppMessage(to, message) { + await fetch('https://graph.facebook.com/v18.0/SEU_PHONE_NUMBER_ID/messages', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': 'Bearer SEU_TOKEN_WHATSAPP' + }, + body: JSON.stringify({ + messaging_product: 'whatsapp', + to: to, + text: { body: message } + }) + }); +}` + })} + + {p({ + children: ( + <> + Exemplo em Python: + + ) + })} + + {pre({ + children: `from flask import Flask, request +import requests + +app = Flask(__name__) + +@app.route('/webhook/whatsapp', methods=['POST']) +def whatsapp_webhook(): + data = request.json + from_number = data['from'] + message = data['message'] + + # Consultar API do Knowly + knowly_response = requests.post( + 'https://api.knowly.dev.br/chat', + headers={ + 'Content-Type': 'application/json', + }, + json={ + 'kb_key': 'knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd', + 'model': 'MISTRAL_SMALL', + 'prompt': message + } + ) + + ai_response = knowly_response.json()['response'] + + # Enviar resposta pelo WhatsApp Business API + send_whatsapp_message(from_number, ai_response) + + return '', 200 + +def send_whatsapp_message(to, message): + requests.post( + f'https://graph.facebook.com/v18.0/SEU_PHONE_NUMBER_ID/messages', + headers={ + 'Content-Type': 'application/json', + 'Authorization': 'Bearer SEU_TOKEN_WHATSAPP' + }, + json={ + 'messaging_product': 'whatsapp', + 'to': to, + 'text': {'body': message} + } + )` + })} + + {h2({ children: 'Passo 4: Testar a Integração' })} + {ul({ + children: ( + <> + {li({ + children: ( + <>Envie uma mensagem para seu número do WhatsApp Business + ) + })} + {li({ + children: <>Verifique se o webhook está recebendo a mensagem + })} + {li({ + children: ( + <>Confirme que a API do Knowly está retornando respostas + ) + })} + {li({ + children: ( + <> + Valide se as respostas estão sendo enviadas de volta ao + cliente + + ) + })} + + ) + })} + + {h2({ children: 'Dicas Importantes' })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Timeout: Configure um tempo limite razoável + para requisições (recomendado: 10-15 segundos) + + ) + })} + {li({ + children: ( + <> + Tratamento de erros: Implemente mensagens de + fallback caso a API não responda + + ) + })} + {li({ + children: ( + <> + Rate limiting: Respeite os limites de taxa do + WhatsApp Business API + + ) + })} + {li({ + children: ( + <> + Contexto: Considere manter histórico de + conversas para melhorar as respostas + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Com essa integração, seu WhatsApp Business responderá + automaticamente aos clientes usando o conhecimento da sua base, + proporcionando atendimento 24/7 e reduzindo a carga de trabalho da + equipe. + + ) + })} + + ) +} + +export default IntegrationWhatsAppPage diff --git a/src/features/docs/pages/next-steps.tsx b/src/features/docs/pages/next-steps.tsx new file mode 100644 index 0000000..94120c8 --- /dev/null +++ b/src/features/docs/pages/next-steps.tsx @@ -0,0 +1,324 @@ +import { motion } from 'framer-motion' +import { h1, h2, p, ul, li } from '@/shared/components/typography' + +export function NextStepsPage() { + return ( + + {h1({ children: 'Próximos Passos' })} + + {p({ + children: ( + <> + Estamos constantemente inovando e desenvolvendo novas + funcionalidades para tornar o Knowly ainda mais poderoso e fácil de + usar. Confira o que estamos planejando para o futuro da plataforma. + + ) + })} + + {h2({ children: 'Roadmap de Novas Features' })} + + {h2({ children: 'Sistema de Chatbot Multi-Tenant (Em Desenvolvimento)' })} + {p({ + children: ( + <> + Nossa próxima grande funcionalidade é um{' '} + sistema de chatbot multi-tenant completo que + simplificará drasticamente a integração do Knowly em suas + plataformas. + + ) + })} + + {p({ + children: ( + <> + O que é? + + ) + })} + {p({ + children: ( + <> + Um sistema de chatbot gerenciado e hospedado pela Knowly que você + poderá integrar diretamente em seus canais de atendimento, sem + precisar se preocupar com infraestrutura, webhooks ou gerenciamento + de APIs. + + ) + })} + + {p({ + children: ( + <> + Benefícios: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Zero configuração de infraestrutura: Não será + mais necessário criar e manter servidores para consumir as + APIs das bases de conhecimento + + ) + })} + {li({ + children: ( + <> + Integração simplificada: Basta conectar suas + contas do WhatsApp Business, Instagram, ou outras plataformas + diretamente no painel do Knowly + + ) + })} + {li({ + children: ( + <> + Gerenciamento centralizado: Controle todos os + seus chatbots de diferentes plataformas em um único lugar + + ) + })} + {li({ + children: ( + <> + Multi-tenant: Suporte a múltiplas empresas e + organizações com isolamento completo de dados + + ) + })} + {li({ + children: ( + <> + Escalabilidade automática: Nossa + infraestrutura cuida de todo o dimensionamento automaticamente + + ) + })} + {li({ + children: ( + <> + Monitoramento em tempo real: Acompanhe + métricas de conversas, satisfação e performance dos chatbots + + ) + })} + + ) + })} + + {p({ + children: ( + <> + Plataformas suportadas: + + ) + })} + {ul({ + children: ( + <> + {li({ children: 'WhatsApp Business' })} + {li({ children: 'Instagram Direct Messages' })} + {li({ children: 'Website (Widget de chat embarcado)' })} + {li({ children: 'Facebook Messenger (Em breve)' })} + {li({ children: 'Telegram (Em breve)' })} + {li({ children: 'Slack (Em breve)' })} + {li({ + children: + 'E-commerce (integração com Shopify, WooCommerce, etc.) (Em breve)' + })} + + ) + })} + + {p({ + children: ( + <> + Como funcionará: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: ( + <> + Passo 1: No painel do Knowly, acesse a seção + "Chatbots" + + ) + })} + {li({ + children: ( + <> + Passo 2: Selecione a plataforma que deseja + integrar (WhatsApp, Instagram, Website, etc.) + + ) + })} + {li({ + children: ( + <> + Passo 3: Conecte sua conta seguindo o fluxo + de autenticação simplificado + + ) + })} + {li({ + children: ( + <> + Passo 4: Associe uma ou mais bases de + conhecimento ao chatbot + + ) + })} + {li({ + children: ( + <> + Passo 5: Configure opções como horário de + atendimento, mensagens de boas-vindas, e regras de escalação + + ) + })} + {li({ + children: ( + <> + Passo 6: Ative o chatbot e comece a receber + atendimentos automatizados! + + ) + })} + + ) + })} + + {h2({ children: 'Análises e Insights Avançados' })} + {p({ + children: ( + <> + Além do chatbot multi-tenant, estamos desenvolvendo um sistema + completo de análises para você entender melhor como seus clientes + interagem com a IA: + + ) + })} + {ul({ + children: ( + <> + {li({ + children: + 'Dashboard com métricas de performance das bases de conhecimento' + })} + {li({ + children: 'Análise de sentimento das conversas' + })} + {li({ + children: 'Identificação de perguntas frequentes não respondidas' + })} + {li({ + children: + 'Sugestões de melhoria para otimizar suas bases de conhecimento' + })} + {li({ + children: 'Relatórios de satisfação do cliente' + })} + + ) + })} + + {h2({ children: 'Customização Avançada de Respostas' })} + {ul({ + children: ( + <> + {li({ + children: + 'Templates personalizáveis para diferentes tipos de perguntas' + })} + {li({ + children: + 'Tom de voz configurável (formal, casual, técnico, etc.)' + })} + {li({ + children: + 'Regras de negócio customizadas para tratamento especial de certos tópicos' + })} + {li({ + children: 'Respostas com rich media (imagens, vídeos, carrosséis)' + })} + + ) + })} + + {h2({ children: 'Suporte Multilíngue' })} + {ul({ + children: ( + <> + {li({ + children: 'Detecção automática do idioma do usuário' + })} + {li({ + children: + 'Respostas em múltiplos idiomas a partir da mesma base de conhecimento' + })} + {li({ + children: 'Tradução automática de documentos' + })} + + ) + })} + + {h2({ children: 'Integrações com CRMs e Ferramentas' })} + {ul({ + children: ( + <> + {li({ + children: 'Integração nativa com Salesforce, HubSpot, Pipedrive' + })} + {li({ + children: + 'Webhooks personalizados para integração com qualquer sistema' + })} + {li({ + children: 'API de eventos para rastreamento de conversas' + })} + + ) + })} + + {h2({ children: 'Fique por Dentro' })} + {p({ + children: ( + <> + Estamos trabalhando arduamente para trazer essas funcionalidades o + mais rápido possível. O sistema de chatbot multi-tenant está em fase + avançada de desenvolvimento e será lançado em breve! + + ) + })} + + {p({ + children: ( + <> + Quer ser notificado quando essas features forem lançadas? Entre em{' '} + + contato conosco + {' '} + ou acompanhe nossas atualizações. + + ) + })} + + ) +} + +export default NextStepsPage diff --git a/src/features/home/pages/home-page.tsx b/src/features/home/pages/home-page.tsx index d1ceeff..cc28c6a 100644 --- a/src/features/home/pages/home-page.tsx +++ b/src/features/home/pages/home-page.tsx @@ -119,7 +119,7 @@ const owners = [ { name: 'Izabel Sampaio Goes', image: 'https://d1b8zs4rmj3xdl.cloudfront.net/iza.jpeg', - role: 'Estagiária de Ciência de Dados e IA na Evo Systems', + role: 'Estagiária de Business Analytics na Amazon', linkedin: 'https://www.linkedin.com/in/izabel-sampaio-goes/' }, { @@ -223,16 +223,16 @@ export function HomePage() { -

+

{words.map((word, index) => ( @@ -243,7 +243,7 @@ export function HomePage() { ))}

@@ -253,19 +253,26 @@ export function HomePage() { - + - + @@ -278,25 +285,33 @@ export function HomePage() { whileInView="visible" transition={{ staggerChildren: 0.04 }} > - - Como o Knowly Funciona - +

+ Como o Knowly Funciona +

+

+ Três passos simples para transformar seus documentos em IA +

+ {process.map((content, idx) => ( - +
+ {idx + 1} +
+ {content.title}
@@ -306,15 +321,15 @@ export function HomePage() { -

+

{content.content}

{idx < process.length - 1 && window.innerWidth >= 768 && ( - + )} {idx < process.length - 1 && window.innerWidth < 768 && ( - + )}
))} @@ -328,13 +343,18 @@ export function HomePage() { whileInView="visible" transition={{ staggerChildren: 0.04 }} > - - Preços - +

+ Preços Simples e Transparentes +

+

+ Escolha o plano perfeito para suas necessidades +

+
( - - {plan.title} - - {plan.price}{' '} - - p/mês - + {idx === 1 && ( +
+ Mais Popular +
+ )} + + + {plan.title} + + + {plan.price} + + p/mês + - + {plan.features.map((feature, idx) => (
- +
+ +
{feature}
))}
- - + +
))} @@ -385,19 +422,24 @@ export function HomePage() { }} variants={variants} > - - FAQ - +

+ Perguntas Frequentes +

+

+ Tudo o que você precisa saber sobre o Knowly +

+
- + {faqs.map((faq, i) => ( {faq.content} @@ -408,7 +450,7 @@ export function HomePage() { Acesse a página completa de FAQ