Verdent Docs
Principais recursos

Design Mode

Use um briefing em texto para escolher primeiro uma direção visual e, depois, construir um app funcional a partir dessa direção aprovada.

Design Mode é o caminho de criação design-first do Verdent para novos apps com uma interface visível. Use-o quando você tiver uma ideia em palavras, mas ainda não tiver um design finalizado, screenshot, guia de estilo ou plano completo de páginas.

Em vez de partir direto para o código, o Design Mode ajuda você a decidir primeiro como o produto deve parecer e funcionar e, então, transforma a direção aprovada em um app funcional.

Quando usar o Design Mode

Use o Design Mode quando quiser criar uma nova UI de produto a partir de um briefing em texto, como:

  • um app full-stack
  • um frontend web ou landing page
  • um app mobile
  • uma ideia de produto do zero em que a direção visual ainda não está decidida

Quando pular essa etapa

Pule o Design Mode quando:

  • o projeto for um utilitário trivial de tela única, como um formulário básico ou um app de brinquedo muito pequeno
  • você já tiver um briefing de design completo com uma direção de estilo concreta, paleta, sistema tipográfico e lista de páginas ou telas
  • você já tiver arquivos de design, mockups, screenshots ou um guia de estilo que devam ser seguidos diretamente
  • você quiser explicitamente pular o design e ir direto para o código

Se o seu briefing já for específico o suficiente, o Verdent pode usá-lo como a direção escolhida e avançar diretamente para o planejamento de páginas e o trabalho de construção.

Como o Design Mode funciona

Descreva o produto

Comece com um briefing em linguagem simples: o que você quer construir, para quem é, o que deve fazer e quaisquer referências de clima ou estilo que você já tenha.

Escolha uma direção visual

O Verdent explora direções de design distintas para que você possa escolher o visual e a sensação antes de escrever o código.

Planeje as páginas ou telas

Para produtos com múltiplas páginas, full-stack ou mais complexos, o Verdent transforma a direção escolhida em um plano de páginas ou telas e em uma especificação de produto em linguagem simples.

Construa a partir da direção aprovada

Depois que a direção estiver clara, o Verdent restaura o design em um app funcional e mantém as decisões posteriores vinculadas ao design e à especificação aprovados.

Visualize e continue

Revise o app no preview e, em seguida, continue com o trabalho de backend, testes ou outras iterações conforme necessário.

Como usar o Design Mode no Verdent Desktop

Quando você inicia um novo produto no Manager, descreva o app que deseja construir. Se você ainda não tiver uma direção de design concreta, abra o Design Mode e o Verdent ajudará você a escolher uma direção visual antes de construir.

Você pode manter o briefing simples, mas deixe-o específico o suficiente para orientar as decisões de design:

  • o que o produto é
  • quem vai usá-lo
  • a principal tarefa que ele deve ajudar a realizar
  • as páginas, telas ou estados que você já sabe que vai precisar

Exemplos de briefings

Landing page

Construa uma landing page para um app de finanças pessoais voltado a freelancers. Ela deve transmitir calma, confiança e um tom editorial, com um hero, seções de recursos, preços e FAQ.

App multi-tela

Crie um rastreador de hábitos mobile-first para pessoas se recuperando de burnout. Ele deve transmitir leveza e ser tátil, com onboarding, check-in diário, visão de progresso e configurações.

Dicas para melhores resultados

  • Diga para quem o produto se destina.
  • Descreva a sensação que você quer, não apenas a lista de recursos.
  • Mencione páginas ou telas conhecidas, se você as tiver.
  • Compartilhe referências ou restrições cedo, se forem importantes.
  • Diga o que evitar se você já souber o que ficaria errado.
  • Para produtos complexos, espere confirmar a lista de páginas e a especificação de produto antes que a construção completa continue.