PROMPT DE VÍDEO

Modelo de Design de Movimento com Morphing de UI

Um modelo de prompt abrangente para criar designs de movimento de interface do usuário em loop, onde os elementos se transformam através de vários estados sincronizados com a música.

Crie uma página web com este prompt

ComandoModelo de Design de Movimento com Morphing de UI

<inputs>
Peça-me: 8 a 12 estados de UI que quero que a forma assuma (ex.: botão, carregador, player, slider, toggle, abas, gráfico, command palette, toast), preto e branco puro ou uma cor de destaque, e uma música livre de royalties em torno de 120 BPM (ex.: Mixkit, gratuita para uso comercial).
</inputs>

<direction>
Movimento de UI nível Dribbble. Uma única forma, nunca cortada: cada estado é o mesmo elemento mudando seu tamanho, raio e cor enquanto seu conteúdo troca com um leve desfoque. Um cursor impulsiona cada mudança com cliques e arrastos reais. Tela cinza-quente clara, componentes em preto e branco, uma fonte de UI limpa (Geist). Molas por toda parte, no máximo um pequeno overshoot. A câmera faz zoom para que cada estado preencha o quadro. O último quadro é o primeiro quadro, então ele entra em loop.
Proibido: easing elástico, explosões de partículas, brilhos, gradientes na estrutura da UI, traços de ícones incompatíveis, tempo morto, qualquer coisa que pareça um template genérico.
</direction>

<structure>
120 BPM, 7 compassos, algo acontece em cada batida.
Botão → carregador → check → dynamic island → music player com morphing play/pause → scrub na barra de progresso → ela se torna um slider de volume que estica quando arrastado além do máximo → um toggle vira na batida → o knob se torna um indicador de aba líquido → as abas se abrem em um gráfico que se desenha sozinho, com tooltip ao passar o mouse → colapsa em ⌘K → digite para filtrar → enter → toast → volta para o botão.
</structure>

<build>
1. Um único arquivo HTML, quadrado 1440x1440. Cada estilo é calculado a partir do tempo dentro de seek(t): sem transições CSS, sem timers, sem estado carregado entre frames.
2. As molas são respostas de passo em forma fechada. Um valor que muda de alvo várias vezes é a soma de uma mola por mudança, então permanece uma função pura do tempo.
3. As duas bordas do indicador de aba usam molas diferentes, então a borda líder estica à frente da borda traseira. Mesmo truque para o knob do toggle.
4. Os arrastos são manipulação direta: enquanto o cursor está pressionado, o valor é calculado a partir de sua posição. Ao soltar, ele retorna com mola de onde estava.
5. Analise a música com numpy para a grade de batidas e comece em um downbeat. Posicione cada som de UI pelo seu pico medido.
6. Renderize com Playwright: 4 subframes por frame, misturados com ffmpeg tmix para motion blur a 60fps.
7. Renderize um frame por batida antes da renderização completa. Corrija qualquer coisa fora da grade, apertada ou difícil de ler.
</build>

<gotchas>
Nunca coloque will-change em nada que a câmera escale ou onde o texto fique desfocado. Texto que troca dentro de um contêiner em morphing precisa de seus próprios tempos de entrada e saída, ou ele se sobrepõe. Faça o último quadro ser idêntico ao primeiro, incluindo posição e velocidade do cursor, ou o loop terá travamentos.
</gotchas>

<start>
Peça-me os inputs, depois mostre-me a lista de estados na grade de batidas antes de escrever qualquer código.
</start>

Como usar este prompt

1
Copie o prompt completo acima.
2
Abra uma plataforma compatível com o Claude Opus 5.5, como a YouMind, e cole o prompt.
3
Troque o tema, o estilo ou os detalhes conforme a sua ideia e gere.

Este é um prompt de IA gratuito da biblioteca de prompts da YouMind. Explore outros milhares de prompts de vídeo, todos gratuitos para copiar e adaptar.

Explorar mais prompts de vídeo

Mais de Claude Opus 5.5

Storyboard de Animação de Carro Low-Poly

Prompt de Animação de Título com Glitch

Simulação Realista de Deserto no Godot com Física

@KANA｜東京AI映像

Prompt Simples de Animação de Gráfico para Opus 5.5

Análise da Animação de Robô Polvo em Three.js

Demonstração Interativa de Tsuru de Origami com Opus 5.5

@Sourany Phomhome

Todas as categorias de Vídeo

01

Casos de uso

Mostra de Cenas Cinematográficas Vlog / Estilo de Vida Social Curta-metragem Videoclipe Comercial de Marca / Produto Ver mais

02

Estilos

Cinematográfico e Realista Fantasia / Mágico Cyberpunk / Ficção Científica Anime Filme Vintage / Retrô Ver mais

03

Assuntos

Pessoa / Personagem Esportes / Ação Natureza / Paisagem Arquitetura / Interiores Abstrato / VFX Ver mais

Mais recursos de prompts

Biblioteca de IA

Busca de prompts com IA

Deixe a IA buscar em dezenas de milhares de prompts. Filtre por modelo, período e palavras-chave, e ordene por engajamento: visualizações, favoritos, compartilhamentos e mais.

Ferramentas de visão

Imagem para prompt

Transforme qualquer foto em um prompt de imagem IA detalhado. O conversor gratuito de imagem para prompt analisa composição, estilo e iluminação para recriar qualquer visual em segundos.

Converter imagem em prompt

Outros recursos de prompts

Por modelo

Prompts do GPT Image 2.5 Comandos do GPT Image 2 Comandos do Nano Banana Pro Comandos do Seedream 4.5 Comandos do GPT Image 1.5 Prompts de vídeo do Gemini Comandos do Seedance 2.0 Grok Imagine Prompts Prompts do Gemini 3 Pro para sites

Por mídia

Prompts de imagem Prompts de vídeo Prompts de IA para criar sites

Ferramentas de IA

Imagem para prompt Prompts de foto Apresentações do GPT Image 2

Feito para criadores. Grátis para sempre.

YouMind é o copiloto criativo de IA usado por criadores no mundo todo. Cada prompt aqui é curado para ajudar você a criar melhor e mais rápido.

Criar página com prompt Explorar mais prompts

Ferramentas

Ferramentas gratuitas

Comparar

Notion NotebookLM ChatGPT Codex GenSpark Gamma Lovart Manus MyMind Perplexity

Empresa

Privacidade Termos Política de cookies

© 2026 MIND MOTOR PTE. LTD.

AI Summary