Criação de plug-ins de resultados personalizados com o código Claude

Um guia passo a passo para ampliar o StrategyQuant X usando o desenvolvimento assistido por IA

Introdução

Começando com StrategyQuant X build 144, Se o usuário não tiver acesso a um plug-in de resultados personalizado, ele poderá ser criado por meio de vibecodificação usando o Aplicativo de desktop Claude Code. O StrategyQuant X sempre foi compatível com os plug-ins personalizados do Results, como arquivos HTML estáticos carregados na guia Results, mas a criação de um era complicada e fora do alcance da maioria dos usuários, exigindo habilidades sólidas em JavaScript, conhecimento da API PostMessage, do modelo de dados SQX e de temas CSS.

A partir da compilação 144, isso muda. Agora você pode criar plug-ins com recursos completos descrevendo o que deseja em inglês simples. O Claude lê o guia de plug-ins do SQX que acompanha sua instalação, compreende as convenções usadas pelos plug-ins existentes e gera código com qualidade de produção que você pode inserir diretamente na guia Resultados.

Este guia o orienta no processo completo de criação de um plug-in real - o Tabela de pontuação de robustez, que classifica qualquer estratégia de 0 a 100 em seis pilares de robustez. Cada etapa é algo que você pode reproduzir em sua própria sessão do Claude Code. O Scorecard está disponível para download aqui:

[Captura de tela: O plug-in Robustness Scorecard finalizado em execução na guia Resultados do SQX, mostrando o círculo de pontuação, o grau da letra e as barras de pilar].

Pré-requisitos

Antes de começar, verifique se você tem:

• EstratégiaQuant X instalado - licença Pro ou Ultimate (a camada Starter não oferece suporte a plug-ins personalizados)
• Aplicativo de desktop Claude Code instalado a partir de claude.com/claude-code
• Uma compreensão básica de onde user/extend/ResultsPlugins/ reside em sua instalação do SQX
• Pelo menos uma estratégia de backtested disponível em um banco de dados para ser testada

Não é necessário ter conhecimento de JavaScript, Vue ou CSS.

Etapa 1 - Abra a pasta de plug-ins no Claude Code

Inicie o aplicativo de desktop Claude Code e abra o user/extend/ResultsPlugins/ de sua instalação do SQX (File → Open Folder (Arquivo → Abrir pasta), ou arraste a pasta para o ícone do aplicativo).

Quando a pasta é aberta, o Claude Code pega automaticamente o Arquivo CLAUDE.md mantido pela equipe do SQX. Esse arquivo contém a arquitetura completa do plug-in, a API PostMessage completa, a lista de campos de estatísticas disponíveis, regras de temas, requisitos de isenção de responsabilidade e padrões de dicas de ferramentas. A partir desse momento, o Claude sabe tudo o que precisa para criar um plug-in que se encaixe naturalmente ao lado dos oficiais.

[Captura de tela: Janela do Claude Code com a pasta ResultsPlugins aberta no Claude Code].

Etapa 2 - Permita que o Claude examine o ambiente

Envie sua primeira mensagem ao Claude:

Examine essa pasta para obter habilidades e instruções para codificar o plug-in de resultado.

Claude lê CLAUDE.md e resume os principais fatos para você: os plug-ins residem em sua própria subpasta com um único index.html, a comunicação com o SQX ocorre exclusivamente via postMessage, o corpo deve usar overflow:hidden, o Vue 3 é suportado por meio de um tempo de execução local e assim por diante.

Essa etapa de carregamento de contexto é essencial. Depois que o Claude confirmar que entende o ambiente, tudo o que ele produzir posteriormente respeitará as convenções do SQX sem que você tenha de reafirmá-las.

[Captura de tela: Janela de bate-papo do Claude Code mostrando o resumo de Claude sobre a arquitetura do plug-in após a leitura de CLAUDE.md.].

Etapa 3 - Brainstorming de ideias de plugins

Em vez de se comprometer com uma implementação imediatamente, peça opções à Claude:

Escreva para mim um novo plug-in para o SQX que pontuará a estratégia em termos de robustez com base nos resultados das estatísticas e sugira 10 ideias.

Claude responde com dez abordagens diferentes - scorecards ponderados, listas de verificação de semáforos, analisadores IS/OOS, testes de estresse Monte Carlo, gráficos de radar, detectores de risco de cauda, medidores de sobreajuste e muito mais. Cada ideia vem com uma breve descrição e os campos de estatísticas nos quais ela se basearia.

Essa fase de brainstorming é uma das maiores vantagens de trabalhar com um colaborador de IA. Você vê uma gama de opções que talvez nunca tenha considerado e mantém o controle da direção final.

[Captura de tela: A lista de 10 ideias de plug-ins no bate-papo do Claude Code, com breves descrições em cada uma delas].

Etapa 4 - Solicitar um plano de implementação

Depois de escolher uma ideia, solicite um plano detalhado antes de escrever qualquer código:

Escreva um plano de implementação para a ideia 1. Scorecard de robustez (0-100).

O Claude produz um plano passo a passo: a estrutura de pastas, os dados que ele buscará (três arquivos paralelos, um para cada pasta e um para cada arquivo). Chamadas GET_STATS - em ambas as direções, somente longa, somente curta), o modelo de pontuação com seis pilares e seus pesos, os pontos de normalização para cada métrica, o layout da interface do usuário com um círculo de pontuação e barras de pilar, a ordem de construção e uma lista explícita de cortes de escopo para coisas que serão não estar na versão um.

Leia o plano com atenção. Este é o momento mais econômico para mudar de direção - corrigir um erro conceitual agora requer uma frase, enquanto corrigi-lo após a implementação requer várias iterações.

[Captura de tela: O plano de implementação no chat, mostrando a tabela de pesos dos pilares e a configuração de pontuação].

Etapa 5 - Aprovar e gerar o código

Quando o plano parece correto, uma simples confirmação é suficiente:

ok, faça isso

Claude cria um novo RobustnessScorecard/, copia o vue.global.prod.js a partir de um plug-in existente (o SQX é executado off-line, portanto, todas as dependências devem ser locais) e gera um único index.html contendo:

• Variáveis CSS para temas claros e escuros
• Um aplicativo Vue 3 com um manipulador de eventos de mensagem
• Três paralelos Solicitações GET_STATS com um contador que aguarda todas as respostas antes de computar
• A Objeto CONFIG que contém pesos de pilar
• A função norm() para normalização métrica linear por partes
• Os cálculos dos seis pilares com fallbacks para dados ausentes
• Um portão de baixa negociação (menos de 100 negociações limita o pilar de amostra a 30)
• Reponderação automática quando um pilar não tem entradas válidas
• A interface de usuário completa: círculo de pontuação, nota por letra, veredicto, principais pontos fracos e barras de pilar

Aproximadamente 500 linhas de código com qualidade de produção em um único arquivo, pronto para ser inserido no SQX.

[Captura de tela: A pasta RobustnessScorecard recém-criada na árvore de arquivos com index.html e vue.global.prod.js visíveis].

Etapa 6 - Adicione a isenção de responsabilidade padrão

Qualquer ferramenta que interprete o desempenho das negociações deve incluir uma isenção de responsabilidade. Claude já conhece essa regra de CLAUDE.md, mas você pode acionar a etapa explicitamente:

Adicione também um aviso de isenção de responsabilidade correspondente aos outros plug-ins.

Claude analisa como O Prop Analytics e o Prop Monte Carlo implementam suas isenções de responsabilidade, aplicam a mesma classe CSS (11px, cor suave, border-top, texto justificado, flex-shrink:0) e coloca o bloco como o último elemento dentro de #app. Especificamente para a tabela de pontuação, Claude acrescenta uma frase extra esclarecendo que uma pontuação alta não garante o desempenho futuro e uma pontuação baixa não garante o fracasso.

Como o Claude corresponde ao padrão usado pelos plug-ins existentes, o aviso de isenção de responsabilidade é visualmente consistente com o restante da guia Resultados.

[Captura de tela: A visualização do plug-in mostrando a barra de isenção de responsabilidade na parte inferior do iframe, sob as barras de pilar].

Etapa 7 - Adicione dicas de ferramentas com explicações práticas

Essa é a etapa que transforma o plug-in de uma ferramenta de pesquisa em algo que qualquer pessoa pode usar:

Faça também as dicas de ferramentas com explicações práticas.

Claude adiciona um padrão de dica de ferramenta em CSS puro ([data-tip]:hover::after com white-space: pre-line) e cria um único objeto centralizado objeto TOOLTIPS na parte superior do script. Cada dica de ferramenta segue uma estrutura de três perguntas:

1. O que é - uma definição em linguagem simples
2. Como ler - limiares de concreto fraco / OK / bom
3. Por que é importante - um breve exemplo do mundo real

Por exemplo, a dica de ferramenta do Profit Factor diz:

Profit Factor = lucro bruto ÷ prejuízo bruto.
Fraco: <1,2 - OK: 1,2-1,5 - Bom: 1,5+.
Exemplo: 1,87 significa que você ganha $1,87 para cada $1 perdido.

As dicas de ferramentas são anexadas ao título, à pontuação máxima, à nota da letra, a cada nome de pilar e a cada métrica bruta que o plug-in exibe. Um sutil sublinhado pontilhado marca o que é possível passar o mouse para que os usuários possam descobri-las.

[Captura de tela: uma dica de ferramenta que aparece ao passar o mouse sobre "Robustness scorecard".]

Etapa 8 - Atualizar CLAUDE.md para futuros plug-ins

Essa é a etapa que se acumula ao longo do tempo. Peça ao Claude para documentar o que acabou de aprender:

Atualizar CLAUDE.md - adicionar instruções sobre dicas de ferramentas com exemplos práticos e sobre a isenção de responsabilidade. Verifique os outros plug-ins para saber o que eles já usam.

Claude examina os plug-ins existentes quanto à marcação e ao estilo do aviso de isenção de responsabilidade, escreve uma nova seção "Tooltips & Explaining Metrics to Users" (Dicas de ferramentas e explicação de métricas para usuários) que abrange a regra das três perguntas, o padrão de dica de ferramenta em CSS puro, uma cópia pronta para uso de métricas comuns e cinco exemplos práticos. Ele também adiciona uma seção "Disclaimer (Required)" (Isenção de responsabilidade (obrigatória)) com o texto padrão, o bloco CSS padrão, o posicionamento correto no layout, o padrão i18n e uma lista de verificação de revisão. Por fim, ele acrescenta RobustnessScorecard à tabela Exemplos de plug-ins existentes.

Após essa etapa, o próximo plug-in que você criar começará a partir de uma linha de base aprimorada - a plataforma literalmente aprende com suas próprias extensões.

[Captura de tela: O arquivo CLAUDE.md na pasta do plug-in de resultados].

Etapa 9 - Teste o plug-in dentro do StrategyQuant X

Feche o SQX e inicie-o novamente (ou clique no ícone de recarga na guia Resultados). Abra qualquer estratégia de um banco de dados, vá para a seção Resultados e você deverá ver Tabela de pontuação de robustez listados junto com os plug-ins existentes.

O que verificar:

• A pontuação geral e a nota por letra são computadas corretamente
• Todas as seis barras de pilar são renderizadas com as cores apropriadas - vermelho, âmbar ou verde, dependendo da pontuação
• Passar o mouse sobre os nomes dos pilares, o círculo de pontuação, a nota e cada métrica bruta mostra uma dica de ferramenta
• Alternar a skin SQX entre os modos claro e escuro também altera o plug-in
• Uma estratégia com menos de 100 negociações vê seu pilar de Tamanho da amostra limitado a 30
• Uma estratégia unilateral (somente a longo prazo ou somente a curto prazo) é penalizada no pilar Simetria

Se algo der errado, abra o DevTools do navegador do plug-in (clique com o botão direito do mouse dentro do plug-in → Inspecionar), copie todos os erros do console, cole-os no Claude Code e deixe que o Claude os corrija. Você nunca sai da conversa.

[Captura de tela: A guia SQX Results com a guia Robustness Scorecard selecionada e uma estratégia real carregada, mostrando a pontuação calculada e todos os pilares].

Etapa 10 - Iteração

É aqui que os plug-ins personalizados deixam de parecer uma entrega única e começam a parecer uma ferramenta viva. Cada solicitação de acompanhamento ao Claude pode ser de forma livre - ele já conhece o código-fonte completo e pode fazer alterações direcionadas. Acompanhamentos comuns:

• "Tornar os pesos dos pilares configuráveis a partir de entradas na parte superior do plug-in."
• "Adicione arquivos de localidade para en/cs/de e conecte-os a SET_LANGUAGE."
• "Adicione um painel de histórico mostrando as últimas 5 estratégias que eu marquei."
• "Adicione um sétimo pilar para consistência de tempo com base na distribuição mensal de lucros."
• "Deixe-me exportar o scorecard atual como um PNG."

Claude preserva a estrutura que você já tem e acrescenta apenas o que você solicitou.

Dicas para vibecoding produtivo

Sempre solicite um plano antes do código. Ler um plano de implementação custa trinta segundos e economiza trinta minutos de iteração se o projeto estiver errado.

Mantenha a configuração centralizada. Limites, pesos, cópia da dica de ferramenta, regras de cores - peça ao Claude para colocar tudo isso em um CONFIG ou objeto TOOLTIPS na parte superior do arquivo. Isso torna o ajuste trivial e a tradução futura possível.

Deixe CLAUDE.md crescer. Sempre que você perceber que está repetindo uma regra ("sempre adicione um aviso de isenção de responsabilidade, sempre adicione dicas de ferramentas, sempre combine com o tema existente"), peça ao Claude para escrevê-la em CLAUDE.md. Os futuros plug-ins herdarão a regra automaticamente.

Teste em estratégias com perfis diferentes. Experimente uma estratégia com poucas negociações, uma estratégia unilateral, uma altamente lucrativa e uma pouco lucrativa. Se a pontuação não corresponder às suas expectativas, ajuste os pontos de normalização - uma frase para Claude é suficiente.

Não se apresse. Um bom plug-in por tarde é um ritmo realista. Uma ferramenta bem acabada em que você confia vale mais do que várias ferramentas incompletas.

O que você pode construir em seguida

O Scorecard de Robustez é apenas o começo. Durante a etapa inicial de brainstorming, Claude sugeriu nove outros plug-ins, cada um deles podendo ser criado em uma única sessão usando o mesmo fluxo de trabalho descrito acima:

Cada uma delas corresponde a aproximadamente uma tarde de conversa com Claude Code. E porque CLAUDE.md agora contém os padrões reutilizáveis do Robustness Scorecard - regras de dicas de ferramentas, padrões de isenção de responsabilidade, convenções de temas - cada plug-in subsequente começa com uma linha de base mais alta do que o anterior.

Plug-ins de exemplo existentes

Análise de Prop

Localização: user/extend/ResultsPlugins/Prop analytics/
Pilha tecnológica: Vue 3 (tempo de execução local) + CSS puro, único index.html
Objetivo: Painel estatístico avançado projetado especificamente para avaliar estratégias em relação a regras das firmas de negociação proprietárias (FTMO, TopStep e similares).

O que ele faz

A análise do Prop utiliza uma única estratégia e a examina através das lentes que uma empresa de consultoria usaria antes de aceitar ou rejeitar sua conta. Em vez de mostrar estatísticas genéricas, ele responde às perguntas exatas que uma avaliação de financiamento faz: "Essa estratégia teria ultrapassado o limite de drawdown diário? Um único dia gerou muito lucro? O quanto ela chegou perto de falhar?"

O plug-in permite que o usuário configure os parâmetros de avaliação na parte superior - capital inicial, limite de drawdown diário, tamanho do contrato, alavancagem máxima permitida e um "limiar pós-ruptura" para detecção de borda. Tudo abaixo é recalculado ao vivo.

[Captura de tela: O painel de entrada da análise Prop com os parâmetros de avaliação (capital inicial, limite diário de DD, tamanho do contrato, alavancagem máxima, limite pós-ruptura).

Principais cartões de análise

A análise Prop é construída como uma grade de cartões focados, cada um respondendo a uma pergunta:

• Prop Restrições da empresa - pior drawdown em um único dia, limite diário de headroom, conformidade com a regra de consistência (a regra "nenhum dia com mais de 30-50% de lucro" usada pela maioria das empresas)
• Daily Profit & Loss - blocos cronológicos de dias em verde/vermelho com destaque para o melhor e o pior dia
• Risco de margem e alavancagem - simula as regras de margem da empresa calculando a alavancagem real (valor nocional de negociações abertas simultaneamente ÷ saldo da conta) e sinaliza violações
• Vantagem pós-ruptura - mede se há uma vantagem estatística em esperar por X perdas consecutivas antes de implementar a estratégia (retorno da linha de base versus retorno pós-perda, taxa de ganhos após perdas, tempo médio de recuperação)
• Duração do drawdown - Maior tempo debaixo d'água em dias
• Comportamento do tempo de espera - compara a duração média das negociações vencedoras com a duração média das negociações perdedoras e sinaliza o comportamento assimétrico (manter os perdedores por mais tempo do que os vencedores é um sinal de alerta psicológico clássico)
• Pontuação de consistência - desvio padrão mensal e porcentagem de dias lucrativos
• Risco de cauda (95%) - Valor em risco e déficit esperado (CVaR) para o pior 5% de dias
• Desempenho do regime - classifica o ambiente de mercado (Momentum, Choppy, High Volatility) em que a estratégia prospera e em que se perde

Padrões que demonstra

O Prop analytics é o plug-in de referência para qualquer coisa que envolva processamento em nível de pedidos. Ele obtém a lista completa de pedidos via GET_ORDERS e deriva o P&L diário, a exposição de alavancagem, as frequências de sequência e os tempos de recuperação inteiramente em JavaScript - nada vem pré-computado da SQX.

É também a referência para localização. O plug-in é fornecido com traduções completas em doze idiomas (en, cs, de, es, fr, id, it, pl, pt, ru, zh-CN, zh-TW), todas armazenadas no diretório locales/ subpasta como arquivos JSON simples. Cada rótulo voltado para o usuário e cada dica de ferramenta vem de uma chave de localidade. O auxiliar Vue <code class="bg-bg-100/50 border border-0.5 border-border-300 text-danger-000 rounded-[0.4rem] px-1 py-px font-mono text-[13px]">tHtml() renderiza cadeias de caracteres contendo HTML para que as dicas de ferramentas possam incluir <code class="bg-bg-100/50 border border-0.5 border-border-300 text-danger-000 rounded-[0.4rem] px-1 py-px font-mono text-[13px]"><strong> e <code class="bg-bg-100/50 border border-0.5 border-border-300 text-danger-000 rounded-[0.4rem] px-1 py-px font-mono text-[13px]"><br> tags.

E, por fim, é a referência para dicas de ferramentas avançadas. Quase todas as métricas e títulos de cartas têm um data-tip apoiado por uma chave de local tooltipHtml. O texto da dica de ferramenta não apenas define a métrica, mas também explica por que uma firma de propriedades se preocupa com ela, muitas vezes com um exemplo concreto em dólares ("Se você começar a terça-feira com $100.000, ganhar para $102k, mas depois fechar um perdedor para cair para $96.000, sua queda diária é de 4%...").

Prop Monte Carlo

Localização: user/extend/ResultsPlugins/Prop Monte Carlo/
Pilha tecnológica: Vue 3 (tempo de execução local) + HTML5 Canvas, individual index.html
Objetivo: Corridas Simulações de Monte Carlo na sequência de negociações de uma estratégia para responder à pergunta: "Qual é a probabilidade de essa estratégia sobreviver a uma avaliação da firma de apoio sob ordens comerciais aleatórias?"

O que ele faz

Um único backtest é uma ordem específica de negociações. Monte Carlo pergunta: E se as mesmas negociações tivessem ocorrido em uma ordem diferente? Ao embaralhar a sequência de negociações milhares de vezes e reproduzir cada permutação de acordo com as regras da empresa de propósitos, o plug-in produz uma distribuição de resultados possíveis em vez de um único número de sorte ou azar.

Prop Monte Carlo obtém a lista de pedidos por meio de GET_ORDERS, permite que o usuário configure os parâmetros de simulação (número de iterações, nível de confiança, capital inicial, limite de perda diária, limite máximo de rebaixamento, meta de lucro) e executa tudo no navegador. O resultado é uma distribuição visual mais os percentis principais - uma probabilidade realista de passar na avaliação.

Principais recursos

• Simulação no lado do cliente - toda a lógica de aleatoriedade e repetição é executada em JavaScript; não há servidor, nem API externa
• Parâmetros configuráveis pelo usuário - contagem de iterações, níveis de confiança e regras da empresa (perda diária, drawdown máximo, meta de lucro)
• Visualização baseada em tela - a distribuição, o leque de patrimônio líquido ou as faixas de percentil são processados diretamente em um Elemento , com um elemento ResizeObserver que lida com o redimensionamento do iframe e um redesenho manual em SET_THEME changes
• Probabilidade de aprovação/reprovação - o resultado do título: "Sob essas regras, essa estratégia passa na avaliação em X% de execuções simuladas"
• Localização completa - a mesma configuração de doze idiomas da análise Prop, com disclaimerHtml e todos os rótulos na pasta locales/

[Captura de tela: Close-up do gráfico de tela mostrando a distribuição de Monte Carlo com marcadores de percentil sobrepostos].

Padrões que demonstra

Prop Monte Carlo é o plug-in de referência para qualquer coisa que envolva um Gráfico <canvas. Principais aspectos a serem observados:

• A tela é dimensionada dinamicamente por meio de ResizeObserver (não window.resize, porque o iframe SQX pode ser redimensionado independentemente)
• As cores da pintura da tela são lidas das propriedades personalizadas do CSS por meio de getComputedStyle() no momento do desenho - as variáveis CSS sozinhas não afetam a pintura da tela, portanto, cada mudança de tema aciona uma chamada manual drawChart()
• O código de desenho é isolado do sistema de reatividade do Vue; o Vue gerencia o cromo da interface do usuário e o desenho da tela é uma função simples chamada a partir de ganchos do ciclo de vida

É também a referência para computação com muita simulação no navegador. A estrutura de loop e a forma como o estado reativo é atualizado durante a iteração mantêm a IU responsiva mesmo durante longas execuções.

Conclusão

Os plugins de resultados personalizados no StrategyQuant X costumavam ser algo que somente os desenvolvedores podiam criar. Com o aplicativo de desktop Claude Code, eles agora são algo que qualquer trader com uma ideia clara pode criar em uma tarde - e o fluxo de trabalho neste guia é a sequência exata que produziu o primeiro.

Para iniciar seu próprio plug-in, abra user/extend/ResultsPlugins/ no Claude Code e execute as dez etapas acima, substituindo sua própria ideia pelo Robustness Scorecard. O código-fonte completo do plug-in de exemplo está em sua pasta ResultsPlugins/RobustnessScorecard/ - use-o como referência sempre que quiser ver como um plug-in finalizado está estruturado.