PENGEMBANGAN SISTEM DRAFT PICK ANIMATION OVERLAY UNTUK TURNAMEN MOBILE LEGENDS MENGGUNAKAN METODE AGILE DEVELOPMENT WEB APP (Studi Kasus: E-Sport Arena Community)

Turnamen e-sport, khususnya Mobile Legends: Bang Bang (MLBB), semakin populer di kalangan komunitas gaming di Indonesia. Salah satu fase krusial dalam pertandingan adalah draft pick, yang menentukan strategi tim melalui pemilihan dan pelarangan hero. Namun, pada turnamen tingkat komunitas, penyajian draft pick masih dilakukan secara manual dan statis sehingga kurang menarik dan sulit dipahami oleh penonton awam. Penelitian ini bertujuan untuk mengembangkan sistem Draft Pick Animation Overlay berbasis web yang mampu menyajikan proses draft pick secara animatif, interaktif, dan real-time, guna mendukung kualitas siaran turnamen. Penelitian ini menggunakan metode Extreme Programming (XP) sebagai pendekatan pengembangan perangkat lunak, dengan prinsip user-centered design yang melibatkan caster, observer, dan panitia turnamen dalam setiap iterasi pengembangan. Pengumpulan data dilakukan melalui observasi siaran terdahulu, wawancara semi-terstruktur, serta kuesioner evaluasi prototipe. Sistem dikembangkan menggunakan HTML, CSS, dan JavaScript, serta diuji secara internal menggunakan OBS Studio di Ampu Studio Universitas Amikom Purwokerto. Hasil pengujian menunjukkan bahwa sistem overlay mampu meningkatkan kejelasan strategi tim, memperkuat narasi caster, dan meningkatkan keterlibatan penonton. Kesimpulan dari penelitian ini menunjukkan bahwa sistem Draft Pick Animation Overlay yang dikembangkan berhasil memenuhi kebutuhan komunitas E-Sport Arena, serta berpotensi diterapkan pada turnamen lain di masa mendatang. Penelitian ini diharapkan dapat menjadi referensi dalam pengembangan teknologi siaran e-sport dan memperluas literatur di bidang rekayasa perangkat lunak berbasis hiburan digital.