hyperframes-cli
Render HTML compositions to video with HyperFrames CLI
Transform HTML-based video compositions into MP4 or WebM output without manual rendering. Automate scaffolding, linting, visual inspection, and final delivery for content creators and development teams.
تنزيل ZIP المهارة
رفع في Claude
اذهب إلى Settings → Capabilities → Skills → Upload skill
فعّل وابدأ الاستخدام
اختبرها
استخدام "hyperframes-cli". npx hyperframes doctor
النتيجة المتوقعة:
Checking environment...
✓ Chrome: installed
✓ FFmpeg: installed
✓ Node: v22.10.0
✓ Memory: 8GB available
Environment is ready for rendering.
استخدام "hyperframes-cli". npx hyperframes lint ./my-project
النتيجة المتوقعة:
Linting composition...
✓ index.html: valid
✗ compositions/intro.html: missing data-composition-id
⚠ compositions/outro.html: overlapping tracks at 2.5s
1 error, 1 warning found.
التدقيق الأمني
آمنAll 69 static findings are false positives. The external_command detections are markdown code examples showing CLI usage, not executable code. Network detections are localhost URLs for local development preview, which is expected. No cryptographic code or malicious patterns exist in this skill.
درجة الجودة
ماذا يمكنك بناءه
Automate video generation in CI/CD pipelines
Use hyperframes render with --non-interactive flag to generate videos as part of automated workflows without manual intervention.
Create marketing video content from templates
Scaffold a project with a template like product-promo, customize the HTML composition, then render to final MP4 for social media or advertising.
Debug and fix visual layout issues in video compositions
Run hyperframes lint to catch structural errors, then hyperframes inspect to identify text overflow and clipping before final rendering.
جرّب هذه الموجهات
Run `npx hyperframes init my-project --non-interactive` to create a new HyperFrames video project in the current directory.
Run `npx hyperframes lint` followed by `npx hyperframes inspect --json` to check for errors and visual layout issues in the current composition.
Run `npx hyperframes render --output final.mp4 --quality high --fps 30` to render the current composition to a high-quality MP4 file.
Run `npx hyperframes preview --port 3002` to start the preview server and open the HyperFrames studio for interactive testing.
أفضل الممارسات
- Run lint and inspect commands before previewing to catch structural and visual issues early
- Use --docker flag for reproducible, byte-identical renders across different environments
- Use draft quality during iteration and switch to high quality only for final delivery
تجنب
- Do not skip lint and inspect steps before rendering - structural errors may cause silent failures
- Do not use 60fps unless specifically needed - it doubles render time with minimal visual benefit
- Do not render directly to final output during development - use draft quality to save time