VIRTUAL DRESSING ROOM BERBASIS AUGMENTED REALITY DENGAN MOTION DETECTION Koresya, Edo Raditya Hermanto, Harris Gunawan BINUS University, Kebon Jeruk Raya no. 27, Kemanggisan, Jakarta Barat, 021-5345830
ABSTRAK
Perkembangan bisnis pakaian sudah merambah luas baik penjualan melalui online maupun di dalam toko sehingga dibutuhkan aplikasi yang dapat mendukung bisnis tersebut. Virtual dressing room merupakan aplikasi berbasis augmented reality yang bertujuan untuk membantu pembeli dan penjual pakaian baik secara langsung maupun online. Motion detection merupakan metode yang dipakai dalam pengembangan aplikasi ini sehingga user dapat menggerakkan kursor dengan tangan secara virtual untuk memilih menu-menu yang ada. Motion detection yang diimplementasikan menggunakan Ostrich Library dan Adobe Flash, serta menggunakan hardware berupa webcam. Hasil penelitian merupakan aplikasi virtual dressing room yang menggunakan metode motion detection untuk menjalankan fiturnya. Dari evaluasi yang telah dilakukan, fitu-fitur dalam aplikasi ini dapat berjalan dengan baik dan membantu user dalam mencoba pakaian. Kata Kunci : Virtual Dressing Room, Augmented Reality, Motion Detection, Adobe Flash ABSTRACT The development of the apparel business has covered extensively both sales through online and in-store, so an application is needed to support the business. Virtual dressing room is an augmented reality-based application that aims to help buyers and sellers of clothing either in person or online. Motion detection is a method used in the development of this application so that the user can move the virtual cursor with hand to choose the existing menus. Motion detection is implemented using Ostrich Library and Adobe Flash, and uses the hardware in the form of webcam. The results are a virtual dressing room application that uses motion detection method for running features. Of evaluations that have been conducted, features in this application can run well and help users in trying on clothes. Keywords : Virtual Dressing Room, Augmented Reality, Motion Detection, Adobe Flash .
PENDAHULUAN Perkembangan bisnis pakaian sudah merambah luas baik penjualan melalui online maupun di dalam toko sehingga dibutuhkan aplikasi yang dapat mendukung bisnis tersebut. Virtual dressing room merupakan aplikasi berbasis augmented reality yang bertujuan untuk membantu pembeli dan penjual pakaian baik secara langsung maupun online. Terdapat 2 penelitian dengan topik yang sama, yaitu Virtual Dressing Room Using Kinect dan Virtual Fitting Room Using Marker on Android Based Mobile Device. Virtual Dressing Room Using Kinect adalah aplikasi yang menggunakan Kinect SDK yang digunakan juga dalam permainan dengan kinect platform dan untuk menampilkan model pakaian tidak perlu menggunakan marker (Isikdogan & Kara, 2012). Sedangkan Virtual Fitting Room Using Marker on Android Based Mobile Device adalah aplikasi yang menggunakan marker untuk menampilkan model
pakaian pada layar dan perangkat keras yang dipakai adalah camera dan mobile device Android (Martin & Oruklu, 2012). Dari kedua penelitian sebelumnya, penulis membuat aplikasi Virtual Dressing Room tanpa menggunakan Kinect dan marker untuk menampilkan model pakaian, dan ini menjadi nilai tambah bagi aplikasi ini. Masalah yang dianalisa adalah: Mencocokkan model pakaian yang ada ke tubuh user Menangkap gerakan yang user lakukan untuk melakukan interaksi dengan program Tujuan penelitian adalah untuk membuat aplikasi virtual dressing room yang dengan menggunakan Augmented Reality sebagai teknologi dasarnya untuk membantu pembeli dan penjual dari website atau toko yang menjual pakaian.
METODE PENELITIAN Metode penelitian yang dilakukan untuk membuat aplikasi Virtual Dressing Room ini adalah sebagai berikut: 1. Studi Pustaka Mencari bahan referensi yang berkaitan dengan Augmented Reality, Virtual Dressing Room, dan pengaplikasian motion detection pada Augmented Reality. 2. Pengumpulan Data Memberikan kuesioner kepada beberapa responden yang bersedia untuk ikut berpartisipasi. 3. Analisis Data Data yang telah didapat dari tahap pengumpulan data selanjutnya diproses dan dianalisis untuk kemudian dijadikan acuan untuk pembuatan aplikasi 4. Analisis Masalah Masalah yang dianalisa adalah: Mencocokkan model pakaian yang ada ke tubuh user Menangkap gerakan yang user lakukan untuk melakukan interaksi dengan program 5. Perancangan Program Perancangan program dibagi menjadi 2 (dua) bagian, yaitu: Perancangan Interface (antar muka) Perancangan Sistem Pengujian aplikasi dilakukan oleh penulis dan pengguna (12 orang). Hasil pengujian yang didapat adalah semua fitur-fitur dalam aplikasi ini sudah berjalan dengan baik, tampilan user-interface sudah nyaman dan dapat digunakan pada web maupun toko pakaian.
HASIL DAN BAHASAN Jawaban dari permasalahan pada penelitian ini yaitu dengan membuat aplikasi Virtual Dressing Room dimana akan membantu pembeli untuk mencoba pakaian secara virtual sehingga pembeli tidak perlu mengantri di ruang ganti pakaian ketika di toko pakaian dan dapat mencoba pakaian secara virtual sebelum membeli pakaian di toko online. Penjual juga akan secara otomatis mendapatkan keuntungan jika pembeli mendapatkan kepuasan dalam berbelanja di toko penjual tersebut. Algoritma yang digunakan untuk mendeteksi gerakan berdasarkan library Ostrich : a. Dua buah variabel bertipe BitmapData dibuat untuk menampung frame video yang sekarang (current / new) dan sebelumnya (previous / older). b.
Data piksel yang ada pada older akan dipindahkan ke newer. Setelah itu, piksel-piksel yang sekarang tertangkap kamera akan digambarkan ke older supaya jika algoritma ini diulang, maka aplikasi tetap akan memiliki gambar yang belum tersentuh oleh filter dan juga digambarkan ke newer dengan mengaplikasikan difference filter sehingga perbedaan antara kedua frame tersebut dapat terlihat.
Dengan menggunakan difference filter, piksel yang memiliki warna sama dengan pixel yang ada sebelumnya akan ditampilkan dengan warna hitam. Jika piksel tersebut memiliki perbedaan warna dengan piksel yang ada sebelumnya, maka akan ditampilkan dengan warna lain selain hitam. c.
Setelah itu, supaya lebih terfokus pada gerakan yang terjadi, setiap piksel pada newer akan diaplikasikan pada sebuah matriks filter yang digunakan untuk meningkatkan kontras. Perhitungan yang dilakukan saat matriks filter tersebut diaplikasikan pada sebuah piksel dengan ‘dest’ sebagai nilai baru dari color channel tiap piksel dan ‘src’ sebagai nilai awal dari color channel .
d.
Setelah diaplikasikan terhadap matriks filter, tiap piksel pada frame kemudian akan diaplikasikan kepada sebuah blurFilter untuk memperjelas dan memperhalus area gerakan.
e.
Dengan menggunakan threshold, warna lain selain hitam akan dirubah menjadi warna hijau untuk menandakan adanya gerakan pada bagian tersebut. Setelah itu, sebuah color bounds rectangle, bisa juga disebut motion rectangle akan ditempatkan disekitar bagian yang berwarna hijau.
Cara penempatan kursor di dalam motion rectangle diatur dengan mengikuti akan mengikuti ketentuan sebagai berikut: a. Posisi kursor pada koordinat Y akan berada 10 pixel dibawah sisi atas dari motion rectangle. b.
Jika motion rectangle berada pada sebelah kiri layar, maka posisi kursor pada koordinat X akan mengikuti posisi koordinat sisi kiri dari motion rectangle.
c.
Jika motion rectangle berada pada sebelah kanan layar, maka posisi kursor pada koordinat X akan mengikuti posisi koordinat sisi kanan dari segiempat.
d.
Jika motion rectangle berada di tengah layar, maka posisi koordinat X dari kursor akan ditempatkan di tengah koordinat X dari motion rectangle.
Virtual Dressing Room ini memiliki fitur-fitur antara lain : 1. Menu Inisialisasi Awal Menampilkan dua pilihan jenis kelamin yang berfungsi untuk membedakan gambar pakaian yang akan ditampilkan pada layar.
Gambar Tampilan Awal 2. Menu untuk memilih model pakaian
User dapat menggerakkan tangannya ke arah button “<” atau “>” untuk memilih model-model pakaian yang tersedia dalam aplikasi.
Gambar Menu Memilih Model Pakaian 3. Menu untuk menentukan posisi pakaian User dapat menggerakkan tangannya ke arah button “v” atau “^” untuk mengatur posisi pakaian ke atas (^) dan ke bawah (v).
Gambar Menu Menentukan Posisi Pakaian 4. Menu untuk menentukan ukuran pakaian User dapat menggerakkan tangannya ke arah button “+” atau “-” untuk mengatur ukuran pakaian menjadi lebih besar atau lebih kecil sesuai dengan tubuh user.
Gambar Menu Menentukan Ukuran Pakaian 5. Menu untuk memilih warna pakaian Menu ini terdapat pada Next Menu. User dapat menggerakkan tangannya ke arah button “v” atau “^” untuk memilih warna pakaian yang tersedia.
Gambar Menu Menentukan Warna Pakaian 6. Menu Menu ini terdapat pada Next Menu. User dapat menggerakkan tangannya ke arah button “CAP” untuk mengambil gambar user saat mengenakan pakaian secara virtual.
Gambar Menu Capture Berdasarkan 1. 2. 3. 4.
evaluasi pengguna yang didapat dari hasil kuisioner yang disebarkan kepada 15 responden adalah: Semua fitur-fitur dalam aplikasi virtual dressing room sudah dapat berjalan dengan baik User interface aplikasi ini sudah nyaman bagi pengguna Kurang baiknya pendeteksian gerakan apabila terdapat lebih dari 1(satu) gerakan Aplikasi berguna untuk membantu user dalam mengambil keputusan sebelum membeli
Berdasarkan evaluasi penulis, penulis melakukan uji coba terhadap semua fitur yang ada. Semua fitur yang dibuat telah berjalan dengan baik dan benar apabila gerakan yang ditangkap tidak lebih dari satu, sedangkan yang masih kurang optimal saat adanya gerakan lain selain user sendiri di dalam layar yang ditangkap.
SIMPULAN DAN SARAN Tujuan utama dari pembuatan aplikasi ini sudah tercapai yaitu membuat sebuah aplikasi virtual dressing room berbasis augmented reality yang dapat membantu pengguna untuk mencoba pakaian secara virtual. Berdasarkan hasil evaluasi yang didapat dari kuesioner dan evaluasi penulis didapatkan: 1. 2. 3. 4.
Fitur pemilihan pakaian, perubahan posisi pakaian, penggantian warna pakaian, dan pengambilan gambar pengguna yang dibuat di dalam aplikasi sudah berjalan dengan baik. Tampilan dari aplikasi nyaman dan mudah untuk digunakan. Sebagian besar user tidak mengalami kesulitan saat menggunakan aplikasi ini. Aplikasi dapat digunakan di dalam toko dan website penjualan pakaian.
Metode motion detection dalam aplikasi ini masih belum optimal, di mana jika terdapat 2 orang dalam menggunakan aplikasi ini, deteksi pergerakan dalam aplikasi ini belum bekerja dengan baik. Untuk pengembangan aplikasi ini lebih lanjut, penulis menyarankan metode detection dalam aplikasi ini lebih dioptimalkan, lalu dapat dihubungkan dengan database agar lebih mudah dalam melakukan update (menambahkan dan mengurangi) model dan warna pakaian.
REFERENSI About
Ostrich Flash – Webcam Motion http://ostrichflash.wordpress.com/about/
Capture.
Diakses
tanggal
20
November
2012
dari
Ajanki, A., Billinghurst, M. (2011). An Augmented Reality Interface to Contextual Information. London: SpringerVerlag.
Amstrong, T. (2002). Kinds Of Smart. Jakarta: PT Gramedia Pustaka Utama Bartle, R. A. (2004). Designing Virtual Worlds. USA: New Riders Publishing Carmigniani, J., et al. (2011). Augmented Reality Technologies, Systems and Applications. London: Springer. Cawood S., & Fiala M. (2008). Augmented Reality: A Practical Guide. Pragmatic Bookshelf Djaali, H. (2011). Psikologi Pendidikan. Jakarta: Bumi Aksara Fanani, A. Z. (2007). Bermain Logika ActionScript Macromedia Flash Pro 8. Jakarta: PT Elex Media Komputindo. Haller, M., et al. (2007). Emerging Technologies of Augmented Reality – Interfaces and Design. USA: Idea Group Publishing. Höhl, W. (2009). Interactive Environments with Open-Source Software. Vienna: Springer Hutter, Marcus (2012). One Decade of Universal Artificial Intelligence. Canberra: RSCS@ANU and SML@NICTA Işɪkdoğan, F. & Kara, G. (2012). A Real Time Virtual Dressing Room Application using Kinect. Kipper G., & Rampolla J. (2012). Augmented Reality: An Emerging Technologies Guide to AR. Elsevier, Inc. Krevelen, D. W. F. V. & Poelman, R. (2010). A Survey of Augmented Reality Technologies, Applications and Limitations. The Netherlands: Delfi University of Technology. Kusrini. (2006). Sistem Pakar, Teori dan Aplikasi. Yogyakarta: Andi. Liarokapis, F. (2007). An Augmented Reality Interface for Visualizing and Interacting with Virtual Content. London: Springer-Verlag. Martin C.G. & Oruklu E. (2012). Human Friendly Interface Design for Virtual Fitting Room Applications on Android Based Mobile Devices. Journal of Signal and Information Processing. Martinez-Martin E., & delPobil A.P. (2012). Robust Motion Detection in Real-Life Scenarios. London: Springer. Millington I. & Funge J.D. (2009). Artificial Intelligence for Games. San Francisco: Morgan Kaufmann/Elsevier. Munassar, N. & Govardhan, A (2010). A Comparison Between Five Models of Software Engineering. India: IJCSI. Oberst, R.D. (2001). 2020 Web Vision: How the Internet Will Revolutionize Future Homes, Business & Society. USA: Universal Publisher. Pachoulakis, I., Kapetanakis, K. (2012). Augmented Reality Platforms for Virtual Fitting Rooms. Greece: Technological Educational Institute of Crete. Petersen, K., et al. (2009). The Waterfall Model in Large-Scale Development. Berlin: Springer-Verlag. Putra, D. (2010). Pengolahan Citra Digital. Yogyakarta: Andi. Santoso, I. (2009). Interaksi Manusia dan Komputer Edisi 2. Yogyakarta: Andi. Schnabel, M. A., et al. (2010). Touching the Untouchables: Virtual, Augmented and Reality. Thailand: CAADRIA. Schrater, P. R. (2000). Mechanisms of Visual Motion Detection. New York: Nature America Inc.
Shneiderman B. & Plaisant C. (2010). Designing The User Interface - Strategies for Effective Human-Computer Interaction. Boston: Peason Higher Education Shupe, R., Rosser, Z. (2008). Learning ActionScript 3.0 – A Beginner’s Guide. Canada: O’Reilly. Szeliski, R. (2011). Computer Vision: Algorithms and Applications. Washington: Springer. The Pragmatic Programmers. (2008). Augmented Reality, A Practical Guide. USA: The Pragmatic Programmers. Xu, K. (2003). Visual Registration for Unprepared Augmented Reality Environment. London: Springer-Verlag.
RIWAYAT PENULIS Edo Raditya Hermanto lahir di Jakarta pada tanggal 22 Maret 1991. Penulis menamatkan pendidikan S1 di Universitas Bina Nusantara dalam bidang Teknik Informatika pada tahun 2013. Harris Gunawan lahir di Jakarta pada tanggal 1 September 1991. Penulis menamatkan pendidikan S1 di Universitas Bina Nusantara dalam bidang Teknik Informatika pada tahun 2013. Koresya lahir di Jakarta pada tanggal 20 Desember 1991. Penulis menamatkan pendidikan S1 di Universitas Bina Nusantara dalam bidang Teknik Informatika pada tahun 2013.
