Cara Saya Membuat Video Motion Graphics Profesional Dengan Claude Code + Remotion (Tanpa Editing)

AAndy Lo
Computing/SoftwareSmall Business/StartupsPhotography/ArtInternet Technology

Transcript

00:00:00Lihatlah video penjelasan yang kami buat ini.
00:00:02Mars, si planet merah, dunia yang telah memikat umat manusia selama berabad-abad.
00:00:08Ini adalah planet keempat dari matahari, berada tepat setelah Bumi di tata surya kita.
00:00:14Video ini tidak diedit menggunakan After Effects.
00:00:16Kami tidak menyentuh keyframe, dan kami tidak membuat animasi apa pun secara manual.
00:00:21Claude menggunakan skill Remotion Agent baru, lalu membangun dan merendernya untuk kami.
00:00:26Gerakan, pengaturan waktu, semuanya dilakukan hanya dengan memberikan perintah prompt.
00:00:30Tapi pertama-tama, mari bahas tentang skill Claude.
00:00:33Jika Anda mengikuti perkembangan AI akhir-akhir ini, skill Claude adalah topik yang paling hangat saat ini.
00:00:38Semua orang membicarakannya, tapi inilah sebenarnya skill Claude tersebut.
00:00:43Itu adalah panduan instruksi yang mengajarkan Claude cara menguasai alat dan alur kerja tertentu.
00:00:49Terdapat paket pengetahuan khusus yang mengubah Claude dari asisten umum
00:00:54menjadi seorang ahli di berbagai bidang seperti produksi video, analisis data, atau otomatisasi.
00:01:00Dan saat Anda menggabungkan skill dengan kode Claude dan alat pengkodean agenda Thorpe,
00:01:05Anda akan membuka sesuatu yang sangat hebat.
00:01:07Sekarang, mari bahas Remotion.
00:01:09Ini adalah framework yang memungkinkan Anda membuat video menggunakan kode React,
00:01:13teknologi yang sama yang menggerakkan situs web modern.
00:01:15Namun, inilah masalahnya.
00:01:16Remotion sangat hebat, tetapi juga sangat kompleks.
00:01:20Anda perlu memahami React, pustaka animasi, fungsi pengaturan waktu, dan perenderan video.
00:01:26Ini adalah alat pengembang yang selama ini sulit dijangkau oleh kebanyakan orang.
00:01:30Itulah mengapa skill Remotion Agent ini menjadi pengubah keadaan.
00:01:33Ini memberikan Claude pengetahuan mendalam tentang seluruh framework Remotion,
00:01:37seperti cara menyusun komposisi, mengatur koreografi animasi,
00:01:41mengelola pengaturan waktu, menangani aset, dan semuanya.
00:01:45Jadi, alih-alih Claude menebak-nebak kode video, sekarang ia memahami framework tersebut
00:01:50layaknya seorang pengembang Remotion yang ahli.
00:01:53Ini adalah sistem yang sama yang sudah digunakan pengembang untuk menghasilkan video secara otomatis.
00:01:58Dan di akhir video ini,
00:02:00Anda akan bisa mengarahkan desain grafis profesional hanya dengan perintah prompt.
00:02:04Mari kita mulai.
00:02:05Pertama, kita perlu menginstal skill Claude Remotion.
00:02:08Untuk melakukannya, kita akan mengetikkan perintah ini.
00:02:11Anda bisa menemukan perintah ini di alat situs web Remotion.
00:02:14Lalu kita pilih semua model dalam daftar dengan menekan spasi lalu enter.
00:02:19Setelah skill Claude terinstal di proyek,
00:02:22kita akan membuka terminal kode Claude dan memintanya untuk memulai proyek Remotion baru.
00:02:28Mari kita tunggu hingga proses persiapannya selesai.
00:02:30Sekarang proses persiapan proyek dan templatnya sudah selesai.
00:02:38Cukup ikuti petunjuk di sini untuk meluncurkan Remotion Studio.
00:02:42Mari kita lihat tampilannya. Bagus.
00:02:45Jadi, beginilah tampilan Remotion.
00:02:46Mirip aplikasi edit video, tapi Anda memprogram setiap adegannya.
00:02:51Nah, karena proyek sudah terinstal dan Anda sudah tahu tampilan Remotion,
00:02:56mari kita lanjut ke tahap pengembangan.
00:02:59Pengembangan kita terdiri dari sembilan fase.
00:03:02Fase 1 sampai 3 akan membangun sistem tempat Claude beroperasi.
00:03:07Fase 4 sampai 7 untuk membuat aset dan menentukan komponen yang bisa digunakan.
00:03:13Dan fase 8 sampai 9 adalah tahap eksekusi.
00:03:16Dengan begitu, mari kita lanjutkan.
00:03:19Tentu saja, kita mulai dari fase 1.
00:03:21Sekarang setelah semuanya terinstal,
00:03:25mari buka panduan pembuatan yang kami buat khusus untuk video ini.
00:03:29Meski panduan ini untuk video spesifik yang ingin kami buat,
00:03:35Anda juga bisa mengubah panduan ini untuk membuat video lain yang Anda inginkan
00:03:39setelah Anda memahami cara kerja perintah prompt ini.
00:03:42Jika Anda ingin salinan prompt ini,
00:03:44Anda bisa melihat komunitas gratis kami tempat kami mengunggah panduan seperti ini.
00:03:48Agar Anda juga bisa membangun sesuatu dengan AI.
00:03:51Mari salin prompt fase 1 lalu tempelkan di kode Claude.
00:03:56Kemudian kita tekan enter.
00:03:57Fungsi prompt ini adalah untuk membangun fondasi teknis
00:04:02yang harus diikuti Claude selama proses pengembangan.
00:04:06Anggap saja ini sebagai aturan dan pola yang harus ia ikuti.
00:04:09Ini sangat penting karena kebanyakan proyek gagal
00:04:13bukan karena kurangnya arahan visual,
00:04:16tapi karena AI tidak diberi aturan konkret sehingga akhirnya bekerja semaunya sendiri.
00:04:23Setelah fase 1 selesai, tampilannya akan seperti ini.
00:04:27Dan file markdown pengembangan akan dibuat.
00:04:31Claude sudah selesai meletakkan fondasinya.
00:04:34Jadi, Anda sekarang bisa lanjut ke fase berikutnya, fase 2.
00:04:37Sekarang kita akan menentukan arahan seni dan sistem visual untuk video ini.
00:04:42Ini adalah langkah yang sangat, sangat penting dalam alur kerja.
00:04:46Sejauh ini, kita telah menyiapkan lingkungan dan memastikan Claude memahami Remotion.
00:04:52Apa yang kita lakukan di sini adalah memberi tahu Claude cara berpikir secara visual sebelum ia menulis kode yang sebenarnya.
00:05:00Jadi, silakan buka panduan pembuatannya lagi.
00:05:03Anda akan melihat bagian yang bertanda fase 2.
00:05:05Anda bisa menyalin seluruh prompt persis seperti aslinya.
00:05:10Lalu kembali ke kode Claude di terminal Anda.
00:05:15Tempelkan prompt tersebut dan tekan enter.
00:05:17Biarkan Claude mengambil alih sejenak.
00:05:21Saya ingin berhenti sebentar dan menjelaskan mengapa prompt ini sangat penting.
00:05:25Karena di sinilah banyak orang sering melewatkan langkah atau mencoba mengendalikan segalanya secara berlebihan.
00:05:30Prompt ini tidak meminta Claude untuk langsung membuat video lengkap.
00:05:35Yang dilakukan adalah membangun pemikiran sistem.
00:05:39Seperti kita sedang menentukan aturan dunia yang akan dibangun oleh Claude.
00:05:43Anggap saja ini sebagai arahan kreatif, bukan sekadar instruksi.
00:05:46Kita memberi tahu Claude hal-hal seperti suasana secara keseluruhan, batasan visual,
00:05:52bagaimana gerakan seharusnya terasa, dan bagaimana keputusan desain diambil jika ada sesuatu yang tidak ditentukan secara eksplisit.
00:06:00Ini sangat penting karena kita tidak mungkin mendeskripsikan setiap piksel dalam video ini, bukan?
00:06:07Hal itu mustahil dilakukan.
00:06:08Namun di sisi lain, kita tidak ingin Claude menebak secara acak atau menciptakan pola yang sama sekali tidak sesuai dengan gaya kita.
00:06:15Prompt ini menciptakan kendali tanpa harus mengatur hal-hal mikro.
00:06:19Ini memberi Claude kerangka kerja untuk beroperasi di dalamnya.
00:06:22Jadi, alih-alih menebak apa arti "bersih" atau "modern", ia memiliki definisi yang sama dengan kita.
00:06:29Alih-alih berhalusinasi, kini ia memiliki keterampilan teknis
00:06:33dan batasan kreatif untuk bekerja dengan benar.
00:06:36Mari tekan enter dan tunggu Claude memprosesnya.
00:06:39Baiklah, setelah Claude selesai, Anda akan melihat di sini bahwa ia membuat file arahan seni,
00:06:44yang menguraikan cara ia harus menalar dan mengeksekusi keputusan di masa depan.
00:06:48Saat masuk ke pengembangan yang sebenarnya, jangan takut untuk melakukan penyesuaian di bagian ini,
00:06:55karena Anda tentu ingin proyek Anda memiliki arahan seni yang Anda inginkan.
00:06:58Jadi, Anda mungkin perlu meminta Claude untuk mengubah atau menambah beberapa hal.
00:07:02Dan begitu saja, kita telah membuka fase alur kerja berikutnya.
00:07:07Kita sekarang memiliki bahasa visual yang sama antara Anda dan AI.
00:07:12Jadi Claude tahu cara memikirkan video ini sebelum ia menulis komposisi atau urutan apa pun.
00:07:18Dan itu adalah kemajuan besar.
00:07:19Pada titik ini, kita telah berhasil menetapkan arahan seni dan kendali visual.
00:07:24Kita memang belum membangun videonya.
00:07:26Tapi kita sudah memasang fondasi yang membuat hasil akhirnya nanti terprediksi dan profesional.
00:07:31Dengan arahan seni yang sudah mantap, hal berikutnya yang perlu kita lakukan adalah menyusun cerita videonya.
00:07:37Langkah ini akan merampungkan sistem yang kita butuhkan.
00:07:40Kita beranjak dari bagaimana perasaan video tersebut ke apa yang sebenarnya terjadi dari waktu ke waktu.
00:07:47Tujuannya sangat sederhana.
00:07:49Tentukan adegannya, alur, dan pengaturan waktunya.
00:07:52Agar videonya masuk akal sebelum kita mulai membuat animasi apa pun.
00:07:56Oke, mari kembali ke panduan pembuatan dan cari prompt fase 3.
00:08:02Kita bisa menyalin semuanya.
00:08:03Setelah Anda menyalinnya, kembali ke kode Claude.
00:08:08Tempelkan prompt tersebut dan tekan enter.
00:08:10Sekarang kita tunggu Claude memprosesnya.
00:08:13Claude mengambil arahan seni yang kita tentukan tadi dan menggunakannya untuk membuat lini masa.
00:08:18Ia memutuskan berapa banyak adegan yang kita butuhkan, apa fungsi setiap adegan,
00:08:23dan berapa lama setiap momen harus muncul di layar.
00:08:27Inilah yang memungkinkan kita membuat video berdurasi 10 atau 60 detik
00:08:32yang terasa terencana, bukan terburu-buru atau asal-asalan.
00:08:36Setelah Claude selesai, Anda akan melihat rincian video ke dalam beberapa adegan.
00:08:40Setiap adegan memiliki peran yang jelas.
00:08:43Biasanya ada pembukaan yang menarik, bagian pesan utama, momen pendukung, dan penutup, kan?
00:08:52Ini sebenarnya adalah papan cerita (storyboard), hanya saja dalam bentuk tulisan.
00:08:56Ini semacam storyboard yang ditulis dalam teks, bukan visual.
00:09:02Pada titik ini, Anda bisa meminta Claude untuk mengubah beberapa hal.
00:09:05Jadi, jika ada adegan yang tidak pas dengan keinginan Anda, katakan saja.
00:09:10Jika Anda ingin menyusun ulang bagian atau menghapus salah satunya, sekaranglah waktunya.
00:09:15Ini adalah poin lain di mana orang sering merasa bingung.
00:09:17Mereka mengira harus menerima hasil pertama begitu saja.
00:09:20Sebenarnya tidak perlu.
00:09:21Anggap saja ini sebagai draf kolaborasi, oke?
00:09:25Begitulah.
00:09:27Dalam kasus ini, strukturnya terlihat cukup kuat, kan?
00:09:30Temponya masuk akal, adegannya mengalir logis, dan sesuai dengan durasi yang kita tuju.
00:09:37Jadi alih-alih melakukan revisi lagi, kita akan memberikan sinyal setuju kepada Claude.
00:09:41Anda cukup memberi tahu Claude untuk melanjutkan
00:09:45dan membuat file storyboard berdasarkan struktur ini.
00:09:48Setelah Anda melakukannya, Claude akan menghasilkan file khusus
00:09:52yang merepresentasikan lini masa lengkap video tersebut.
00:09:55File ini menjadi satu-satunya acuan utama untuk apa yang akan kita buat nanti.
00:10:00Dan begitu saja, cerita videonya sekarang sudah terkunci.
00:10:04Kita tahu apa yang terjadi, kapan itu terjadi, dan mengapa bagian itu ada.
00:10:08Belum ada yang dianimasikan, tapi keputusan kreatif tersulit sudah selesai.
00:10:13Sekarang setelah storyboard selesai, kita akan masuk ke fase empat,
00:10:18yaitu menentukan inventaris aset kita.
00:10:20Ini adalah salah satu langkah yang mungkin awalnya terasa opsional,
00:10:24tapi sebenarnya sangat krusial jika Anda ingin hasil yang bersih dan konsisten.
00:10:28Tujuannya sangat sederhana, tentukan aset apa saja yang ada,
00:10:33dan bagaimana tampilannya sebelum kita mencoba membuat, menganimasi, atau menempatkannya.
00:10:38Langkah ini krusial karena memisahkan antara keputusan desain dan logika adegan.
00:10:44Pemisahan itulah yang mencegah terjadinya kendala di kemudian hari.
00:10:48Inilah alasannya mengapa hal ini penting.
00:10:50Jika Anda meminta Claude mendesain aset, memutuskan tampilannya,
00:10:54sekaligus menentukan posisinya dalam sebuah adegan pada waktu yang bersamaan.
00:10:59Anda menumpuk terlalu banyak keputusan dalam satu langkah, dan di situlah biasanya terjadi kegagalan.
00:11:04Anda akan mendapatkan hasil yang tidak konsisten dan buruk.
00:11:07Mari kembali ke panduan pembuatan dan salin prompt fase empat.
00:11:11Setelah disalin, kembali ke terminal Claude, tempelkan, dan tekan enter.
00:11:17Sekarang kita tunggu Claude memprosesnya.
00:11:19Sambil menunggu, saya jelaskan apa yang dilakukan prompt ini di balik layar.
00:11:24Ini belum membuat visualnya.
00:11:25Langkah ini menentukan parameter desain untuk setiap aset yang kita perlukan.
00:11:29Hal-hal seperti objek, penggunaan warna, dan sebagainya.
00:11:33Kesalahan umum di sini adalah melewatkan tahap ini dan membiarkan setiap adegan membuat asetnya sendiri.
00:11:39Itulah yang menyebabkan video di mana setiap adegan terlihat kaku dan tidak terasa menyatu.
00:11:45Setelah Claude selesai, ia akan membuat file inventaris aset yang disusun dengan jelas.
00:11:53Setiap aset memiliki nama dan parameter yang sudah ditentukan.
00:11:57Pada titik ini, Anda tidak perlu banyak mengubah kecuali ada yang kurang atau tidak diperlukan.
00:12:04Jika Anda ingin menambah atau mengubah apa pun, minta saja Claude untuk melakukannya.
00:12:10Kini kita sudah memiliki daftar aset lengkap dan sistem desain yang mengaturnya.
00:12:17Itu artinya saat Claude mulai menghasilkan komponen Remotion,
00:12:22ia tidak akan menebak-nebak lagi bagaimana tampilannya nanti.
00:12:25Claude akan mengambilnya langsung dari inventaris ini.
00:12:28Setelah spesifikasi aset terkunci, kita bisa lanjut ke fase 5,
00:12:33yaitu benar-benar menghasilkan aset-aset tersebut.
00:12:36Sekarang kita akan memproduksi potongan konkret yang akan digunakan di seluruh video.
00:12:42Sejauh ini, kita memang sengaja memisahkan setiap fokus pengerjaan.
00:12:48Mulai dari menentukan sistem, arahan seni, storyboard, hingga spesifikasi aset tadi.
00:12:56Langkah ini sekarang mengubah definisi-definisi tersebut menjadi aset nyata tanpa mencampuradukkan tanggung jawab,
00:13:04yang membuat kode Claude berkembang dengan instruksi dan konteks yang sangat jelas.
00:13:10Itulah mengapa cara ini bekerja dengan sangat andal.
00:13:13Mari kita jalankan.
00:13:15Ambil prompt fase 5 dari panduan pembuatan lagi, lalu tempelkan di terminal Claude.
00:13:20Tapi sebelum tekan enter, ada hal penting.
00:13:23Saat mengerjakan proyek besar dengan banyak aset dari berbagai kategori,
00:13:29sangat disarankan untuk menghasilkannya secara bertahap berdasarkan kategori.
00:13:33Maksudnya adalah menambahkan aturan pada prompt yang memerintahkan Claude
00:13:37untuk menghasilkan satu kategori aset dalam satu waktu.
00:13:40Ini mengurangi kemungkinan AI berhalusinasi, sehingga memperkecil peluang
00:13:45Claude kehilangan gaya desain di antara aset yang tidak berhubungan.
00:13:49Dalam kasus kita, video ini tidak memiliki inventaris aset yang terlalu besar.
00:13:53Jadi kita bisa langsung menghasilkan semuanya dalam satu proses.
00:13:57Ketahuilah bahwa seiring bertambah besarnya proyek Anda, melakukan batching menjadi praktik terbaik.
00:14:03Oke, bagian ini biasanya memakan waktu, jadi harap bersabar.
00:14:08Setelah selesai, luangkan waktu sejenak untuk memindai hasilnya dan lihat apakah semua aset yang Anda butuhkan ada di sana.
00:14:15Biasanya, Anda akan menemukan semuanya di folder SRC.
00:14:20Dan begitu saja, kita sekarang memiliki set lengkap aset yang dihasilkan dan siap digunakan.
00:14:25Dan ini bukan lagi sekadar ide abstrak.
00:14:28Ini adalah blok bangunan nyata yang akan digunakan kembali di berbagai adegan,
00:14:32yang akan memberikan konsistensi video yang kita inginkan.
00:14:36Setelah semua aset selesai, langkah selanjutnya adalah memberi mereka gerakan.
00:14:41Ini adalah fase enam, dan tujuannya di sini adalah untuk menentukan bagaimana perilaku masing-masing aset kita.
00:14:47Belum ke adegan final, hanya blok bangunan gerakan yang akan digunakan kembali di mana-mana.
00:14:53Inilah yang Anda pikirkan sebagai primitif gerakan.
00:14:56Dan pada dasarnya, kita menciptakan bahasa gerakan bersama yang dapat digunakan oleh seluruh video.
00:15:01Jadi, di panduan build, ambil saja prompt fase enam lalu tempelkan ke Claude code.
00:15:07Sekarang, inilah pergeseran pola pikir yang penting.
00:15:10Kita tidak perlu menjadi sangat teknis di sini.
00:15:13Kita tidak mencantumkan setiap keyframe atau mendeskripsikan setiap animasi secara detail.
00:15:18Dan alasan kita bisa melakukan itu adalah karena pekerjaan yang kita lakukan sebelumnya.
00:15:23Karena pada fase-fase awal proyek ini, kita sudah menetapkan bagaimana Claude harus berpikir.
00:15:28Kita menentukan aturan dan pola pengembangan, prinsip visual, penceritaan,
00:15:33dan batasan desain menggunakan semua file markdown tersebut.
00:15:37Dan ini memberi Claude pemahaman mendalam tentang gaya, tempo, dan nada yang kita tuju.
00:15:44Jadi pada titik ini, kita bisa memercayainya untuk mengevaluasi proyek secara keseluruhan
00:15:48dan mengusulkan pola gerakan yang masuk akal.
00:15:50Jadi setelah prompt ditempel, kita bisa langsung menekan enter.
00:15:55Claude akan mulai menganalisis aset dan menghasilkan primitif gerakan.
00:15:58Kesalahan umum di sini adalah mencoba mengontrol langkah ini secara berlebihan.
00:16:02Jika Anda mencoba mengatur gerakan secara mikro pada tahap ini,
00:16:05Anda akan berakhir dengan memasukkan gerakan spesifik adegan ke dalam sistem gerakan Anda.
00:16:10Dan itu membuat segalanya lebih sulit untuk digunakan kembali nanti.
00:16:13Jadi sebaliknya, kita mengincar pola gerakan serbaguna yang fleksibel
00:16:17yang terasa konsisten di seluruh video.
00:16:21Dan sekarang bukan berarti Claude akan mendapatkan semuanya dengan sempurna.
00:16:25Tidak apa-apa.
00:16:26Tugas kita di sini bukan untuk mengharapkan gerakan tanpa cela pada percobaan pertama, kan?
00:16:31Tugas kita adalah mendapatkan dasar yang kuat.
00:16:34Kita pasti akan kembali dan memoles momen-momen spesifik nanti saat melihat hasil adegannya.
00:16:39Jadi setelah sedikit pemrosesan, Claude selesai.
00:16:42Dan begitu saja, kita sekarang memiliki sekumpulan primitif gerakan yang ditentukan untuk proyek ini.
00:16:47Ini dapat digunakan kembali, konsisten, dan selaras dengan sistem visual
00:16:52dan narasi yang kita tetapkan sebelumnya.
00:16:54Itu adalah pencapaian besar.
00:16:57Kita sekarang punya aset dan kita punya gerakan.
00:17:00Dan kita sudah sangat dekat untuk mengubah semua ini menjadi sebuah video.
00:17:04Dan sekarang untuk fase 7 dan 8.
00:17:06Ini adalah bagian di mana kita pada dasarnya menyatukan semuanya.
00:17:09Beberapa hal yang diminta oleh prompt ini kepada Claude
00:17:12kemungkinan besar adalah hal-hal yang sudah diperhitungkan selama fase awal.
00:17:17Namun tetap saja, penting untuk menjalankannya guna membuat komponen yang diperlukan
00:17:22dan memastikan tidak ada celah.
00:17:25Jadi jalankan saja di terminal Claude code
00:17:28sambil meminta Claude untuk melewati hal-hal yang sudah ia lakukan.
00:17:31Baiklah, sekarang setelah semua itu selesai,
00:17:34kita akhirnya mendapat lampu hijau untuk membangun adegan dan menyusun videonya, oke?
00:17:40Dan ini adalah fase 9.
00:17:42Dan sejujurnya, ini adalah bagian termudah dari seluruh alur kerja
00:17:46karena semua pemikiran sulit sudah dilakukan untuk kita, oke?
00:17:50Jadi mari kita lanjutkan.
00:17:51Pada titik ini, Claude tidak lagi menebak-nebak.
00:17:54Ia mengeksekusi di dalam sistem yang sudah kita siapkan dengan hati-hati.
00:17:57Tujuan kita di sini sangat sederhana.
00:17:59Hasilkan kode untuk setiap adegan.
00:18:02Tinjau tampilannya.
00:18:05Lalu susun semuanya menjadi satu video final yang terpoles.
00:18:10Pertama, salin prompt fase 9 dari panduan build
00:18:13dan tempelkan ke terminal Claude lalu tekan enter.
00:18:17Dan apa yang dilakukan prompt ini adalah menginstruksikan Claude
00:18:21untuk mulai membangun adegan gerakan yang sebenarnya
00:18:23menggunakan semua yang telah kita buat sejauh ini.
00:18:26Seperti pengarahan seni, papan cerita, aset,
00:18:29dan primitif gerakan semuanya bersatu di sini.
00:18:32Jadi sekarang idealnya, terutama untuk proyek yang lebih besar,
00:18:35Anda ingin menghasilkan adegan satu per satu.
00:18:38Dan itulah mengapa kita merancang prompt-nya seperti itu.
00:18:41Dan meskipun ini hanya video berdurasi satu menit 30 detik,
00:18:45mempelajari praktik terbaik ini lebih awal akan menghindarkan Anda dari banyak kesulitan nanti.
00:18:49Jadi saat adegan dihasilkan secara individual,
00:18:52jauh lebih mudah untuk men-debug setiap bagian
00:18:55dan membuat perubahan terarah tanpa merusak seluruh video.
00:18:59Jadi setelah adegan satu selesai, kita lanjut dan hasilkan adegan-adegan sisanya.
00:19:04Dan setelah itu selesai, kita ingin melihat apa yang telah kita bangun.
00:19:08Anda bisa meminta Claude untuk menjalankan Remotion Studio untuk Anda
00:19:10dan ia akan memberi Anda URL-nya.
00:19:12Atau Anda bisa langsung menjalankan npm start di terminal.
00:19:16Sekarang kita berada di dalam Remotion Studio dan mari kita tekan putar.
00:19:21Dan langsung saja Anda bisa melihat bahwa pengarahan seni
00:19:24dan gaya visualnya terlihat konsisten di setiap adegan.
00:19:28Dan itu pertanda yang sangat bagus.
00:19:29Jika video terasa agak datar, itu sepenuhnya wajar.
00:19:34Saat ini kita baru membuat adegannya, kita belum sepenuhnya
00:19:38menyusun video atau memoles transisinya.
00:19:42Jadi dari sini, kita akan kembali ke kode Claude
00:19:45dan menyampaikan masalah yang kita amati dan memberi tahu Claude apa yang ingin kita tingkatkan.
00:19:50Seperti parameter tepat tentang bagaimana menurut kita adegan-adegan tersebut harus bergerak.
00:19:56Dan masalah tepat yang kita gunakan di sini tidaklah begitu penting.
00:19:58Hasil Anda mungkin terlihat berbeda dari setiap bagian, seperti hasil Anda dibandingkan hasil saya.
00:20:04Masalah tepat yang kita gunakan di sini tidaklah begitu penting.
00:20:07Hasil Anda mungkin terlihat berbeda dari setiap bagian dibandingkan milik saya.
00:20:10Dan itu juga hal yang baik karena di sinilah Anda mulai
00:20:14mengembangkan keterampilan memoles dan men-debug pekerjaan Anda sendiri.
00:20:17Anda tidak lagi sekadar mengikuti prompt.
00:20:20Anda membuat keputusan akhir.
00:20:22Dan setelah itu selesai, kita periksa videonya lagi.
00:20:25Dan begitu saja, semuanya terasa lebih mantap.
00:20:28Gerakannya lebih bersih, transisinya lebih baik,
00:20:31dan videonya akhirnya mulai terasa disengaja, bukan sekadar mekanis.
00:20:35Baiklah, tapi kita tidak berhenti di sini.
00:20:37Oke, lapisan terakhir adalah pengisi suara dan musik latar.
00:20:41Jadi untuk ini, kita akan menggunakan SDK ElevenLabs.
00:20:44Kita lakukan bagian ini dengan cepat.
00:20:46Jadi langsung saja buka dokumentasi ElevenLabs.
00:20:49Ambil perintah yang sesuai untuk pengaturan Anda.
00:20:52Dan karena kita menggunakan Node.js, kita akan menggunakan yang itu.
00:20:56Lalu minta saja Claude untuk menjalankan perintahnya dan menyiapkan integrasi ElevenLabs untuk voiceover dan musik.
00:21:03Claude akan membuatkan file ENV untuk Anda di mana Anda bisa menempelkan kunci API ElevenLabs Anda.
00:21:09Setelah itu, Anda bisa meminta Claude untuk membuatkan naskah pengisi suara
00:21:13yang sesuai dengan video yang telah Anda bangun.
00:21:16Dan setelah semuanya tersambung dan selesai, mari kita lihat hasilnya lagi.
00:21:20Mars, sang planet merah, dunia yang telah memikat umat manusia selama berabad-abad.
00:21:27Ia adalah planet keempat dari matahari, berada tepat setelah Bumi di tata surya kita.
00:21:31Pada titik terdekatnya, Mars berjarak 225 juta kilometer dari Bumi.
00:21:37Itu adalah perjalanan tujuh bulan dengan pesawat luar angkasa.
00:21:41Siapkan kesabaran Anda.
00:21:42Mars berukuran sekitar setengah dari Bumi, dunia yang lebih kecil namun tidak kalah menawan.
00:21:48Satu hari di Mars hampir sama dengan di Bumi, yaitu 24 jam dan 37 menit.
00:21:54Tapi setahun? Itu memakan waktu 687 hari Bumi, hampir dua tahun kita.
00:22:01Atmosfernya sangat tipis, hanya 1% dari atmosfer Bumi.
00:22:05Anda pasti butuh baju luar angkasa.
00:22:07Kenapa begitu merah?
00:22:09Zat besi oksida, atau karat, menutupi permukaannya, memberikan warna khas pada Mars.
00:22:15Mars adalah rumah bagi Olympus Mons, gunung berapi terbesar di tata surya,
00:22:19tiga kali lebih tinggi dari Everest.
00:22:21Dan ada air, membeku di kutub dan kemungkinan tersembunyi di bawah tanah,
00:22:27kunci bagi eksplorasi di masa depan.
00:22:29Kita telah mengirim lima rover untuk menjelajah: Sojourner, Spirit, Opportunity, Curiosity, dan Perseverance.
00:22:37Suatu hari nanti, manusia akan menjejakkan kaki di Mars,
00:22:40akan membangun habitat, menancapkan bendera, dan menyebutnya sebagai rumah kedua kita.
00:22:45Mars menanti!
00:22:46Nah, seperti inilah tampilan video penjelasan Mars kita.
00:22:51Video penjelasan yang sepenuhnya terbangun, terpoles, bersih, dan profesional.
00:22:56Dibangun dari sebuah sistem, bukan tebak-tebakan.
00:22:59Dan penceritaannya terasa menyenangkan, visualnya terlihat hebat dan setiap transisinya—
00:23:05Dan penceritaannya terasa menyenangkan, visualnya terlihat hebat, dan setiap transisi berjalan dengan sangat mulus.
00:23:12Baiklah, mari kita tinjau sejenak apa yang baru saja kita lakukan.
00:23:16Kita berawal dari folder kosong menjadi video profesional yang sepenuhnya dirender.
00:23:22Tanpa After Effects, tanpa timeline, tanpa keyframe.
00:23:26Kita menggunakan Claude code, Remotion, dan keahlian agen sebagai satu sistem tunggal.
00:23:32Dan kita mengarahkan hasilnya alih-alih membangun setiap bagian secara manual.
00:23:38Itu adalah aset nyata yang bisa Anda unggah, kirim, dan masukkan ke dalam alur kerja Anda hari ini.
00:23:44Dan itulah poin pentingnya di sini.
00:23:47Kekuatannya bukan hanya karena AI lebih cepat, tapi karena alat-alat ini bekerja bersama.
00:23:52Jadi ketika Claude code dapat memahami Remotion dan keahlian menyuntikkan pengetahuan yang tepat di waktu yang tepat,
00:23:59Anda tidak lagi bekerja seperti kreator solo, Anda bekerja seperti tim kecil.
00:24:05Dan itulah pergeseran dari sekadar menggunakan AI menjadi benar-benar membangun dengan AI.
00:24:09Jadi mulai sekarang, Anda bukan hanya membuat video, Anda sedang membangun sistem visual.
00:24:14Anda bisa mengubah suasana, menukar data, membuat versi baru, dan meluncurkannya tanpa menunggu orang lain.
00:24:21Dan ini tidak menggantikan kreativitas, justru memperkuatnya.
00:24:26Dan setelah Anda memiliki alur kerja ini, Anda bisa menerapkannya pada demo produk,
00:24:30klip media sosial, pekerjaan klien, atau apa pun yang ingin Anda luncurkan.
00:24:34Jadi jika Anda ingin mendalaminya lebih jauh, itulah yang kita lakukan di dalam komunitas premium AnyNoCode.
00:24:40Kami membedah alur kerja dunia nyata seperti ini, menunjukkan cara menghasilkan uang dengan AI,
00:24:46dan Anda akan belajar bersama para pendiri dan pembangun profesional.
00:24:50Plus, Anda bisa mendapatkan kursus desain situs web AI kami di sana untuk membantu Anda mengimplementasikannya lebih cepat.
00:24:54Jadi jika Anda menyukai video ini, silakan tekan tombol like dan subscribe
00:24:58untuk tutorial lainnya seperti ini di masa mendatang.
00:25:01Sampai jumpa di video berikutnya.

Key Takeaway

Video ini mendemonstrasikan bagaimana menggabungkan kecerdasan Claude Code dengan framework Remotion untuk menciptakan alur kerja produksi video berbasis kode yang otomatis, profesional, dan sistematis.

Highlights

Penggunaan Claude Code dan Remotion Agent untuk membuat video motion graphics profesional tanpa editing manual atau After Effects.

Penerapan sistem sembilan fase pengembangan yang terstruktur untuk memastikan hasil video yang konsisten dan terprediksi.

Pentingnya membangun 'art direction' dan 'storyboard' tekstual sebagai fondasi sebelum menulis kode animasi yang sebenarnya.

Metode pemisahan aset (asset inventory) dan primitif gerakan (motion primitives) untuk menghindari kegagalan logika dalam AI.

Integrasi suara latar (voiceover) dan musik menggunakan SDK ElevenLabs yang dikelola langsung melalui terminal Claude.

Transisi peran dari kreator solo menjadi pengarah sistem (system director) dengan bantuan kolaborasi AI.

Kemampuan untuk melakukan iterasi, debugging, dan pemolesan video secara cepat hanya melalui perintah prompt.

Timeline

Pengenalan Konsep Motion Graphics Berbasis AI

Video dimulai dengan menampilkan hasil akhir video penjelasan tentang planet Mars yang dibuat tanpa menyentuh keyframe manual. Narator menjelaskan peran Claude yang menggunakan skill Remotion Agent baru untuk membangun dan merender video berdasarkan perintah prompt saja. Dijelaskan bahwa Remotion adalah framework video-as-code berbasis React yang biasanya sangat kompleks bagi pemula, namun kini dapat diakses melalui bantuan AI. Skill Claude bertindak sebagai paket pengetahuan khusus yang mengubah asisten umum menjadi ahli produksi video yang memahami struktur komposisi dan pengaturan waktu. Bagian ini menekankan bahwa penonton akan belajar cara mengarahkan desain grafis profesional hanya dengan memberikan instruksi yang tepat.

Persiapan Lingkungan dan Instalasi Skill

Langkah pertama dalam proses teknis ini adalah menginstal skill Claude Remotion melalui perintah terminal yang tersedia di situs web Remotion. Pengguna diminta untuk memilih model AI yang sesuai dan membiarkan Claude menyiapkan templat proyek dasar serta meluncurkan Remotion Studio. Antarmuka Remotion digambarkan mirip dengan aplikasi edit video konvensional, namun dengan perbedaan utama bahwa setiap adegan diprogram melalui kode. Narator kemudian memperkenalkan rencana pengembangan yang terdiri dari sembilan fase sistematis, mulai dari pembangunan fondasi hingga eksekusi akhir. Fase-fase ini dirancang untuk memastikan Claude bekerja dalam koridor aturan yang jelas agar proyek tidak gagal di tengah jalan.

Fase 1-3: Membangun Fondasi, Arahan Seni, dan Cerita

Fase awal ini berfokus pada pembangunan sistem tempat AI akan beroperasi dengan memberikan instruksi konkret melalui file markdown. Fase 1 menetapkan aturan teknis agar Claude tidak bekerja semaunya, sementara Fase 2 menentukan bahasa visual dan arahan seni seperti suasana dan batasan desain. Narator menjelaskan bahwa memberikan definisi yang jelas tentang konsep seperti "modern" atau "bersih" sangat penting untuk mencegah halusinasi AI. Fase 3 melibatkan pembuatan storyboard dalam bentuk teks yang menentukan urutan adegan, alur cerita, dan durasi setiap momen di layar. Langkah-langkah ini memastikan bahwa keputusan kreatif tersulit sudah disepakati sebelum proses animasi yang sebenarnya dimulai.

Fase 4-6: Manajemen Aset dan Primitif Gerakan

Pada tahap ini, fokus beralih ke pembuatan inventaris aset dan penentuan parameter desain untuk setiap objek yang diperlukan dalam video. Fase 4 memisahkan keputusan desain dari logika adegan untuk menjaga konsistensi visual di seluruh durasi video. Di Fase 5, aset-aset nyata dihasilkan oleh Claude, di mana untuk proyek besar disarankan menggunakan metode 'batching' atau pembuatan bertahap per kategori. Fase 6 memperkenalkan konsep 'motion primitives', yaitu blok bangunan gerakan dasar yang dapat digunakan kembali di berbagai bagian video tanpa perlu mendeskripsikan setiap keyframe. Dengan menetapkan aturan gerakan secara sistemis, Claude dapat mengusulkan pola animasi yang masuk akal dan selaras dengan prinsip visual yang telah ditentukan sebelumnya.

Fase 7-9: Eksekusi Adegan dan Pemolesan Final

Fase-fase akhir ini melibatkan penyatuan seluruh komponen menjadi adegan video yang utuh dan fungsional. Claude mulai mengeksekusi kode untuk setiap adegan secara individual berdasarkan arahan seni, storyboard, dan aset yang telah siap. Narator menyarankan pembuatan adegan satu per satu untuk mempermudah proses debugging dan melakukan perubahan terarah tanpa merusak struktur video secara keseluruhan. Setelah adegan dihasilkan, pengguna dapat meninjau hasilnya melalui Remotion Studio dan memberikan instruksi tambahan kepada Claude untuk memoles transisi atau gerakan yang dirasa kurang pas. Proses ini mengubah pengguna dari seorang eksekutor menjadi pengambil keputusan akhir yang memastikan hasil video terasa disengaja dan tidak mekanis.

Integrasi Audio dan Kesimpulan Alur Kerja

Lapisan terakhir dari produksi video ini adalah penambahan pengisi suara dan musik latar menggunakan integrasi SDK ElevenLabs melalui Node.js. Claude membantu mengonfigurasi file lingkungan (ENV), memasukkan kunci API, serta menghasilkan naskah pengisi suara yang sesuai dengan durasi visual. Hasil akhirnya adalah video penjelasan Mars yang profesional dengan transisi mulus dan narasi yang menarik, semuanya dibangun tanpa After Effects. Narator menyimpulkan bahwa kekuatan metode ini terletak pada kolaborasi antar alat AI yang bekerja sebagai satu sistem terpadu untuk memperkuat kreativitas manusia. Video ditutup dengan ajakan untuk bergabung dalam komunitas premium AnyNoCode guna mempelajari lebih lanjut tentang alur kerja AI dalam dunia nyata.

Community Posts

No posts yet. Be the first to write about this video!

Write about this video