El enfoque de trabajo
pixel2motion parte de un logo rasterizado y lo divide en piezas que pueden moverse independientemente. Reconstruye esas piezas como geometría SVG editable antes de coreografiar su aparición. Bordes suaves, espacio negativo correcto y silueta fiel tienen prioridad sobre reproducir cada píxel suavizado de la captura original.
La salida incluye logo estático, estudio de animación HTML interactivo y evidencias de inspección. Un contrato de fotograma final conecta ambas etapas: la animación debe asentarse en la misma marca verificada. Repetición, cámara lenta y controles de velocidad permiten revisar la coreografía; los puntos de acceso por tiempo permiten inspeccionar cruces y relevos difíciles.
Entregables esperados
- Un logo.svg editable con identificadores estables de las piezas animadas.
- Un logo_motion.html independiente con repetición, velocidad y cámara lenta.
- Una especificación de animación, superposiciones geométricas y fotogramas capturados.
Del brief a la revisión
- 01Identificar los elementos
Inspecciona la imagen fuente, distingue símbolo y logotipo tipográfico y elige un contexto de uso. Registra personalidad de marca y orden de aparición antes de ajustar geometría.
- 02Ajustar la forma fiel más simple
Prueba primitivas y unas pocas curvas suaves antes de añadir complejidad de trazados. Compara superposiciones renderizadas e inspecciona bordes ampliados; la fuente trata IoU como diagnóstico y no como umbral universal de aprobación.
- 03Animar y comparar el final
Construye movimiento con identificadores estables y revisa anticipación, acción, cruces y asentamiento. Compara el fotograma final con el estado estático usando el mismo navegador y viewport.