BAB 3 METODE PENELITIAN 3.1 Hasil Uji Kuesioner Kuisioner terdiri dari 12 pertanyaan dan terdapat 56 responden yang menjawab kuesioner secara online. Kuisioner ini dimaksudkan untuk mengetahui pendapat para responden mengenai Augmented Reality, aplikasi Virtual dressing room, dan manfaat penggunaan aplikasi tersebut bagi para pembeli dan pemilik toko pakaian baik secara langsung (memiliki sebuah toko) maupun tidak langsung (menjual pakaian secara online, misalnya melalui website). Berikut adalah hasil penyebaran kuisioner : 1. Berapakah usia Anda? Tabel 3.1 Hasil Kuesioner Nomor 1 Pilihan Jumlah Responden Persentase Responden <=15 tahun 1 2% 16 25 tahun 40 71% 26 35 tahun 11 20% >= 36 tahun 4 7% 38
39 Gambar 3.1 Representasi Hasil Kuesioner Nomor 1 dalam Diagram Pie Pertanyaan ini dibuat untuk mengetahui usia dari responden yang terbagi menjadi beberapa kelompok dengan range tertentu. Dari diagram diatas dapat dilihat bahwa 2% dari responden berumur dibawah 15 tahun, 71% responden berumur diantara 16 sampai 25 tahun, 20% dari responden berumur diantara 26 sampai 35 tahun dan 7% sisanya berumur diatas 36 tahun.
40 2. Jenis kelamin Anda? Tabel 3.2 Hasil Kuesioner Nomor 2 Pilihan Jumlah Responden Persentase Responden Pria 22 39% Wanita 34 61% Gambar 3. 2 Representasi Hasil Kuesioner Nomor 2 dalam Diagram Pie
41 Pertanyaan ini dibuat untuk mengetahui jenis kelamin dari responden yang telah berpartisipasi dalam menjawab kuesioner yang ada. Dari representasi hasil kuesioner, didapatkan sebagian besar dari responden, sebanyak 61% berjenis kelamin wanita, dan 39% sisanya berjenis kelamin pria. 3. Apakah pada laptop atau komputer yang Anda miliki terdapat webcam? Tabel 3.3 Hasil Kuesioner Nomor 3 Pilihan Jumlah Responden Persentase Responden Ya 43 77% Tidak 13 23% Gambar 3.3 Representasi Hasil Kuesioner Nomor 3 dalam Diagram Pie
42 Pertanyaan ini bertujuan untuk mengetahui apakah responden memiliki webcam pada laptop atau PC yang dimilikinya. Hasil yang didapat menunjukkan bahwa sebagian besar responden memiliki webcam pada laptop atau komputer yang dimilikinya. 4. Apakah Anda mengetahui tetang augmented reality? Tabel 3.4 Hasil Kuesioner Nomor 4 Pilihan Jumlah Responden Persentase Responden Ya 23 41% Tidak 33 59% Gambar 3.4 Representasi Hasil Kuesioner Nomor 4 dalam Diagram Pie
43 Pertanyaan ini bertujuan untuk mengetahui apakah sebelumnya responden mengetahui teknologi augmented reality. Jika responden menjawab Tidak, maka responden tidak akan menjawab pertanyaan selanjutnya. Dari hasil yang didapat, responden yang tidak mengetahui augmented reality lebih banyak daripada responden yang mengetahuinya. 5. Apakah Anda pernah mencoba aplikasi augmented reality? Tabel 3.5 Hasil Kuesioner Nomor 5 Pilihan Jumlah Responden Persentase Responden Ya 14 61% Tidak 9 39%
44 Gambar 3.5 Representasi Hasil Kuesioner Nomor 5 dalam Diagram Pie Pertanyaan ini dibuat untuk mengetahui berapa banyak responden yang pernah mencoba aplikasi berbasis teknologi augmented reality. Hasil yang didapat menunjukkan bahwa 39% dari responden yang mengetahui augmented reality tidak pernah mencoba aplikasi yang berhubungan dengan teknologi tersebut. 6. Apakah Anda pernah mendengar tentang aplikasi Virtual dressing room? Tabel 3.6 Hasil Kuesioner Nomor 6 Pilihan Jumlah Responden Persentase Responden Ya 16 70% Tidak 7 30%
45 Gambar 3.6 Representasi Hasil Kuesioner Nomor 6 dalam Diagram Pie Pertanyaan ini ditujukan untuk mengetahui berapa banyak responden yang sebelumnya pernah mengetahui tentang aplikasi virtual dressing room. Jika responden menjawab Tidak, maka responden tidak akan menjawab pertanyaan selanjutnya. Dari data yang didapat, 70% dari responden pernah mendengar atau mengetahui tentang aplikasi virtual dressing room.
46 7. Apakah Anda pernah mencoba aplikasi Virtual dressing room? Tabel 3.7 Hasil Kuesioner Nomor 7 Pilihan Jumlah Responden Persentase Responden Ya 3 19% Tidak 13 81% Gambar 3.7 Representasi Hasil Kuesioner Nomor 7 dalam Diagram Pie Pertanyaan ini ditujukan untuk mengetahui berapa banyak responden yang pernah mencoba menggunakan aplikasi virtual dressing room. Dari data yang didapat, hanya 19% responden yang mengetahui dan pernah mencoba aplikasi virtual dressing room.
47 8. Menurut Anda, apakah aplikasi virtual dressing room dibutuhkan di website penjualan pakaian? Tabel 3.8 Hasil Kuesioner Nomor 8 Pilihan Jumlah Responden Persentase Responden Ya 14 87% Tidak 2 13% Gambar 3.8 Representasi Hasil Kuesioner Nomor 8 dalam Diagram Pie Pertanyaan ini dibuat untuk mengetahui pendapat responden tentang penting atau tidaknya penggunaan virtual dressing room pada website penjualan pakaian.
48 Hasil yang didapat menunjukkan 87% dari responden berpendapat bahwa aplikasi virtual dressing room dibutuhkan pada website penjualan pakaian. 9. Menurut Anda, apakah aplikasi virtual dressing room ini dibutuhkan di toko pakaian? Tabel 3.9 Hasil Kuesioner Nomor 9 Pilihan Jumlah Responden Persentase Responden Ya 8 50% Tidak 8 50% Gambar 3.9 Representasi Hasil Kuesioner Nomor 9 dalam Diagram Pie
49 Pertanyaan ini dibuat untuk mengetahui pendapat responden tentang penting atau tidaknya penggunaan virtual dressing room pada toko pakaian. Pertanyaan ini tidak wajib dijawab karena sebagian responden belum pernah mendengar tentang aplikasi virtual dressing room. Data yang didapat menunjukkan jumlah responden yang berpendapat aplikasi virtual dressing room dibutuhkan pada toko pakaian dan berpendapat aplikasi virtual dressing room tidak dibutuhkan pada toko pakaian berjumlah sama. 10. Menurut Anda, apakah dengan adanya aplikasi Virtual dressing room ini membantu pembeli dalam pengambilan keputusan sebelum membeli pakaian? Tabel 3.10 Hasil Kuesioner Nomor 10 Pilihan Jumlah Responden Persentase Responden Ya 14 87% Tidak 2 13%
50 Gambar 3.10 Representasi Hasil Kuesioner Nomor 10 dalam Diagram Pie Pertanyaan ini ditujukan untuk mengetahui apakah aplikasi virtual dressing room dianggap dapat membantu penggunanya dalam pengambilan keputusan sebelum membeli pakaian. Hasil yang didapat menunjukkan 13% dari responden menganggap aplikasi virtual dressing room tidak membantu penggunanya dalam pengambilan keputusan sebelum membeli pakaian.
51 11. Menurut Anda, apakah dengan adanya aplikasi virtual dressing room, bisnis penjualan pakaian bisa dibantu perkembangannya? Tabel 3.11 Hasil Kuesioner Nomor 11 Pilihan Jumlah Responden Persentase Responden Ya 14 87% Tidak 2 13% Gambar 3.11 Representasi Hasil Kuesioner Nomor 11 dalam Diagram Pie
52 Pertanyaan ini ditujukan untuk mengetahui pendapat para responden tentang manfaat dari aplikasi virtual dressing room untuk pemilik usaha / penjual pakaian. Dari data yang didapat, 84% responden berpendapat bahwa aplikasi virtual dressing room dapat membantu pemilik usaha untuk mengembangkan bisnis penjualan pakaian mereka. 12. Menurut Anda, fitur-fitur apa yang perlu dikembangkan dalam aplikasi virtual dressing room? Tabel 3.12 Hasil Kuesioner Nomor 12 Pilihan Jumlah Responden Persentase Responden Menentukan posisi pakaian dengan posisi tubuh 14 70% Menentukan ukuran pakaian 15 68% Menentukan warna pakaian 9 39% Mengambil gambar pengguna pada saat mencoba pakaian secara virtual (Menu Capture) 10 43% Fitur lainnya 6 11%
53 Gambar 3.12 Representasi Hasil Kuesioner Nomor 12 dalam Diagram Batang Pertanyaan ini ditujukan untuk mengetahui fitur apa saja yang dibutuhkan oleh para responden atau calon pengguna dalam sebuah aplikasi virtual dressing room. Dari hasil yang telah dijabarkan diatas, fitur yang paling dibutuhkan adalah fitur untuk menentukan ukuran pakaian dan menentukan posisi pakaian. Beberapa jawaban yang didapat dari responden yang memilih fitur lainnya, adalah sebagai berikut :
54 - Menyimpan gambar yang telah dicapture untuk kemudian dibandingkan dengan pakaian lain yang sebelumnya telah dicoba - Deteksi tubuh otomatis, tidak perlu mengatur letak pakaian secara manual 3.2 Analisis Aplikasi Sejenis 3.2.1 Virtual Dressing Room Using Kinect Aplikasi ini menggunakan Kinect SDK yang digunakan juga dalam permainan dengan kinect platform. Pendekatan metode yang dilakukan oleh dalam pembuatan aplikasi ini adalah sebagai berikut (Isikdogan & Kara, 2012): 1. Ekstraksi dari user, digunakan untuk membuat lingkungan augmented reality di sekitar tubuh user. 2. Memposisikan model pakaian 2D dengan menggunakan pelacak kerangka tubuh (skeletal tracker) dari Kinect SDK, 3. Scaling dari model pakaian 2D dengan menggunakan Euclidean distance antara sendi tubuh dan jarak user dari sensor, 4. Pendeteksian warna kulit untuk mencegah warna yang tidak diinginkan pada bagian tubuh dan model pakaian 2D, misalnya pada saat user meletakkan tangannya di depan model 2D.
55 Untuk user interface, user dapat memilih pakaian yang ingin digunakan dengan menggerakan tangan ke arah gambar pakaian yang berada pada lingkungan augmented reality yang telah dibuat. Gambar 3.13 Tampilan Aplikasi Virtual Dressing Room Using Kinect 3.2.2 Virtual Fitting Room Using Marker on Android Based Mobile Device Penggunaan aplikasi ini, user tidak membutuhkan komponen perangkat keras tambahan. Aplikasi ini merupakan perangkat lunak berbasis JAVA yang dirancang untuk dapat digunakan pada semua mobile device Android (API minimum 14) yang memiliki kamera. Algoritma yang digunakan dapat melacak dan mengubah ukuran pakaian yang sesuai dengan tata ruang posisi dari user (Martin & Oruklu, 2012). Dalam aplikasi ini, Cecilia Garcia Martin dan Erdal Oruklu mengembangkan human-friendly interface yang didefinisikan sebagai interaksi sistem komputasi yang interaktif dengan memberikan user cara yang lebih
56 mudah untuk berkomunikasi dengan mesin. Untuk menampilkan model pakaian dibutuhkan marker agar aplikasi dapat memilih pakaian yang ingin ditampilkan pada layar. Gambar 3.14 Tampilan Aplikasi Virtual Fitting Room Using Marker on Android Based Mobile Device
57 Tabel 3.13 Perbandingan Aplikasi Sejenis Kamera (Web camera) Menggunakan hardware tambahan (mis. Kinect) Menggunakan marker untuk menampilkan model pakaian Virtual Dressing Room Using Kinect Ya Ya Tidak Virtual Fitting Room Using Marker on Android Based Mobile Device Ya Tidak Ya 3.3 Usulan Penyelesaian Masalah Berdasarkan permasalahan yang terdapat pada kuesioner dan aplikasi sejenis yang telah dibuat, maka diusulkan penyelesaian masalah sebagai berikut: 1. Membuat aplikasi untuk membantu mempermudah pengguna mencoba pakaian yang diinginkan 2. Aplikasi memiliki fitur memilih pakaian, memposisikan pakaian pada tubuh, mengganti warna pakaian, dan mengambil gambar dari user yang sedang mencoba pakaian 3. Aplikasi dapat digunakan dengan menggunakan hardware tambahan yang telah dimiliki oleh kebanyakan pengguna desktop computer dan laptop 4. Menambahkan teknologi markerless augmented reality untuk menambahkan layer informasi pada dunia nyata tanpa membutuhkan marker
58 3.4 Konsep dan Pendekatan Aplikasi ini dibuat menggunakan sebuah library dengan ActionScript 3.0 sebagai bahasa pemrograman dasarnya, Ostrich. Ostrich memungkinkan aplikasi untuk dapat mendeteksi gerakan (motion detection) dan mengikuti gerakan (motion tracking) pada kamera dengan menggunakan Adobe Flash. 3.4.1 Metode Motion Detection Otak manusia memiliki kemampuan untuk mendeteksi gerakan dan mengikuti gerakan yang ada secara otomatis. Komputer juga dapat melakukannya dengan bantuan beberapa fungsi dan algoritma. Dengan menggunakan library Ostrich, algoritma yang dilakukan untuk mendeteksi gerakan adalah: 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.
59 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, yaitu: Gambar 3.15 Matriks Filter yang Digunakan untuk Meningkatkan Kontras pada tiap Piksel dari Frame 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 piksel adalah sebagai berikut:
60 Gambar 3.16 Perhitungan yang Dilakukan untuk Mencari Nilai Baru dari Tiap Piksel Dalam Frame d. Setelah diaplikasikan terhadap matriks filter, tiap piksel pada frame kemudian akan diaplikasikan kepada sebuah blurfilter untuk memperjelas dan memperhalus area gerakan. BlurFilter yang digunakan adalah: Gambar 3.17 Syntax yang Digunakan untuk Blur Filter Parameter di dalamnya adalah blurx (jumlah blur horizontal), blury (jumlah blur vertical), dan quality (jumlah perulangan pengaplikasian blur). 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.
61 Pada saat aplikasi dieksekusi, ada atau tidaknya kamera akan diperiksa setiap 200 milidetik. Untuk menghindari adanya pemicu gerakan pada tahap awal inisialisasi dari algoritma ini, akan diberikan tenggat waktu (delay) selama 1000 milidetik sebelum algoritma untuk mendeteksi gerakan dijalankan. Setelah motion rectangle dibuat, sebuah persegi berukuran kecil akan ditempatkan di dalam motion rectangle untuk menjadi sebuah kursor virtual. Ketika kursor melewati (hover) tombol yang telah dibuat, maka fungsi yang berada dalam tombol tersebut akan dijalankan. 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.
62 e. Jika motion rectangle berada di tempat lainnya, maka kursor akan diletakkan pada tempat yang proporsional.
63 3.5 Perancangan Sistem Perancangan sistem menggunakan beberapa diagram, yaitu Flowchart dan Sequence Diagram. 3.5.1 Flowchart Gambar 3.18 Flowchart dari aplikasi virtual dressing room
64 Aplikasi virtual dressing room ini dimulai dengan tampilan menu awal. Pada menu awal ini terdapat penjelasan tentang pemakain aplikasi Virtual Dressing Room dan menu pilihan jenis kelamin (Male atau Female). Setelah user memilih jenis kelamin, aplikasi ini akan berpindah ke menu utama. Menu utama akan menampilkan pakaian sesuai jenis kelamin yang dipilih dan beberapa menu, diantaranya: a. Up/Down untuk mengatur posisi pakaian di sumbu y b. Zoom In/Zoom Out, untuk memperbesar atau memperkecil pakaian agar sesuai dengan tubuh user c. Prev/Next, untuk mengganti model pakaian d. Next Menu, untuk menuju ke Menu Kedua Saat Menu Kedua dipilih, akan ditampilkan 3 menu yaitu: a. Prev/Next, menu ini berbeda dengan menu utama, menu ini untuk memilih warna pakaian b. Menu Capture, untuk pengambilan gambar c. Prev Menu, untuk kembali ke Menu Utama
65 3.6 Perancangan Layar / Storyboard Tampilan menu awal Gambar 3.19 Tampilan Menu Awal dalam Storyboard Tampilan ini akan muncul saat aplikasi virtual dressing room dieksekusi. Pada tampilan ini terdapat penjelasan awal berupa cara pemakaian aplikasi virtual dressing room, serta button untuk memilih gender (jenis kelamin) dari user. Pemilihan gender akan mempengaruhi model pakaian yang akan dimuculkan pada tampilan layar selanjutnya.
66 Tampilan menu utama Gambar 3.20 Tampilan Menu Utama dalam Storyboard Tampilan ini merupakan tampilan dari menu utama dari aplikasi virtual dressing room. Segiempat di tengah layar merupakan tempat untuk menampilkan pakaian. Pakaian yang ada akan ditampilkan di tengah layar. Beberapa tombol juga terdapat pada tampilan ini, seperti tombol Next dan Prev yang berfungsi untuk mengganti model pakaian yang ditampilkan, tombol zoom in dan zoom out yang akan membantu user untuk memperbesar atau memperkecil ukuran pakaian yang ditampilkan, tombol up dan down untuk membantu user
67 mengatur posisi agar tepat berada pada tubuhnya, serta tombol menu kedua yang dapat digunakan untuk mengakses tampilan layar selanjutnya. Pada bagian kiri bawah dari layar terdapat beberapa thumbnail dari pakaian yang tersedia, sehingga user dapat melihat pakaian apa yang akan dicoba setelah memilih tombol next atau prev Tampilan menu Kedua Gambar 3.21 Tampilan Menu Kedua dalam Storyboard Pada tampilan layar ini, terdapat beberapa fungsi lain yang dapat dijalankan oleh aplikasi virtual dressing room. Terdapat tombol next dan prev yang berfungsi untuk mengganti warna pakaian yang telah dipilih pada menu sebelumnya, sebuah tombol capture yang dapat digunakan oleh
68 pengguna untuk mengambil gambarnya pada saat menggunakan pakaian yang dipilihnya secara virtual, serta sebuah tombol di sebelah kanan atas yang digunakan untuk kembali ke tampilan layar sebelumnya (tampilan untuk memilih model pakaian). Bagian kiri bawah dari tampilan ini menampilkan pilihan warna lain dari pakaian yang ada, sehingga user dapat melihat warna dari pakaian yang akan dicoba selanjutnya. Pada bagian kiri atas terdapat sebuah segiempat untuk menampilkan hasil capture yang dilakukan oleh user.