Saltar para o conteúdo principal

Documentation Index

Fetch the complete documentation index at: https://docs.replit.com/llms.txt

Use this file to discover all available pages before exploring further.

Tempo estimado: 15 minutos Um protótipo é a menor versão de uma ideia de produto que alguém pode experimentar e reagir. Você usará o Pace como exemplo: um rastreador de corrida premium que oferece aos corredores uma visão geral polida do seu treino, recuperação e progresso.
O protótipo Pace publicado em uma URL pública — um dashboard premium de rastreador de corrida com distância semanal, corridas recentes, próximos treinos e conquistas

O que você vai aprender

Você vai aprender como:
  • Transformar uma ideia de produto ampla em um fluxo testável.
  • Usar o modo Plan para definir o escopo de um protótipo antes de construir.
  • Avaliar se o plano do Agent é pequeno o suficiente para testar.
  • Usar anotações do Canvas e colaboração para coletar feedback em contexto.
  • Explorar duas direções de protótipo em paralelo quando a questão do produto não está clara.
1

Escreva o prompt

O prompt acima descreve o Pace — um rastreador de corrida pessoal com um dashboard inicial polido, um fluxo Adicionar Corrida, estatísticas, uma visualização de plano placeholder e dados de amostra realistas de São Francisco. Use Copiar o prompt para colá-lo no Replit você mesmo, ou Construir no Replit para abrir o Replit com o prompt já anexado.O prompt é intencionalmente específico sobre a direção visual, as telas, quais dados simular e o que é um placeholder — é isso que dá ao Agent um alvo claro para avaliar.
2

Use o modo Plan (opcional)

Se você quiser que o Agent pense na questão do produto antes de escrever qualquer código, ative o Plan ao lado da entrada do prompt. O modo Plan produz um plano estruturado que você pode revisar antes de aprovar a construção — útil quando a direção ainda não está totalmente decidida.
O compositor de prompts do Replit com o resumo do protótipo Pace digitado e a caixa de seleção Plan destacada, pronta para definir o escopo da construção antes do Agent começar
Revise o plano: usuário-alvo, fluxo principal, o que deve ser real, o que pode ser simulado e uma lista de verificação de testes. Se o plano adicionar muitos recursos, peça ao Agent para reduzi-lo.
3

Revise o que o Agent construiu

Quando o Agent terminar, abra o Preview e use o Pace como um visitante pela primeira vez.Verifique se você consegue:
  • Ver o dashboard Alex Morgan preenchido com corridas de amostra realistas.
  • Registrar uma nova corrida pelo botão flutuante + ou pelo botão hero Iniciar Corrida.
  • Ver a corrida aparecer em Corridas Recentes e as estatísticas Esta Semana atualizarem.
  • Navegar pelas abas Corridas, Estatísticas, Plano e Perfil.
  • Redimensionar o Preview para a largura de um telefone para verificar o layout mobile.
Se algo parecer errado, descreva o sintoma ao Agent e peça a correção mínima.
O protótipo Pace rodando no Preview — o workspace mostra o chat do Agent à esquerda e o dashboard Pace preenchido à direita, o tipo de superfície com que um visitante pela primeira vez interagiria
4

Publique e peça feedback

Publique quando o fluxo principal funcionar.
O Editor de Projeto com ambos os pontos de entrada de publicação visíveis: o card inline de Publicar no chat do Agent com um campo de subdomínio e o bloco Publicação no painel de Ferramentas e arquivos
Uma vez publicado, abra a URL pública em uma nova aba do navegador para garantir que a experiência funcione para visitantes pela primeira vez antes de compartilhá-la.
O protótipo Pace publicado aberto em uma nova aba do navegador, pronto para compartilhar com revisores para feedback focado
Compartilhe a URL com uma tarefa focada:
Use o Pace como um corredor tentando rastrear uma semana de treino. Registre uma corrida, navegue pelo dashboard e me diga o que parece confuso ou motivador.
Um bom feedback deve ajudá-lo a decidir o que construir a seguir. Evite perguntar “O que você acha?” a menos que queira respostas vagas.
5

Colabore com sua equipe

Os protótipos de produto melhoram quando os colegas de equipe podem revisar o mesmo artefato e dar feedback em contexto.Convide colaboradores com base em quão próximos eles precisam trabalhar com você:
  • Convide alguém para o projeto quando eles precisam revisar ou ajudar apenas com este protótipo. Veja Convidar colegas de equipe.
  • Convide alguém para um workspace quando eles fazem parte de uma equipe em andamento e precisam de acesso em todos os projetos. Veja Workspaces de equipe.
A caixa de diálogo Convidar aberta na barra superior do workspace com o campo de entrada de nome de usuário ou e-mail destacado, pronto para convidar um colega para o projeto
Em seguida, use o Canvas quando o feedback for visual. Adicione notas diretamente no protótipo, anote a área que você quer alterar e peça ao Agent para usar essas notas ao atualizar o app.
O frame Pace no Canvas com um retângulo, seta e rótulo de texto apontando para um local 'botão Login com Strava' ao lado do botão Registrar Corrida — o tipo de nota contextual que colaboradores podem deixar para o Agent
Para PMs, isso significa que o protótipo funciona como um artefato compartilhado: designers podem anotar fluxos, engenheiros podem inspecionar a viabilidade e as partes interessadas podem experimentar a versão publicada.

🎉 Parabéns

Você transformou uma ideia de produto em um protótipo focado e compartilhável — um dashboard Pace funcional que colegas de equipe e clientes podem experimentar e reagir. A parte difícil não foi este protótipo. Foi aprender como reduzir uma ideia ampla a um fluxo testável, coletar feedback em contexto e decidir o que vale a pena construir a seguir.

Próximos passos

Use o feedback para escolher um próximo passo:

Adicionar um banco de dados

Salve o histórico de corridas para que sobreviva à recarga.

Adicionar login

Dê a cada corredor uma conta com seu próprio progresso.

Crie um app mobile

Leve o Pace para rastreamento em primeiro lugar em iOS ou Android.

Crie um dashboard a partir de dados

Transforme o histórico de corridas em insights de progresso.

Construa em paralelo

Quando a questão do produto é sobre direção, não apenas implementação, explorar várias ideias ao mesmo tempo ajuda você a comparar opções em vez de se comprometer cedo demais. O Replit Agent suporta tarefas paralelas — você pode pedir ao Agent para trabalhar em mais de um protótipo, recurso ou experimento ao mesmo tempo e revisá-los lado a lado.
Visualização de thread mostrando várias tarefas do Agent rodando em paralelo com indicadores de status
Para saber como as tarefas são enfileiradas, executadas e concluídas, veja Sistema de tarefas. Quando você não tem certeza de qual direção é melhor, peça ao Agent para criar duas tarefas paralelas. Para o Pace, você poderia comparar:
  • Protótipo focado em motivação: sequências, conquistas, recomendações encorajadoras.
  • Protótipo focado em análise: estatísticas mais aprofundadas, tendências semana a semana, recordes pessoais.
Após ambas as tarefas terminarem, compare-as com a mesma pergunta de feedback:
Qual versão te deixa mais propenso a voltar amanhã, e por quê?

Precisa de mais ajuda?

  • O protótipo tem muitos recursos: peça ao Agent para reduzi-lo a um usuário-alvo e um fluxo.
  • O público não está claro: peça ao Agent para reescrever a seção de boas-vindas para um usuário-alvo.
  • Dados simulados escondem riscos: peça ao Agent para listar o que é real e o que é simulado.
  • O feedback é vago: dê aos revisores uma tarefa e uma pergunta.
  • A publicação falha: use Solução de problemas de publicação.

Relacionado