Protótipos são os novos PRDs


Um número cada vez maior de gerentes de produto está percebendo que a forma mais rápida de chegar à clareza é construir. No Figma Make, eles estão testando suposições sob pressão desde cedo, ganhando impulso e mobilizando equipes em torno de algo tangível.
Compartilhar Protótipos são os novos PRDs
Ilustração de capa por Raven Jiang
Assim como em muitas disciplinas ao longo do processo de desenvolvimento de produto, o papel dos PMs está evoluindo. À medida que fluxos de trabalho tradicionais de produto entram em colapso, os PMs de hoje se veem orientando e prototipando com suas equipes, em vez de compartilhar documentos estáticos para revisão.
Ao transformar direções iniciais em protótipos interativos de alta fidelidade, fica mais fácil explorar múltiplos conceitos e levar as ideias adiante. Em vez de gastar tempo escrevendo documentações que talvez não capturem as nuances de um produto, os protótipos permitem mostrar — e não apenas contar — criando exemplos funcionais que ilustram a intenção e estimulam a discussão. Veja como as equipes de PM do Figma estão criando protótipos usando o Figma Make em todas as etapas de seus fluxos de trabalho — e por que os protótipos começaram a substituir completamente os documentos de requisitos de produto (PRDs).
Exploração
Tradicionalmente, a exploração de conceitos iniciais dependia de mockups, diagramas ou apresentações de slides. Como esses documentos não conseguem demonstrar o comportamento real, as equipes precisam imaginar a experiência, o que pode tornar o alinhamento mais lento. Mas, ao definir o escopo de um projeto, os protótipos conseguem pintar um quadro mais completo e oferecer algo concreto ao qual reagir.
Definir o espaço do problema
Quando há muitas incógnitas ou restrições mal definidas, você pode usar o Figma Make para ganhar mais clareza. “Eu uso o Figma Make quando não sinto que entendo muito bem o espaço do problema”, diz Tara Nadella, Gerente de Produto do Figma. Quando a equipe dela começou a explorar possíveis funcionalidades no Check designs — um linter de design system que identifica valores brutos e recomenda as variáveis corretas — seus pares da engenharia compartilharam um protótipo da funcionalidade e uma especificação técnica, animados para dar vida às ideias iniciais. A equipe de design também já vinha refletindo sobre as nuances da funcionalidade do produto, sugerindo possíveis abordagens visuais. Mas, como Tara ainda estava tentando entender o formato do problema, ela não conseguia alinhar uma solução. “As pessoas estavam começando a levar a ideia adiante, e percebi que precisava formar uma opinião. Mas eu não sabia por onde começar.”
Para se situar, Tara abriu o Figma Make e começou a criar prompts. Trabalhar em fluxos e interações mais rudimentares ajudou Tara a articular as ideias e perguntas que precisava levar de volta para a equipe, desde avaliar quando usar plugins complementares até sugerir ajustes de design que tornariam a experiência ponta a ponta mais intuitiva.
Explorar ideias iniciais
Ao moldar conceitos iniciais, o Figma Make permite gerar várias abordagens em minutos, para identificar quais valem a pena aprofundar. “O Figma Make ajuda a resolver o problema da tela em branco ao oferecer algo para explorar”, afirma Tara. E, com os kits do Make, essas explorações permanecem ancoradas em componentes reais de produto, gerando resultados que se parecem e se comportam muito mais como algo que de fato pode ser lançado. “[O Figma Make] reduz a barreira de entrada para a geração de ideias — não é preciso depender apenas de esboços à mão ou texto”, afirma Summer Wang, Gerente de Produto do Figma.
O Figma Make ajuda a resolver o problema da tela em branco ao oferecer algo a partir do qual explorar ideias.
O recurso de Copiar design converte uma pré-visualização do Figma Make em camadas editáveis no Figma Design, ajudando as equipes a criar variações, explorar múltiplas direções com mais rapidez e adicionar refinamentos visuais manualmente. Depois de atualizar o design no Figma Design, é possível vinculá-lo novamente ao Figma Make para atualizar o protótipo.
Recentemente, o Gerente de Produto do Figma, Sean Lea, estava explorando como a IA no Figma Slides poderia aplicar automaticamente as cores da marca de um usuário quando o prompt indica a criação de uma apresentação de marca. Ele recorreu ao Figma Make para prototipar como essa experiência poderia funcionar na prática. Sean duplicou modelos existentes do Figma Slides e usou prompts no Figma Make para remixar suas paletas de cores com base em pistas do prompt, simulando como um sistema automatizado poderia se comportar. “Isso nos ajudou a ganhar confiança na abordagem e a demonstrá-la em ação, em vez de apenas descrevê-la”, diz Sean.
Recursos de imagem com IA no Figma Make aceleram a exploração visual. É possível remover planos de fundo, isolar objetos ou reenquadrar imagens diretamente na tela de trabalho.
Dicas dos PMs do Figma
- Ancore seu protótipo no seu design system: use os kits do Make para conectar as bibliotecas de design da sua equipe, garantindo que tudo o que o Make gerar esteja ancorado no seu produto real, e não em um mockup genérico. “Ao criar prompts, comece sempre a partir de uma UI base e conecte as bibliotecas para simular seu produto real”, afirma Summer.
- Deixe o Figma Make descansar: afaste-se do seu protótipo e volte com uma perspectiva renovada. “Muitas das minhas sessões no Figma Make costumam durar várias horas seguidas, então revisitar depois é útil porque você sai daquele mergulho profundo e volta com a cabeça fresca”, diz Tara. Isso pode ajudar você a perceber pequenas inconsistências ou detalhes que talvez passassem despercebidos.
Criar modelos permite que você defina um padrão de alta qualidade para exploração. Depois de criar um protótipo bem refinado, você pode publicá-lo como um modelo, com diretrizes que controlam o que os colegas de equipe podem alterar. Isso garante que todos explorem a partir da mesma base, mantendo a consistência da marca.
Validação
Pode ser difícil sair de um modo mais generativo, de exploração de ideias iniciais, para validar quais delas valem o investimento de recursos. O ponto-chave é obter o alinhamento dos envolvidos internos e o feedback dos usuários — protótipos ajudam a evitar feedback equivocado e a confirmar que você está no caminho certo.
Coletar feedback dos usuários
Prototipar com o Figma Make permite colocar rapidamente exemplos funcionais diante dos usuários, oferecendo feedback rápido e confiável que garante que você esteja atacando problemas reais dos usuários. “A qualidade do que o Figma Make gera é boa o suficiente para permitir uma conversa real com usuários sobre uma funcionalidade ou ideia”, afirma Ezra Mechaber, Gerente de Produto do Figma. “Você não está entregando o código, mas está acelerando drasticamente o ciclo de construir-medir-aprender.” E, quando o Figma Make está conectado a um design system, os protótipos não apenas têm uma aparência mais refinada, como também permanecem alinhados à marca, dando aos PMs confiança de que o que os usuários veem reflete o produto real.
Ao se preparar para o recente lançamento do ChatGPT no Figma Slides, Sean teve apenas dois dias para coletar insights de usuários. Ele rapidamente usou o Figma Make para mesclar a interface do ChatGPT com os próprios padrões de design do Figma e prototipar um fluxo de exemplo. Em apenas um dia, ele tinha um protótipo funcional pronto para cinco entrevistas com usuários. “Os insights influenciaram diretamente nossos critérios de qualidade para as avaliações e nos deram a confiança necessária para tomar uma decisão clara de seguir ou não com a proposta”, afirma.
A qualidade [do Figma Make] é alta o bastante para permitir uma conversa real com usuários sobre uma funcionalidade.
Conquistar alinhamento
Quando você está defendendo uma ideia e nem todo mundo está convencido, um protótipo rápido pode ajudar a conquistar o apoio necessário ao mostrar como ela atende às necessidades dos usuários. Ver conceitos em contexto ajuda sua equipe a priorizar com mais confiança e até a trazer ideias que estavam paradas de volta para o roteiro. "[Figma Make] é uma ferramenta muito poderosa para alinhamento”, diz Tara. “Muitas vezes temos conversas teóricas sobre funcionalidades teóricas em algum ponto do produto. Mas quando você mostra um visual, fica muito mais rápido colocar todo mundo na mesma página. Assim, todos falamos a mesma linguagem e conseguimos avançar.”
A integração com o Supabase adiciona funcionalidades de backend aos protótipos do Figma Make, viabilizando recursos como telas de login, formulários que realmente salvam dados e apps que mantêm informações entre sessões. Em vez de simular fluxos de usuários com mockups clicáveis, você pode testar protótipos que funcionam como apps reais — tornando a pesquisa com usuários mais realista e revelando como as funcionalidades se comportam no uso real.
O Figma Make é igualmente útil para revisitar ideias que saíram do roteiro. Funcionalidades que antes pareciam vagas ou arriscadas podem ganhar uma segunda chance quando você consegue prototipar rapidamente uma versão funcional. “Para ideias no backlog, consigo mostrar rapidamente o que estou imaginando — ajudando a revisitar essas ideias com mais contexto”, diz Summer.
Dicas dos PMs do Figma:
- Não tenha medo de compartilhar um protótipo inacabado: encare os protótipos como pontos de partida para conversas, não como entregáveis finais. “A maior armadilha é achar que seu projeto no Make precisa estar ‘pronto’ antes de ser compartilhado. Use desde cedo e com frequência — mesmo para ideias bagunçadas ou ainda imaturas”, diz Sean.
- Adicione interações realistas: garanta que a UI espelhe o mais fielmente possível o seu produto atual. “Peça ao Make para criar páginas vinculadas, botões e outras interações para deixar tudo mais real”, diz Summer. Isso ajuda usuários e envolvidos a interagirem com o protótipo como se fosse o produto final.
Tomada de decisão
As decisões de produto muitas vezes dependem de detalhes que são difíceis de imaginar até que seja possível interagir com eles de fato. Com que rapidez um estado de carregamento deve aparecer? Um layout realmente faz sentido quando você começa a clicar e navegar por ele? Comunicar essas nuances é essencial ao avaliar múltiplas abordagens.
Acerte nos detalhes
"O desafio entre produto, design de produto e engenharia sobre como descrever e articular comportamentos específicos de produto é sempre uma área difícil", diz a gerente de produto do Figma, Holly Li. "O Figma Make condensou e simplificou muito esse problema para nós." Em vez de pedir que as equipes imaginem como diferentes opções poderiam funcionar, você pode colocar protótipos funcionais na frente delas para comparação. “PMs vivem constantemente nesse espaço entre descrever uma ideia de produto e mostrá-la”, diz Ezra. “Quando alguém leva um protótipo funcional para um workshop estratégico, a discussão muda completamente. Você consegue identificar imediatamente o que funciona na prática versus o que só parece bom na teoria.”
PMs vivem constantemente nesse espaço entre descrever uma ideia e mostrá-la.
Por exemplo, quando a equipe da Holly estava avaliando diferentes comportamentos de rolagem para uma funcionalidade, ela percebeu como era difícil expressar em palavras os trade-offs de cada opção. “Eu sei que isso é algo com que todo mundo se importa, porque impacta muito a qualidade da experiência, mas é quase impossível de descrever”, ela diz. Em vez de explicar as nuances de velocidade, direção e tempo de cada abordagem, Holly e sua equipe usaram o Figma Make para criar um protótipo de cada versão. Ver as opções em movimento, lado a lado, facilitou a compreensão de como elas funcionavam em contexto e a escolha daquela que fazia mais sentido para o caso de uso.
Compartilhar contexto
Quando um protótipo existe, ele se torna um artefato compartilhado para coletar contribuições da equipe e refinar ideias. Mas a forma como você compartilha esse protótipo faz diferença. “Não se trata apenas do artefato, mas também de construir uma narrativa em torno dele”, diz Tara. “Às vezes, simplesmente jogar um link da sua criação no Figma Make em um chat pode causar sobrecarga.” Em vez disso, muitos PMs gravam vídeos no Loom, nos quais apresentam uma demonstração do protótipo ou fazem essa apresentação ao vivo em reuniões.
Por exemplo, quando Summer estava definindo a direção de uma nova homepage e do feed de atividades, ela usou o Figma Make para criar vários protótipos de seus conceitos principais e reuni-las no FigJam para compartilhar com a equipe. Ao organizar capturas de tela de cada fluxo e anotar como as interações poderiam funcionar, ela criou uma narrativa visual clara que facilitou para os envolvidos avaliar os trade-offs e oferecer feedback mais direcionado.


O Figma Make oferece às equipes maneiras flexíveis de compartilhar protótipos com segurança. Você pode publicar um projeto no Make internamente — restrito a pessoas conectadas à sua organização no Figma — ou adicionar proteção por senha para revisões externas, facilitando a colaboração e a coleta de feedback sem expor protótipos na web aberta.
Depois de reunir todas as contribuições certas, manter os protótipos alinhados a decisões e feedbacks em evolução é outro desafio. Para simplificar este processo, você pode usar Make Conectores para sincronizar o contexto de ferramentas como Coda, Notion ou Linear diretamente nos seus protótipos. Isso garante que os ciclos de feedback se mantenham consistentes e que todos trabalhem a partir da mesma fonte de verdade, sem precisar sair do seu fluxo de trabalho.
Criar espaço para refinamento
Quando você usa o Figma Make como um playground para protótipos, já consegue resolver muitos dos detalhes críticos — fluxos, lógica e casos extremos — antes que uma funcionalidade chegue à produção. O que vem depois é o refinamento, quando o foco passa a ser o cuidado e o polimento dos detalhes. “O Figma Make libera tempo para a parte divertida do gerenciamento de produtos: tomar decisões com base no gosto pessoal e no fluxo de trabalho com muito mais confiança”, diz Holly.
O Figma Make libera tempo para a parte divertida do gerenciamento de produtos: tomar decisões com base no gosto pessoal e no fluxo de trabalho com muito mais confiança.
À medida que os protótipos se aproximam da produção, as equipes podem conectar pacotes npm do React ao Figma Make para garantir consistência com a base de código ativa. Isso permite que engenheiros trabalhem com componentes reais desde o início e ajuda gerentes de produto a ver como as funcionalidades vão se comportar depois de implementadas — reduzindo a distância entre protótipo e produção.
Esse ponto de partida mais sólido também transforma o handoff. “Hoje, a especificação que enviamos para as equipes de engenharia geralmente é um arquivo do Figma Make, junto com os designs”, diz Holly. Engenheiros podem usar o protótipo do Figma Make como referência de como as interações devem funcionar, enviar o código diretamente para o GitHub e usá-lo como base para o desenvolvimento contínuo. Eles também podem usar o servidor MCP do Figma para trazer contexto de design — componentes, variáveis e estrutura — diretamente para o ambiente de programação. Ao se conectar aos mesmos arquivos do Figma com os quais os PMs trabalham, o MCP ajuda os engenheiros a programar alinhados com a intenção do protótipo.
Dicas dos PMs da Figma:
- Prompts de workshop com o ChatGPT: use para ajudar a estruturar ideias em prompts claros. “Às vezes, eu só quero despejar ideias e pergunto: ‘Como você dividiria isso?’”, Tara diz.
- Seja minuciosoe específico: adicione o máximo de detalhes possível, mesmo que seja ao longo de vários prompts menores. “É preciso ser específico e explicar um pouco”, diz Holly. “Assim, você e o modelo ficam alinhados sobre seus objetivos.”
À medida que o desenvolvimento de produtos continua evoluindo junto com a IA, os protótipos oferecem uma forma mais rápida e clara de explorar ideias e alinhar a equipe. Nesse novo cenário, os PMs que mais se destacam são aqueles que abraçam a iteração em tempo real, transitando com fluidez entre os limites tradicionais de função.




