calesthio/openmontage932 installs
svg-character-animation
Animate SVG character rigs with GSAP, CSS transforms, Remotion frame control, and HyperFrames-compatible browser previews.
How do I install this agent skill?
npx skills add https://github.com/calesthio/openmontage --skill svg-character-animationIs this agent skill safe to install?
- Gen Agent Trust Hubpass
The skill provides patterns, guidelines, and code examples for animating SVG character rigs using GSAP and Remotion. No security vulnerabilities or malicious behaviors were found.
- Socketpass
No alerts
- Snykpass
Risk: LOW · No issues
What does this agent skill do?
SVG Character Animation
Use this skill when animating character rigs made from SVG parts.
Runtime Rules
- Animate transforms (
x,y,scale,rotation) rather than layout. - Use timelines for multi-part acting beats.
- For SVG elements, use stable pivots (
svgOriginor correctly scoped transform origins). - In Remotion, do not let GSAP advance with
requestAnimationFrame; drive a paused timeline from the current frame.
Browser Pattern
gsap.set("#arm_right", { svgOrigin: "390 310" });
const tl = gsap.timeline({ defaults: { ease: "power2.inOut" } });
tl.to("#head", { rotation: -8, duration: 0.2 })
.to("#arm_right", { rotation: 35, duration: 0.4 }, "<");
Remotion Pattern
const frame = useCurrentFrame();
const progress = frame / durationInFrames;
timeline.progress(progress);
HyperFrames Pattern
Use HTML/SVG/GSAP components with deterministic timelines and validate via the HyperFrames CLI before final render.
Quality Checklist
- Parts stay connected at pivots during motion.
- Blinks, gaze, and mouth shapes are separate enough to read.
- Pose holds are long enough to communicate emotion.
- Frame sampling shows meaningful deltas, not frozen animation.
Sources
- GSAP core transform properties and SVG handling: https://gsap.com/docs/v3/GSAP/CorePlugins/CSS/
- GSAP timelines and sequencing: https://gsap.com/docs/v3/GSAP/Timeline/
- Remotion
useCurrentFrame: https://www.remotion.dev/docs/use-current-frame
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/calesthio/openmontage/svg-character-animation">View svg-character-animation on skillZs</a>