Kanal24, Malang – Upaya mendekatkan seni tradisi kepada generasi muda terus berkembang melalui pemanfaatan teknologi digital. Salah satunya dilakukan mahasiswa Fakultas Vokasi Universitas Brawijaya (UB), Haikal Muhammad Ar-rabani, yang mengembangkan website wayang kulit digital interaktif dengan sistem kendali gerakan tangan.
Mahasiswa semester pertama Program Studi Sarjana Terapan (DIV) Teknologi Rekayasa Perangkat Lunak (TRPL) tersebut menciptakan inovasi bernama Wayang Vokasi UB. Karya ini memungkinkan pengguna memainkan tokoh wayang melalui gerakan tangan dan jari yang ditangkap kamera web (webcam), tanpa memerlukan perangkat sensor tambahan yang dipasang pada tubuh.
Pengembangan Wayang Vokasi UB dilakukan di bawah bimbingan dosen Rachmad Andri Atmoko, S.ST., M.T. Inovasi tersebut turut diperkenalkan kepada publik dalam ajang DIPA MediaArt Festival 2026 di Gazebo Raden Wijaya Universitas Brawijaya, Malang, Selasa (27/10/2026).
Baca juga:
UB Gandeng 52 Mitra Perluas Akses Beasiswa Mahasiswa
Kehadiran karya ini menjadi salah satu bentuk penerapan teknologi informasi untuk menghadirkan pengalaman baru dalam mengenal seni pertunjukan tradisional. Wayang kulit yang selama ini identik dengan pertunjukan panggung dan keterampilan khusus seorang dalang, dikembangkan menjadi media digital yang dapat dicoba secara langsung oleh pengunjung.
Dalam pertunjukan wayang konvensional, seseorang membutuhkan perangkat panggung khusus serta keterampilan memainkan tokoh wayang yang diperoleh melalui proses latihan panjang. Sementara melalui Wayang Vokasi UB, pengguna cukup berdiri di depan kamera dan menggerakkan tangan untuk mengendalikan tokoh wayang yang tampil di layar monitor.
Masing-masing tangan pengguna berfungsi mengendalikan satu tokoh wayang. Dengan demikian, dua tokoh yang ditampilkan dapat bergerak mengikuti posisi dan gerakan tangan secara langsung.
Menggabungkan MediaPipe dan WebSocket
Di balik pengalaman interaktif tersebut, Wayang Vokasi UB dibangun melalui sistem pengolahan citra yang dirancang berjalan pada perangkat komputer lokal atau mini PC. Aplikasi ditampilkan melalui peramban web (browser) pada alamat localhost dengan mode layar penuh.
Sistem bekerja dengan memanfaatkan kamera untuk menangkap posisi tangan pengguna. Selanjutnya, pustaka MediaPipe digunakan untuk mendeteksi titik-titik sendi atau landmark tangan secara waktu nyata (real-time).
Data koordinat hasil pendeteksian kemudian dikirimkan melalui protokol komunikasi WebSocket menuju antarmuka peramban. Data tersebut diterjemahkan menjadi pergerakan sendi dan lengan dua tokoh wayang yang ditampilkan di layar.
Secara visual, kedua tokoh wayang dirancang dengan ornamen berwarna emas, merah, dan biru serta ditempatkan saling berhadapan. Pengguna juga dapat memilih tampilan wayang berwarna maupun mode siluet bayangan, sehingga pengalaman visual yang disajikan tidak terbatas pada satu bentuk tampilan.
Pengembangan sistem ini sekaligus menghadirkan tantangan teknis bagi Haikal, terutama dalam menjaga kelancaran respons gerakan. Pada tahap awal, animasi wayang sempat mengalami gerakan patah-patah ketika proses pendeteksian tangan dan penampilan grafis dijalankan secara bersamaan di dalam peramban.
“Awalnya saya berfokus agar wayang bisa tampil di layar dan mengikuti gerak tangan pengguna. Namun setelah diuji pada beberapa perangkat, saya menyadari bahwa kelancaran respons gerakan sangat menentukan kenyamanan pengguna saat mencoba memainkan wayang tersebut,” ujar Haikal Muhammad Ar-rabani.
Untuk mengatasi kendala tersebut, Haikal kemudian memisahkan proses deteksi tangan dari proses penampilan grafis pada peramban. Kedua proses itu dihubungkan menggunakan jalur komunikasi WebSocket agar pengiriman data dapat berlangsung lebih stabil.
“Untuk mengatasi gerakan yang patah-patah akibat penumpukan beban pemrosesan di satu titik, saya memisahkan proses deteksi tangan dari tampilan peramban dan menghubungkan keduanya menggunakan jalur komunikasi WebSocket. Hasilnya, aliran data menjadi jauh lebih stabil dan pergerakan wayang lebih responsif,” jelasnya.
Perbaikan tersebut menjadi bagian penting dalam pengembangan aplikasi. Sebab, sistem kendali berbasis gerakan tangan tidak hanya dituntut mampu mengenali posisi pengguna, tetapi juga harus menerjemahkan gerakan tersebut menjadi respons visual yang nyaman dan mudah diikuti.
Haikal menyebut pengembangan Wayang Vokasi UB masih terus berlanjut. Salah satu aspek yang menjadi perhatian berikutnya adalah penyempurnaan algoritma pemetaan sendi agar gerakan lengan wayang dapat terlihat lebih luwes dan mendekati karakteristik gerakan wayang kulit asli.
“Ke depannya, saya juga terus menyempurnakan algoritma pemetaan sendi agar gerakan lengan wayang bisa lebih luwes mendekati gerakan wayang kulit asli,” tambahnya.
Pembelajaran Terapan Sejak Semester Pertama
Wayang Vokasi UB tidak hanya menjadi karya teknologi yang dipamerkan kepada publik, tetapi juga menunjukkan penerapan pembelajaran berbasis proyek di lingkungan Fakultas Vokasi UB.
Dalam proses pengembangannya, Haikal terlibat langsung mulai dari perancangan antarmuka visual, integrasi teknologi MediaPipe dan WebSocket, hingga pengujian performa unit demonstrasi saat dipamerkan. Rangkaian proses tersebut memberikan pengalaman bagi mahasiswa untuk mengintegrasikan berbagai komponen teknologi menjadi sebuah sistem yang dapat digunakan secara langsung.
Dosen pembimbing, Rachmad Andri Atmoko, S.ST., M.T., menjelaskan bahwa proyek tersebut dirancang sebagai sarana pembelajaran agar mahasiswa mampu menghadapi persoalan teknis secara nyata. Mahasiswa tidak hanya mempelajari konsep pemrograman di ruang kelas, tetapi juga ditantang merancang arsitektur sistem secara menyeluruh.
“Proyek ini menjadi sarana pembelajaran langsung bagi mahasiswa sejak semester pertama untuk tidak hanya memahami teori pemrograman di ruang kelas, tetapi juga merancang arsitektur sistem yang utuh,” ujar Rachmad.
Menurutnya, pengembangan Wayang Vokasi UB memberikan kesempatan kepada mahasiswa untuk mempraktikkan integrasi teknologi visi komputer (computer vision) dan komunikasi data secara waktu nyata. Mahasiswa juga belajar mengidentifikasi serta menyelesaikan kendala performa perangkat keras ketika sistem digunakan dalam situasi pameran.
“Mahasiswa belajar mengintegrasikan visi komputer (computer vision) dan komunikasi data real-time, sekaligus melatih kemandirian dalam memecahkan kendala performa perangkat keras secara langsung saat pameran,” lanjutnya.
Rachmad menilai perpaduan teknologi pengolahan citra dengan seni tradisi membuka ruang eksplorasi lintas disiplin bagi mahasiswa vokasi. Rekayasa perangkat lunak, menurutnya, dapat dikembangkan tidak hanya untuk kebutuhan industri atau layanan digital, tetapi juga untuk menghadirkan pendekatan baru dalam pelestarian budaya.
Berpotensi Menjadi Media Edukasi Interaktif
Partisipasi Wayang Vokasi UB dalam DIPA MediaArt Festival 2026 memperlihatkan bagaimana teknologi dapat digunakan untuk menghadirkan seni tradisional melalui pengalaman yang lebih interaktif. Pengunjung tidak hanya melihat karya yang ditampilkan, tetapi juga dapat berinteraksi langsung dengan objek digital melalui gerakan tubuh.
Pendekatan tersebut membuka peluang pemanfaatan wayang digital sebagai media pengenalan budaya yang lebih dekat dengan kebiasaan generasi muda dalam berinteraksi dengan teknologi. Pengalaman memainkan tokoh wayang melalui gerakan tangan juga dapat menjadi pintu masuk untuk mengenalkan karakter visual dan seni pertunjukan tradisional.
Meski demikian, pengembangan sistem masih memerlukan penyempurnaan, terutama pada kelenturan animasi serta penambahan variasi tokoh dan lakon. Aspek tersebut menjadi bagian dari rencana pengembangan agar aplikasi tidak hanya berfungsi sebagai demonstrasi teknologi, tetapi juga dapat dimanfaatkan dalam kegiatan edukasi.
Rachmad berharap Wayang Vokasi UB dapat terus dikembangkan sehingga nantinya bisa digunakan sebagai media pembelajaran interaktif di sekolah maupun dalam berbagai pameran teknologi.
“Harapannya, sistem Wayang Vokasi UB ini dapat terus disempurnakan, baik dari sisi kelenturan animasi maupun penambahan variasi tokoh dan lakon, sehingga siap dimanfaatkan sebagai media edukasi interaktif di sekolah-sekolah maupun pameran teknologi,” ungkapnya.
Pengembangan Wayang Vokasi UB menjadi gambaran penerapan keahlian rekayasa perangkat lunak untuk menjawab kebutuhan yang lebih luas, termasuk mendukung pengenalan dan pelestarian budaya. Melalui proyek yang dikerjakan sejak semester pertama ini, mahasiswa Fakultas Vokasi UB memperoleh pengalaman mengembangkan teknologi sekaligus mengeksplorasi keterkaitannya dengan seni tradisi.
Inovasi tersebut juga menunjukkan bahwa pengembangan teknologi digital dapat berjalan beriringan dengan upaya memperkenalkan warisan budaya kepada masyarakat. Wayang tidak hanya hadir sebagai objek pertunjukan, tetapi juga dapat dikembangkan menjadi pengalaman interaktif yang memungkinkan generasi muda mengenalnya melalui cara yang berbeda. (nid)
