Aqui está uma prévia da interface e das funcionalidades principais da extensão:
⏱️ Timer de Foco
|
⚙️ Configurações e Idiomas
|
|
📊 Dashboard de Produtividade (Métricas de Estudo)
Acompanhamento detalhado do tempo dedicado por categoria com suporte a i18n. |
|
Study AI é uma extensão para Chrome que implementa a técnica Pomodoro com recursos avançados de análise e personalização. O projeto foi desenvolvido com assistência de IA (GitHub Copilot), demonstrando como ferramentas de IA podem acelerar o desenvolvimento de software moderno.
Este projeto é um exemplo prático de desenvolvimento assistido por IA, onde:
- ✅ A arquitetura foi planejada com auxílio de IA
- ✅ Código otimizado e revisado por ferramentas inteligentes
- ✅ Documentação técnica gerada de forma eficiente
- ✅ Debugging acelerado com análise automatizada
- 3 Modos de Estudo: Foco (25 min), Pausa Curta (5 min), Pausa Longa (15 min)
- Controles Intuitivos: Iniciar, Pausar, Resetar com um clique
- Persistência de Estado: Timer continua rodando mesmo fechando o popup
- Notificações Sonoras: 4 tipos de sons personalizáveis (Sparkle, Piano, Chime, Bell)
- Controle de Volume: Ajuste fino de 0-100% com preview em tempo real
- Gráfico Semanal: Visualize suas sessões de estudo por dia da semana
- Análise por Categoria: Distribua seu tempo entre diferentes áreas de estudo
- Histórico Completo: Acompanhe seu progresso ao longo do tempo
- Export/Import de Dados: Backup completo em formato JSON
- Temas: Modo claro e escuro
- Categorias Customizáveis: Crie categorias para organizar seus estudos
- Sons de Notificação: Escolha entre 4 sons com síntese Web Audio API
- Interface Responsiva: Design glassmorphism moderno e clean
- Autenticação OAuth 2.0
- Controles de reprodução direto no timer
- Sincronização com suas playlists
- HTML5 + CSS3: Interface moderna com Glassmorphism
- JavaScript (ES6+): Lógica assíncrona e event-driven
- Chart.js: Visualização de dados interativa
- Service Worker (background.js): Timer persistente em background
- Offscreen Documents: Reprodução de áudio (Web Audio API)
- Chrome Storage API: Persistência local de dados
- Chrome Identity API: OAuth 2.0 para Spotify
- Web Audio API: Geração de tons com envelope ADSR
- Offscreen Documents: Compatibilidade com Manifest V3
-
Clone o repositório:
git clone https://github.com/seu-usuario/study-ai.git cd study-ai -
Abra o Chrome e acesse:
chrome://extensions/ -
Ative o "Modo do desenvolvedor" (toggle no canto superior direito)
-
Clique em "Carregar sem compactação"
-
Selecione a pasta do projeto (onde está o
manifest.json) -
Pronto! A extensão aparecerá no canto superior direito do navegador 🎉
# Em breve: build automatizado
npm run build- Clique no ícone da extensão no Chrome
- Selecione o modo desejado (Foco, Pausa Curta, Pausa Longa)
- Clique em "Iniciar"
- O timer continua rodando mesmo se fechar o popup!
- Quando terminar, ouça a notificação sonora 🔔
- Clique na aba "Estatísticas"
- Veja seu gráfico semanal de produtividade
- Analise distribuição por categoria de estudo
- Exporte seus dados para backup (JSON)
- Clique na aba "Configurações"
- Tipo de Som: Escolha entre Sparkle, Piano, Chime, Bell
- Volume: Ajuste com o slider (0-100%)
- Testar Som: Clique no botão 🔊 para preview
- Tema: Alterne entre claro/escuro
- Idioma: Português ou Inglês
study-ai/
├── manifest.json # Configuração da extensão (MV3)
├── background.js # Service Worker (timer, storage, API)
├── popup.html # Interface principal (3 abas)
├── popup.js # Lógica do frontend
├── offscreen.html # Documento para áudio (MV3)
├── offscreen.js # Síntese de áudio (Web Audio API)
├── chart.js # Biblioteca Chart.js (local)
├── icon.png # Ícone da extensão
└── README.md # Este arquivo
-
Arquitetura Inicial
- IA sugeriu estrutura de Service Worker para MV3
- Propôs padrão de mensagens entre popup ↔ background
- Definiu estratégia de persistência com Chrome Storage API
-
Implementação de Funcionalidades
- Timer: Lógica de contagem regressiva com sincronização
- Áudio: Síntese Web Audio API com envelope ADSR
- Gráficos: Integração Chart.js com dados dinâmicos
- Spotify OAuth: Fluxo de autenticação completo
-
Debugging e Otimização
- IA identificou problemas de message passing
- Corrigiu inconsistências de estado
- Otimizou performance do timer
-
Documentação
- README profissional gerado
- Comentários de código claros
- Guias de teste criados
- GitHub Copilot: Autocompletar código e sugestões contextuais
- ChatGPT/Claude: Planejamento de arquitetura e debugging
- IA para Testes: Geração de cenários de teste
- Verifique se a extensão está ativada em
chrome://extensions/ - Recarregue a extensão clicando no ícone de reload
- Abra o console do background: Developer Tools → Service Worker
- Verifique o volume do sistema (não está mudo?)
- Ajuste o volume no slider da extensão
- Teste com o botão 🔊 "Testar Som"
- Console do offscreen deve mostrar:
[Offscreen] Teste de som: sparkle (volume: 70%)
- Complete pelo menos uma sessão de estudo (25 min)
- Dados são salvos automaticamente ao final de cada sessão
- Export/Import para backup dos dados
Contribuições são bem-vindas! Este projeto é open-source e aceita:
- Reportar Bugs: Abra uma issue descrevendo o problema
- Sugerir Funcionalidades: Compartilhe suas ideias
- Pull Requests: Fork → Branch → Commit → PR
- Integração completa com Spotify
- Sincronização em nuvem (Google Drive)
- Notificações desktop nativas
- Suporte para múltiplos idiomas
- Mobile companion app
- Análise avançada com IA (previsão de produtividade)
Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.
Desenvolvido com 💙 e ☕ por [Daniel Mourão Lopes]
- GitHub: @DanielMouraoti
- LinkedIn: Daniel Mourão
- GitHub Copilot pela assistência no desenvolvimento
- Comunidade Chrome Extensions pela documentação
- Chart.js pela biblioteca de gráficos
- Web Audio API pela síntese de áudio
⭐ Se este projeto te ajudou, deixe uma estrela no repositório! ⭐


