FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
diegoivo
diegoivobrainstorming
Public
Like
brainstorming
Home
Code
3
backend
1
frontend
3
README.md
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in miliseconds.
Sign up now
Code
/
Code
/
Search
README.md

Brainstorming com IA - Conversion

Uma ferramenta profissional de brainstorming que utiliza a metodologia "How Might We" combinada com Inteligência Artificial para transformar desafios em oportunidades.

🚀 Funcionalidades

  • Metodologia How Might We: Framework comprovado usado pelas empresas mais inovadoras
  • IA Avançada: Integração com Gemini 2.5 Flash Preview para gerar insights únicos
  • Interface Intuitiva: Design limpo e profissional seguindo a identidade visual da Conversion
  • Autenticação Completa: Login com Google OAuth e email/senha
  • Histórico de Sessões: Salve e acesse suas sessões anteriores
  • Exportação: Exporte resultados em PDF (em desenvolvimento)

🛠 Tecnologias

  • Backend: Hono framework
  • Frontend: HTML/CSS/JavaScript com TailwindCSS
  • Database: SQLite
  • IA: Google Gemini 2.5 Flash Preview
  • Autenticação: Google OAuth + sessões customizadas

📋 Estrutura do Projeto

├── backend/
│   └── index.ts             # API principal com Hono
├── frontend/
│   ├── index.html           # Landing page
│   ├── signup.html          # Página de cadastro
│   └── app.html             # Interface do chat
└── README.md

🔧 Configuração

Variáveis de Ambiente Necessárias

GEMINI_API_KEY=sua_chave_do_gemini GOOGLE_CLIENT_ID=seu_google_client_id GOOGLE_CLIENT_SECRET=seu_google_client_secret

Como Obter as Chaves

  1. Gemini API Key:

    • Acesse Google AI Studio
    • Crie uma nova API key
    • Copie a chave gerada
  2. Google OAuth:

    • Acesse Google Cloud Console
    • Crie um novo projeto ou selecione um existente
    • Ative a Google+ API
    • Crie credenciais OAuth 2.0
    • Configure as URLs de redirecionamento

🎯 Como Usar

1. Landing Page (/)

  • Apresenta a ferramenta e seus benefícios
  • Call-to-action para cadastro
  • Design responsivo com identidade Conversion

2. Cadastro (/signup)

  • Formulário completo de lead capture
  • Integração com Google OAuth
  • Validação de campos obrigatórios

3. Interface de Brainstorming (/app)

  • Chat interativo com IA
  • Geração automática de perguntas "How Might We"
  • Histórico de sessões
  • Categorização de perguntas por temas

🤖 Metodologia How Might We

A ferramenta implementa o framework "How Might We" seguindo estas etapas:

  1. Análise do Desafio: A IA analisa o problema apresentado
  2. Geração de Perguntas: Cria 5-7 perguntas estratégicas
  3. Categorização: Organiza por temas (Tecnologia, Pessoas, Processos, etc.)
  4. Exploração: Sugere direções para cada pergunta
  5. Desenvolvimento: Facilita o diálogo para gerar soluções

📊 Schema do Banco de Dados

Tabela users

  • Informações completas do usuário
  • Dados de empresa e cargo
  • Intenção de contratação de SEO

Tabela sessions

  • Sessões de brainstorming
  • Desafio inicial
  • Status da sessão

Tabela messages

  • Histórico de conversas
  • Mensagens do usuário e IA
  • Timestamp de criação

Tabela hmw_questions

  • Perguntas "How Might We" geradas
  • Categorização automática
  • Vinculação com sessões

🎨 Design System

Cores

  • Primary Blue: #2563EB (Conversion)
  • Backgrounds: Tons de cinza e branco
  • Accents: Gradientes sutis em azul

Tipografia

  • Font: Inter (Google Fonts)
  • Weights: 300, 400, 500, 600, 700

Componentes

  • Cards: Border radius 8px, sombras sutis
  • Buttons: Transições suaves, hover effects
  • Forms: Validação visual, estados de foco

🔒 Segurança

  • Autenticação: Tokens de sessão seguros
  • Validação: Sanitização de inputs
  • CORS: Configuração automática do Val Town
  • Environment: Variáveis sensíveis protegidas

📱 Responsividade

  • Mobile First: Design otimizado para dispositivos móveis
  • Breakpoints: Adaptação para tablet e desktop
  • Sidebar: Colapsível em telas menores
  • Touch: Interfaces otimizadas para toque

🚀 Deploy

O projeto está configurado para deploy automático no Val Town:

  1. Configure as variáveis de ambiente
  2. O backend será executado automaticamente
  3. As páginas frontend são servidas estaticamente
  4. O banco SQLite é inicializado na primeira execução

🔧 Correções Recentes

✅ Modal de Login na Página de Cadastro

  • Problema: Link "Já tem uma conta? Faça login" recarregava a página em vez de abrir o modal
  • Solução: Adicionado return false; no onclick para prevenir o comportamento padrão do link
  • Status: Corrigido ✅

📈 Próximas Funcionalidades

  • Exportação em PDF
  • Compartilhamento de sessões
  • Templates de desafios
  • Análise de sentimentos
  • Integração com ferramentas de produtividade
  • Dashboard de métricas
  • Modo colaborativo em tempo real

🤝 Contribuição

Este projeto segue os padrões de desenvolvimento da Conversion:

  • Código limpo e documentado
  • Testes unitários (em desenvolvimento)
  • Padrões de commit semântico
  • Review de código obrigatório

📞 Suporte

Para dúvidas ou suporte:

  • Email: suporte@conversion.com.br
  • Website: https://conversion.com.br

Desenvolvido com ❤️ pela equipe Conversion

Code
backendfrontendREADME.md
Go to top
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Product
FeaturesPricing
Developers
DocsStatusAPI ExamplesNPM Package Examples
Explore
ShowcaseTemplatesNewest ValsTrending ValsNewsletter
Company
AboutBlogCareersBrandhi@val.town
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.