AI Class

Cara Bikin Video Promosi Pakai AI dengan Claude dan Remotion (Tanpa After Effects)

· 5 menit baca

Bikin video promosi biasanya berarti buka After Effects atau Premiere, cari template, geser keyframe satu per satu, lalu ulangi semuanya waktu ada revisi harga atau tanggal. Kalau kamu cuma butuh video pendek untuk Reels, TikTok, atau iklan produk, prosesnya terasa terlalu berat.

Ada cara lain: videonya ditulis sebagai kode, dan kodenya ditulis oleh AI. Kamu cukup menjelaskan video yang kamu mau ke Claude, lalu Remotion merender kode itu jadi file MP4. Revisi juga lewat obrolan, misalnya "ganti warnanya jadi hijau" atau "teks kedua muncul lebih lambat".

Artikel ini membahas alurnya dari nol sampai video pertama kamu jadi.

Apa itu Remotion?

Remotion adalah framework untuk membuat video dengan React. Setiap frame video adalah hasil render sebuah komponen React. Remotion memberi tahu komponen sedang berada di frame ke berapa, dan kamu mengatur posisi, ukuran, atau transparansi elemen berdasarkan angka frame itu.

Beberapa istilah yang akan sering kamu lihat:

  • Composition: satu video, lengkap dengan ukuran (misalnya 1080×1920), fps, dan durasi dalam frame.
  • useCurrentFrame(): mengembalikan nomor frame yang sedang dirender.
  • interpolate(): mengubah rentang frame jadi rentang nilai. Contohnya frame 0 sampai 20 jadi opacity 0 sampai 1.
  • spring(): animasi pegas yang halus, cocok untuk teks atau logo yang muncul.
  • Sequence: mengatur kapan sebuah bagian mulai dan berapa lama tampil.

Karena videonya berupa kode, kamu bisa mengganti teks, warna, atau data tanpa mengedit ulang dari awal. Satu video promosi bisa dijadikan template untuk puluhan produk.

Kenapa pakai Claude untuk menulis kodenya?

Kamu tidak perlu jago React untuk memakai Remotion. Claude bisa membaca deskripsi video dalam bahasa sehari-hari lalu menerjemahkannya jadi komponen Remotion: animasi teks, transisi antar-scene, logo reveal, sampai layout untuk format vertikal.

Kalau kamu memakai Claude Code (Claude yang berjalan di terminal), Claude bisa langsung membuat file di project, menjalankan perintah, dan memperbaiki error sendiri. Kalau memakai Claude di browser, kamu menyalin kodenya ke project secara manual. Keduanya bisa, tapi Claude Code jauh lebih cepat untuk bolak-balik revisi.

Yang perlu disiapkan

  • Node.js terpasang di komputer.
  • Akun Claude, lebih baik lagi kalau sudah memakai Claude Code.
  • Bahan promosi: nama produk, harga atau promo, logo, dan foto produk kalau ada.

Langkah 1: Buat project Remotion

Buka terminal di folder kerja kamu, lalu jalankan:

npx create-video@latest

Pilih template kosong (blank) supaya Claude bisa mulai dari kanvas bersih. Setelah selesai, masuk ke folder project dan jalankan Remotion Studio:

npx remotion studio

Studio terbuka di browser. Di sinilah kamu melihat preview video, memutar ulang, dan menggeser timeline frame demi frame.

Langkah 2: Jelaskan videonya ke Claude

Bagian terpenting ada di prompt. Semakin jelas kamu menjelaskan isi, urutan, dan gaya video, semakin sedikit revisi yang dibutuhkan. Contoh prompt untuk video promosi vertikal:

Buat composition Remotion bernama "Promo" untuk Instagram Reels:
ukuran 1080x1920, 30 fps, durasi 8 detik.

Scene 1 (0-2 detik): logo di tengah, muncul dengan animasi spring.
Scene 2 (2-5 detik): teks "Kopi Susu Gula Aren" lalu di bawahnya
"Diskon 30% minggu ini", muncul bergantian dari bawah.
Scene 3 (5-8 detik): ajakan "Order sekarang di GoFood"
dengan tombol berwarna oranye yang berdenyut pelan.

Gaya: latar gelap, aksen oranye, font tebal, animasi halus
tanpa efek memantul. Logo ada di public/logo.png.

Claude akan membuat komponen video dan mendaftarkannya sebagai composition. Hasilnya kurang lebih seperti potongan berikut, yang menganimasikan teks dengan spring() dan interpolate():

import { AbsoluteFill, interpolate, spring, useCurrentFrame, useVideoConfig } from "remotion";

export const Headline = () => {
  const frame = useCurrentFrame();
  const { fps } = useVideoConfig();
  const scale = spring({ frame, fps, config: { damping: 200 } });
  const opacity = interpolate(frame, [0, 20], [0, 1], { extrapolateRight: "clamp" });

  return (
    <AbsoluteFill style={{ backgroundColor: "#111", justifyContent: "center", alignItems: "center" }}>
      <h1 style={{ color: "#fff", fontSize: 110, opacity, transform: `scale(${scale})` }}>
        Diskon 30%
      </h1>
    </AbsoluteFill>
  );
};

Kamu tidak harus menulis kode ini sendiri. Yang penting kamu paham polanya: nilai animasi dihitung dari nomor frame, jadi setiap revisi tinggal mengubah angka atau teks.

Langkah 3: Preview dan revisi lewat obrolan

Buka Remotion Studio dan putar videonya. Catat apa yang kurang pas, lalu sampaikan ke Claude dengan bahasa biasa. Misalnya:

  • "Scene 2 terlalu cepat, tambah satu detik."
  • "Teks diskonnya kurang menonjol, perbesar dan kasih warna oranye."
  • "Logo jangan membesar, cukup fade in."

Revisi kecil seperti ini biasanya selesai dalam satu atau dua pesan. Bandingkan dengan membuka ulang project editing dan menggeser keyframe manual.

Langkah 4: Render ke MP4

Kalau sudah puas, render videonya dari terminal:

npx remotion render Promo out/promo.mp4

Promo adalah id composition yang tadi dibuat. Untuk versi YouTube, minta Claude membuat composition kedua berukuran 1920×1080 dengan layout yang disesuaikan, lalu render dengan id tersebut. Satu project bisa menyimpan banyak versi sekaligus.

Tips supaya hasilnya rapi

  • Tulis per scene, lengkap dengan durasi. Claude bekerja paling baik kalau urutan dan timing-nya jelas.
  • Sebutkan gaya animasi. Kata seperti "halus", "cepat", atau "tanpa efek memantul" berpengaruh besar ke hasil.
  • Simpan aset di folder public. Logo, foto produk, dan font dipanggil dari sana dengan staticFile().
  • Jadikan template. Minta Claude memindahkan teks, harga, dan warna ke props, supaya video berikutnya cukup ganti datanya.

Batasan yang perlu kamu tahu

  • Remotion gratis untuk individu dan tim kecil, tapi perusahaan dengan jumlah karyawan tertentu wajib membeli lisensi. Cek syarat terbarunya di situs resmi Remotion sebelum dipakai untuk bisnis.
  • Render memakai tenaga komputer kamu sendiri. Video panjang atau beresolusi tinggi butuh waktu lebih lama di laptop yang spesifikasinya terbatas.
  • Remotion mengurus visual dan audio yang kamu masukkan, tapi tidak membuat suara sendiri. Untuk voice over, sound effect, dan musik latar, kamu butuh tools lain.

Lanjut: suara, musik, dan posting otomatis

Video promosi yang enak ditonton biasanya punya voice over, sound effect, dan musik latar. Semuanya bisa dibuat dengan AI juga, lalu digabungkan ke project Remotion yang sama. Setelah itu video bisa dijadwalkan dan dipublikasikan ke TikTok, Reels, dan Shorts tanpa upload manual.

Alur lengkapnya, dari prompt di Claude, render di Remotion, suara dan musik dengan ElevenLabs, sampai auto posting lewat Repliz, dibahas langkah demi langkah di kelas Buat Video Motion dan Edit Video Pakai AI. Materinya berbahasa Indonesia dan cocok untuk pemula yang belum pernah coding.

Artikel terkait