Todos os Skills de vídeo Premium em um só plano. Cancele quando quiser.Ver planos
Solenne · 16:9

Renderizado por este Skill

Tela inicial em celular 3D v1.0.0

Um celular 3D gira num estúdio suave com uma tela inicial de vidro líquido, notificações chegando e o seu web app na tela.

Ainda sem avaliações 0 downloads
Formato
Vídeo · 16:9
Duração
0:15

Grátis Grátis com uma conta

Entre para baixar

Cole isto no seu agente. Ele conecta a CLI se necessário e instala o Skill.

Um bloco gratuito do HyperFrames para 15 segundos de b-roll de dispositivo em 3D. Um modelo 3D de celular gira sobre uma mesa sob um papel de parede em shader; a tela inicial de vidro líquido mostra ícones de apps, widgets e notificações entrando, e depois abre uma página web com uma frase de destaque e cards. Todo o conteúdo da tela (ícones, rótulos, notificações, a página) é HTML que você pode editar; o celular e o notebook são modelos 3D.

Atualizado em 4 de nov. de 2026

O que você recebe

  • Um MP4 de 15 segundos em 1920×1080 com um celular 3D
  • Uma tela inicial de vidro líquido, notificações e a sua página na tela
  • HTML editável para cada pixel da tela

Ideal para

  • Filmes de lançamento de apps e b-roll
  • Vídeos de destaque para landing pages
  • Demos para investidores e keynotes

Não é para

  • Mostrar uma gravação real do seu app
  • Formatos só na vertical

Sobre este Skill

Você diz

/ios26-liquid-glass Faça uma tela inicial em celular 3D para a Solenne: notificações sobre a cena da noite e o relatório de energia, e a página da Solenne "Your home, on cue".

B-roll de dispositivo faz qualquer app parecer lançado. A Tela inicial em celular 3D renderiza um celular 3D de verdade com uma tela inicial atual de vidro líquido, para que as suas notificações apareçam e o seu web app se abra nele, sob luz de estúdio, sem gravação e sem artista 3D.

Como funciona

  1. Peça: diga ao seu agente as notificações, os nomes dos apps e o conteúdo da página que o celular deve mostrar.
  2. Preencha: ele escreve seus textos e suas cores nas variáveis do bloco, mantendo os textos perto do tamanho para o qual o layout foi feito.
  3. Renderize: ele renderiza um rascunho com npx hyperframes render, confere alguns quadros e renderiza o MP4 final.
  4. Reaproveite: as variáveis ficam num pequeno arquivo JSON, então a próxima versão é só mais uma renderização.

Dicas

  • Troque os ícones e nomes de apps padrão pelos seus ou por neutros; a nossa amostra faz isso.
  • Mantenha cada notificação em uma linha curta.
  • Use as cores reais do seu produto na página.
  • Ele não tem variáveis: seu agente edita o texto direto no HTML, seguindo o SKILL.md.

Código aberto

Este é um bloco do registro do HyperFrames, feito pela HeyGen e pelos colaboradores do HyperFrames (heygen-com/hyperframes) e compartilhado sob a Apache License 2.0. O download é o bloco com seus arquivos e um SKILL.md escrito pela Reelity, para que seu agente saiba preenchê-lo e renderizá-lo; o HyperFrames em si roda pelo npm.

O que você precisa antes de começar

Você fornece
As notificações, os nomes dos apps e o texto da página que você quer na tela, e as suas cores.
Dependências
Node.js 22 ou superior — obrigatório · FFmpeg — obrigatório
Custos externos
Nenhum. O HyperFrames é gratuito, de código aberto e renderiza no seu próprio computador.
Último teste
v1.0.0 —

Avaliações de usuários

Ainda não há avaliações. Instale o Skill e seja o primeiro a avaliar.

Perguntas frequentes

Ele vem com ícones de apps reais?

O original inclui ícones de apps conhecidos como placeholders. Troque pelos seus ou por neutros; a nossa amostra usa ícones neutros gerados.

Posso colocar um print na tela?

Sim. A tela é HTML, então uma imagem do seu app pode substituir a página.

Por que é grátis?

É um bloco de código aberto do HyperFrames, da HeyGen e dos colaboradores do HyperFrames. Nós o listamos como está, com um SKILL.md para que seu agente possa usá-lo e uma amostra feita com uma das nossas marcas da casa, a Solenne.

Guias

How to make an app install video that shows the installThe fastest way to sell an app is to show someone getting it. How to animate an app store search, a tap on GET and the install, free, with the App Store Search Spot block.How to make a 3D phone mockup video for your appDevice b-roll makes any app look shipped. How to render a 3D phone with a liquid-glass home screen and your app on it, free, with the 3D Phone Home Screen block.How to make a 3D laptop mockup video for your productSoftware looks real on real hardware. How to put your product on a 3D laptop with a liquid-glass desktop, free, with the 3D Laptop Desktop block.

Skills parecidos

Ver todos