26 pontos por spilist2 2025-04-23 | 7 comentários | Compartilhar no WhatsApp

Nas últimas semanas, fiz junto com conhecidos não desenvolvedores (advogados, profissionais de marketing, PMs etc.) uns cinco ou seis apps simples com vibe coding

Organizei esse processo e montei um “guia introdutório de vibe coding para não desenvolvedores” em 5 etapas

  1. Entender, em linhas gerais, até onde a IA atual consegue ir e o que ela consegue fazer
  2. Definir com clareza o problema que você quer resolver e o produto que quer criar
  3. Verificar com rapidez e frequência, com os próprios olhos, como o resultado está funcionando
  4. Fazer prompts e interagir com a IA para que ela consiga programar bem
  5. Perceber comportamentos anômalos e pontos de melhoria, aprimorar e finalizar

1) Entender, em linhas gerais, até onde a IA atual consegue ir e o que ela consegue fazer

Para não desenvolvedores que estão tendo o primeiro contato com vibe coding, recomendo começar com atividades desse tipo

  • Experimentar diretamente o ganho de eficácia ao ver que é possível criar algo funcional com apenas um prompt curto em um LLM ou em um serviço de prototipagem com IA
  • Assinar alguns perfis em redes sociais e newsletters que organizam e explicam as novidades mais recentes sobre IA
  • Abrir mão da ambição de acompanhar toda informação e toda ferramenta de IA, e testar superficialmente apenas as ferramentas ligadas a temas específicos que te interessam

2) Definir com clareza o problema que você quer resolver e o produto que quer criar

  • Mesmo que você já tenha noção da capacidade da IA, não dá para criar um produto sem uma definição clara do problema
  • Por isso, primeiro você precisa ficar mais lúcido fazendo perguntas que aumentem sua metacognição
  • Usar o app de metacognição criado com vibe coding
    1. O que você quer criar?
    2. Por que você quer criar isso? Que problema está tentando resolver?
    3. Quem sofre com esse problema?
    4. Em que situações essas pessoas enfrentam esse problema?
    5. Que paliativo/substituto elas usam hoje nessa situação?
    6. Como confirmar que a opção 1 resolve melhor o problema do que a opção 5?
    7. Como fazer com que elas prefiram usar a opção 1 em vez da 5?
  • Depois que o que você quer criar estiver organizado, a ideia foi pegar o “prompt para geração de PRD” produzido por esse app e colocar em um LLM para que ele criasse o PRD

3) Verificar com rapidez e frequência, com os próprios olhos, como o resultado está funcionando

  • O maior benefício do vibe coding é ter um “app funcionando” em um estágio muito inicial. Isso também é muito importante para motivar não desenvolvedores
  • Nesse sentido, eu não recomendo muito que não desenvolvedores comecem vibe coding com Cursor, porque há muitos obstáculos grandes e pequenos até conseguir rodar o app
  • Em vez disso, acho que serviços como o Lovable, que recebem um PRD e já devolvem um protótipo funcional, são um ponto de partida melhor. Como eles também geram um link público imediatamente, fica fácil mostrar para conhecidos e receber feedback
  • Mas, se o app que você quer criar não for baseado na web, a coisa fica um pouco mais complicada, porque ferramentas de prototipagem normalmente geram web apps
  • Nesse caso, são necessárias decisões técnicas e configuração do ambiente de execução, então tanto eu quanto a IA precisamos ficar mais inteligentes

4) Fazer prompts e interagir com a IA para que ela consiga programar bem

  • Eu ficar mais inteligente <-> a IA ficar mais inteligente <-> montar bons prompts <-> o resultado sai melhor e mais rápido
  • Quanto melhor o prompt, menos rodadas de pingue-pongue (= tempo e dinheiro) são necessárias para atingir o objetivo
  • Em vários guias de prompt engineering, um ponto em comum é definir bem no prompt o papel (Role), o contexto (Context) e a tarefa (Task)

Papel, contexto e tarefa

  • No vibe coding, o “papel” não é tão importante assim
    • Porque agentes de programação já costumam ter um papel apropriado definido e isso pode até atrapalhar
    • E talvez por programação ser um benchmark importante, os LLMs também costumam programar bem sem atribuição de papel
    • Claro, se o app que você quer criar for especial, também pode ser bom dar um papel apropriado
  • O “contexto” já fica suficientemente coberto se você criou bem o PRD
  • A “tarefa” é definir bem o objetivo e o critério de conclusão. O critério de conclusão pode
    • estar explícito dentro do prompt (few-shot prompting)
    • estar definido em arquivos externos ou no código (TODOs.md ou código de teste)
    • estar só na sua cabeça (esse estilo não é bonito)
  • O objetivo final do vibe coding é instruir a IA a programar bem para criar rapidamente um app que funcione de acordo com o PRD. Para isso, é bom adotar três objetivos intermediários
    • Eu fico mais inteligente
    • A IA fica mais inteligente
    • A funcionalidade opera conforme a especificação

Eu fico mais inteligente?

  • Se você não é desenvolvedor, ou se o domínio é desconhecido, ou se a stack é desconhecida, fica difícil dar instruções com terminologia precisa
  • Nessas horas, basta avisar o LLM sobre essa limitação e aprender com ele
    • “(Mostrando uma captura de tela) Esse tipo de jogo normalmente é feito com o quê?”
    • “Vou fazer algo assim; se fosse você, como conseguiria os dados?”
    • “Para verificar o funcionamento principal de um app nativo o mais rápido possível, que tecnologia eu deveria usar?”
  • Observe, por meio dessas perguntas, se você está mudando assim
    • Palavras-chave técnicas: estou usando termos técnicos/termos de domínio com precisão
    • Fluxo de dados: consigo explicar como obter, processar e exibir os dados necessários para a funcionalidade principal do meu app
    • Ambiente de execução: preparei um ambiente em que posso rodar o código gerado pela IA e verificar com meus próprios olhos se funciona
  • Idealmente, seria bom escrever o PRD e começar a programar depois de eliminar todos os unknown unknowns, mas isso não é obrigatório
  • Há muito que só se aprende quando se começa a codar e, se necessário, sempre dá para recomeçar do zero. (Isso pode até ser mais rápido do que corrigir algo já existente)

A IA fica mais inteligente?

  • Significa informar à IA, por meio de um system prompt (como Cursor Rules), as palavras-chave técnicas ou o fluxo de dados que você identificou
  • Para reduzir o número de intervenções da sua parte e fazer com que o código da IA combine mais com o que você quer, são necessárias principalmente duas coisas: restrições e orientações de documentação
  • Orientações de restrição ajudam a IA a escrever código de forma mais consistente. Por exemplo:
    • Stack técnica: use NextJS app router, estilize com Tailwind e ShadCN, use apenas ícones Lucid, use Stripe para pagamentos etc.
    • Estrutura e padrões: organize as pastas desta forma, nomeie os arquivos assim, faça o estilo de UI parecer Material etc.
    • Formato de saída (de acordo com o ambiente de execução): vou usar Electron Fiddle, então me dê 4 arquivos nesse formato; vou usar CodePen, então me dê um HTML, um CSS e um JS etc.
  • Orientações de documentação ajudam a melhorar o foco e a memória da IA. Duas ideias foram especialmente úteis
    • Memory Bank do Cline: definir um fluxo de trabalho em que o agente registra em arquivos o que foi feito e o que falta fazer
    • Prompt Context de Dongyoon Kang: em vez de deixar instruções longas sobre o projeto inteiro na pasta raiz, criar instruções por pasta
  • O Memory Bank é especialmente recomendado para não desenvolvedores, porque facilita observar e aprender o que está acontecendo no momento

A funcionalidade opera conforme a especificação?

  • Trata-se de uma estratégia de prompting no nível da conversa (com o agente de programação), e não no nível do projeto
  • Acho que a melhor estratégia para fazer a funcionalidade operar conforme a especificação é se o teste passar, faça o commit
    • “Implemente X. Escreva primeiro os testes, depois programe, execute os testes e continue corrigindo o código até eles passarem.”
  • Isso é possível porque o agente de programação tem permissão e capacidade para escrever código de teste, executar no terminal e ler o resultado
  • Depois que os testes passarem, basta receber uma sugestão de mensagem de commit e fazer o commit do código de teste junto com o código da funcionalidade. Eu faço o commit manualmente, mas o agente também pode fazer commit automático
  • Não só testes unitários, mas também testes de integração e testes E2E podem ser escritos, executados e corrigidos pela própria IA (referência: testes automatizados com Cursor + Playwright)
  • Tudo isso é uma estratégia para facilitar, tanto para quem faz vibe coding quanto para a IA, a verificação de “a funcionalidade individual foi implementada conforme a especificação, e o app inteiro funciona de acordo com o PRD?”

5) Perceber comportamentos anômalos e pontos de melhoria, aprimorar e finalizar

  • Na minha visão, vibe coding está longe de ser algo de “um clique” e há muito o que aprender
  • Entre essas coisas, há três competências que considero essenciais para ir além de “um pequeno protótipo pessoal” e, como fundador solo, criar um app em nível de produto comercial: capacidade de percepção, capacidade de programação e capacidade de product engineering

Capacidade de percepção

  • Perceber com sensibilidade quando uma tela ou funcionalidade está operando de forma diferente do PRD (ou da sua intenção original)
  • Se isso faltar, fica muito difícil identificar o erro da IA e pedir que ela corrija
    • Os “testes” da etapa 4 não só reduzem os erros da IA desde o início, como também ajudam a desenvolver sua própria capacidade
    • Isso porque, ao ler o processo em que a IA transforma a especificação em código de teste, você aprende não apenas “essa funcionalidade é necessária”, mas “para concluir a implementação dessa funcionalidade, estas condições são necessárias”
  • Mas “o app foi implementado conforme a especificação” e “o app é bom” são coisas diferentes. Por isso, é importante ter product sense para encontrar melhorias (veja a newsletter do Lenny no link para mais detalhes)

Capacidade de programação

  • Pelo menos por enquanto, por melhor que você quebre o trabalho e delegue à IA, ainda é preciso mexer diretamente no código em pelo menos uns 5% para conseguir finalizar
    • Há muitos apps nas redes sociais que ficam parados nos 80% e nunca são lançados justamente por não conseguirem fazer isso
  • Claro, essa proporção pode variar dependendo do app que se quer criar, e talvez não seja impossível implementar tudo só com IA até o fim, mas isso é muito ineficiente
  • Em vez de se entregar totalmente ao vibe, recomendo estudar programação em si olhando a documentação que a IA gera (por meio de Memory Bank, código de teste etc.). E também buscar mentoria de desenvolvedores
  • Em especial, aprender sobre backend, que costuma ser menos visível (autenticação de usuários, integração com APIs externas, entrada e saída de dados, pagamentos etc.), e sobre estratégia de deploy (branch principal e branches de feature, gestão de variáveis de ambiente etc.) tende a trazer bastante resultado

Capacidade de product engineering

  • Lançar um app não é o fim, é o começo. Para fazer isso direito, é preciso entender o ciclo completo de desenvolvimento de produto
    • Identificação do problema, ideação da solução, planejamento, design, implementação, testes, deploy, divulgação, monitoramento de erros, coleta de feedback, operação...
  • Mesmo que você não vá tratar cada etapa com profundidade, é bom ao menos saber o que se faz em cada fase e quais palavras-chave são usadas nela
  • Só assim você consegue aprender o que não sabe e identificar a capacidade de colegas com quem pode trabalhar quando não conseguir dar conta sozinho

Encerrando

  • Transformar um app feito com vibe coding em um produto de nível comercial não é nada fácil. Ainda assim, ninguém pode negar que ficou mais fácil do que nunca começar
  • Ver conhecidos se empolgando de verdade ao ver sua pequena ideia ganhar vida (“Uau, eu estou programando!”) também me deixou muito feliz
  • Recomendo que outros não desenvolvedores que estejam lendo este texto aproveitem essa oportunidade para se tornar “makers” de forma divertida
  • Se você usar sua própria especialização de domínio para criar, com vibe coding, uma ferramenta pequena, rápida e útil que resolva muito bem um problema específico, acho que ainda terá competitividade na era da IA

7 comentários

 
jk34011 2025-04-25

Uau~ eu achava que vibe coding era só uma ilusão.
Fazia tempo que eu não via um texto escrito com esse nível de profundidade.
Foi uma leitura muito divertida, gostei bastante.

 
spilist2 2025-04-25

Obrigado! Vejo um grande potencial nisso haha

 
jk34011 2025-04-25

Ah;; agora que vi, meu comentário ficou meio estranho.
Acho que, mais do que dizer que é uma ilusão, a sensação é de que ainda está longe?
No fim, sinto que vibe coding tem limitações e que é difícil sem conhecimento de desenvolvimento.
Claro, com a evolução da IA, acho que no futuro isso vai melhorar muito.

Como achei que meu comentário poderia soar como se vibe coding não tivesse sentido, estou escrevendo esta resposta meio sem jeito de novo.
Eu também uso bastante vibe coding haha

 
spilist2 2025-04-26

Ah, não, haha. Eu também entendi a nuance que você mencionou.

Então, como escrevi no texto, o que chamo de vibe coding está longe de ser só um "clique", e acho que, para elevar o nível, o engenheiro precisa se esforçar bastante.

 
bbulbum 2025-04-23

Sempre leio com atenção.

 
spilist2 2025-04-23

Obrigado!

 
spilist2 2025-04-23

Também gravei um vídeo no YouTube haha https://www.youtube.com/watch?v=ecY5VBpruOA