Animação de interface
Uma nova era do no-code
Usar uma esfera como guia visual entre páginas, formulários e fluxos em camadas. As interfaces são planos combináveis com profundidade, não simples capturas.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Bem-vindo à era do no-code
Percorrer um espaço da escuridão à luz para transformar áreas compactas de interface e código em um mundo criativo aberto e explorável.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Comet | Janela de nebulosa
Fixar a navegação no topo e expandir só a máscara central; separar imagem interna e tamanho do contêiner.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Framer sobre um prisma de vidro
Fixar o título no eixo central e revelá-lo palavra por palavra; uma faixa estreita de vidro se estende da esquerda para a direita, e o ponto de luz mais intenso cruza o título pouco depois.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Nova identidade｜Revelação do logotipo
Extrair um C de uma superfície iridescente ampliada, recolher o volume em uma letra e depois abrir o nome inteiro na mesma linha de base.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Google Drive integrado ao Figma agent
Ler feedback externo, modificar o design e gerar um documento com os motivos das alterações, fechando o ciclo de leitura e escrita.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Figma Agent Vectors
Os recursos recém-gerados continuam selecionáveis, com cores editáveis e animação configurável; demonstrar a editabilidade nessas três etapas.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Linear — estado da fila de mesclagem nas diferenças
O vídeo contém apenas um hover local: preservar o estado principal, revelar o tempo já aguardado ao passar o ponteiro e ocultá-lo ao sair.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Lovable | Conectores do Google
Agrupar primeiro vários ícones de ferramentas e depois transformá-los, um a um, em etiquetas de conectores no campo de instruções
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Notion External Agents (integração com Claude + Cursor)…
Manter o mesmo cartão de tarefa enquanto o estado avança por Triage→Plan→Build→PR→Ship.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Adaptação ao iPhone Duo
Ao abrir, ampliar a área visível do conteúdo; barra lateral e corpo mantêm uma relação de recorte entre pai e filho.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Notion como código — espaços de trabalho em TypeScript
Escrever o requisito antes de mostrar execução e código, passando ao resultado real do espaço de trabalho após confirmar a implantação.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
ChatGPT | Apple Messages
Depois de encontrar uma pendência, mostrar uma sugestão, permitir edição e confirmação pelo usuário e só então mostrar a mensagem recebida na conversa de destino.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Cloud Computer: Implantação e uso de um computador na nuvem
Explicar o ambiente persistente de execução e demonstrá-lo com três exemplos: bots, coleta de dados e implantação
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Lançamento do Claude Haiku 5.5
Manter as três colunas fixas e alternar texturas internas e orientações em L em passos discretos; trocar recursos não equivale a deslocar o bloco inteiro.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Fable 5 | Retorno do personagem de pixels
Revelar o nome do produto letra por letra somente quando o personagem chegar ao letreiro, ligando movimento e letras por causa e efeito.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Atualização de recurso | Voice mode
Expandir o mesmo círculo central de botão a janela de imagem e recolhê-lo novamente, preservando a identidade espacial.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Android Drop — Find Hub, Motion Assist, Gemini
Cada função combina um cartão principal e um pequeno feedback associado.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação gráfica
Prévia de 5 segundos do mesmo projeto · 5.0 segundos
Reorganizar pontos em pessoas, lugares e objetos em sequência, com cores seguindo a categoria.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação gráfica
Grok Bot × Linear
Alinhar e fixar as duas marcas enquanto o fundo flui sem competir com o texto.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Grok Bot agora pode pesquisar, ler e monitorar o X.
Mostrar várias fontes consultadas antes de condensá-las em um resumo temático.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Grok Bot · Formulários e login na conversa
O agente passa o controle ao usuário quando encontra autenticação; o fluxo continua após receber sua entrada.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Grok — 21 vozes totalmente novas
Fixar posição e tamanho do título; o movimento vem principalmente do fluxo contínuo do fundo.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Reception · Atendimento telefônico em vários setores
Estabelecer o mesmo problema por chamadas de vários setores e apresentar uma esfera luminosa como solução no trecho central
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
ElevenLabs | Scribe v2
Apresentar dimensões de medição e explicar capacidades por mudanças concretas no texto
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Composer · Edição de músicas por seções
Passar de solicitação aberta a seções, andamento e tonalidade controláveis, concluindo em forma de onda e obra final
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Polymarket · Escolha de direção em cinco minutos
Apresentar a decisão e depois focar o terminal complexo em uma ação de duas opções
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Cursor Multitask / Subagents — /multitask no novo…
Adicionar várias tarefas à mesma sessão e mostrar a quantidade paralela em um painel fixo
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Annotate chega ao design mode
Prender anotações aos elementos-alvo, com correspondência exata entre números e comentários
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Cursor — agora no iPad
Mostrar o mesmo resultado em vários dispositivos antes de focar organização e revisão no tablet
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Cursor — crie um app web e implante na Vercel
Mostrar repositórios disponíveis antes de destacar a criação do zero; a prévia aparece após a entrada
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Computer pode gerar gráficos interativos
Incluir gráficos que respondam ao ponteiro com informações de dados, não apenas com zoom global.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Perplexity — Portable Computer no NVIDIA DGX Spark
Cercar o dispositivo com ferramentas locais e colocar modelos de nuvem em outra camada; conexões indicam encaminhamento quando necessário, não envio externo por padrão.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação 3D
Migrar para Framer com MCP
Fixar a janela dianteira no alto à direita e a traseira abaixo à esquerda com a mesma perspectiva. Recolher a traseira até um ponto antes de expandir pelo eixo diagonal.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Framer Skills
Na abertura, digitar sucessivamente regras de fonte e aspas no campo de entrada; depois, mostrar a página pronta para deixar claro que essas regras afetam o conjunto da página.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Templates do Framer Agent
Alinhar três modelos na horizontal, mostrando o cartão central inteiro e apenas parte dos laterais, escurecidos. Na troca, deslizar toda a faixa horizontalmente e restaurar o brilho do cartão central apenas ao chegar à posição.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Carteira Link para agentes
Primeiro instalar e conectar o agente; depois, pedir uma alteração no itinerário pelo chat, mostrar o custo e passar ao celular para confirmar. Repetir custo e estabelecimento entre interfaces para identificar a mesma solicitação.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
Directory: dados gratuitos de recrutamento
Avatares aparecem sucessivamente ao redor do título central, com tamanhos semelhantes e etiquetas curtas de identidade. Manter o título em duas linhas e usar laranja na linha da marca.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Transforme esboços em desenhos animados no Grok
A primeira solicitação transforma o esboço em uma folha de personagens; a segunda converte esse resultado em animação. O chat rola para cima, e os novos resultados entram por baixo, mantendo a relação com a mensagem anterior.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação 3D
Digitação por voz gratuita
Teclas com símbolo e texto caem formando uma fileira e se separam para os lados, revelando uma cápsula preta luminosa com ondas sonoras. A cápsula serve de âncora comum para as próximas demonstrações.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Adaptação ao iPhone Duo
O celular vertical entra centralizado, gira e se abre em duas colunas horizontais: a lista fica de um lado e o detalhe entra no outro. Manter a mesma nota nos dois formatos.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Novas capacidades do Runway Agent
Mostrar primeiro a página final do produto, voltar à solicitação, extrair cores e produto, gerar cenas e tamanhos diferentes e terminar com a capacidade de animação. Repetir a mesma caixa de som em vários resultados.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Palavras de estado e HyperFrames
As palavras de estado mudam rapidamente em monoespaçada discreta, seguidas de um triângulo duplo escuro. O verde preenche o símbolo de baixo para cima e depois o logotipo branco se abre.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Novas capacidades｜450+ integrações
Cápsulas laranja conectam palavras como connect e with e terminam em um sinal de mais clicável. Ao clicar, ícones entram por vários arcos, e o número cresce até 450.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Edição de filmagens reais
Vidro.
O vidro permanece fixo enquanto uma mão e um recipiente passam atrás; a grade fina divide os contornos em pequenos segmentos deslocados. O plano geral situa a moldura, e os detalhes mostram claramente a relação entre textura e distorção.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de texto
TIDAL｜Identidade tipográfica, versão de 60 segundos
Fazer do texto o protagonista: palavras curtas crescem, se comprimem e se encadeiam conforme a ênfase semântica; losangos empurram os blocos de texto para o próximo grupo de cores.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Composição de botões · 10.7 segundos
Separar e reunir três botões de efeitos com recortes como módulos encaixáveis, começando pelo inferior e preservando a relação vertical próxima.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Creative Cloud｜Variação de lâminas magenta
Mostrar com cortes breves como o símbolo passa de lâminas tridimensionais para edição plana e material prateado, usando magenta como fio visual.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
EliseAI｜Interface do produto no site
Explicar o valor do assistente com uma conversa completa de agendamento: o usuário pede um horário, o assistente oferece duas opções e o usuário confirma uma.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação gráfica
Estamos lançando EURR, nossa primeira stablecoin lastreada em euros, no app do Revolut.
Trocar as posições dianteira e traseira de duas moedas sobre a mesma bandeja, mantendo o texto fixo para concentrar o movimento entre elas.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Apresentamos o Wabi 2.0: um novo tipo de mensageiro que cria apps e realiza tarefas…
As informações do chat viram gradualmente pequenos aplicativos úteis, que depois formam uma página pessoal.
Apenas vídeo de referência; nenhum projeto editável fornecido.
Animação de interface
Crie apresentações com IA
Primeiro transformar o tema em um roteiro editável e depois o roteiro em slides completos, com resultados claros nas duas gerações.
Apenas vídeo de referência; nenhum projeto editável fornecido.