Se você já pediu para uma IA "criar um componente de input" e recebeu um resultado totalmente diferente do que esperava, provavelmente o problema não foi a IA — foi o prompt.

Hoje em dia, saber escrever um bom prompt virou uma habilidade tão importante quanto saber escrever um bom código. É a nova interface entre o desenvolvedor e a ferramenta. E, assim como acontece com código limpo, existem princípios simples que fazem uma diferença enorme no resultado final.

Neste post, vou compartilhar algumas dicas práticas de como montar um prompt eficiente, com exemplos voltados para quem trabalha com desenvolvimento frontend.

Por que a qualidade do prompt importa tanto?

Modelos de IA generativa (como GPT, Claude ou Gemini) respondem a partir daquilo que você escreve. Se o input é vago, ambíguo ou sem contexto, a saída também será.

"Garbage in, garbage out."

Essa frase, clássica do mundo da computação, nunca fez tanto sentido. Um prompt mal estruturado gera retrabalho, código genérico e — pior — respostas que parecem corretas, mas não resolvem o problema real.

A boa notícia é que montar um bom prompt é algo bem objetivo. Basta seguir alguns princípios.

Características de um bom prompt

1. Seja específico

Quanto mais específico for o prompt, menor a margem para a IA "chutar" o que você quer.

Ruim

Crie um componente de input em Vue.

Melhor

Crie um componente de input em Vue 3 com Composition API e TypeScript,
que aceite as props: modelValue (string), label (string), placeholder
(string) e error (string opcional). Use v-model e emita o evento
update:modelValue.

Perceba como o segundo prompt deixa claro o que você quer, qual tecnologia, quais props e qual comportamento. A IA não precisa adivinhar.

2. Dê contexto

Contexto é o que diferencia uma resposta genérica de uma resposta útil. Se você não diz para a IA em que cenário aquele código vai rodar, ela vai assumir o cenário mais comum — que raramente é o seu.

Sem contexto

Escreva uma função de debounce.

Com contexto

Estou desenvolvendo uma feature de busca em uma aplicação Vue 3 com
TypeScript. Preciso de uma função de debounce tipada que eu possa
reutilizar no composable useSearch. A função de callback recebe uma
string e retorna uma Promise.

O segundo prompt já direciona a IA para gerar algo que encaixa no seu projeto, com a tipagem certa e seguindo o padrão de composables.

3. Itere

Prompt não é bala de prata. Raramente o primeiro resultado é o ideal.

O segredo é tratar o prompt como um processo iterativo: você pede, avalia a resposta, refina a pergunta e pede de novo. Cada iteração vai deixando o resultado mais próximo do que você precisa.

Esse é o mesmo princípio de quando a gente refatora código: primeiro faz funcionar, depois melhora.

4. Use palavras-chave

Palavras-chave técnicas funcionam como "âncoras" para a IA. Se você quer uma resposta focada em acessibilidade, use termos como ARIA, a11y, role, aria-label. Se quer performance, use lazy loading, memoization, virtual scroll.

Essas palavras direcionam o modelo para o universo certo de conhecimento.

5. Estruture de forma lógica

Um prompt longo, jogado em um parágrafo único, é difícil até para um humano ler. Quebre em partes, use listas, separe contexto, requisitos e formato de saída.

A gente vai ver isso melhor daqui a pouco.

Os componentes de um prompt

Com o tempo, percebi que prompts bons seguem uma estrutura parecida. Eles geralmente têm seis componentes principais:

Papel (Role) é a persona que a IA deve assumir. Por exemplo: "Você é um dev frontend sênior especializado em Vue 3".

Diretiva é o que você quer que ela faça — o núcleo do prompt. Por exemplo: "Crie um composable para gerenciar autenticação".

Exemplos (shots) são demonstrações que guiam o modelo a realizar a tarefa. Por exemplo: "Siga o padrão do composable abaixo: ...".

Contexto é a informação adicional relevante para o pedido. Por exemplo: "O projeto usa Pinia e axios com interceptors".

Instrução de estilo define tom, formato e convenções da saída. Por exemplo: "Use inglês nos nomes de variáveis e português nos comentários".

Formato de saída especifica como a resposta deve vir. Por exemplo: "Responda apenas com o código, sem explicações".

Nem todo prompt precisa dos seis. Mas, em geral, quanto mais completo, melhor o resultado.

Um exemplo prático: do ruim ao bom

Vamos supor que você precisa criar um composable para consumir uma API de produtos.

Versão ruim

Faz um composable pra buscar produtos

O que pode dar errado aqui? Praticamente tudo. A IA pode usar fetch, axios ou ofetch. Pode ou não tipar. Pode retornar um array, uma Promise, um ref. Pode usar onMounted ou não. Ou seja: você vai ter que refatorar bastante.

Versão melhor

Você é um desenvolvedor frontend sênior especializado em Vue 3 e TypeScript.

Crie um composable chamado `useProducts` que:

- Busque uma lista de produtos a partir do endpoint GET /api/products
- Use axios (já configurado e importado de `@/lib/api`)
- Retorne: products (Ref<Product[]>), loading (Ref<boolean>), error (Ref<string | null>) e uma função fetchProducts
- Seja totalmente tipado em TypeScript

A interface Product já existe e está em `@/types/product.ts` com os campos: id (number), name (string), price (number).

Siga o estilo de composable abaixo como referência:

```ts
export function useExample() {
  const data = ref<Data | null>(null)
  const loading = ref(false)
  const error = ref<string | null>(null)

  async function fetchData() {
    loading.value = true
    try {
      const response = await api.get('/example')
      data.value = response.data
    } catch (err) {
      error.value = 'Erro ao carregar dados'
    } finally {
      loading.value = false
    }
  }

  return { data, loading, error, fetchData }
}
```

Responda apenas com o código, sem explicações.

Aqui temos todos os componentes: papel, diretiva, contexto, exemplo, instrução de estilo e formato de saída. A IA agora tem um caminho muito mais claro para seguir — e a chance de o primeiro resultado já ser utilizável é altíssima.

Boas práticas em prompts

Resumindo tudo que vimos até aqui, seguem algumas boas práticas:

• Use prompts específicos. Evite pedidos genéricos como "faz um componente legal".

• Dê instruções precisas e detalhadas. Explique inputs, outputs, comportamentos esperados.

• Controle o formato da resposta. Peça código puro, JSON, markdown — o que fizer sentido.

• Use separadores para organizar informações. Quebre o prompt em seções (contexto, requisitos, exemplos). Isso ajuda a IA a parsear melhor o que você quer.

• Dê exemplos sempre que possível. Um bom exemplo vale mais que três parágrafos de explicação.

• Itere. Se a resposta não veio boa, refine o prompt. Não aceite o primeiro resultado só porque "mais ou menos serve".

Conclusão

Escrever bons prompts é, no fim das contas, sobre comunicar intenção com clareza. E isso é uma habilidade que qualquer dev pode (e deve) desenvolver.

Se você está começando a usar IA no seu dia a dia, meu conselho é simples: trate o prompt como se fosse uma issue bem escrita no backlog. Ninguém gosta de pegar uma task com descrição vaga, certo? Com a IA, é a mesma coisa.

Quanto mais você praticar essas dicas, mais rápido vai perceber que o gargalo nunca foi a ferramenta — era a forma como a gente estava pedindo as coisas.

Gostou do artigo? Compartilhe!