Página de captura de email no vibe coding: uma valida, outra converte

Uma página de captura de email pede 1 contato e encerra o trabalho ali. Outra landing pede a conta e a jornada até o produto. Gabriel abriu as 2 no editor na mesma sessão de vibe coding e deu a cada uma um trabalho: uma valida, a outra converte.

O produto é o Bookbase, gerenciador de favoritos, com extensão, app e as landings. Nos 91 min as 2 páginas estavam no mesmo projeto. Ele apontou a de pré-lançamento, depois a pública. A primeira ainda pedia o e-mail. A segunda já levava o visitante até criar a conta. As 2 compartilhavam o produto e o editor, e cada uma tinha um trabalho.

A página de captura de email ainda está validando

Na primeira tela o recorte cabe numa fala só:

Essa land page aqui só quero capturar um e-mail ainda. Tô validando.

O teste que ele montou cabe em 1 e-mail: alguém deixa o contato. O nome que ele dá a esse recorte é pré-lançamento, e a sequência do produto vem na frase seguinte:

Captura de contar essa de pré-lançamento. E a ideia que a página vaiar passar por essas etapas, né? Primeiro vai ter, depois vai tercimento, tudo mais.

Primeiro captura, depois crescimento. A página do produto muda de função com o tempo. Na etapa de captura o único serviço é o contato. O crescimento espera essa etapa terminar. Ele mostrou isso em 2 páginas, a de validar e a de converter, em vez de um layout só com os 2 pedidos.

A landing pública já leva até a conta

A outra tela já está no segundo trabalho. Ele define o papel dela assim:

Landing page tá é o que fica público, né, a princípio, até a pessoa criar a conta

Enquanto o visitante não tem conta, essa é a face do Bookbase. Na sessão ele formula a promessa dessa landing: nunca mais perder um favorito, nenhum navegador. A jornada que ele descreve pede 3 campos para criar a conta:

eu peço três campos aqui para no momento atualmente para pessoa criar uma conta

Depois dos 3 campos, a pessoa entra na plataforma. Nessa página pública ele fala em open beta e em provas sociais. A captura, no recorte em que ele ainda valida, fica com o e-mail. A pública fica com o CTA e com a jornada até a conta. Isso aparece também em pagina em construção.

A mesma live separa Assinar de Entrar, outro par de trabalhos. Aqui o par é captura e conversão.

No vibe coding, as 2 landings ficam no mesmo editor

Gabriel estava em vibe coding com as 2 landings abertas. O agente lê as 2. Pedir "a landing do Bookbase" sem dizer a etapa junta o e-mail de validação com os 3 campos da conta no mesmo bloco.

Ele apontou a tela e nomeou o trabalho. "Só quero capturar um e-mail ainda" mantém a primeira página no form de 1 campo. "Tô validando" diz a etapa. A pública fica com o título, o CTA, o open beta e a jornada até a conta.

O recorte vai no prompt: URL aberta, trabalho daquela URL, etapa atual. Sem isso o contexto das 2 telas vaza de uma para a outra, e a página de captura de email deixa de ser um teste.

Uma linha no prompt, depois gera

Antes de pedir a próxima landing, escreva se aquela URL valida ou converte. Validar pede 1 e-mail e fecha. Converter leva aos 3 campos e larga o tom de pré-lançamento. Se as 2 frases couberem no mesmo pedido ao agente, as etapas ainda estão misturadas.

A mesma URL pode mudar de etapa, como ele descreveu. O visitante que chega hoje não precisa receber os 2 pedidos de uma vez. Quando a captura cumprir o papel, troca o recorte e gera de novo.

A sessão está gravada. Dá para assistir à live e ver ele apontar as 2 telas, uma ainda só querendo o e-mail.