skills.rest
nexu-io
nexu-ioOFFICIAL
Explore all skills by this author →
WebsiteGitHub

chat-motion-overlay

Generate configurable chat motion overlays from transcripts or screenshots for video editing workflows.

93.2k|10.8k|Updated Apr 28, 2026
Search Tags:#video#chat#overlay#Remotion#Animation#motion-graphics
One-click install
npx skills add https://github.com/nexu-io/open-design --skill chat-motion-overlay
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chat-motion-overlay
Source: https://github.com/nexu-io/open-design/tree/main/skills/chat-motion-overlay
Command: npx skills add https://github.com/nexu-io/open-design --skill chat-motion-overlay

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires remotion, typescript, react, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill solves the manual, time-consuming process of creating high-quality, animated chat bubbles for social media videos, demo reels, and story reenactments.

Core Features & Use Cases

  • Configurable Motion: Generate chat overlays with support for WeChat, Telegram, and Messenger UI styles.
  • Flexible Input: Convert plain text transcripts or screenshots into structured animation specs.
  • Professional Output: Export transparent video files (MOV/WebM) ready for direct import into Premiere, Final Cut, or Jianying.

Quick Start

Use chat motion overlay to turn the attached transcript into a WeChat-style transparent video clip.

Frequently Asked Questions about chat-motion-overlay

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a chat motion overlay from a screenshot?▼

Provide the screenshot to the skill, which will infer participants, message grouping, and timestamps. The skill then converts this into a transcript format before generating the animation spec.

Can I use my own avatars in the chat animation?▼

Yes, set the avatarMode to 'upload' or 'mixed' in your config JSON. You can then provide local paths to your avatar images, which the skill will bundle into the final render.

Does this skill support transparent video backgrounds?▼

Yes, the skill supports MOV and WebM formats with alpha channels. These are designed to be layered directly over other footage in editors like Premiere, Final Cut, or Jianying.

What messaging app styles are supported?▼

The skill currently supports WeChat, Telegram, and Facebook Messenger UI containers, as well as a 'none' option for standalone bubble animations.

How do I continue editing the chat animation in Remotion?▼

Set the deliveryFormat to 'remotion' or 'hyperframe'. The skill will generate a complete, renderable bundle directory that you can open and modify in your local development environment.

Related Skills

Explore More Design & Creative Skills→
CerisonAutomationCerisonAutomation

transcribe

Transcribe audio and video files into text using a configured speech-to-text provider.

Community
Intermediate
video-production-buddyvideo-production-buddy
602

video-toolkit

Automates text-to-video production with Remotion-based composition and cloud GPU rendering.

Official
Advanced
abdu6666abdu6666
17

video-merger

Merge video clips with transitions, effects, and background music using FFmpeg.

Community
Intermediate
Lev-itLev-it

gpt-taste

Generate creative UI designs with Python randomization, AIDA structure, and GSAP animations.

Official
Advanced