Sobre este template
Luminex preserva o rastro das decisões: o briefing que produziu esta hero tem 162 caracteres. A paleta é azul profundo #010A12 por baixo, branco #CFDDD8 para a tipografia e azul #143F62 carregando os destaques. A entrega é React: uma página só, sem plugin e sem ferramenta de build entre você e o design. Deixe aberto enquanto escreve: o briefing de 162 caracteres é a parte que se transfere para a sua própria página.
Feito para
- Engenheiros que precisam que a hero sobreviva a uma conexão lenta vão usar 800x600 e a escala tipográfica como orçamento de peso.
- Feito para quem cuida do conteúdo e reescreve uma hero cujo título precisa continuar tão longo quanto o da Luminex.
- Líderes de estúdio que tocam vários projetos ao mesmo tempo vão usar esta hero como o padrão que todas as outras páginas copiam.
O que está incluído
- A barra segue a grade. A barra é uma linha de texto e uma ação, medida em uma moldura em 800x600, para ler como faixa e não como bloco. Os links são compostos abaixo da marca em tamanho, e a ação #143F62 é o único elemento da barra com peso. Se a sua página tiver mais seções, agrupe em vez de alargar a barra.
- Uma barra sem excesso. Copie este padrão quando precisar de uma navegação que sobreviva a uma primeira tela barulhenta.
- Destaque só nos controles. A cor se resume a um destaque: azul #143F62 nas ações, azul profundo #010A12 em todo o resto. O contraste entre #143F62 e azul profundo #010A12 é o que torna o destaque legível em tamanhos pequenos.
- A composição é o conteúdo. A composição está completa em 800x600: texto, mídia e controles estão todos nomeados no briefing. A página é uma composição só em 800x600, e é por isso que ela se sustenta quando o texto muda.
Movimento e interação
Movimento que sai da frente
Esta é entregue como composição estática em 800x600, então a hierarquia precisa funcionar sem movimento, e funciona. Não há biblioteca de animação no briefing, o que mantém a reconstrução enxuta.
Estático por decisão
Não há biblioteca de scroll aqui: a composição em 800x600 fica parada e só se movem os elementos que respondem a você. A quietude é uma escolha válida.
Como Luminex ordena a primeira leitura
Dá para embaralhar esses blocos e a página continuaria carregando. Mas deixaria de ler como argumento: a navegação são uma sequência, e uma moldura em 800x600 só funcionam nessa ordem. O leitor de SaaS recebe a oferta antes das opções.
Como a hero se reorganiza
A hero é composta em 800x600 e recomposta para larguras estreitas. a escala é fluida, não em degraus, então a versão de celular é uma decisão, não um espremer. O layout estreito é uma decisão de projeto, não um espremer, e a hierarquia sobrevive a ele.
O que mudar primeiro em Luminex
Se a sua marca tem uma paleta mais pesada, teste contra a moldura antes de assumir. azul profundo #010A12 sustenta a página, então um destaque mais escuro precisa de mais contraste do que a referência usa. Reescreva a linha de display antes de tocar na cor.
Perguntas frequentes
Posso publicar uma página reconstruída a partir de Luminex sem dar os créditos?
O prompt foi publicado abertamente por motionsites.ai, e a prévia aqui é a renderização deles. Trate como referência de estrutura e movimento, confira os termos do site de origem e reconstrua a composição com o seu próprio texto, mídia e paleta antes de publicar.
O prompt de Luminex é uma especificação pronta ou um ponto de partida?
É um briefing de construção, não uma descrição de clima: ele nomeia a composição em 800x600, o espaçamento e os valores de movimento. Nada nele trata a imagem renderizada como fonte da verdade.
Por que a entrada cita React?
Luminex foi construído em React, e a entrada registra isso para dar procedência. O briefing descreve posições, tamanhos e tempos, então ele se reconstrói em qualquer framework capaz de definir tipografia e posicionar elementos.
