Relume
Relume · Programação
Relume é uma ferramenta de design web com IA que transforma um texto curto em sitemap, wireframes e guia de estilo, e depois exporta tudo para Webflow ou Figma.
Sobre Relume
About
O que é o Relume
Relume é uma ferramenta de design web com IA feita para a fase que vem antes do estilo visual de um site. Você descreve um projeto em um texto e ela gera um sitemap com as páginas necessárias, wireframes para cada uma, um guia de estilo combinando e textos de espaço reservado. A partir daí, você envia tudo para Webflow ou Figma como elementos editáveis. A proposta é substituir aquele trabalho lento de planejamento que costuma ficar entre o briefing do cliente e a construção de verdade.
A ferramenta tem duas metades. O AI Site Builder cuida da geração e transforma um briefing escrito em estrutura e conteúdo. A Relume Library é a outra metade: um conjunto grande de seções prontas que segue a convenção de nomes de classe Client-First, da Finsweet, o que mantém a estrutura consistente entre designers e projetos.
O Relume serve a agências, freelancers e equipes internas que trabalham com Webflow ou Figma. Ele não estiliza o site nem hospeda nada. Monta o esqueleto, e você leva adiante na ferramenta que já usa. Se o seu fluxo de trabalho vive fora do Webflow e do Figma, o ganho cai bastante.
Como começar
- Crie sua conta em relume.io e abra um projeto, a partir de um briefing em branco ou de um dos conjuntos de componentes publicados.
- Escreva um texto descrevendo o site, seu objetivo e seu público, e deixe a IA gerar um sitemap de páginas.
- Ajuste o sitemap, arraste seções para cada página a partir da Relume Library e edite os textos de espaço reservado.
- Gere ou escolha um guia de estilo para cores, tipografia e espaçamento, e exporte tudo para Webflow ou Figma.
Informações do produto
Uma visão rápida dos preços, das plataformas compatíveis e do desempenho de Relume.
Ideal para
Os usuários, tarefas e cenários em que esta ferramenta se encaixa melhor.
Usuários
- Agências de Webflow
- Designers freelancers
- Equipes de marketing internas
Tarefas
- Transformar um briefing em sitemap
- Criar wireframes rápido
- Redigir textos provisórios
Cenários
- Uma agência que inicia vários sites de clientes em paralelo e precisa de estruturas de seção coerentes.
- Um designer que trabalha sozinho e quer mostrar um wireframe ao cliente antes de investir dias no design completo.
- Uma equipe que usa a nomenclatura Client-First e quer que todo projeto novo parta do mesmo conjunto de componentes.
Principais recursos
Geração de sitemap e wireframes com IA
O Relume funciona como gerador de sitemap com IA e como ferramenta de wireframes em uma única passada. Você escreve um texto descrevendo o site e recebe um sitemap de páginas recomendadas junto com wireframes para cada uma. A estrutura vem com seções reais em vez de caixas vazias, então você avalia o layout desde o início, não depois de aplicar estilo.
Biblioteca de seções prontas
A biblioteca reúne um catálogo grande de componentes responsivos organizados por tipo de página, com heros, tabelas de preço, depoimentos, rodapés e mais. Cada seção usa a convenção de nomes Client-First da Finsweet, o que mantém a estrutura igual seja com um designer seja com dez.
Exportação para Webflow e Figma
Com o projeto pronto, você o envia para Webflow ou Figma como elementos nativos e editáveis. Isso faz do Relume uma ferramenta prática de wireframes para Webflow, e o plugin do Figma importa seus wireframes e guias como camadas editáveis. No Webflow, a exportação cria páginas, seções e textos em uma só importação, então o wireframe vira uma maquete funcional em vez de uma imagem fixa.
Gerador de guia de estilo
O Relume age como criador de guia de estilo e define regras de cor, tipografia e espaçamento combinando com as páginas geradas, de modo que cada seção parte de uma base visual comum. Trate isso como base, não como um sistema de design finalizado.
Textos de espaço reservado escritos por IA
A ferramenta preenche as seções com texto gerado para que o wireframe se leia como uma página real. Esse texto é feito para ser trocado, e usá-lo como conteúdo final seria um erro.
Exportação para React
O Relume consegue gerar componentes como código React, o que estende o fluxo além das ferramentas de design. Serve a equipes que querem que a estrutura gerada alimente direto uma construção de front-end.
Prós e contras
Prós
- Encurta a fase de planejamento ao transformar um briefing escrito em sitemap e wireframes em minutos.
- A Relume Library entrega um conjunto amplo e coerente de seções com a nomenclatura Client-First.
- A exportação para Webflow cria páginas e seções reais, então o wireframe vira um ponto de partida funcional.
- O plano gratuito deixa você testar o fluxo antes de pagar pela geração ilimitada.
Contras
- Monta estrutura, não estilo, então o design e a publicação seguem no Webflow ou no Figma.
- O valor cai se o seu stack não for Webflow, Figma ou React, porque os destinos de exportação são limitados.
- Os textos e guias de estilo gerados são rascunhos, e cada projeto ainda precisa de revisão humana antes de ir ao ar.
Perguntas frequentes
O Relume gera um sitemap, wireframes, um guia de estilo e textos de espaço reservado a partir de um texto, e depois exporta tudo para Webflow ou Figma. Ele cobre a fase de planejamento, não o design final nem a hospedagem.
Conteúdo relacionado
Explore ferramentas, skills e artigos relacionados a Relume.
Alternativas a Relume
Forefront
Forefront · ProgramaçãoO Forefront é uma plataforma web para construir com IA de código aberto. Você ajusta os principais modelos de linguagem de código aberto com seus próprios dados, avalia o desempenho deles e os roda por uma API ou os exporta para hospedar por conta própria. Desenvolvedores que querem a conveniência de uma plataforma fechada, mas fazem questão de ser donos dos modelos e dos dados, são o público-alvo aqui.
Startkit
StartKit.AI · ProgramaçãoStartkit é um boilerplate para criar produtos de SaaS com IA e wrappers de IA. Pense nele como um boilerplate para startups de IA com as partes chatas já conectadas: autenticação, pagamentos com Stripe e Lemon Squeezy, limites de uso, e-mail transacional e um kit inicial de API de IA que conversa com OpenAI, Anthropic, Groq ou Llama. Você clona o repositório, define seu preço e começa pela parte do produto que as pessoas realmente pagam. Ele é feito em Next.js sobre React e Tailwind, então boa parte do código boilerplate já parece familiar.
Testim
Tricentis · ProgramaçãoO Testim é uma plataforma de automação de testes com IA para criar e executar testes de ponta a ponta em aplicações web, mobile e Salesforce. Ele se apoia no aprendizado de máquina para manter os testes estáveis quando uma interface muda, então as equipes gastam menos tempo consertando seletores quebrados. Nada mal para uma ferramenta de testes automatizados que você pode começar a usar hoje. Você cria testes gravando ações no navegador e depois adiciona JavaScript quando precisa de mais controle. É uma escolha sólida para equipes de QA ocupadas.