Feedback Widget
Da dor corporativa à proposta de solução
Ato 1 — O silêncio perigoso
Em rotinas corporativas, vi times perderem tempo investigando bugs com pouca informação. Tickets chegavam tarde e sem contexto visual. A dor maior não era o bug — era o silêncio.
Sem feedback no contexto, as correções viram apostas: custam tempo, foco e confiança.
Ato 2 — O insight
E se o usuário contasse a história no momento exato da dor, com captura de tela automática? Transformar frustração em direção, reduzindo ruído na triagem.
Ato 3 — A proposta
Um widget embutido, não intrusivo, com três pilares:
- Contexto imediato: screenshot e metadados leves.
- Fricção quase zero: 3 tipos de feedback (Problema, Ideia, Outro) e envio em segundos.
- Ciclo completo: notificação por e‑mail e registro no backend para análise posterior.
Ato 4 — Impacto esperado (hipótese)
Ainda sem clientes reais; o objetivo é validar estes ganhos em um piloto:
- Tempo para entender um bug: ↓ 60–80% com screenshot contextual.
- Custo de triagem por ticket: ↓ 30–50%.
- Lead time (descoberta → fix): ↑ 2–3x.
- Ideias acionáveis/mês: aumento consistente com classificação simples.
Proposta pronta para experimento controlado (PoC) e medições com métricas claras.
Ato 5 — Próximos passos
- Roteamento: bugs → board técnico; ideias → backlog de discovery.
- Agrupamento temático: termos-chave e tela de origem.
- SDK mobile (Expo) para ampliar o alcance.
Demo interativa
Funcionalidades Principais
- Tipos de feedback: Problema, Ideia e Outro, com categorias personalizáveis.
- Captura automática de tela: Registra o estado da interface para agilizar o suporte.
- UI acessível e responsiva: Navegação por teclado, ARIA labels e pronto para mobile.
- Notificações por e‑mail: Envio de detalhes via Nodemailer.
- API Backend: Armazenamento via Prisma com SQLite por padrão.
- Testes: Unitários com Jest.
Arquitetura e Stack Tecnológico
| Categoria | Tecnologia | Propósito |
|---|---|---|
| Web (Frontend) | React + Vite + Tailwind CSS | UI do widget e estilos. |
| Mobile | Expo / React Native | Cliente mobile opcional. |
| Servidor (Backend) | Node.js (Express) | API REST para receber feedbacks. |
| ORM & Banco | Prisma + SQLite | Modelagem e persistência de dados. |
| Nodemailer | Envio dos resumos de feedback. | |
| Testes | Jest | Testes unitários de casos de uso. |
| Linguagem | TypeScript | Segurança de tipos em toda a stack. |
| Hospedagem | Vercel | CI/CD e CDN global. |