OnUI: Extensão de Navegador para Feedback Preciso de Interface ao Claude Code

OnUI é uma extensão de navegador que fornece contexto visual para correções de interface ao trabalhar com o Claude Code. Ela resolve o problema comum de ter que descrever qual elemento da interface precisa de atenção, permitindo anotações diretas nas páginas web.

O que o OnUI faz

Você pode clicar em elementos ou desenhar regiões em qualquer página web, adicionar notas sobre o que está errado e exportar um relatório estruturado. O Claude Code lê este relatório via MCP local (Model Context Protocol), dando a ele informações exatas sobre o elemento DOM, seu caminho, sua intenção e nível de severidade. Isso elimina descrições ambíguas como "o botão à direita, não o outro".

Implementação Técnica

O desenvolvedor construiu o OnUI usando o Claude Code ao longo de várias semanas. O Claude Code escreveu a maior parte da base de código TypeScript, incluindo tanto a extensão do navegador quanto o servidor MCP local. Desafios técnicos específicos abordados durante o desenvolvimento incluem:

• Iteração no isolamento do Shadow DOM para evitar conflitos de CSS com as páginas hospedeiras
• Construção da interface de diálogo de anotação e formatadores de exportação
• Depuração da ponte de mensagens nativas entre a extensão e o MCP local

Disponibilidade e Licenciamento

O OnUI é gratuito para uso, sem planos pagos. Está disponível para instalação com um clique na Chrome Web Store e também funciona no Edge e Firefox. O projeto está licenciado sob GPL-3.0, tem zero dependências de nuvem, zero telemetria e é completamente gratuito.

Fluxo de Trabalho de Desenvolvimento

O desenvolvedor observa a ironia de construir uma ferramenta para o Claude Code usando o próprio Claude Code. Seu fluxo de trabalho atual de iteração de interface é: anotar → Claude corrige → verificar → repetir.