Claude Skills by notivn

github.com/notivn

20 skillsA× 18B× 20 installs29 views

Ai IllustrationsAGenerate illustrations with Gemini and composite them into the video being edited - how to pick the moments that need an image, write the prompt, call the /api/illustrations endpoint (images MUST match the selected Style Design), and composite into the composition. Read when the brief enables "Ảnh minh họa AI" (AI illustrations) or the user asks for generated illustrations for a video.ai-agentsgobashVotes: 0GitHub stars: 108
Auto CutACut silences and dead weight (fillers, repeated takes, false starts) out of a talking-head video BEFORE building the edit - call the measured /auto-trim API instead of hand-rolling ffmpeg, review the dead-weight candidates it returns, and do the one job only a human/AI can do (spotting repeated POINTS). Read this when the brief enables "Tự động cắt ngắn video" (autoCut) or the user complains that the video still has dead weight/silences.ai-agentsgoapiVotes: 0GitHub stars: 108
Background MusicAPick background music from the assets/music/ library and configure auto-ducking (music dips automatically under speech) via meta.json audio.music for the Remotion assembly layer. Read when the brief/edit prompt has a "Nhạc nền" (background music) section set to auto, or when the user asks to add/adjust background music on a video.ai-agentsshellVotes: 0GitHub stars: 108
Color GradingAColor grading video in the AI Edit Video system - delog/tonemap HDR-HLG-log footage, apply the color preset the user approved in the UI, and the visual verification workflow. Read when the edit prompt has a "Chỉnh màu" (color grading) section, when the source footage is HDR/log, or when the user asks for grading/delog.ai-agentsgobashVotes: 0GitHub stars: 108
GsapAGSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.designjavascriptgoVotes: 0GitHub stars: 108
Hyperframes CliAHyperFrames CLI tool - hyperframes init, lint, preview, render, transcribe, tts, doctor, browser, info, upgrade, compositions, docs, benchmark. Use when scaffolding a project, linting or validating compositions, previewing in the studio, rendering to video, transcribing audio, generating TTS, or troubleshooting the HyperFrames environment.ai-agentsbashnodeVotes: 0GitHub stars: 108
Skills DirectorySkills Directory Look up any of 103,619 scanned skills — grade, score, and every finding. Free.Check a skill
Hyperframes RegistryAInstall and wire registry blocks and components into HyperFrames compositions. Use when running hyperframes add, installing a block or component, wiring an installed item into index.html, or working with hyperframes.json. Covers the add command, install locations, block sub-composition wiring, component snippet merging, and registry discovery.ai-agentsbashgitVotes: 0GitHub stars: 108
HyperframesACreate video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (cro...designgobashVotes: 0GitHub stars: 108
Key LayoutAMain key / related key layout on the video - the MAIN KEY (topic/hook) sits in a band at the TOP of the video, the RELATED KEYS in a band at the BOTTOM (above the caption area), timed to whatever is being said. Read this when the brief enables "Bố cục Key" (keyLayoutEnabled) or the edit prompt contains the section "Bố cục Key: BẬT".designgoVotes: 0GitHub stars: 108
Make A VideoABeginner-friendly end-to-end video creator for HyperFrames. Use when the user says "make a video", "create a video", "new video", "build a video", "video from scratch", "I want to make a video", "help me create a video", or when someone who's never used HyperFrames before arrives with a concept, script, or rough idea and wants a finished MP4. Interviews the user in one pass, then builds the full video with mandatory preview and visual-verification gates.ai-agentspythongoVotes: 0GitHub stars: 108
Noti Tiktok Full TextABuild a Vietnamese vertical TikTok explainer in the "MỔ XẺ PAPER AI" (AI paper dissection) format with HyperFrames (HTML/CSS/GSAP → MP4), Noti.vn style. N text scenes + PDF paper-page scenes, every piece of text a real HTML element (reveal/count-up/red highlight), animated captions, stat callouts, comparison tables, pull-quotes. Picks sound effects itself by content + timestamp from the `assets/sound-effects/` library (tag `hay-dung`) and wires them into the video. The fix for Vietnamese text...designpythongoVotes: 0GitHub stars: 108
Noti Tiktok VnBEdit a Vietnamese vertical TikTok video (9:16) with HyperFrames following the Noti.vn/GĐT standard - talking-head + kinetic typography + karaoke captions + zoom/punch-in camera + timestamp-synced sound effects, rendered to MP4. Ships with the verified fixes (gradient text dropping diacritics, Vietnamese transcription, ffmpeg PATH). Use when the user hands over a Vietnamese clip and wants it built into a TikTok video with animated text + subtitles + beat-synced zoom in the dark fintech blue st...designpythongoVotes: 0GitHub stars: 108
Noti Youtube EditBBuild a Vietnamese landscape 16:9 YouTube video (1920×1080) with HyperFrames (HTML/CSS/GSAP → MP4), keeping the Noti.vn/GĐT branding inherited from noti-tiktok-vn. Supports 2 modes - A) talking-head + motion graphics (full-frame face, camera move to PiP, karaoke captions) and B) full-text explainer (text scenes + slides/charts, no face on screen). Includes the "camera move" technique (animate the wrapper, never the video), the fix for Vietnamese text losing diacritics, and picking sound effec...designpythongoVotes: 0GitHub stars: 108
Offline VoiceAHow the on-device narration engine (VieNeu-TTS) and voice cloning work in this system - install tiers, the worker protocol, and the verified traps around torchaudio, voice metadata parsing and duration. Read when working on Text to video narration, the Voices page, the /api/voices or /api/tts endpoints, or when a user reports that offline voices or voice cloning fail to install or sound wrong.developmentpythongoVotes: 0GitHub stars: 108
Remotion AssembleAHow to use Remotion as the assembly layer - read the project's meta.json and stitch the rendered HyperFrames scenes + footage + voice + sound effects into the finished video. Read this when writing/editing code in engines/remotion or when assembling the timeline for a video.developmentgobashVotes: 0GitHub stars: 108
Short Form VideoABuild and iterate short-form vertical (9:16) videos in Hyperframes - TikTok/Reels/Shorts style. Use when the user says "short-form video", "vertical video", "TikTok/Reels/Shorts", "make a short", "talking-head + motion graphics", or when the target is a 1080x1920 composition with face video + synced scene overlays + karaoke captions. Encodes the full May Shorts 19 playbook: face-mode choreography, audio-synced scene timing, karaoke captions, and the 10-rule quality checklist.designgobashVotes: 0GitHub stars: 108
Skill AuthoringAThe standard for writing new skills for the AI Edit Video system - file structure, frontmatter, tone of voice, and how to accumulate production lessons into skills. Read when the user asks to create a new skill (via chat or from the Skills page in the web UI) or when updating a skill after finishing a video.ai-agentsgodebuggingVotes: 0GitHub stars: 108
Video PipelineAEnd-to-end video production workflow for the AI Edit Video system - from the user request to the MP4 in outputs/, coordinating HyperFrames (scenes) and Remotion (assembly). Read this when starting any video or when building the backend render queue.designgobashVotes: 0GitHub stars: 108
Website To HyperframesACapture a website and create a HyperFrames video from it. Use when: (1) a user provides a URL and wants a video, (2) someone says "capture this site", "turn this into a video", "make a promo from my site", (3) the user wants a social ad, product tour, or any video based on an existing website, (4) the user shares a link and asks for any kind of video content. Even if the user just pastes a URL - this is the skill to use.designVotes: 0GitHub stars: 108
Webui DesignADesign system for the AI Edit Video web dashboard (noti.vn) - the three-step type scale, light/dark color tokens, the component primitives every page must use, Inter font, SVG icons, Shopify Admin style layout. MUST read before writing or modifying any UI in apps/web.designgoshellVotes: 0GitHub stars: 108