ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-11-14 21:29:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(skill): house style anti-defaults for SVG, overlap, and zoom (#68)

Browse Source 
## Summary

- Anti-default: don't draw real-world objects with SVG paths — they look crude. Geometric shapes and abstract forms only.
- Anti-default: every element needs clear space — overlapping text is always ugly.
- Replaced zoom-in monoculture in choreography — now offers 6 ambient motion options instead of always zooming.
- Added scene pacing: build/breathe/resolve phases.

Follow-up to the house style PR (#59, merged). These fixes came from visual review of 20+ eval compositions.

## Test plan

- [ ] Generate a composition with a sparse prompt and verify no SVG illustrations of real objects
- [ ] Verify elements don't overlap in generated compositions
- [ ] Verify ambient motion varies (not always zoom-in)

🤖 Generated with [Claude Code](https://claude.com/claude-code)
This commit is contained in:
Vance Ingalls
2026-03-26 14:02:30 -07:00
committed by GitHub
parent e1c1c6fb30
commit 238962adff
1 changed files with 15 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
skills/compose-video/house-style.md
+15 -13
View File
@@ -94,19 +94,21 @@ Beyond choosing a typeface:
Things the LLM reaches for that look generic. Do the opposite.
| Default | Instead |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Inter / Roboto / system font | Pick a typeface with character — commit to it |
| `#f5f5f5` / `#333` / mid-gray | Go high contrast. Near-black or near-white, not the middle |
| Blue accent `#3b82f6` | No blue unless the user asks for blue |
| Everything centered, equal weight | One focal point per frame. Lead the eye somewhere |
| Uniform spacing | Tight clusters and open gaps. Vary deliberately |
| Same entrance on every element | Never repeat an entrance pattern in a composition |
| 1s duration on everything | 0.3–0.6s. Shorter than you think |
| `power2.out` on everything | Vary eases — no more than 2 independent tweens with the same ease (staggers are exempt) |
| Always dark background | Match the content: food, weddings, kids, wellness, education → light palette |
| Inventing colors per-element | Declare palette up front. Every element references it |
| Content in cards/containers | Place content directly on the canvas — separate with space and alignment, not box boundaries. Cards are a web pattern. Exception: dashboards, lower thirds, captions over footage |
| Default | Instead |
| --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Inter / Roboto / system font | Pick a typeface with character — commit to it |
| `#f5f5f5` / `#333` / mid-gray | Go high contrast. Near-black or near-white, not the middle |
| Blue accent `#3b82f6` | No blue unless the user asks for blue |
| Everything centered, equal weight | One focal point per frame. Lead the eye somewhere |
| Uniform spacing | Tight clusters and open gaps. Vary deliberately |
| Same entrance on every element | Never repeat an entrance pattern in a composition |
| 1s duration on everything | 0.3–0.6s. Shorter than you think |
| `power2.out` on everything | Vary eases — no more than 2 independent tweens with the same ease (staggers are exempt) |
| Always dark background | Match the content: food, weddings, kids, wellness, education → light palette |
| Inventing colors per-element | Declare palette up front. Every element references it |
| Content in cards/containers | Place content directly on the canvas — separate with space and alignment, not box boundaries. Cards are a web pattern. Exception: dashboards, lower thirds, captions over footage |
| Hand-drawn SVG illustrations | Don't attempt to draw real-world objects (faces, buildings, food, animals) with SVG paths — they look crude. Use geometric shapes, lines, and abstract forms only. If the composition needs imagery, use text and typography to evoke it instead |
| Overlapping elements | Every element needs its own clear space. Check that positioned elements don't collide — stagger positions vertically with enough margin. Overlapping text is always ugly |
## Palettes