Vi uma atualização do Codex hoje, não é uma grande novidade, mas achei que valia a pena escrever sobre ela.
A OpenAI adicionou um navegador integrado ao device toolbarIsso também é conhecido como a barra de ferramentas de tamanho do dispositivo. De agora em diante, quando você criar páginas da Web, alterar a interface do usuário ou ajustar o layout responsivo no Codex, não precisará ficar olhando para uma janela padrão para ver o efeito.
Você pode fazer com que o Codex teste o aplicativo em diferentes tamanhos: celular, tablet, desktop. Ele examinará a página por conta própria e encontrará desalinhamentos, transbordamento, botões muito pequenos, espaçamento incorreto, navegação que se desintegra no celular e, em seguida, continuará a alterar o código.
A entrada também é muito simples: três pontos à direita da barra de URL no navegador incorporado do Codex e pronto.
Figura 1: Interface de revisão de código do aplicativo Codex
O aplicativo Codex está colocando o código de escrita, examinando as alterações e fazendo revisões na mesma bancada de trabalho.
Fonte: Página do aplicativo Codex dos desenvolvedores da OpenAI
Tudo isso é ostensivamente um pequeno botão com muito significado real.
No passado, quando usávamos IA para escrever front-end, o problema mais comum era: o código pode ser executado e a página pode ser aberta, mas, no momento em que mudarmos o dispositivo, ficaremos expostos.
O desktop parece bom, mas os cabeçalhos dos celulares são espremidos em três linhas; as larguras dos cartões são reduzidas a zero e as barras de rolagem horizontais aparecem; os botões ficam nas bordas da tela; os pop-ups não cobrem todo o espaço em uma tela pequena; e a barra de navegação se transforma diretamente em um site de desastre.
Não é que o modelo não saiba como escrever código, mas sim que ele não conseguiu “ver” e “validar” links de forma estável no passado.
O verdadeiro problema com os front-ends nunca é apenas colocar o React Os componentes estão escritos. O problema é examiná-los várias vezes, ajustá-los e testá-los para ver o tamanho. Especialmente no caso de páginas responsivas, o design geralmente fornece apenas um ou dois estados, e o dispositivo real tem vários tamanhos estranhos.
É essa lacuna que a barra de ferramentas do dispositivo preenche.
Correspondência Figura 2: Interface do aplicativo Codex New Thread
Uma tarefa de front-end pode começar com uma linguagem natural e, em seguida, o Codex em um loop fechado de implementação de código, verificação de página e modificação.
Fonte da imagem: página do Codex dos desenvolvedores da OpenAI
Em vez de ser apenas um “assistente de programação”, o Codex agora está se aproximando de ser um “agente de desenvolvimento que verifica os resultados de front-end por si mesmo”.
Estou mais preocupado com o fato de que esse recurso mudará a forma como as tarefas de front-end são entregues.
No passado, as tarefas que você dava à IA eram geralmente:
Ajude-me a criar uma página responsiva.
Uma maneira melhor de colocar isso agora seria:
Ajude-me a perceber esta página e verifique o layout em 390px, 768px e 1440px, respectivamente. Corrigi o problema por conta própria quando o encontrei e finalmente me disse o que foi alterado em cada tamanho.
Isso é diferente.
O primeiro é fazer com que a IA escreva código, o segundo é fazer com que a IA conclua uma tarefa de front-end aceitável.
Indo um pouco além, o Codex pode formar um conjunto muito útil de loops fechados:
Primeiro, gere a página, depois abra o aplicativo local, alterne entre diferentes tamanhos de dispositivo, observe o problema da página, modifique o CSS e a estrutura do componente, execute-o novamente e, por fim, envie a diferença.
É aqui que a produtividade de front-end da IA realmente começa a ficar difícil.
Com a adição da barra de ferramentas do dispositivo, o Codex pode verificar as páginas em diferentes tamanhos de tela, em vez de apenas olhar para a área de trabalho.
A OpenAI também alterou alguns detalhes ao longo do caminho: o navegador está cerca de 30% mais rápido, a animação do cursor do mouse está mais firme, há uma nova maneira de ocultar o compositor no modo de tela cheia e há algumas correções para navegadores Windows.
Elas soam mal, mas são importantes para a sensação da ferramenta.
Qual é o maior medo das ferramentas de codificação de IA?
Não é que seja um recurso menos interessante, é que ele é travado, lento, obscurece e interrompe os pensamentos quando você o usa. Quando você precisa olhar para o navegador com frequência para ver os efeitos, esses pequenos detalhes são ampliados infinitamente. Um navegador mais rápido, um cursor mais estável e menos bloqueio em tela cheia deixariam as pessoas mais dispostas a realizar tarefas reais com ele.
Figura 3: Interface de entrada do Codex na Web/nuvem
O Codex Web pode lidar com tarefas em um ambiente de nuvem ou executar várias tarefas de desenvolvimento em paralelo.
Crédito da imagem: Documentação do Codex Cloud dos desenvolvedores da OpenAI
É por isso que acho que a direção da Codex está clara atualmente.
Não é apenas em e Claude O Code é sobre quem é melhor em escrever código do que quem é melhor em escrever código, mas é sobre compensar as partes sujas, quebradas e reais do “cenário de desenvolvimento de software”.
Escrever código é apenas a primeira etapa. No desenvolvimento real, há também visualizações de página, anomalias, mudança de tamanho, feedback de teste, alterações de PR e evidências de revisão. No passado, todas essas coisas tinham que ser observadas, mas agora o Codex está assumindo um pouco o controle.
O desenvolvimento de front-end, em particular, é o mais vulnerável a ser reescrito por esse recurso.
Como o front-end não se limita a ter a lógica certa, ele também precisa ter os recursos visuais certos, as interações certas e os dispositivos certos.
Se um botão pode ser clicado ou não, se uma janela pop-up está bloqueada ou não, se ela transbordará no celular ou não, se há contraste suficiente no modo escuro, todas essas questões costumavam ser difíceis de julgar apenas pelo código. Agora, desde que o Codex possa abrir o navegador, mudar o tamanho e observar a página, ele tem a chance de encontrar o problema sozinho.
É claro que não recomendo abandoná-lo completamente.
Especialmente para páginas de marcas, sites de produtos e sistemas de back-end complexos, a IA ainda é propensa a cometer erros de “semelhança”. Ela pode corrigir erros óbvios, mas a estética, a hierarquia de informações e a intenção de interação ainda precisam ser verificadas por humanos.
Faz mais sentido deixar que o Codex cuide da primeira rodada de implementação e da limpeza de problemas de baixo nível, e que um humano cuide do julgamento final.
Por exemplo, quando uma página estiver pronta, você pode simplesmente deixar o Codex executar uma rodada:
- - Desktop 1440px Verificar uma vez
- - Flatbed 768px Verifique uma vez
- - Celular 390px Verificar uma vez
- - Foco na verificação de quebras de linha no cabeçalho, bloqueio de botões, rolagem horizontal, estouro de formulário, falha na navegação
- - Depois de corrigi-lo, envie o diff com uma explicação do que foi alterado em cada tamanho.
Esses tipos de tarefas são perfeitos para serem entregues à IA.
Porque é repetitivo, trivial e consome muita atenção, mas afeta a qualidade da entrega.
Os problemas responsivos não costumam ser grandes bugs, mas sim pequenos problemas, como quebras de linha de títulos, adesivos de botões, excesso de cartões e navegação desalinhada.
Desse ponto de vista, o valor da barra de ferramentas do dispositivo não está na “simulação da tela do telefone” em si.
As ferramentas de desenvolvimento de navegadores têm sido capazes de fazer isso há muito tempo.
Aqui está o verdadeiro ponto alto: essa habilidade é colocada na cadeia de execução do Codex.
Os desenvolvedores humanos costumavam ter que fazer a ação:
Abra a página, examine-a, encontre um desalinhamento, volte ao editor e altere o código, atualize-a novamente, altere o tamanho, examine-a novamente, altere-a novamente.
Agora o link pode começar a ser executado pelo próprio Codex.
Essa é a mudança.
Figura 4: Interface de feedback do Codex PR / Teste
Os entregáveis do Codex não devem ser apenas código, mas diffs, resultados de testes e notas de alteração que possam ser revisados.
Fonte da imagem: página do Codex dos desenvolvedores da OpenAI
Portanto, prefiro ver essa atualização como um sinal.
O código de escrita de IA passou de “você pode gerar” para “você pode verificar”.
Costumávamos nos surpreender com o fato de a IA poder realmente escrever páginas.
A próxima coisa realmente valiosa é se a IA pode examinar a página por si só, encontrar o problema por si só, corrigi-lo por si só e, em seguida, fornecer o resultado a uma revisão humana.
O front-end provavelmente será o primeiro local onde os hábitos de trabalho serão alterados.
No futuro, a entrega padrão de uma tarefa de front-end pode não ser mais “a página está escrita”, mas sim:
O lado do desktop já viu isso.
A extremidade do tablet foi vista.
Vi isso no celular.
A interação acabou.
Problemas óbvios de layout corrigidos.
O diff pode ser revisado agora.
Esse é o objetivo por trás dessa pequena atualização do Codex.
Não é um botão extra.
É a IA que está começando a realmente entrar na aceitação de front-end.
