Skip to main content
As sugestões são o centro da interface do Replit Design. Em vez de encarar uma caixa de prompt em branco e precisar saber o que pedir, você seleciona um frame de design e o Replit Design propõe o que tentar em seguida. Cada sugestão está a um clique de se tornar uma nova geração.
Um frame de Website selecionado mostrando um hero do supercarro APEX X1, com um painel de Próximos passos sugeridos ao lado oferecendo chips de sugestão como Explorar abordagens diferentes, Tentar layouts diferentes, Explorar vibes diferentes e Me surpreenda

​
Como as sugestões funcionam

Quando você seleciona um frame de design gerado, sugestões aparecem ao lado dele. Elas são baseadas no que você está vendo, então explorar não exige vocabulário de design. Clique em uma e o Replit Design gera o resultado como um novo frame; o original permanece no lugar.

​
O que as sugestões propõem

As sugestões respondem a diferentes perguntas de exploração:
  • Um novo visual: o mesmo design em uma direção diferente, como uma variante editorial escura ou um layout diferente.
  • Uma extensão: uma seção ou página que seu design sugere, mas ainda não tem, como uma seção de preços ou uma página de contato.
  • Um novo contexto: seu design em outro lugar, como uma viewport mobile.

​
Explore com sugestões

O ciclo é propositalmente curto:
1

Selecione um frame gerado

Clique em qualquer frame de design gerado no canvas.
Um frame de Design rotulado APEX X1 Exact Replica mostrando uma página hero de supercarro cinza no canvas
2

Escolha uma sugestão

Sugestões aparecem ao lado do frame selecionado, baseadas no que você está vendo. Revise-as e clique em uma; você não precisa adicionar nada.
3

O Agent constrói ao clicar

No momento em que você clica, o Agent começa a construir a sugestão como um novo frame ao lado do original. Seus frames anteriores permanecem no canvas, então nada se perde ao explorar.
Um novo frame de Design intitulado 'Add Saturation on Scroll' sendo renderizado como um layout esqueleto com um indicador de Building…, ao lado do frame original APEX X1
4

Observe as mudanças

O frame finalizado aparece ao lado do original para que você possa compará-los lado a lado. O painel de chat resume o que mudou.
Dois frames de Design finalizados lado a lado no canvas, o original APEX X1 Exact Replica e a variante concluída Add Saturation on Scroll, com um resumo 'Run complete' no painel de chat
5

Aplique o design vencedor ao seu app

Continue selecionando e ramificando até que uma direção pareça certa; novas sugestões aparecem para qualquer frame que você selecionar. O vencedor não precisa continuar sendo um mockup: selecione-o, escolha Build… na barra de ações e escolha seu app existente em Apply to an existing creation. O Agent reescreve o código do app para corresponder ao design, deixando o frame no canvas como referência.
O menu Build aberto em uma variante selecionada com duas opções: 'Build this design', que cria um novo artefato, e 'Apply to an existing creation' listando o artefato Website do projeto

O menu Build: aplique o frame vencedor a um app que você já tem.

Veja Construa seu design para o fluxo completo, incluindo construir o frame como um novo app. Para refinar detalhes antes de aplicar, refine com o chat.

​
Dicas

  • Explore em direções, não em etapas. As sugestões se ramificam; seguir uma não te compromete. Gere algumas e compare no canvas.
  • Misture com suas próprias palavras. As sugestões e a caixa de chat de design funcionam juntas: clique em sugestões para explorar amplamente, converse para direcionar com precisão. O chat não serve apenas para polimento; uma mensagem como “tente o menu de navegação à esquerda” também abre uma nova direção.
  • Troque o modelo para uma sensibilidade diferente. Cada modelo explora de um jeito diferente; veja Explore com modelos diferentes.