Pular para o conteúdo

Engenharia e agentes

Para a frente de engenharia de software e agentes de IA: mostrar o trabalho do agente como ele é, etapa por etapa, com número em mono e uma pessoa aprovando antes de qualquer mudança.

Agente ao vivo

Uma execução simulada de ponta a ponta: o agente planeja, chama ferramentas, cruza os dados, propõe e para à espera de aprovação. A telemetria sobe com uma mola curta; a pilha, o registro e o fluxo de eventos andam no mesmo relógio, que para fora da tela e no Pausar.

Execução com aprovação

.rq-agente · __telemetria · __pilha · __registro · __fluxo · __aprovacao · data-rq="agente"

Concluída

Agente de operação da loja

Antes de subir os anúncios da semana, conferir estoque e preço dos produtos em campanha.

Tempo
11,0 s
Latência p95
1.310 ms
Tokens
13.030
Custo estimado
R$ 0,29
Ferramentas
6 chamadas
  1. 01Planejar Divide a tarefa e escolhe as ferramentas Feita 1,2 s
  2. 02Ler o catálogo Produtos da coleção em campanha Feita 1,6 s
  3. 03Ler as campanhas Anúncios ativos da semana Feita 1,1 s
  4. 04Cruzar os dados Estoque, preço e anúncio de cada produto Feita 2,6 s
  5. 05Propor a ação Escreve a proposta para o squad Feita 1,4 s
  6. 06Aprovação Uma pessoa do squad decide Feita 09:12
  7. 07Executar Só o que foi aprovado Feita 2,2 s
  8. 08Registrar Resumo para o squad da aceleração Feita 1,1 s

plano Plano em cinco passos: catálogo, campanhas, cruzamento, proposta e execução 760 ms · 1.180 tk

ferramenta shopify.produtos.listar → 38 produtos 200 · 182 ms

ferramenta shopify.estoque.consultar → 38 níveis de estoque 200 · 241 ms

ferramenta anuncios.campanhas.ativas → 12 anúncios 200 · 318 ms

modelo Cruza estoque, preço e anúncio de cada produto 1.310 ms · 9.240 tk

achado 3 produtos anunciados com menos de 10 unidades

achado 1 preço no anúncio diferente do preço na loja

modelo Proposta: pausar 2 anúncios, corrigir 1 preço e repor 3 itens 940 ms · 2.610 tk

sistema Execução parada à espera de uma pessoa

pessoa Proposta aprovada

ferramenta anuncios.pausar → 2 anúncios 200 · 204 ms

ferramenta anuncios.preco.atualizar → 1 anúncio 200 · 233 ms

ferramenta estoque.reposicao.criar → 1 pedido, 3 itens 201 · 287 ms

sistema Resumo enviado ao squad da aceleração

sistema Execução concluída em 11,0 s

Simulação com dados de exemplo. Os nomes de ferramenta ilustram integrações com a loja e os anúncios; não é o registro de um cliente.

Quando usar
Para mostrar como um agente trabalha numa operação real: o que ele lê, o que conclui, o que pede para mudar e quem aprova. Em página de venda, prefira a execução curta, com no máximo oito etapas.
Roteiro
JSON em script[data-agente-roteiro]: inicio, precoMilTokens e etapas. Cada etapa tem eventos (t em ms de relógio, tipo, texto, ms, tokens, status, resultado) ou aprovacao. data-agente-auto="false" espera o Executar.
Acessibilidade
O registro é role="log" com aria-live="off": o leitor de tela ouve a troca de etapa, o pedido de aprovação, a pausa e o fim, não cada linha. Estado escrito ao lado do ícone. Pausar atende ao critério de pausar conteúdo que se atualiza sozinho; o rótulo troca para Continuar, sem aria-pressed. A decisão fica escrita no lugar dos botões e recebe o foco. Se a execução termina com o foco no Pausar, ele passa para Executar de novo.
Sem JS e movimento reduzido
Sem JS, vale o que estiver escrito na pilha, no registro e no fluxo: escreva ali a execução concluída (o módulo limpa e refaz ao ligar). Com movimento reduzido, os números trocam direto e nada desliza; a execução segue, com o Pausar à mão.

Número técnico em mono

Latência, tokens, custo, status HTTP, horário e identificador de ferramenta saem em JetBrains Mono, com algarismos tabulares e zero cortado: a coluna não dança quando o número muda. Frase e título continuam em Hanken Grotesk.

Rótulo e valor

.rq-mono · .rq-rotulo-mono · --rq-fonte-mono · --rq-t-mono
Latência p95
1.310 ms
Status
201
Ferramenta
estoque.reposicao.criar

Executado às 09:12:19.402, com 13.030 tokens.

Simulação · dados de exemplo

Sem e com

O antes e o depois numa frase cada, lado a lado. O "sem" fica tracejado; o "com" leva o realce do tema. Com o módulo da troca, os dois trocam de lugar com a assinatura do Roque.

Aceleração

.rq-semcom · __lados · __lado--sem · __lado--com · __frase

Sem a Chesslab

“Eu não sei onde estou errando.”

Com a Chesslab

Cada real tem um teto. Cada semana, um feedback.

Engenharia, com a troca

data-rq="troca" · data-troca-item · data-troca-gatilho

Sem agente

Toda segunda, alguém confere estoque, preço e anúncio na mão.

Com agente

O agente cruza tudo antes de os anúncios subirem. Uma pessoa aprova.

Quando usar
Uma dor e uma resposta, curtas. Frase entre aspas no "sem" quando for a fala de quem compra.
Contraste
O "com" usa --rq-realce e --rq-sobre-realce, par conferido em 4,5:1 nos seis temas.

Ticker técnico

A faixa que corre, com as frentes de engenharia em mono. Uma por página; a cópia que fecha a volta é escondida do leitor de tela. Com movimento reduzido ou com a pausa ligada, fica parada.

Faixa

.rq-ticker · __faixa · --duracao · .rq-pausa
Engenharia de software · Agentes de IA · LLMs · Integrações · Shopify · Dados e observabilidade · Squads dedicados ·