Avaliações do editor: Avaliações do usuário:[Total: 0 Average: 0] @media(min-width: 500px) { } @media(min-width: 800px) { }

Noya é uma ferramenta gratuita de prototipagem de IU com o editor Notion like e exportação Figma. Essa ferramenta é apenas outra ferramenta de prototipagem de interface do usuário para você, mas funciona de maneira diferente. É mais rápido e oferece uma maneira totalmente nova e diferente de projetar páginas da Web ou outras interfaces do usuário. Ele permite que você desenhe os blocos da interface do usuário usando arrastar e soltar e, em seguida, o layout final é gerado em tempo real. Ele tem Notion como comandos de barra que você pode usar para inserir vários blocos em seus designs.

Você pode construir seus designs em apenas alguns segundos com isso. Para espaços reservados, como imagens e tabelas, ele pode gerar automaticamente os dados fictícios para você, que são editáveis. Você pode se concentrar apenas no design e, uma vez concluído o design, pode exportá-lo como PNG, PDF e um arquivo Figma. Ele suporta exportação em React também, mas acho que não está incluído no plano gratuito.

O plano gratuito do Noya permite que você crie qualquer protótipo de design de um site, página inicial ou aplicativo da web. Mas você está limitado apenas a 200 blocos. Isso é bom para criar sites de pequenas empresas. O editor não limita você a ter blocos de tamanho fixo. Você pode redimensionar e remodelar os blocos usando o mouse, assim como você redimensiona imagens.

🎉🚀 Apresentando Noya (YC W23) 🚀🎉

Noya é uma ferramenta de wireframing que gera designs & código. Experimente:https://t.co/Cxrcs1bWkb

Noya permite que você trabalhe em wireframes de baixa fidelidade, enquanto ainda produz designs de alta fidelidade e protótipos React para compartilhar com sua equipe. pic.twitter.com/WV3bcXkLLt

— Devin Abbott (@dvnabbott) 9 de fevereiro de 2023

Ferramenta gratuita de prototipagem de interface do usuário com Notion like Editor, Figma Export: Noya

No site principal da Noya, você acabou de precisa criar uma conta gratuita para começar a usá-lo. Então, faça isso e você chegará ao painel principal. A partir daqui, você pode criar seu primeiro projeto e depois começar a desenhar.

No editor, a primeira coisa que você precisa definir é o nome do projeto e depois as dimensões. Além disso, você escolhe um sistema de design, mas por enquanto apenas Charka UI é suportado.

Agora, a verdadeira diversão pode começar. Na viewport, você apenas começa a desenhar os blocos. Clique no ícone “+” e arraste para desenhar um bloco. Com base na dimensão do bloco desenhado, ele tentará adivinhar automaticamente o que você deseja. Se você desenhar um retângulo estreito, ele adivinhará automaticamente que é uma barra de navegação no cabeçalho.

Da mesma forma, você pode adicionar outros blocos em seus designs, como imagens e seção de heróis.

Os blocos suportam comandos de barra e também há um menu para alterar o tipo de bloco. Basta digitar a barra (/) e ver as opções. Ou você também pode usar o menu suspenso no lado inferior direito de cada bloco para definir o tipo.

Depois de terminar o design, você pode ver a visualização ao vivo do design. Basta clicar em abrir a visualização ao vivo e renderizará seu design em uma página da Web na nova guia.

Da mesma forma, você pode continuar adicionando blocos e ele continuará gerando o design para você, bem como sua visualização. Quando terminar, você pode simplesmente exportar seu design. Clique na opção Exportar e você verá as várias opções que ela oferece.

Desta forma, você pode usar esta simples e nova ferramenta de prototipagem de interface do usuário, equipada com novas ferramentas e segue um padrão diferente fluxo de trabalho na concepção de UIs. A geração de conteúdo de IA que ele oferece também é louvável e você pode duplicar seus projetos aqui.

Pensamentos finais:

Se você gosta de design de interface do usuário e UX, então eu sou com certeza você vai adorar esta ferramenta por sua simplicidade e poderosa funcionalidade. A melhor parte dessa ferramenta é o desenho à mão livre. Você pode projetar e moldar os blocos de construção da maneira que desejar. Além disso, a exportação de Figma e React também é muito útil, já que designs modernos estão sendo criados neles.

Categories: IT Info