lunartech-x/video-to-frames-workflow
skills/design-and-media/ui-ux/design-skills/video-to-frames-workflow/SKILL.md
Converts AI-generated videos into image frame sequences for web animations. Use when the user needs to extract frames from video, create scroll animations, or convert MP4 to image sequences.
$ install --global
skillsauthnpx skillsauth add lunartech-x/superpowers video-to-frames-workflowInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 6, 2026, 10:07 PM25.8s1 file scanned
SKILL.md
- name:
- video-to-frames-workflow
- description:
- Converts AI-generated videos into image frame sequences for web animations. Use when the user needs to extract frames from video, create scroll animations, or convert MP4 to image sequences.
Video to Frames Workflow
Convert videos into frame sequences for scroll-based web animations.
When to use this skill
- User needs to convert video to frames
- User wants scroll-based animations from video
- User mentions EZGif or frame extraction
- User has AI-generated video for web use
Why Convert to Frames
MP4 on scroll = laggy, choppy experience Frame sequence on scroll = smooth, Apple-quality animations
Workflow
Using EZGif (Recommended)
- [ ] Go to ezgif.com/video-to-jpg
- [ ] Upload video file
- [ ] Set FPS (25-30 recommended)
- [ ] Click "Convert to JPG"
- [ ] Download frames as ZIP
Frame Settings by Use Case
| Use Case | FPS | Est. Frames (10s video) | |----------|-----|-------------------------| | Smooth scroll | 30 | 300 | | Standard scroll | 25 | 250 | | Lightweight | 15 | 150 |
Quick Reference
EZGif Steps
- Upload video (MP4, WebM, etc.)
- Set output FPS in settings
- Convert to JPG
- Scroll to bottom → "Download frames as ZIP"
Frame Organization
# Extract ZIP to project
unzip frames.zip -d ./sequence
# Rename folder for consistency
mv extracted_folder sequence
Expected Output
sequence/
├── frame_001.jpg
├── frame_002.jpg
├── frame_003.jpg
└── ... (200-300 frames)
Integration with Anti-Gravity
After extracting frames:
- Create project folder on desktop
- Move sequence folder into project
- Open in Anti-Gravity
- Prompt for scroll animation:
The frames for the animation are in the sequence folder.
Build a sticky scroll component that maps scroll position to these frames.
Use Next.js. Preload frames. Map 0-100% scroll to frame 1-N.
Alternative Tools
| Tool | Pros | Cons | |------|------|------| | EZGif | Free, fast, web-based | Limited file size | | FFmpeg | Powerful, local | Requires CLI | | VLC | Already installed | Manual process |
FFmpeg Command (Alternative)
ffmpeg -i input.mp4 -vf fps=30 sequence/frame_%03d.jpg
Optimization Tips
Reduce File Size
- Use WebP instead of JPG
- Compress with quality 80-85
- Resize to max needed resolution
Faster Loading
- Lazy load frames beyond viewport
- Use intersection observer
- Preload first 10 frames immediately
Resources
- EZGif Video to JPG
- EZGif Video to WebP
Related Skills
lunartech-x/anndata
tools
VerifiedTrustedCommunity
Data structure for annotated matrices in single-cell analysis. Use when working with .h5ad files or integrating with the scverse ecosystem. This is the data format skill—for analysis workflows use scanpy; for probabilistic models use scvi-tools; for population-scale queries use cellxgene-census.
14SKILL.mdUpdated May 16, 2026
lunartech-x/alphafold-db
testing
VerifiedTrustedCommunity
Access AlphaFold 200M+ AI-predicted protein structures. Retrieve structures by UniProt ID, download PDB/mmCIF files, analyze confidence metrics (pLDDT, PAE), for drug discovery and structural biology.
14SKILL.mdUpdated May 16, 2026
lunartech-x/alpha-vantage
development
VerifiedTrustedCommunity
Access real-time and historical stock market data, forex rates, cryptocurrency prices, commodities, economic indicators, and 50+ technical indicators via the Alpha Vantage API. Use when fetching stock prices (OHLCV), company fundamentals (income statement, balance sheet, cash flow), earnings, options data, market news/sentiment, insider transactions, GDP, CPI, treasury yields, gold/silver/oil prices, Bitcoin/crypto prices, forex exchange rates, or calculating technical indicators (SMA, EMA, MACD, RSI, Bollinger Bands). Requires a free API key from alphavantage.co.
14SKILL.mdUpdated May 16, 2026
lunartech-x/aeon
development
VerifiedTrustedCommunity
This skill should be used for time series machine learning tasks including classification, regression, clustering, forecasting, anomaly detection, segmentation, and similarity search. Use when working with temporal data, sequential patterns, or time-indexed observations requiring specialized algorithms beyond standard ML approaches. Particularly suited for univariate and multivariate time series analysis with scikit-learn compatible APIs.
14SKILL.mdUpdated May 16, 2026