
Renderizado por este Skill
Widgets em vidro líquido v1.0.0
Widgets de dados em vidro líquido fosco contam para cima, um painel de destaque mostra o progresso e chips de status acendem sobre uma aurora em movimento.
- Formato
- Vídeo · 16:9
- Duração
- 0:08
Grátis Grátis com uma conta
Cole isto no seu agente. Ele conecta a CLI se necessário e instala o Skill.
Um bloco gratuito do HyperFrames para 8 segundos de dashboard em vidro líquido. Três widgets foscos contam uma temperatura, um nível de bateria e um anel de passos, um painel de destaque com o seu logo mostra um título, uma frase e um status que é concluído, e três chips de status acendem, tudo sobre um shader de aurora em movimento. Os textos, os números e o logo são editados no HTML.
Atualizado em 3 de nov. de 2026
O que você recebe
- Um MP4 de 8 segundos em 1920×1080 com fundo de aurora ao vivo
- Widgets de dados com contagem, um painel de destaque e chips de status
- O seu logo no painel
Ideal para
- Apps de fitness, saúde e dispositivos inteligentes
- Dashboards e recursos de dados
- B-roll de lançamento de produto
Não é para
- Fundos lisos ou nas cores da marca
- Mais de três dados
Sobre este Skill
/liquid-glass-widgets Faça widgets em vidro líquido para uma corrida com o Halden: temperatura, bateria do relógio e 8.2K passos, com um painel "Long run saved: 18.4 km at an easy pace in the Halden Solace" que termina em "Run saved".
Widgets são como as pessoas dão uma olhada rápida no que importa. Os Widgets em vidro líquido montam um pequeno dashboard no estilo de vidro líquido fosco, com números subindo e um painel que anuncia uma tarefa concluída, para que um app de fitness, um dispositivo inteligente ou um serviço mostre seus dados com beleza.
Como funciona
- Peça: diga ao seu agente os três valores dos widgets, o título e a frase do painel, o status final e o seu logo.
- 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.
- Renderize: ele renderiza um rascunho com
npx hyperframes render, confere alguns quadros e renderiza o MP4 final. - Reaproveite: as variáveis ficam num pequeno arquivo JSON, então a próxima versão é só mais uma renderização.
Dicas
- Escolha três números que contem uma mesma história, como temperatura, bateria e passos numa corrida.
- Mantenha a frase do painel em uns 70 caracteres.
- Use um logo branco.
- Ele não tem variáveis: seu agente edita os textos e os números 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
- Três dados, um título e uma frase curtos para o painel, um status final e um logo branco.
- 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
Os widgets podem mostrar outros dados?
Sim. Rótulos, valores e unidades ficam no HTML; a animação de contagem funciona com qualquer número.
Tem o mesmo visual das Notificações em vidro líquido?
Sim, a mesma aurora e o mesmo vidro, então os dois funcionam muito bem juntos na edição.
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, o Halden Solace.






