<aside> 🎬

Skill /brag membaca project website atau app yang ada di folder kerja, lalu menyusun video launch singkat. Panduan ini membedakan jalur klasik dengan /brag-slim dan memberi langkah yang bisa dicoba dari instalasi sampai review hasil.

</aside>

Diverifikasi: 26 September 2026 · Materi untuk audiens @kayadigital.ai · CTA: BRAG

Baru selesai membuat website atau aplikasi dengan AI? /brag adalah skill untuk AI coding agent yang membaca folder source project, memilih cerita dan momen visual yang paling kuat, lalu membuat video launch singkat. Ini bukan fitur untuk menempelkan URL sembarang website dan otomatis merekam layarnya. Project harus tersedia bagi agent sebagai file yang dapat dibaca. Jalur /brag klasik memakai Hyperframes untuk menyusun dan merender video; /brag-slim adalah jalur lebih baru yang tidak memakai Hyperframes. Sumber: README resmi, instruksi skill.

1. Pilih jalur yang akan dipakai

Jalur Kapan dipilih Instalasi Catatan
/brag klasik di Claude Code Mulai dari workflow resmi dengan output yang terdokumentasi rinci Plugin marketplace Node.js 22+, FFmpeg, Hyperframes CLI
/brag pada agent lain Memakai Codex CLI, Cursor, Gemini CLI, dan agent yang mendukung skill npx skills add Pastikan agent benar-benar menemukan skill dan dapat menjalankan alat lokal
/brag-slim Ingin mencoba versi baru yang dibuat untuk Claude Opus 5.5 Plugin terbaru atau instal skill terpisah Tanpa Hyperframes dan tanpa bundled assets; instruksi hasil dan dependensi dapat berbeda

Tutorial utama di bawah mengikuti jalur klasik, sebab langkah pemeriksaan, render, dan nama file hasilnya terdokumentasi di repo. Menurut situs proyek, pada Claude Opus 5.5 pemanggilan /brag otomatis beralih ke /brag-slim; gunakan /brag --full untuk meminta jalur klasik. Fitur ini bergantung pada versi plugin dan model yang digunakan. Situs resmi, README.

2. Requirement sebelum install

  1. Project website atau app yang source code-nya ada di komputer. Buka folder project itu di AI coding agent. Skill membaca kode, copy, komponen UI, aset, serta alur penggunaan. Website yang hanya punya URL publik belum memenuhi alur utama ini.
  2. AI coding agent yang mendukung Agent Skills, misalnya Claude Code, Codex CLI, opencode, atau agent lain yang dapat membaca instruksi skill dan menjalankan perintah lokal.
  3. Node.js versi 22 atau lebih baru dan npx.
  4. FFmpeg terpasang dan bisa ditemukan dari terminal melalui PATH.
  5. Hyperframes CLI untuk jalur klasik; repo meminta pengecekan dengan npx hyperframes doctor.

Cek di terminal sistem:

node --version
npx --version
ffmpeg -version
npx hyperframes doctor

Jika salah satu pemeriksaan gagal, pasang atau perbaiki komponen tersebut menggunakan petunjuk resmi untuk sistem operasi Anda, lalu ulangi pengecekan. Jangan memasukkan /brag ke terminal sistem: /brag adalah instruksi di percakapan AI coding agent. README bagian Requirements dan Use it.

3. Install skill

Opsi A — Claude Code, paling langsung

Buka Claude Code, lalu jalankan dua perintah berikut di dalam Claude Code, berurutan:

/plugin marketplace add latent-spaces/brag
/plugin install brag@brag