Run any Skill in Manus with one click

rendering

Stars41

Forks4

UpdatedJuly 19, 2026 at 13:37

Validate Motionly preview, scrubbing, serialization, and final export. Use for missing assets, blank frames, non-finite state, animated media synchronization, browser codec limitations, Lottie/GIF/SVG playback, MP4/WebM/GIF export, pixel inspection, and renderer troubleshooting.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

COPPSARY

COPPSARY/Motionly

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Software DevelopersComputer and Mathematical Occupations·SOC 15-1252

File Explorer

2 files

SKILL.md

readonly

name	rendering
description	Validate Motionly preview, scrubbing, serialization, and final export. Use for missing assets, blank frames, non-finite state, animated media synchronization, browser codec limitations, Lottie/GIF/SVG playback, MP4/WebM/GIF export, pixel inspection, and renderer troubleshooting.

Rendering

Use the production parser → scene graph → evaluator → asset synchronizer → Canvas renderer path. A valid parse is necessary but does not prove visual correctness.

Validation Loop

Parse and build the scene graph.
Verify canvas size, FPS, duration, imports, tracks, and expected elements.
Run inspect:motion with the expected duration.
Review every reported empty-frame range.
Preview representative timestamps and real media decoding.
Export a short representative render when animated assets changed.
Save/reload and confirm round-trip stability.

Animated Media Contract

MP4/WebM/MOV seek through the browser video decoder.
Lottie and supported GIF seek to project time before every deterministic export frame.
Animated SVG and GIF fallback use wall-clock playback; deterministic MP4/GIF export deliberately runs in real time for those assets.
Browser codec or API gaps must appear as explicit editor warnings/errors.

Inspect These Frames

First visible frame.
First decoded frame of every animated asset.
A mid-animation frame proving motion is not flattened.
Clip trim boundaries.
One frame before/during/after transitions.
Final visible frame.

Failure Guide

Asset imports but stays blank: inspect decoder error, MIME type, CORS, and browser codec.
Video frame lags while scrubbing: use exact synchronization and await seeked.
Lottie blank: verify .lottie data, WASM load, intrinsic animation size, and load events.
GIF frozen in export: verify ImageDecoder or real-time fallback pacing.
Animated SVG appears at the wrong phase: its Canvas timeline is live; restart at clip activation and disclose lack of exact seeking. If CSS keyframes differ, report the Canvas runtime limitation.
Preview/export differ: confirm both call the same evaluated time and asset synchronization path.

Do not claim pixel correctness from deterministic state signatures alone.

More from this repository

same repository

motionly

COPPSARY/Motionly

Create, edit, validate, and preview editable Motionly .motion animation projects. Use for Motionly storyboards, motion graphics, local assets, timing, presets, and project.motion files.

2026-07-2041

write-motionly

COPPSARY/Motionly

Create, edit, retime, review, and repair Motionly `.motion` projects. Use when an agent needs to turn a script, audio track, storyboard, or asset folder into a polished Motionly animation; choose Motionly transitions and presets; synchronize visuals to narration; fix composition or overlap; or explain valid `.motion` syntax.

2026-07-1941

animation

COPPSARY/Motionly

Choreograph polished Motionly object animation and sequences. Use for entrances, holds, exits, keyframes, stagger, presets, scene beats, motion hierarchy, product reveals, logo stings, UI demonstrations, and replacing repetitive fade-only motion.

2026-07-1941

assets

COPPSARY/Motionly

Import, inspect, place, animate, and troubleshoot Motionly media assets. Use for PNG/JPEG, static or animated SVG, GIF, MP4, WebM, MOV, Lottie, audio, data URLs, aspect ratios, codecs, browser decoding, trim timing, and preserving existing animation.

2026-07-1941

camera

COPPSARY/Motionly

Direct global camera moves and local artwork focus in Motionly. Use for push-ins, pull-backs, pans, speed zooms, focal shifts, diagram walkthroughs, logo close-ups, parallax planning, and deciding whether to animate the camera or an individual SVG/object.

2026-07-1941

composition

COPPSARY/Motionly

Design clear professional Motionly compositions. Use for hierarchy, layout, spacing, branding, color, scene design, focal subjects, clutter, overlap, aspect ratios, product launch frames, diagrams, and visual review of generated animation.

2026-07-1941

name	rendering
description	Validate Motionly preview, scrubbing, serialization, and final export. Use for missing assets, blank frames, non-finite state, animated media synchronization, browser codec limitations, Lottie/GIF/SVG playback, MP4/WebM/GIF export, pixel inspection, and renderer troubleshooting.

Rendering

Use the production parser → scene graph → evaluator → asset synchronizer → Canvas renderer path. A valid parse is necessary but does not prove visual correctness.

Validation Loop

Parse and build the scene graph.
Verify canvas size, FPS, duration, imports, tracks, and expected elements.
Run inspect:motion with the expected duration.
Review every reported empty-frame range.
Preview representative timestamps and real media decoding.
Export a short representative render when animated assets changed.
Save/reload and confirm round-trip stability.

Animated Media Contract

MP4/WebM/MOV seek through the browser video decoder.
Lottie and supported GIF seek to project time before every deterministic export frame.
Animated SVG and GIF fallback use wall-clock playback; deterministic MP4/GIF export deliberately runs in real time for those assets.
Browser codec or API gaps must appear as explicit editor warnings/errors.

Inspect These Frames

First visible frame.
First decoded frame of every animated asset.
A mid-animation frame proving motion is not flattened.
Clip trim boundaries.
One frame before/during/after transitions.
Final visible frame.

Failure Guide

Asset imports but stays blank: inspect decoder error, MIME type, CORS, and browser codec.
Video frame lags while scrubbing: use exact synchronization and await seeked.
Lottie blank: verify .lottie data, WASM load, intrinsic animation size, and load events.
GIF frozen in export: verify ImageDecoder or real-time fallback pacing.
Animated SVG appears at the wrong phase: its Canvas timeline is live; restart at clip activation and disclose lack of exact seeking. If CSS keyframes differ, report the Canvas runtime limitation.
Preview/export differ: confirm both call the same evaluated time and asset synchronization path.

Do not claim pixel correctness from deterministic state signatures alone.