Mundos sci-fi com shaders
Uma landing page sci-fi orientada por shaders, em que quatro universos distintos se alternam suavemente à medida que você rola a página. Copie o prompt para criar a sua.
Loading preview...
2507 views
Comece com este prompt
Gere uma landing page com shaders e quatro universos
Floresta das Quatro Estações
Substitua os quatro universos por cenas de floresta ao longo das estações.
Experimente o Kimi BuildCrie uma landing page sci-fi orientada por shaders, apresentada como um estudo ao vivo de raymarching em tempo real: a página não usa texturas, malhas nem outros assets — quatro cenas cósmicas são calculadas inteiramente pela matemática de fragment shaders e se alternam suavemente à medida que o visitante rola a página. Cena um, Singularidade: um buraco negro com disco de acreção, com a luz integrada ao longo de geodésicas em cerca de 200 etapas para que o lado distante do disco se curve por cima, enquanto o feixe Doppler relativístico ilumina um dos lados. Cena dois, Nebulosa: um campo de densidade fBm de 4 oitavas iluminado por cerca de 44 amostras de dispersão simples de frente para trás. Cena três, Marés: um campo de altura oceânico com oito oitavas de ondas interferentes, encontrado por bisseção, que reflete por Fresnel um céu de aurora com 32 camadas. Cena quatro, Primeira Luz: terreno multifractal estriado, rastreado por esfera até o horizonte ao amanhecer. Cada capítulo combina um título poético com uma breve lista de parâmetros técnicos, como contagens de amostras e etapas de integração. Uma barra lateral esquerda acompanha os capítulos com preenchimento de progresso; um HUD no canto mostra a cena atual, o buffer de renderização, a taxa de quadros e a profundidade de rolagem; uma barra superior exibe WebGPU · em tempo real. Tipografia monoespaçada, paleta em preto e branco com um único destaque laranja e uma sobreposição de grão de filme. As transições controladas pela rolagem devem funcionar de fato e com fluidez em qualquer navegador compatível com WebGPU. Substitua os quatro universos por uma floresta na primavera, no verão, no outono e no inverno, mantendo a estrutura de transição suave controlada pela rolagem. Dê a cada estação sua própria paleta e partículas — pétalas, vaga-lumes, folhas caindo e neve — e reescreva os textos com uma temática de natureza.
Crie uma landing page sci-fi orientada por shaders, apresentada como um estudo ao vivo de raymarching em tempo real: a página não usa texturas, malhas nem outros assets — quatro cenas cósmicas são calculadas inteiramente pela matemática de fragment shaders e se alternam suavemente à medida que o visitante rola a página. Cena um, Singularidade: um buraco negro com disco de acreção, com a luz integrada ao longo de geodésicas em cerca de 200 etapas para que o lado distante do disco se curve por cima, enquanto o feixe Doppler relativístico ilumina um dos lados. Cena dois, Nebulosa: um campo de densidade fBm de 4 oitavas iluminado por cerca de 44 amostras de dispersão simples de frente para trás. Cena três, Marés: um campo de altura oceânico com oito oitavas de ondas interferentes, encontrado por bisseção, que reflete por Fresnel um céu de aurora com 32 camadas. Cena quatro, Primeira Luz: terreno multifractal estriado, rastreado por esfera até o horizonte ao amanhecer. Cada capítulo combina um título poético com uma breve lista de parâmetros técnicos, como contagens de amostras e etapas de integração. Uma barra lateral esquerda acompanha os capítulos com preenchimento de progresso; um HUD no canto mostra a cena atual, o buffer de renderização, a taxa de quadros e a profundidade de rolagem; uma barra superior exibe WebGPU · em tempo real. Tipografia monoespaçada, paleta em preto e branco com um único destaque laranja e uma sobreposição de grão de filme. As transições controladas pela rolagem devem funcionar de fato e com fluidez em qualquer navegador compatível com WebGPU. Insira uma seção de produtos entre a segunda e a terceira cena: três cards de produto lado a lado, cada um com título, um diferencial e um botão, surgindo em sequência conforme a rolagem, com estilo alinhado aos visuais dos shaders.
Modo de Desempenho para Dispositivos Móveis
Reduza o custo de partículas e iluminação em dispositivos móveis.
Experimente o Kimi BuildCrie uma landing page sci-fi orientada por shaders, apresentada como um estudo ao vivo de raymarching em tempo real: a página não usa texturas, malhas nem outros assets — quatro cenas cósmicas são calculadas inteiramente pela matemática de fragment shaders e se alternam suavemente à medida que o visitante rola a página. Cena um, Singularidade: um buraco negro com disco de acreção, com a luz integrada ao longo de geodésicas em cerca de 200 etapas para que o lado distante do disco se curve por cima, enquanto o feixe Doppler relativístico ilumina um dos lados. Cena dois, Nebulosa: um campo de densidade fBm de 4 oitavas iluminado por cerca de 44 amostras de dispersão simples de frente para trás. Cena três, Marés: um campo de altura oceânico com oito oitavas de ondas interferentes, encontrado por bisseção, que reflete por Fresnel um céu de aurora com 32 camadas. Cena quatro, Primeira Luz: terreno multifractal estriado, rastreado por esfera até o horizonte ao amanhecer. Cada capítulo combina um título poético com uma breve lista de parâmetros técnicos, como contagens de amostras e etapas de integração. Uma barra lateral esquerda acompanha os capítulos com preenchimento de progresso; um HUD no canto mostra a cena atual, o buffer de renderização, a taxa de quadros e a profundidade de rolagem; uma barra superior exibe WebGPU · em tempo real. Tipografia monoespaçada, paleta em preto e branco com um único destaque laranja e uma sobreposição de grão de filme. As transições controladas pela rolagem devem funcionar de fato e com fluidez em qualquer navegador compatível com WebGPU. Adicione adaptação de desempenho para dispositivos móveis: abaixo de 768px de largura, reduza as contagens de partículas e a resolução de renderização, desative a iluminação volumétrica mais custosa e exiba um controle de "modo de alto desempenho" que os visitantes possam alternar.
