MockStudioBuscar
Integração

MockStudio + Fluxo Âncora

O Fluxo Âncora é um método de desenvolvimento com IA em seis etapas, em que nada é implementado sem uma especificação aprovada. Ele é todo em texto. O MockStudio entra como a parte visual da etapa 1: a história do usuário já nasce com o protótipo clicável e os critérios de aceite tirados do que funciona nele.

Conhecer o Fluxo Âncora ↗Como o método funciona ↗
Onde entra

As seis etapas, com o protótipo na primeira

A etapa 1 é onde o MockStudio entra de verdade. Nas seguintes, o que ele gerou ajuda sem mudar o processo.

  1. 1POUser StoryMockStudio

    A história nasce com o protótipo clicável, prints e critérios de aceite sugeridos.

  2. 2Tech LeadRefinamento

    O registro de alterações do mock vira insumo da especificação e do delta.

  3. 3GatekeeperAuditoria

    Cada alteração do mock tem um requisito, e cada requisito aparece no mock.

  4. 4DevImplementação

    O documento para o dev já fala a língua da IA que implementa.

  5. 5QATestes

    Fluxos e ações do protótipo viram roteiro de teste.

  6. 6ReviewCI/CD

    Segue o fluxo normal.

Como usar

Do protótipo à história do usuário

  1. Monte o protótipo no MockStudio: capture as telas, torne funcional, faça as alterações e ligue as ações.
  2. Clique em Exportar → Para o Fluxo Âncora e informe o código da US e o projeto (se já souber).
  3. Copie a pasta prototipo/ para projetos/<projeto>/trabalhos/<US>/ no repositório Âncora.
  4. Cole o prompt-padronizador.md no agente da etapa 1 e responda às perguntas. O que o PO confirmar vai para a 01-us-original.md.
Passo a passo completo no guia →
O que a exportação gera

A pasta prototipo/

01-us-prototipo.md

No padrão da US do Fluxo: telas, o que muda, requisitos e critérios de aceite sugeridos, fluxos, perguntas em aberto e cuidados de LGPD.

imagens/

O print de cada tela e, quando há alterações, os prints de antes e depois.

prototipo-clicavel.zip

O protótipo funcionando, offline, para o negócio clicar antes de aprovar.

prompt-padronizador.md

O texto pronto para colar no agente padronizador da etapa 1.

documento-para-o-dev.md

Quando há alterações registradas: cada uma com print marcado e instruções para a IA de código.

Exemplo

Critérios de aceite tirados do protótipo

Trecho do 01-us-prototipo.md gerado a partir da demonstração. Tudo vem marcado como sugerido: só entra na US depois que o PO confirma.

## Critérios de aceite sugeridos

- CA01 Na tela **Pedidos**, ao clicar em “Painel”, abre a tela **Painel**.
- CA02 Na tela **Pedidos**, ao clicar em “+ Novo pedido”, abre a janela **Novo pedido**.
- CA03 Na tela **Pedidos**, ao clicar em “Salvar pedido”, a janela fecha e aparece o aviso “Pedido salvo”.
- CA04 Na tela **Pedidos**, o campo “Valor” usa máscara de valor em dinheiro
       (preenche da direita para a esquerda, como app de banco).
Por que integrar

O que o fluxo ganha

Menos ambiguidade

O PO mostra a tela em vez de descrever em palavras. A história nasce mais completa.

Aprovação mais rápida

O negócio clica no protótipo e aprova (ou pede ajuste) antes de qualquer linha de código.

Rastreabilidade

Alterações do mock, requisitos e critérios de aceite apontam uns para os outros.

Menos idas e voltas

Dúvidas de tela aparecem na etapa 1, e não no review.

Dados pessoais (LGPD). A captura copia telas reais. Na exportação, o MockStudio procura CPF, CNPJ, e-mail e telefone no texto das telas e avisa, sem copiar os valores. Prefira telas de homologação e confira os prints antes de subir.
O protótipo é insumo, não a especificação. A fonte da verdade continua sendo a pasta Âncora: o padronizador usa o protótipo para escrever a US, e o PO confirma. Para mudanças sem tela, o fluxo segue como sempre.