00:00:00Rekayasa selalu menjadi proses yang sangat kolaboratif karena skala pekerjaan dan berbagai peran yang terlibat di dalamnya.
00:00:05Hal ini telah berubah karena AI, namun di saat yang sama, ia membawa cara-cara kolaborasi baru.
00:00:09Model yang berbeda memiliki kekuatan yang berbeda pula, baik dalam perannya maupun biayanya.
00:00:13Mari kita ambil satu contoh.
00:00:14Sudah menjadi fakta umum bahwa model Gemini terbaru sangat hebat dalam hal desain.
00:00:18Mereka jauh lebih kreatif daripada model Claude mana pun, terutama jika Anda memberi mereka lebih sedikit instruksi.
00:00:23Namun secara keseluruhan, Opus 4.6 adalah model yang luar biasa,
00:00:26terutama dengan Claude code sebagai alat pendukungnya, yang merupakan alat yang jauh lebih stabil daripada Gemini CLI.
00:00:31Namun tidak ada cara efisien untuk menggunakan keduanya secara bersamaan dalam alur kerja bersama.
00:00:35Bahkan jika Anda mencoba menggunakannya, Anda harus melakukan banyak pekerjaan manual,
00:00:38dan tidak ada cara untuk membuat agen-agen ini bekerja secara otonom.
00:00:41Baru-baru ini, kami menemukan alat yang memecahkan masalah komunikasi ini dengan membiarkan berbagai
00:00:46agen dengan model berbeda di dalamnya mengobrol satu sama lain dan membebaskan kita dari peran perantara.
00:00:50Agent Chatter adalah antarmuka obrolan untuk koordinasi real-time agen-agen AI.
00:00:55Alat ini mendukung tiga agen paling populer seperti Claude code, Gemini CLI, dan Codex,
00:01:00serta model sumber terbuka seperti Kimi, Qwen, dan banyak lagi.
00:01:03Anda juga dapat menggunakannya untuk menghemat biaya dengan membiarkan agen mahal seperti Claude melakukan perencanaan
00:01:07dan membiarkan Kimi atau GLM melakukan implementasinya.
00:01:10Ini menggunakan obrolan bersama dengan banyak saluran dan membiarkan para agen berbicara satu sama lain
00:01:14serta mengimplementasikan fitur-fitur dalam koordinasi.
00:01:16Kesan awal kami terhadap alat ini adalah antarmuka pengguna bawaannya kurang rapi.
00:01:20Namun karena ini adalah proyek sumber terbuka, kami melakukan fork pada repositori aslinya dan membuat
00:01:24lapisan visual di atasnya, yang bagi kami terlihat jauh lebih baik dan lebih mudah dinavigasi
00:01:28dengan beberapa perubahan yang sesuai dengan kebutuhan kami.
00:01:31Kami mengunggah versi ini ke repositori fork kami sambil tetap menjaga fungsi aslinya tetap utuh.
00:01:35Namun semua kredit untuk arsitektur dasar platform ini tetap menjadi milik pencipta aslinya.
00:01:40Nah, proyek ini sebenarnya berisi sekumpulan skrip
00:01:43yang perlu Anda jalankan sekali untuk menginisialisasi agen-agen pada alat ini.
00:01:46Skrip-skrip ini adalah titik masuk untuk menjalankan sistem,
00:01:49dan tanpa skrip tersebut, Anda tidak dapat menjalankan agen apa pun.
00:01:51Untuk mengakses skrip ini, Anda perlu mengkloning seluruh repositori.
00:01:54Repositori tersebut berisi skrip untuk menginisialisasi semua agen secara terpisah.
00:01:58Namun sebelum menggunakan skrip tersebut, jika Anda menggunakan Mac OS atau Linux, Anda harus menginstal TMUX.
00:02:02TMUX pada dasarnya adalah terminal multiplexer.
00:02:05Ini memungkinkan Anda membuat beberapa sesi terminal dan mengendalikan semuanya dari satu titik.
00:02:09Inilah yang digunakan obrolan agen di baliknya,
00:02:11untuk mengirimkan tugas ke setiap agen terminal yang sedang dijalankannya.
00:02:14Bagi pengguna Windows, Anda dapat menjalankan skripnya secara langsung dan itu akan berhasil.
00:02:18Mereka telah mencantumkan semua perintah untuk menjalankan skrip masing-masing agen.
00:02:21Jadi sebagai contoh, jika Anda akan menggunakan Claude code dan Gemini CLI secara bersamaan,
00:02:26Anda cukup menyalin perintahnya dan menempelkannya ke terminal di folder tempat Anda mengkloning repositori.
00:02:31Anda dapat memilih perintah untuk agen mana pun yang ingin Anda jalankan.
00:02:34Setelah Anda menempelkan perintah, sesi agen akan muncul dalam sesi TMUX.
00:02:38Anda dapat menggunakan agen sebanyak yang Anda suka dalam pengaturan Anda.
00:02:40Misalnya, Anda bisa mengatur empat agen: tiga sesi Claude dan satu sesi Gemini.
00:02:44Namun berapa pun jumlah agen yang Anda gunakan, masing-masing harus dijalankan di terminal khusus.
00:02:49Jadi jika Anda menjalankan empat sesi, Anda memerlukan empat terminal yang berjalan berdampingan,
00:02:53dan Anda akan dapat mengendalikan semuanya dari satu sesi obrolan di alat tersebut.
00:02:56Sekarang, setelah semuanya terinstal, saat Anda menavigasi ke localhost,
00:03:00Anda seharusnya melihat semua agen yang Anda jalankan ditampilkan di panel obrolan.
00:03:03Nah, agar bisa memaksimalkan penggunaan alat ini,
00:03:06ada langkah-laki tertentu yang perlu Anda ambil untuk membantu Anda bekerja lebih efisien.
00:03:09Disarankan untuk menginisialisasi kerangka kerja (framework) yang Anda gunakan sebelum menggunakan alat ini,
00:03:14karena ini adalah titik yang sering menyebabkan konflik antar agen meskipun mereka diberi peran berbeda.
00:03:20Jadi pastikan aplikasi Next.js Anda atau kerangka kerja apa pun yang Anda gunakan sudah diinisialisasi sebelum memulai.
00:03:25Pertama, karena masing-masing agen sebenarnya berjalan sebagai sesi Claude atau Gemini yang terpisah,
00:03:29Anda harus menyetujui izin secara manual untuk masing-masing agen secara individu.
00:03:33Meskipun mereka menyediakan skrip untuk dijalankan dalam mode lewati izin (skip permissions),
00:03:36itu tidak disarankan karena dengan banyak agen, risiko agen menghapus pekerjaan agen lain jauh lebih tinggi.
00:03:42Jadi Anda harus mengatur settings.json untuk Claude code dan Gemini CLI dengan izin yang sesuai.
00:03:48Dengan cara ini, jika pengeditan file atau perintah build perlu dijalankan, ia tidak akan menunggu persetujuan manual Anda,
00:03:53dan di saat yang sama, Anda tetap memiliki kendali atas perintah-perintah yang berbahaya.
00:03:56Hal penting lainnya adalah memastikan bahwa alat MCP dikonfigurasi di dalam file tersebut juga,
00:04:01atau jika tidak, Anda juga harus menyetujui mereka secara manual.
00:04:03Anda juga harus membuat file agents.md.
00:04:05Saat ini file tersebut berfungsi sebagai templat yang berisi struktur optimal untuk penggunaan agen,
00:04:09yang nantinya akan diisi oleh mereka.
00:04:11Ini mencakup aturan peran, perilaku, dan semua prinsip yang perlu diikuti oleh agen.
00:04:15Anda juga memerlukan file perencanaan seperti PRD, templat spesifikasi back-end dan UI,
00:04:20yang saat ini kami gunakan sebagai templat dan akan diisi kemudian oleh agen perencanaan.
00:04:24Tujuan penggunaan templat ini adalah untuk memberikan struktur agar agen tidak menambahkan konten yang tidak perlu.
00:04:30Semua templat ini tersedia di AI Labs Pro, di mana Anda dapat mengunduh dan menggunakannya sendiri.
00:04:35Jika Anda merasa apa yang kami lakukan bermanfaat dan ingin mendukung kanal ini,
00:04:38AI Labs Pro adalah cara terbaik untuk melakukannya.
00:04:40Tautannya akan ada di deskripsi.
00:04:42Hal lain yang dimungkinkan oleh alat ini adalah memberi nama pada setiap agen dan menetapkan peran spesifik.
00:04:47Ini mempermudah identifikasi agen dan membuatnya bekerja sesuai dengan peran yang dirancang khusus untuknya.
00:04:52Misalnya, jika Anda menggunakan Gemini untuk desain UI,
00:04:55Anda dapat mengubah namanya dan menetapkan peran kustom sebagai ahli UI/UX.
00:04:59Anda menetapkan nama dan peran untuk setiap agen agar mereka beroperasi sesuai dengan persona yang ditetapkan.
00:05:04Dan terakhir, Anda perlu menetapkan aturan tertentu agar agen mengikuti tugas dengan benar.
00:05:09Seperti yang disebutkan sebelumnya, Anda harus menggunakan agents.md.
00:05:12Namun Claude menggunakan Claude.md dan Gemini menggunakan Gemini.md,
00:05:16dan masing-masing tidak menggunakan file instruksi utama milik yang lain.
00:05:19Jadi untuk mengoordinasikannya, Anda gunakan agents.md dan tambahkan aturan agar keduanya merujuk ke file tersebut sebagai panduan utama.
00:05:25Anda dapat mengatur beberapa aturan sesuai kebutuhan dan menambahkan sebanyak yang Anda mau.
00:05:29Namun saat Anda membuat aturan, aturan tersebut awalnya berada di draf,
00:05:31dan Anda harus memindahkannya secara manual ke aktif agar agen dapat mengenalinya.
00:05:35Aturan diperbarui setiap 10 pemicu obrolan, yang dapat Anda sesuaikan dengan kebutuhan Anda.
00:05:39Hal lain yang perlu diperhatikan adalah loop guard, yang secara bawaan diatur ke angka 4.
00:05:43Loop guard adalah jumlah maksimum lompatan antar-agen
00:05:46sebelum agen menghentikan tugas mereka dan menunggu input.
00:05:49Ini ditambahkan untuk mencegah agen terjebak dalam putaran tanya-jawab yang terlalu lama.
00:05:53Setelah batas loop guard tercapai, agen akan berhenti berkomunikasi
00:05:56dan Anda harus mengirimkan perintah lanjutkan (continue) untuk memulai kembali.
00:05:59Anda sebaiknya meningkatkannya jika ingin agen berkoordinasi lebih baik dalam waktu yang lebih lama.
00:06:03Namun sebelum kita merencanakan implementasinya, mari dengarkan pesan dari sponsor kami, Airtop.
00:06:06Jika Anda menghabiskan berjam-jam setiap minggu untuk mengikis data secara manual
00:06:10atau mengeklik puluhan tab peramban, ada cara yang jauh lebih baik untuk menanganinya.
00:06:13Airtop adalah platform berbasis awan yang memungkinkan agen AI berinteraksi dengan web layaknya manusia
00:06:19menggunakan templat khusus atau yang sudah jadi untuk menyelesaikan tugas manual yang paling membosankan.
00:06:23Bayangkan ini sebagai peramban awan yang menangani semua pekerjaan kasar untuk Anda.
00:06:27Misalnya, saya menggunakan templat untuk meneliti harga kompetitor.
00:06:30Saya cukup memberikan instruksi kepada agen dalam bahasa Inggris biasa, tanpa perlu kode,
00:06:33dan ia akan menavigasi situs, menangani login, dan mengekstrak apa yang saya butuhkan ke dalam format yang rapi.
00:06:39Bagian favorit saya adalah ia mampu melewati langkah anti-bot yang menyebalkan dan
00:06:43CAPTCHA yang biasanya merusak otomatisasi tradisional,
00:06:46menjadikannya sangat andal untuk pekerjaan bervolume tinggi.
00:06:48Bangun otomatisasi yang andal dalam hitungan menit dan daftar ke Airtop secara gratis sekarang juga.
00:06:53Klik tautan di komentar yang disematkan dan mulailah membangun hari ini.
00:06:56Kini setelah semua langkah selesai, saatnya bergerak menuju implementasi.
00:07:00Karena kami selalu menekankan pentingnya perencanaan sebelum implementasi,
00:07:03Anda harus memulainya dengan perencanaan di sini juga.
00:07:05Mirip dengan cara kerja saluran Slack, Anda juga dapat membuat saluran yang berbeda di sini.
00:07:09Anda mungkin ingin menyiapkan saluran terpisah untuk front-end dan back-end.
00:07:12Setelah Anda memberikan ide aplikasi, alat ini akan mengirimkan permintaan ke sesi Tmux
00:07:16dan mendesaknya untuk memeriksa pesan karena telah disebutkan.
00:07:18Agen perencana membuat seluruh rencana, memberi tahu Anda, dan meminta Anda untuk menyetujui atau menambahkan perubahan.
00:07:23Ia mendokumentasikan rencana tersebut dalam PRD tepat di atas templat yang Anda tambahkan di awal.
00:07:28Anda dapat membuat perubahan sesuka Anda, dan ia akan memperbarui PRD dengan perubahan tersebut.
00:07:32Alat ini menggunakan MCP untuk membiarkan Claude mengirimkan respons dan membaca obrolan dari antarmuka obrolan,
00:07:37memungkinkan komunikasi dua arah terjadi.
00:07:39Setelah rencana dikonfirmasi, Anda memintanya untuk melanjutkan.
00:07:41Dan setelah PRD disetujui, ia akan memberi tahu Gemini secara otomatis
00:07:44dan memintanya untuk mengimplementasikan dokumen spesifikasi UI.
00:07:47Kemudian desainer UI dan agen perencana mulai berkoordinasi satu sama lain
00:07:51mengenai detail implementasi, dengan perencana menyarankan detail
00:07:54dan desainer UI memasukkannya ke dalam rencana, lalu tinjauan berlanjut bolak-balik.
00:07:59Satu hal yang perlu dicatat, meskipun kami telah mengatur loop guard ke 8,
00:08:02entah mengapa itu tidak terdaftar.
00:08:04Jadi kami mencapai batas maksimum loop hanya setelah 4 iterasi dan diminta untuk melanjutkan percakapan.
00:08:08Sekarang pembangun (builder) diberitahu bahwa rencana sudah siap diimplementasikan oleh desainer UI,
00:08:13dan pembangun mengonfirmasi bahwa ia telah menerima rencana tersebut dan menunggu persetujuan untuk melanjutkan.
00:08:18Agen desainer juga memberi tahu Anda bahwa ia ingin melanjutkan implementasi UI,
00:08:22yang sebaiknya Anda tahan sampai Anda meninjau sendiri rencana-rencana tersebut.
00:08:25Di saluran backend, Anda dapat meminta agen pembangun dan perencana untuk memeriksa backend.md,
00:08:30yang dibuat oleh perencana saat sedang mengimplementasikan PRD.
00:08:33Anda menggunakan mereka untuk berkoordinasi satu sama lain guna memvalidasi dokumen,
00:08:37namun masing-masing dari mereka mungkin mengidentifikasi celah dalam implementasi.
00:08:40Jadi mereka semua berkoordinasi satu sama lain dan melibatkan desainer UI untuk menangani spesifikasi UI,
00:08:44membuat mereka bekerja sama untuk memperbaiki masalah tersebut.
00:08:47Anda kemudian dapat meminta perencana untuk melakukan satu tinjauan lagi setelah mereka mengimplementasikan semuanya.
00:08:50Dalam kasus kami, mereka menemukan beberapa masalah tambahan selama tinjauan akhir.
00:08:54Setelah mengatasi hal tersebut, semua agen mengonfirmasi bahwa
00:08:56masalah telah teratasi dan aplikasi siap untuk dibangun.
00:08:59Namun Anda jangan langsung membangunnya. Ada satu langkah lagi yang harus Anda ambil.
00:09:02Anda ingin mereka meninjau rencana tersebut satu sama lain.
00:09:04Alat ini memiliki beberapa mode untuk dicoba, dan Anda harus mencoba mode perencana (planner mode).
00:09:08Anda dapat mencoba berbagai mode untuk tinjauan desain, kritik kode, dan banyak lagi.
00:09:12Mode-mode ini bekerja dalam 3 fase dengan model berbeda yang memainkan peran berbeda.
00:09:16Anda menetapkan agen perencana sebagai presenter, yang memaparkan apa yang telah dilakukan sebelumnya,
00:09:20dan agen peninjau sebagai penantang, yang secara kritis menantang apa yang dikatakan presenter.
00:09:24Agen perencanaan adalah penyintesis, yang menggabungkan temuan dari masing-masing agen.
00:09:28Sesi dimulai saat presenter mempresentasikan, setelah itu penantang menganalisis secara kritis
00:09:32temuan tersebut dan menguji ketahanan dokumen, mengidentifikasi banyak celah.
00:09:36Karena para agen saling bertanya satu sama lain,
00:09:38mereka mampu mengidentifikasi dan memperbaiki banyak masalah yang mungkin terlewatkan jika tidak dilakukan.
00:09:42Setelah itu Anda mendapatkan rencana akhir, yang menandai akhir dari sesi 3 fase tersebut.
00:09:46Selain itu, jika Anda menikmati konten kami, pertimbangkan untuk menekan tombol hype,
00:09:50karena itu membantu kami membuat lebih banyak konten seperti ini dan menjangkau lebih banyak orang.
00:09:54Setelah tinjauan selesai, Anda meminta perencana untuk bertindak sebagai orkestrator dan berkoordinasi dengan
00:09:58semua agen lain untuk mengimplementasikan proyek, menggunakan model masing-masing untuk tugas mereka.
00:10:03Ia mengonfirmasi dan membuat desainer serta pembangun bekerja secara paralel.
00:10:06Ia mengirimkan pesan ke saluran backend dan frontend, memberikan lampu hijau kepada pembangun
00:10:10untuk mulai membangun dan membuka hambatan bagi insinyur frontend agar mereka dapat mengimplementasikan desain.
00:10:15Bekerja dengan alat ini sangat menarik karena Anda pada dasarnya hanya menyerahkan
00:10:18tugas kepada agen perencana dan hanya perlu menanyakan pembaruan kepadanya.
00:10:22Melihat para agen bekerja sama sangatlah menarik karena mereka saling mengoreksi saat terjadi kesalahan.
00:10:26Misalnya, dalam kasus kami, desainer UI secara tidak sengaja mencoba memperbaiki kesalahan
00:10:30yang seharusnya menjadi tanggung jawab pembangun.
00:10:32Baik agen perencana maupun pembangun menunjukkan bahwa ia tidak seharusnya melakukan perbaikan tersebut,
00:10:37karena itu menimpa (overwrite) file yang sedang dikerjakan oleh pembangun.
00:10:39Alur kerja ini akan jauh lebih mulus jika Anda memiliki agen yang bekerja di pohon kerja (work trees) khusus,
00:10:44dengan satu agen yang menggabungkan dan meninjau semuanya secara keseluruhan,
00:10:47karena hal itu akan menghilangkan masalah agen yang saling menimpa pekerjaan satu sama lain.
00:10:50Jadi itu adalah sesuatu yang perlu diingat untuk pengaturan yang lebih kompleks.
00:10:53Perencana kemudian memicu agen peninjau, yang mengidentifikasi masalah secara mendetail,
00:10:57memberikan laporan menyeluruh, dan menetapkan tugas kepada para agen.
00:11:01Karena kami telah menetapkan aturan bahwa jika ada agen yang membutuhkan sesuatu dari yang lain,
00:11:04ia harus langsung memintanya, desainer UI meminta akses ke variabel tertentu dari pembangun,
00:11:09dan pembangun memberikannya.
00:11:10Setelah tinjauan di pihak mereka selesai, perencana meminta Anda untuk melakukan tinjauan front-end akhir.
00:11:15Saat Anda menavigasi ke server pengembangan,
00:11:17Anda akan menemukan bahwa UI-nya sesuai dengan versi gamifikasi yang Anda inginkan.
00:11:20Halaman arahan memiliki kontras tinggi, memberikan nuansa seperti game,
00:11:23dan menggunakan kata-kata hype serta referensi yang membuatnya menarik untuk dicoba.
00:11:26Setelah tes mengetik, Anda menerima laporan performa.
00:11:29Hasilnya ditampilkan di dasbor, menunjukkan kecepatan terbaik sejauh ini,
00:11:33beserta level saat ini dan kemajuan, membuat pengalaman desain terasa imersif.
00:11:37Itu membawa kita ke akhir video ini. Jika Anda ingin mendukung kanal ini dan
00:11:40membantu kami terus membuat video seperti ini, Anda dapat melakukannya dengan menekan tombol super thanks di bawah.
00:11:45Seperti biasa, terima kasih telah menonton dan sampai jumpa di video berikutnya.