Animación de interfaz
Una nueva era del no-code
Usar una esfera como guía visual entre páginas, formularios y flujos en capas. Las interfaces son planos combinables con profundidad, no simples capturas.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Bienvenido a la era del no-code
Recorrer un espacio de la oscuridad a la luz para convertir áreas compactas de interfaz y código en un mundo creativo abierto y explorable.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Comet | Ventana de nebulosa
Fijar la navegación arriba y expandir solo la máscara central; separar imagen interna y tamaño del contenedor.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Framer sobre un prisma de cristal
Fijar el título en el eje central y revelarlo palabra a palabra; una tira estrecha de cristal se extiende de izquierda a derecha y el punto de luz más brillante cruza el título poco después.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Nueva identidad｜Revelación del logotipo
Extraer una C de una superficie iridiscente ampliada, recoger el volumen en una letra y desplegar después el nombre completo sobre la misma línea base.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Google Drive se integra con Figma agent
Leer comentarios externos, modificar el diseño y generar un documento que registre los motivos de los cambios, cerrando el ciclo de lectura y escritura.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Figma Agent Vectors
Los recursos recién generados se pueden seleccionar, recolorear y animar; demostrar la editabilidad en esas tres etapas.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Linear — estado de la cola de fusión en las diferencias
El clip solo contiene un hover local: conservar el estado principal, revelar el tiempo ya esperado al pasar el puntero y ocultarlo al retirarlo.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Lovable | Conectores de Google
Agrupar primero varios iconos de herramientas y convertirlos después, uno por uno, en etiquetas de conectores dentro del campo de instrucciones
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Notion External Agents (integración con Claude + Cursor)…
Mantener la misma tarjeta de tarea mientras su estado avanza por Triage→Plan→Build→PR→Ship.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Adaptación a iPhone Duo
Al desplegar, ampliar el área visible del contenido; la barra lateral y el cuerpo mantienen una relación de recorte entre padre e hijo.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Notion como código — espacios de trabajo en TypeScript
Escribir el requisito antes de mostrar ejecución y código, y pasar al resultado real del espacio de trabajo tras confirmar el despliegue.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
ChatGPT | Apple Messages
Tras encontrar una tarea pendiente, mostrar una propuesta, permitir que el usuario la edite y confirme, y mostrar después la recepción del mensaje en el chat de destino.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Cloud Computer: Desplegar y usar un ordenador en la nube
Explicar el entorno de ejecución persistente y demostrarlo con tres ejemplos: bots, extracción de datos y despliegue
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Lanzamiento de Claude Haiku 5.5
Mantener fijas las tres columnas y cambiar discretamente las texturas internas y orientaciones en L; cambiar recursos no equivale a desplazar el bloque completo.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Fable 5 | Regresa el personaje de píxeles
Revelar el nombre del producto letra a letra solo cuando el personaje llegue al letrero, vinculando causalmente movimiento y letras.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Actualización de función | Voice mode
Expandir el mismo círculo central de botón a ventana de imagen y contraerlo de nuevo, preservando su identidad espacial.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Android Drop — Find Hub, Motion Assist, Gemini
Cada función combina una tarjeta principal y un pequeño indicador de respuesta asociado.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación gráfica
Vista previa de 5 segundos del mismo proyecto · 5.0 segundos
Reconstruir puntos en personas, lugares y objetos por turnos, con colores según la categoría.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación gráfica
Grok Bot × Linear
Alinear y fijar ambas marcas mientras el fondo fluye sin competir con el texto.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Grok Bot ya puede buscar, leer y supervisar X.
Mostrar varias fuentes consultadas antes de condensarlas en un resumen temático.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Grok Bot · Formularios e inicio de sesión en la conversación
El agente entrega el control al usuario cuando encuentra autenticación; reanuda el flujo después de recibir su entrada.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Grok — 21 voces completamente nuevas
Fijar posición y tamaño del título; el movimiento procede principalmente del flujo continuo del fondo.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Reception · Atención telefónica para distintos sectores
Plantear el mismo problema mediante llamadas de varios sectores y presentar una esfera luminosa como solución en la parte central
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
ElevenLabs | Scribe v2
Introducir dimensiones de medición y explicar las capacidades mediante cambios de texto concretos
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Composer · Edición de canciones por secciones
Pasar de una solicitud abierta a secciones, tempo y tonalidad controlables, terminando en onda y obra final
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Polymarket · Elección de dirección a cinco minutos
Plantear primero la decisión y enfocar después la terminal compleja en una acción de dos opciones
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Cursor Multitask / Subagents — /multitask en el nuevo…
Añadir varias tareas a la misma sesión y mostrar el número de tareas paralelas en un panel fijo
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Annotate llega a design mode
Fijar anotaciones a sus elementos de destino, con correspondencia exacta entre números y comentarios
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Cursor — ahora en iPad
Mostrar el mismo resultado en varios dispositivos antes de centrarse en organización y revisión en la tableta
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Cursor — crea una app web y despliégala en Vercel
Mostrar repositorios disponibles antes de destacar la creación desde cero; la vista previa aparece después de la entrada
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Computer puede generar gráficos interactivos
Incluir gráficos que respondan al puntero con información de datos, no solo con un zoom global.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Perplexity — Portable Computer en NVIDIA DGX Spark
Rodear el dispositivo con herramientas locales y colocar modelos en nube en otra capa; las conexiones indican escalado cuando hace falta, no envío externo por defecto.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación 3D
Migrar a Framer con MCP
Fijar la ventana delantera arriba a la derecha y la trasera abajo a la izquierda con la misma perspectiva. Contraer la trasera a un punto antes de expandirla por el eje diagonal.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Framer Skills
Al inicio, introducir sucesivamente reglas de tipografía y comillas en el campo de entrada; después, mostrar la página terminada para dejar claro que las reglas afectan al conjunto de la página.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Plantillas de Framer Agent
Alinear tres plantillas horizontalmente, mostrando la tarjeta central completa y solo parte de las laterales, oscurecidas. Al cambiar, desplazar horizontalmente toda la pista y devolver el brillo a la tarjeta central solo cuando llegue a su posición.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Monedero Link para agentes
Instalar y conectar primero el agente; después, solicitar un cambio de itinerario por chat, mostrar el coste y pasar al teléfono para confirmar. Repetir el coste y el comercio entre interfaces para identificar la misma solicitud.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
Directory: datos gratuitos de contratación
Los avatares aparecen sucesivamente alrededor del título central, con tamaños similares y breves etiquetas de identidad. Mantener el título en dos líneas y colorear en naranja la línea de la marca.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Convierte bocetos en dibujos animados con Grok
La primera solicitud transforma el boceto en una hoja de personajes; la segunda convierte ese resultado en animación. El chat se desplaza hacia arriba y los nuevos resultados entran desde abajo, conservando la relación con el mensaje anterior.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación 3D
Dictado por voz gratuito
Las teclas con símbolo y texto caen formando una fila y se separan hacia los lados, revelando una cápsula negra luminosa con ondas sonoras. La cápsula sirve de anclaje común para las demostraciones siguientes.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Adaptación a iPhone Duo
El teléfono vertical entra centrado, gira y se despliega en dos columnas horizontales: la lista queda a un lado y el detalle entra en el otro. Conservar la misma nota en ambos formatos.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Nuevas capacidades de Runway Agent
Mostrar primero la página final del producto, volver a la solicitud, extraer colores y producto, generar escenas y tamaños distintos y terminar con la capacidad de animación. Repetir el mismo altavoz en varios resultados.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Palabras de estado e HyperFrames
Las palabras de estado cambian rápidamente en monoespaciada tenue, seguidas de un doble triángulo oscuro. El verde rellena el símbolo de abajo arriba y después se despliega el logotipo blanco.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Nuevas capacidades｜450+ integraciones
Las cápsulas naranjas enlazan palabras como connect y with y terminan en un signo más interactivo. Al pulsarlo, entran iconos por varios arcos y la cifra crece hasta 450.
Solo referencia de vídeo; no se incluye un proyecto editable.
Montaje de imagen real
Vidrio.
El cristal permanece fijo mientras una mano y un recipiente pasan detrás; la cuadrícula fina divide sus contornos en pequeños segmentos desplazados. El plano general sitúa el marco y los detalles muestran claramente la relación entre textura y distorsión.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de texto
TIDAL｜Identidad tipográfica, versión de 60 segundos
Hacer del texto el protagonista: palabras cortas crecen, se comprimen y encadenan según el énfasis semántico; los rombos impulsan los bloques de texto hacia el siguiente grupo de colores.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Composición de botones · 10.7 segundos
Separar y reunir tres botones de efectos con muescas como módulos encajables, comenzando por el inferior y conservando su relación vertical estrecha.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Creative Cloud｜Variante de láminas magenta
Mostrar con cortes breves cómo el símbolo pasa de láminas tridimensionales a edición plana y material plateado, usando magenta como hilo visual.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
EliseAI｜Interfaz de producto en la web
Explicar el valor del asistente con una conversación completa de reserva: el usuario pide una hora, el asistente ofrece dos opciones y el usuario confirma una.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación gráfica
Lanzamos EURR, nuestra primera stablecoin respaldada por euros, en la app de Revolut.
Intercambiar la posición delantera y trasera de dos monedas sobre la misma bandeja, manteniendo fijo el texto para concentrar el movimiento entre ambas.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Presentamos Wabi 2.0: un nuevo tipo de mensajería que crea apps y resuelve tareas…
La información del chat se convierte gradualmente en pequeñas aplicaciones útiles, que después forman una página personal.
Solo referencia de vídeo; no se incluye un proyecto editable.
Animación de interfaz
Crea presentaciones con IA
Convertir primero el tema en un esquema editable y después el esquema en diapositivas completas, con resultados claros para ambas generaciones.
Solo referencia de vídeo; no se incluye un proyecto editable.