skills.rest
reason-machines
reason-machinesOFFICIAL
Explore all skills by this author →
Website𝕏@reasonmachinesGitHub

clipsketch-ai-video-storyboard

Generate hand-drawn storyboards and social media copy from tagged video frames using Gemini.

4|Updated May 16, 2026
Search Tags:#social media#image generation#Gemini#storyboard#bilibili#xiaohongshu#video frames
One-click install
npx skills add https://github.com/reason-machines/devtools-skills --skill clipsketch-ai-video-storyboard-reason-machines
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: clipsketch-ai-video-storyboard
Source: https://github.com/reason-machines/devtools-skills/tree/main/skills/clipsketch-ai-video-storyboard
Command: npx skills add https://github.com/reason-machines/devtools-skills --skill clipsketch-ai-video-storyboard-reason-machines

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @google/genai, jszip.

What problem does it solve? Manually creating storyboards and promotional content from video moments requires frame-by-frame screenshots, illustration work, and copywriting. This Skill automates the pipeline from video import to AI-generated storyboards, social copy, and cover images. ## Core Features & Use Cases - Video Frame Tagging: Import videos from Bilibili or Xiaohongshu and tag frames with millisecond precision using keyboard shortcuts and canvas capture. - AI Storyboard Generation: Send tagged frames to Gemini models to produce hand-drawn style storyboards, refine individual panels, and generate cover images. - Social Media Copy: Generate three copy variants (emotional, tutorial, punchy) with hashtags for Xiaohongshu posts. - Use Case: A content creator pastes a Bilibili share link, tags six key frames, and receives a storyboard image, three caption options, and a 9:16 cover image ready for posting. ## Quick Start Clone the clipsketch-ai repository, add your Gemini API key to .env.local, run npm install and npm run dev, then import a video link and tag frames to generate a storyboard.

Frequently Asked Questions about clipsketch-ai-video-storyboard

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

FAQPage Schema
How do I generate a storyboard from video frames with Gemini?▼

Tag frames in the video player using the T key, which captures canvas thumbnails with timestamps. The app sends these base64 images with a style prompt to gemini-3-pro-image-preview, which returns a hand-drawn composite storyboard.

How to import Bilibili or Xiaohongshu videos into ClipSketch AI?▼

Paste the share link or text containing the link into the import field. The app recognizes patterns like bilibili.com/video/BV IDs, b23.tv short links, xhslink.com, and xiaohongshu.com URLs, then resolves them to playable video sources.

Why does the Gemini API return a 403 error?▼

A 403 error means your API key lacks access to the gemini-3-pro-image-preview model. Check Google Cloud Console project settings, enable the Vertex AI API, confirm billing is active, and request access to preview models if needed.

Can I export tagged video frames from ClipSketch AI?▼

Yes, tagged frames export as a ZIP archive containing JPEG frame images plus a timestamps.txt index file, using JSZip. You can also export a plain-text timeline listing each frame's formatted timestamp.

How do I fix video CORS issues when capturing frames?▼

Set crossOrigin="anonymous" and referrerPolicy="no-referrer" on the video element to allow canvas capture. If restrictions persist, configure a server-side proxy rewrite in next.config.js to route external video URLs through your own domain.

Related Skills

Explore More Content & Communication Skills→
csfuwwccsfuwwc
3

video-download

Download videos from Douyin, Xiaohongshu, and Bilibili via shared links or text prompts.

Community
Intermediate
genesis-plangenesis-plan

xiaohongshu

Automate Xiaohongshu content creation, cover generation, and publishing workflows.

Community
Advanced
mrgooniemrgoonie
2.2k

ai-multimodal

Process audio, images, video, and PDFs and generate images using the Google Gemini API.

Community
Advanced
Pixazo-AIPixazo-AI

video-frame-api

Extract a single frame from a video as an image via the Pixazo API.

Official
Basic