Spaces:
Configuration error
Configuration error
Dee Ferdinand commited on
Commit Β·
ef517dd
1
Parent(s): ba8e3d7
feat: hyperframes-video skill v2.0.0
Browse files- Act-first pipeline: scan β transcribe β analyze β brief β confirm β build
- Whisper transcription + Indonesian filler word cleaning + best quote extraction
- 3 visual styles: Dark Premium / Warm Documentary / Bold Editorial
- Auto-style assignment by content energy + client type
- Direct GitHub push + HF render integration via Composio
- Zero question-asking before scanning assets
- Duration intelligence based on raw footage length
skills/hyperframes-video/SKILL.md
CHANGED
|
@@ -1,14 +1,173 @@
|
|
| 1 |
---
|
| 2 |
name: hyperframes-video
|
| 3 |
-
description: "Build production-ready HyperFrames HTML video compositions for testimonials, teasers, trailers, and community stories. Use when the user mentions 'hyperframes video,' 'testimonial video,' 'HyperFrames composition,' 'render MP4 from HTML,' 'kinetic caption video,' 'Dee Ferdinand video,' 'corporate training video,' 'event teaser video,' 'video with GSAP,' or wants to build any HTML-to-MP4 video. Also trigger when the user says 'build me a video for [client],' 'make a 30 second testimonial,'
|
| 4 |
metadata:
|
| 5 |
version: 2.0.0
|
| 6 |
author: Dee Ferdinand Γ Claude
|
| 7 |
-
updated: 2026-06-16
|
| 8 |
-
sources:
|
| 9 |
-
- nateherkai/hyperframes-student-kit
|
| 10 |
-
- heygen-com/hyperframes-launch-video
|
| 11 |
-
- robonuggets/hyperframes-helper
|
| 12 |
-
- coleam00/hyperframes-ai-video-generation
|
| 13 |
-
- elevenlabs/skills
|
| 14 |
---
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
---
|
| 2 |
name: hyperframes-video
|
| 3 |
+
description: "Build production-ready HyperFrames HTML video compositions for testimonials, teasers, trailers, and community stories. Use when the user mentions 'hyperframes video,' 'testimonial video,' 'HyperFrames composition,' 'render MP4 from HTML,' 'kinetic caption video,' 'Dee Ferdinand video,' 'corporate training video,' 'event teaser video,' 'video with GSAP,' or wants to build any HTML-to-MP4 video. Also trigger when the user says 'build me a video for [client],' 'make a 30 second testimonial,' 'create a social proof video,' or references any event folder in Google Drive or GitHub. IMPORTANT: Do NOT ask clarifying questions before acting β scan available assets, transcribe, analyze, present a brief, then build immediately on confirmation."
|
| 4 |
metadata:
|
| 5 |
version: 2.0.0
|
| 6 |
author: Dee Ferdinand Γ Claude
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7 |
---
|
| 8 |
+
|
| 9 |
+
# HyperFrames Video Production Skill v2
|
| 10 |
+
|
| 11 |
+
**ACT-FIRST RULE: Never ask questions before scanning. Always scan β transcribe β analyze β brief β confirm β build.**
|
| 12 |
+
|
| 13 |
+
This skill produces correct HyperFrames HTML compositions with:
|
| 14 |
+
- Auto transcription + intelligent quote extraction
|
| 15 |
+
- 3 brand-matched visual styles
|
| 16 |
+
- ElevenLabs lo-fi music generation
|
| 17 |
+
- Direct GitHub push + HuggingFace render
|
| 18 |
+
- Zero black frames, correct audio
|
| 19 |
+
|
| 20 |
+
---
|
| 21 |
+
|
| 22 |
+
## PIPELINE (6 phases β execute in order, no skipping)
|
| 23 |
+
|
| 24 |
+
### PHASE 1 β Asset Ingestion
|
| 25 |
+
|
| 26 |
+
**Auto-detect from 3 sources (in priority order):**
|
| 27 |
+
|
| 28 |
+
**Source A β Google Drive (via Composio)**
|
| 29 |
+
```
|
| 30 |
+
Account: tomoxi (tomoxi.marketing@gmail.com)
|
| 31 |
+
Tool: GOOGLEDRIVE_FIND_FILE
|
| 32 |
+
Path: 2026/[EventFolder]/
|
| 33 |
+
Subfolders: Video/ β .MOV files (testimonial clips)
|
| 34 |
+
Foto/ β .JPG files (B-roll photos)
|
| 35 |
+
Testimoni/ β .MOV files (raw testimonial recordings)
|
| 36 |
+
```
|
| 37 |
+
β Download all .MOV + .JPG files, save to `/tmp/[client-slug]/`
|
| 38 |
+
|
| 39 |
+
**Source B β GitHub (via Composio)**
|
| 40 |
+
```
|
| 41 |
+
Tool: GITHUB_GET_REPOSITORY_CONTENT
|
| 42 |
+
Repo: AIGoose/dee-video-studio
|
| 43 |
+
Path: projects/[client-slug]/assets/
|
| 44 |
+
```
|
| 45 |
+
|
| 46 |
+
**Source C β Direct upload (user uploads in chat)**
|
| 47 |
+
β Files already in context, save to `/tmp/[client-slug]/`
|
| 48 |
+
|
| 49 |
+
β Always report: `"Found X videos, Y photos from [source]"` then proceed immediately.
|
| 50 |
+
|
| 51 |
+
---
|
| 52 |
+
|
| 53 |
+
### PHASE 2 β Transcription + Cleaning
|
| 54 |
+
|
| 55 |
+
For every .MOV in the Testimoni/ folder:
|
| 56 |
+
|
| 57 |
+
**Transcribe via Whisper (HF Inference)** β see `references/transcription.md` for full code
|
| 58 |
+
|
| 59 |
+
**Clean:** Remove fillers ("eh", "umm", "itu", "ya", "kan", "gitu"), repetitions, false starts
|
| 60 |
+
|
| 61 |
+
**Analyze for best moments:**
|
| 62 |
+
1. Find the single best 10β15s quote (most emotional/concrete/surprising)
|
| 63 |
+
2. Identify the strongest outcome statement ("sekarang saya bisa...")
|
| 64 |
+
3. Rate overall energy: low/medium/high β maps to style suggestion
|
| 65 |
+
4. Suggest duration: <2min raw β 15s. 2β5min β 30s. 5min+ β 45β60s
|
| 66 |
+
|
| 67 |
+
---
|
| 68 |
+
|
| 69 |
+
### PHASE 3 β Intelligent Brief (ONE confirmation point)
|
| 70 |
+
|
| 71 |
+
Present this brief β **do not ask multiple questions**:
|
| 72 |
+
|
| 73 |
+
```
|
| 74 |
+
π VIDEO BRIEF β [Client Name]
|
| 75 |
+
|
| 76 |
+
SOURCE: [X videos, Y photos from Drive/GitHub/upload]
|
| 77 |
+
|
| 78 |
+
TRANSCRIPT ANALYSIS:
|
| 79 |
+
Best quote: "[actual quote from transcript]" (at 0:42)
|
| 80 |
+
Strongest moment: [describe]
|
| 81 |
+
Energy level: High β recommended style: Dark Premium
|
| 82 |
+
|
| 83 |
+
RECOMMENDED BUILD:
|
| 84 |
+
β’ Type: Corporate Testimonial
|
| 85 |
+
β’ Duration: 30s
|
| 86 |
+
β’ Style: Dark Premium (Space Grotesk, kinetic 160px, dark #0d0d1f)
|
| 87 |
+
β’ Music: ElevenLabs lo-fi upbeat 88 BPM
|
| 88 |
+
β’ Quote to use: "[best quote]"
|
| 89 |
+
|
| 90 |
+
Say "go" to build this, or adjust any parameter above.
|
| 91 |
+
```
|
| 92 |
+
|
| 93 |
+
**If user says "go" or any affirmative β immediately proceed to Phase 4.**
|
| 94 |
+
|
| 95 |
+
---
|
| 96 |
+
|
| 97 |
+
### PHASE 4 β Style Selection
|
| 98 |
+
|
| 99 |
+
Read `references/styles.md` for full CSS/GSAP per style.
|
| 100 |
+
|
| 101 |
+
| Style | When | Caption | Palette |
|
| 102 |
+
|-------|------|---------|--------|
|
| 103 |
+
| **Dark Premium** | Corporate, high energy | 160px Space Grotesk | #0d0d1f + purple |
|
| 104 |
+
| **Warm Documentary** | Community, GKI, intimate | 80px Plus Jakarta | Warm brown + amber |
|
| 105 |
+
| **Bold Editorial** | Teaser, launch, public event | 128px Space Grotesk | White + black |
|
| 106 |
+
|
| 107 |
+
---
|
| 108 |
+
|
| 109 |
+
### PHASE 5 β Build + Push to GitHub
|
| 110 |
+
|
| 111 |
+
Read `references/composition.md` β do not build from memory.
|
| 112 |
+
|
| 113 |
+
**Commit via Composio:**
|
| 114 |
+
```
|
| 115 |
+
Tool: GITHUB_COMMIT_MULTIPLE_FILES
|
| 116 |
+
Repo: AIGoose/dee-video-studio
|
| 117 |
+
Files: projects/[client-slug]/index.html + meta.json
|
| 118 |
+
```
|
| 119 |
+
|
| 120 |
+
---
|
| 121 |
+
|
| 122 |
+
### PHASE 6 β Render via HuggingFace
|
| 123 |
+
|
| 124 |
+
```python
|
| 125 |
+
import requests, time
|
| 126 |
+
r = requests.post(
|
| 127 |
+
"https://aigoose-hyperframes-video-studio.hf.space/api/render",
|
| 128 |
+
files=[("files", ("testimoni.MOV", open(video_path,"rb"), "video/quicktime")),
|
| 129 |
+
("files", ("foto_1.JPG", open(photo_path,"rb"), "image/jpeg"))],
|
| 130 |
+
data={"workflow":"testimonial","clientName":CLIENT,"trainerName":"Dee Ferdinand",
|
| 131 |
+
"tagline":"AI Corporate Trainer","website":"deeferdinand.com",
|
| 132 |
+
"format":"9:16","musicTrack":"auto","duration":"30"}
|
| 133 |
+
)
|
| 134 |
+
job_id = r.json()["jobId"]
|
| 135 |
+
while True:
|
| 136 |
+
job = requests.get(f"https://aigoose-hyperframes-video-studio.hf.space/api/jobs/{job_id}").json()
|
| 137 |
+
if job["status"] == "done": print(f"\u2705 {job['hf_url']}"); break
|
| 138 |
+
if job["status"] == "error": raise Exception(job["error"])
|
| 139 |
+
time.sleep(15)
|
| 140 |
+
```
|
| 141 |
+
|
| 142 |
+
---
|
| 143 |
+
|
| 144 |
+
## THE 5 HARD RULES
|
| 145 |
+
|
| 146 |
+
1. `class="clip"` on EVERY timed element + `data-start` + `data-duration` + `data-track-index`
|
| 147 |
+
2. `gsap.timeline({ paused: true })` β `window.__timelines["COMP_ID"] = tl`
|
| 148 |
+
3. NEVER `.play()` `.pause()` `.currentTime` β framework controls media
|
| 149 |
+
4. NEVER `Math.random()`, `Date.now()`, `fetch()` in GSAP scripts
|
| 150 |
+
5. `tl.set({}, {}, TOTAL_DURATION)` at the very end
|
| 151 |
+
|
| 152 |
+
**NO `muted` on video when subject voice is needed.**
|
| 153 |
+
**EXIT ANIMATIONS BANNED** (except final scene).
|
| 154 |
+
|
| 155 |
+
---
|
| 156 |
+
|
| 157 |
+
## REFERENCE FILES
|
| 158 |
+
|
| 159 |
+
- `references/composition.md` β HTML template, GSAP patterns, transitions
|
| 160 |
+
- `references/music.md` β ElevenLabs API, YuE fallback, prompts
|
| 161 |
+
- `references/styles.md` β Dark Premium / Warm Documentary / Bold Editorial
|
| 162 |
+
- `references/transcription.md` β Whisper, cleaning, quote extraction
|
| 163 |
+
- `references/workflows.md` β Scene structures for all 4 video types
|
| 164 |
+
|
| 165 |
+
## CONNECTIONS
|
| 166 |
+
|
| 167 |
+
| Tool | When | How |
|
| 168 |
+
|------|------|-----|
|
| 169 |
+
| Google Drive | Scan assets | Composio `GOOGLEDRIVE_FIND_FILE` account=tomoxi |
|
| 170 |
+
| GitHub | Push composition | Composio `GITHUB_COMMIT_MULTIPLE_FILES` AIGoose/dee-video-studio |
|
| 171 |
+
| HF Space | Render | POST aigoose-hyperframes-video-studio.hf.space/api/render |
|
| 172 |
+
| ElevenLabs | Music | POST /v1/music xi-api-key header |
|
| 173 |
+
| Whisper | Transcribe | HF Inference openai/whisper-large-v3 |
|