Skip to content

Modernize home page with startup-style design and add comprehensive integration documentation with roadmap#70

Merged
enzosakamoto merged 10 commits into
devfrom
copilot/modernize-home-page-ui
Oct 23, 2025
Merged

Modernize home page with startup-style design and add comprehensive integration documentation with roadmap#70
enzosakamoto merged 10 commits into
devfrom
copilot/modernize-home-page-ui

Conversation

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor
  • Analyze current home page design and components
  • Enhance hero section with modern design elements
    • Add gradient backgrounds and glassmorphism effects
    • Improve typography hierarchy and spacing
    • Add subtle animations and visual effects
    • Enhance call-to-action buttons with better visual hierarchy
    • Add badge with emoji for key message
  • Modernize "Como o Knowly Funciona" section
    • Add more visual depth with shadows and gradients
    • Improve card designs with hover effects
    • Better spacing and layout
    • Add numbered badges to cards
  • Enhance pricing section
    • Add featured/highlighted plan with "Mais Popular" badge
    • Better visual hierarchy
    • Modern card designs with scale on hover
    • Improved check icons with background
  • Improve FAQ section styling
    • Better accordion design
    • Enhanced visual appeal with gradient headings
    • Better spacing
  • Update "Sobre nós" section
    • Modern team member cards
    • Better hover effects with scale
    • Active status indicator
  • Test and verify all changes
  • Take final screenshots
  • Add Getting Started documentation page
    • Create new page with step-by-step guide
    • Add "Comece a Usar" menu item in sidebar
    • Include code examples for API integration
  • Add Integration sub-pages documentation
    • Create expandable "Integração" menu with sub-items
    • Add API integration page
    • Add WhatsApp Business integration page with step-by-step guide
    • Add Instagram integration page with step-by-step guide
    • Update sidebar with collapsible sub-menu functionality
  • Update API code snippets to match actual API format
    • Changed endpoint from /v1/query to /chat
    • Changed URL from api.knowly.ai to api.knowly.dev.br
    • Updated request body format (kb_key, model, prompt)
    • Removed Authorization header requirement
    • Updated all code examples in all documentation pages
  • Add "Próximos Passos" documentation page
    • Create roadmap page with future features
    • Add "Próximos Passos" menu item in sidebar with TrendingUp icon
    • Document multi-tenant chatbot system (main feature)
    • Include additional planned features
    • Remove emojis from headings and content

Update: Emojis Removed from Next Steps Page

Removed all emojis from the "Próximos Passos" documentation page for a cleaner, more professional look.

Changes:

  • Removed robot emoji (🤖) from "Sistema de Chatbot Multi-Tenant" heading
  • Removed checkmarks (✅) and forward arrows (🔜) from platform support list
  • Removed chart emoji (📊) from "Análises e Insights Avançados" heading
  • Removed wrench emoji (🔧) from "Customização Avançada de Respostas" heading
  • Removed globe emoji (🌐) from "Suporte Multilíngue" heading
  • Removed link emoji (🔗) from "Integrações com CRMs e Ferramentas" heading

Replaced with:

  • Plain text headings without emojis
  • Text indicators like "(Em breve)" instead of emoji arrows
  • Clean, professional presentation throughout

All content remains the same, just presented in a more formal style without decorative emojis.

Updated Next Steps Page:
Next Steps Without Emojis

Original prompt

Modernize e aprimore a home page #file:home-page.tsx, usando design modernos e chamativos, como se fosse a hero page de uma startup. Precisa ser algo bem bonito. Utilize os textos e elementos já presentes na página para criar uma nova versão.

The user has attached the following files from their workspace:

  • src/features/home/pages/home-page.tsx

Created from VS Code via the GitHub Pull Request extension.


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

…sign

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>
Copilot AI changed the title [WIP] Modernize and improve home page design Modernize home page with modern startup-style design and enhanced visual hierarchy Oct 23, 2025
Copilot AI requested a review from enzosakamoto October 23, 2025 15:05

@enzosakamoto enzosakamoto left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot gere uma página na documentação listando as instruções para começar a usar a plataforma. Gere um item no menu, por exemplo 'Comece a usar'. Nesse seção da documentação, coloque que precisa criar uma conta, depois criar uma base de conhecimento, pegar a chave da base, montar o script para fazer a requisição no código e assim por diante.\

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor Author

@copilot gere uma página na documentação listando as instruções para começar a usar a plataforma. Gere um item no menu, por exemplo 'Comece a usar'. Nesse seção da documentação, coloque que ...

Criada a página de documentação "Comece a Usar" com instruções passo a passo completas! A página inclui:

Passo 1: Criar uma Conta - Como se cadastrar e verificar email
Passo 2: Criar uma Base de Conhecimento - Como criar base e fazer upload de PDFs
Passo 3: Obter a Chave da Base - Como obter API Key e Base ID
Passo 4: Testar no Playground - Como testar antes de integrar
Passo 5: Integrar com seu Código - Exemplos de código em cURL, JavaScript/Node.js e Python

Adicionado item "Comece a Usar" no menu da documentação com ícone de foguete 🚀

Commit: a535afc

Getting Started Page

Sidebar Menu

Copilot AI changed the title Modernize home page with modern startup-style design and enhanced visual hierarchy Modernize home page with modern startup-style design and add Getting Started documentation Oct 23, 2025
Copilot AI requested a review from enzosakamoto October 23, 2025 18:03
@enzosakamoto
enzosakamoto marked this pull request as ready for review October 23, 2025 18:20

@enzosakamoto enzosakamoto left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot Gere novas documentações para colocar serem colocado como sub-itens do item 'Integração'. Ao clicar no ícone, deve aparecer 3 sub-itens: API, WhatsApp Business e Instagram. Na primeira seção de API, use o mesmo texto do que está hoje precisar. No item de WhatsApp Business, adicione instruções de como adicionar as requisições de API dentro do WhatsApp Business para responder mensagens automáticas de clientes. Faça a mesma coisa para a seção do Instagram, adicione informações (passo a passo) de como adiciona requisições da nossa API para responder usuários no instagram automaticamente.

…ith expandable sidebar menu

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor Author

@copilot Gere novas documentações para colocar serem colocado como sub-itens do item 'Integração'. Ao clicar no ícone, deve aparecer 3 sub-itens: API, WhatsApp Business e Instagram. Na primeira s...

Criadas as sub-páginas de integração com menu expansível! O item "Integração" agora possui 3 sub-itens:

API - Integração básica via API REST (mesmo conteúdo da página original)
WhatsApp Business - Guia completo passo a passo:

  • Configurar WhatsApp Business API (Meta ou provedores terceiros)
  • Setup de webhook para receber mensagens
  • Integração com Knowly API (exemplos Node.js e Python)
  • Testes e dicas importantes

Instagram - Guia completo passo a passo:

  • Configurar Instagram Business Account
  • Obter token de acesso da Meta
  • Setup de webhook para DMs
  • Integração com Knowly API (exemplos Node.js e Python)
  • Funcionalidades avançadas e boas práticas

Menu expansível: Clique no ícone "Integração" para expandir/colapsar os sub-itens com animação suave.

Commit: 1f3bdeb

Sidebar com Sub-menu

WhatsApp Integration

Instagram Integration

Copilot AI changed the title Modernize home page with modern startup-style design and add Getting Started documentation Modernize home page with startup-style design and add comprehensive integration documentation Oct 23, 2025
Copilot AI requested a review from enzosakamoto October 23, 2025 19:08

@enzosakamoto enzosakamoto left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot ajuste os snippets de código das documentações de integração para usar os mesmos dados que esperamos na API. Vc consegue pegar os snippets atualizados e revisados no arquivo knowledge-base-detail-modal.tsx. Segue um exemplo de snippet para atualizar nas documentações:

// JavaScript
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: 'Sua pergunta aqui'
  })
})
  .then(response => response.json())
  .then(data => console.log(data.response));

…API format

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor Author

@copilot ajuste os snippets de código das documentações de integração para usar os mesmos dados que esperamos na API. Vc consegue pegar os snippets atualizados e revisados no arquivo knowledge-ba...

Atualizados todos os snippets de código nas documentações de integração para usar o formato correto da API!

Mudanças aplicadas:

  • ✅ Endpoint atualizado: https://api.knowly.dev.br/chat
  • ✅ Removido header de Authorization
  • ✅ Formato do body atualizado:
    • kb_key (exemplo: knowly_c81a7410-4c69-45e2-b6c6-79205c3a99fd)
    • model (exemplo: MISTRAL_SMALL)
    • prompt

Páginas atualizadas:

  • /docs/getting-started - exemplos cURL, JavaScript e Python
  • /docs/integration/api - exemplo básico de API
  • /docs/integration/whatsapp - exemplos Node.js e Python
  • /docs/integration/instagram - exemplos Node.js e Python

Todos os snippets agora correspondem exatamente ao formato usado em knowledge-base-detail-modal.tsx e podem ser copiados e usados diretamente.

Commit: 068bf4d

Getting Started Updated

WhatsApp Integration Updated

Copilot AI requested a review from enzosakamoto October 23, 2025 19:30

@enzosakamoto enzosakamoto left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot adicione um item no menu nas documentações de 'Próximos passos' com o nosso roadmap de novas features. Queremos implementar um sistema de chatbot multi tenant para que as pessoas não se preocupem em gerenciar os sistemas para consumir as APIs das bases de conhecimento da nossa plataforma, só precisarão integrar o sistema de chatbot nosso nas suas plataformas (e-commerce, whatsapp, instagram etc.).

…ot system

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor Author

@copilot adicione um item no menu nas documentações de 'Próximos passos' com o nosso roadmap de novas features. Queremos implementar um sistema de chatbot multi tenant para que as pessoas não se p...

Criada a página "Próximos Passos" na documentação com o roadmap completo de novas features!

Destaques da página:

🤖 Sistema de Chatbot Multi-Tenant (Em Desenvolvimento)

  • Zero configuração de infraestrutura - sem necessidade de servidores próprios
  • Integração simplificada com WhatsApp Business, Instagram e outras plataformas
  • Gerenciamento centralizado de todos os chatbots
  • Escalabilidade automática e monitoramento em tempo real

Outras features no roadmap:

  • 📊 Análises e insights avançados
  • 🔧 Customização avançada de respostas
  • 🌐 Suporte multilíngue
  • 🔗 Integrações com CRMs (Salesforce, HubSpot, Pipedrive)

A página detalha como o sistema funcionará passo a passo, plataformas suportadas, e todos os benefícios para os usuários. Adicionado item "Próximos Passos" no menu da documentação com ícone TrendingUp 📈

Commit: d98ee79

Next Steps Page

Sidebar Menu

Copilot AI changed the title Modernize home page with startup-style design and add comprehensive integration documentation Modernize home page with startup-style design and add comprehensive integration documentation with roadmap Oct 23, 2025
Copilot AI requested a review from enzosakamoto October 23, 2025 19:53

@enzosakamoto enzosakamoto left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot remova os emojis que colocou nessa última documentação

Co-authored-by: enzosakamoto <98707474+enzosakamoto@users.noreply.github.com>

Copilot AI commented Oct 23, 2025

Copy link
Copy Markdown
Contributor Author

@copilot remova os emojis que colocou nessa última documentação

Removidos todos os emojis da documentação "Próximos Passos"!

Alterações:

  • Títulos das seções sem emojis (🤖, 📊, 🔧, 🌐, 🔗 removidos)
  • Lista de plataformas com texto "(Em breve)" em vez de ✅ e 🔜
  • Apresentação mais limpa e profissional

Commit: a4569b4

Next Steps Sem Emojis

@enzosakamoto
enzosakamoto merged commit 465069c into dev Oct 23, 2025
1 check passed
@enzosakamoto
enzosakamoto deleted the copilot/modernize-home-page-ui branch October 23, 2025 20:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants