Logo animation from a raster file: fit minimal, smooth SVG geometry structured for motion, then choreograph it with Disney's 12 principles into a showcase HTML that always lands on the verified static logo.
By NolanLai @nolangz Jun 12, 2026
# Pixel2Motion (v2) **Pixel → Vector → Motion.** This skill fuses two disciplines: 1. **Vectorization discipline** (from logo-vectorizer-minimal-smooth): fit the raster source with the *lowest-complexity* editable geometry that passes visual QA. 2. **Motion discipline** (from Disney's 12 Principles of Animation): choreograph that geometry into brand-appropriate motion with evidence-based timing and easing. The fusion rests on one insight: **minimal smooth geometry IS animatable geometry**. A logo built from 3 semantic parts animates cleanly; a logo built from 400 pixel-stair traced points cannot be choreographed or accepted as a professional logo vector. Phase 2 therefore does not merely vectorize — it *structures for motion*. And the animation must always land exactly on the QA-verified static vector (the **Final Frame Contract**).
From NolanLai's repo, under the MIT license.
The front door is /hyperframes. This skill makes a short, design-led, unnarrated motion graphic (motion is the message;…
Operating Model Use the official player project and verify in Skia Skottie. Do not hand-roll a custom viewer or switch…
Make a fast-paced ad for Claude, about 10–15 s (closer to 15). Reference video attached. research: Study Claude's earli…
You are a world-class motion designer doing a 20.00s kinetic identity bumper for TechHalla — an AI creator known for st…