Individual skill
bang-motion
Membangun motion graphic sinematik di browser (promo video, opener, intro, bumper, kinetic typography, explainer/video penjelasan bergambar 16:9 atau 9:16) memakai HTML + CSS + GSAP (+ Three.js bila perlu), dengan hasil yang bergerak seperti video sungguhan — bukan slide presentasi. Gunakan skill ini setiap kali user meminta "video promo", "opener", "intro animasi", "motion graphic", "bumper", "kinetic typography", "animasi teks sinematik", "explainer", "video penjelasan" (jurnalisme visual, kartun edukasi, kolase), atau menunjukkan referensi video promosi/explainer dan ingin dibuatkan versi web-nya — bahkan bila mereka tidak menyebut kata "motion graphic" secara eksplisit. Juga gunakan bila user mengeluh hasil animasi web "seperti PPT/presentasi" dan ingin lebih sinematik, atau ingin merender animasi web menjadi file video MP4, atau ingin explainer kartun/animasi dibangun LANGSUNG di After Effects lewat bridge/MCP Higgsfield.
SKILL.md
Source commit c1aa65e921c970d858705fcb4a53a8294d1a4131
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- No
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Not checked yet
- Last checked
- Nov 4, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 1,710
- Repository last updated
- Sep 15, 2026
- License
- MIT
Observed agent integration: claude-code
- design Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
.claude-plugin/marketplace.jsonasset · 990 bytes.claude-plugin/plugin.jsonasset · 780 bytesCHANGELOG.mddoc · 2,544 bytesLICENSEasset · 1,070 bytesREADME.mddoc · 19,806 bytesSKILL.mdcore · 39,343 bytesSKILL.mdcore · 39,343 bytesassets/starter-explainer-jurnalisme.htmlasset · 17,027 bytesassets/starter-explainer-kartun.htmlasset · 17,035 bytesassets/starter-explainer-katalog.htmlasset · 19,528 bytesassets/starter-explainer-panggung.htmlasset · 20,733 bytesassets/starter-explainer-sketsa.htmlasset · 17,302 bytesassets/starter-explainer.htmlasset · 18,416 bytesassets/starter-opener.htmlasset · 30,608 bytesdocs/gallery/01-grainy-gradient.jpgasset · 68,110 bytesdocs/gallery/02-kinetic-colorblock.jpgasset · 103,702 bytesdocs/gallery/03-saas-ui-tour.jpgasset · 75,925 bytesdocs/gallery/04-flat-vector.jpgasset · 66,235 bytesdocs/gallery/05-continuous-action.jpgasset · 76,637 bytesdocs/gallery/06-cartoon-stage.jpgasset · 50,357 bytesdocs/gallery/07-flat-pop-photo.jpgasset · 122,418 bytesdocs/gallery/08-white-catalog.jpgasset · 147,178 bytesdocs/gallery/09-visual-journalism.jpgasset · 208,575 bytesdocs/gallery/10-vintage-sketch.jpgasset · 238,104 bytesdocs/gallery/11-cartoon-collage.jpgasset · 189,115 bytesdocs/gallery/12-more-combinations.jpgasset · 133,048 bytesdocs/gallery/hero.jpgasset · 262,834 bytesicon.pngasset · 178,102 bytesicon.svgasset · 2,015 bytesreferences/ae-bridge-higgsfield.mddoc · 11,812 bytesreferences/anti-ppt.mddoc · 11,453 bytesreferences/architecture.mddoc · 7,663 bytesreferences/explainer.mddoc · 34,066 bytesreferences/kartun-panggung.mddoc · 11,892 bytesreferences/opener-konsep.mddoc · 58,022 bytesreferences/roadmap.mddoc · 4,515 bytesreferences/techniques.mddoc · 44,953 bytesscripts/ae/bridge/aset-svg.pyruns · 5,978 bytesscripts/ae/bridge/package.jsonruns · 272 bytesscripts/ae/bridge/rig-tokoh.pyruns · 7,319 bytesscripts/ae/bridge/svg2png.cjsruns · 1,074 bytesscripts/export-frames.mjsruns · 2,677 bytesscripts/kepala-ekspresi.pyruns · 4,399 bytesscripts/serve.pyruns · 854 bytesscripts/snap.mjsruns · 3,086 bytesscripts/vo-pauses.htmlasset · 4,793 bytes
Read excerpt
# Bang Motion — motion graphic web yang bukan PPT
**v1.19.0 · by [Bang Tutorial](https://youtube.com/bangtutorial) · MIT.** Riwayat perubahan di `CHANGELOG.md`;
cara pasang di `README.md`.
Skill ini untuk AI coding agent apa pun (format Agent Skills terbuka).
Isinya hukum dan resep untuk motion graphic yang bergerak seperti video, bukan
presentasi — patuhi sebelum menulis kode.
## Prasyarat — hanya browser
Deliverable (`index.html`) hanya butuh browser modern + internet untuk CDN
(GSAP, font). Python dan Node **opsional**, dipakai hanya untuk alat kerja:
`scripts/serve.py` (server no-cache, cuma perlu bila memakai module lokal),