IMPLEMENTASI
AUGMENTED REALITY
PADA PERANCANGAN SISTEM
KATALOG DIGIPROCREATIVE
BERBASIS ANDROID
SKRIPSI
MARCO KARIM SOLIN
091401033
PROGRAM STUDI S1 ILMU KOMPUTER
FAKULTAS ILMU KOMPUTER DAN TEKNOLOGIINFORMASI
UNIVERSITAS SUMATERA UTARA
IMPLEMENTASI AUGMENTED REALITY PADA PERANCANGAN SISTEM KATALOG DIGIPROCREATIVE BERBASIS ANDROID
SKRIPSI
Diajukan untuk melengkapi tugas dan memenuhi syarat mencapai gelar Sarjana Komputer
MARCO KARIM SOLIN 091401033
PROGRAM STUDI S1 ILMU KOMPUTER
FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI UNIVERSITAS SUMATERA UTARA
iii
PERSETUJUAN
Judul : IMPLEMENTASI AUGMENTED REALITY PADA PERANCANGAN SISTEM KATALOG DIGIPROCREATIVE BERBASIS ANDROID
Kategori : SKRIPSI
Nama : MARCO KARIM SOLIN
NomorIndukMahasiswa : 091401033
Program Studi : SARJANA (S1) ILMU KOMPUTER Departemen : ILMU KOMPUTER
Fakultas : FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI (FASILKOM-TI) UNIVERSITAS SUMATERA UTARA
Diluluskan di Medan, Juli 2014
Komisi Pembimbing :
Pembimbing 2 Pembimbing 1
Amer Sharif, S.Si, M.Kom Ade Candra, ST, M.Kom
NIP.- NIP.197909042009121002
Diketahui/Disetujui oleh
Program Studi S1 IlmuKomputer Ketua,
iv
PERNYATAAN
IMPLEMENTASI AUGMENTED REALITY PADA PERANCANGAN SISTEM KATALOG DIGIPROCREATIVE BERBASIS ANDROID
SKRIPSI
Saya mengakui bahwa skripsi ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.
Medan, Juli 2014
iv
PENGHARGAAN
Segala puji dan syukur penulis ucapkan kepada Allah SWT yang senantiasa melimpahkan rahmat dan karunia-Nya sehingga skripsi ini dapat diselesaikan.
Ucapan terima kasih penulis sampaikan kepada semua pihak yang telah membantu penulis dalam menyelesaikan skripsi ini baik secara langsung maupun tidak langsung. Pada kesempatan ini penulis ingin mengucapkan terima kasih yang sebesar-besarnya kepada :
1. Bapak Ade Candra, ST, M.Kom selaku Dosen Pembimbing I yang telah memberikan bimbingan, saran dan masukan kepada penulis dalam pengerjaan skripsi ini.
2. Bapak Amer Sharif, S.Si, M.Kom selaku Dosen Pembimbing II yang telah memberikan bimbingan, saran dan masukan kepada penulis dalam pengerjaan skripsi ini.
3. Bapak Dr. Poltak Sihombing, M.Kom selaku Ketua Program Studi Ilmu Komputer Fakultas Ilmu Komputer dan Teknologi Informasi Universitas Sumatera Utara serta Dosen Pembanding I dan yang telah memberikan kritik dan saran dalam penyempurnaan skripsi ini.
4. Ibu Dian Rachmawati, S.Si, M.Kom selaku Dosen Pembanding II yang telah memberikan kritik dan saran dalam penyempurnaan skripsi ini.
5. Ibu Maya Silvi Lydia, B.Sc, M.Sc selaku Sekretaris Program Studi Ilmu Komputer, Dekan dan Pembantu Dekan Fakultas Ilmu Komputer dan Teknologi Informasi, semua dosen dan semua pegawai di Program Studi S1 Ilmu Komputer Fakultas Ilmu Komputer dan Teknologi Informasi Universitas Sumatera Utara.
6. Ayahanda Anjur Solin dan Ibunda Mariam Siregar tercinta yang telah memberikan doa, motivasi, perhatian serta kasih sayang yang tulus serta pengorbanan yang tidak ternilai harganya.
v 8. Widya Karolina Sembiring, S.Kom yang telah memberikan doa,
semangat, dukungan, saran dan perhatiannya kepada penulis.
9. Teman-teman seperjuangan dari grup A.R.T (Augmented Reality Team) secara khusus Febrian M Fajar, Andria K. Wahyudi, Zulfahmi Eridinal, Mario Fernando Rentor, Muhammad Gyan M, yang telah memberikan masukan-masukan dalam menyelesaikan skripsi ini.
10.Teman-teman seperjuangan mahasiswa S1-Ilmu Komputer stambuk 2009 secara khusus Tedja Mukti Raharja, Ismail Fata Lubis, yang telah memberikan semangat dan menjadi teman diskusi penulis dalam menyelesaikan skripsi ini.
11.Semua pihak yang terlibat langsung ataupun tidak langsung yang tidak dapat penulis ucapkan satu per satu yang telah membantu penyelesaian skripsi ini.
Penulis menyadari bahwa skripsi ini masih terdapat kekurangan. Oleh karena itu, kepada pembaca agar kiranya memberikan kritik dan saran yang bersifat membangun demi kesempurnaan skripsi ini. Sehingga dapat bermanfaat bagi kita semuanya.
Medan, Mei 2014 Penulis
vii
ABSTRAK
Penjualan pakaian merupakan salah satu lahan bisnis yang sangat berkembang saat ini. Untuk mendapatkan pelanggan dan keuntungan yang banyak dibutuhkan strategi penjualan yang baik mulai dari segi pelayanan hingga sistem penjualan. Sistem katalog merupakan salah satu pelayanan untuk mempermudah konsumen dalam memilih barang yang diinginkan. Teknologi
augmented reality merupakan salah satu cara untuk membuat sistem katalog menjadi lebih menarik. Augmented Reality merupakan penggabungan benda-benda nyata dan maya di lingkungan nyata, berjalan secara interaktif dalam waktu nyata, dan terdapat integrasi antarbenda dalam tiga dimensi. Pada penelitian ini, metode yang digunakan adalah Natural Features Tracking. Hasil penelitian menunjukkan bahwa setiap marker yang dideteksi oleh kamera menampilkan objek baju 3 dimensi sesuai dengan objek aslinya. Dengan adanya sistem katalog yang menggunakan teknologi augmented reality ini, akan memudahkan konsumen dalam menentukan pilihan untuk membeli baju yang diinginkan tanpa harus pergi ke lokasi pembelian.
viii
ABSTRACT
Sales of clothing is one of the highly developed business area at this time. To get a lot of customers and profits, it takes a good sales strategy, start in terms of services to the sales system. Catalog system is one of the services to facilitate customers to select the desired item. Augmented Reality is one way to make the system more attractive catalog. Augmented Reality is the incorporation of real objects and the virtual in the real environment, runs interactively in real time, and there is integration between objects in three dimensions. In this study, the method used is Natural Features Tracking. The results showed that each marker is detected by the camera, display 3-dimensional objects clothes according to the original object. With the catalog system that uses augmented reality technology, will enable consumers to make a choice to buy the clothes you want without having to go to the location of purchase.
x 3.2.3 Sequence Diagram 23
3.2.4 Class Diagram 24
3.3 Flowchart 25
3.3.1 Flowchart Umum Sistem 25 3.3.2 Flowchart Identifikasi Marker 27
3.4 PerancanganAntar Muka 28
3.4.1 FormCover 28
3.4.2 Form Menu Utama 29
3.4.3 FormLoading 30
Bab 4 Implementasi dan Pengujian 32
4.1 Implementasi Sistem 32
4.1.1 Menampilkan interface awal 32 4.1.2 Registrasi Marker 33 4.1.3 Implementasi Natural Features Tracking 39
4.2 Pengujian Sistem 40
4.2.1 Spesifikasi Perangkat Keras Smartphone 40 4.2.2 Tampilan Halaman Cover 40 4.2.3 Tampilan Menu Utama 41 4.2.4 Pengujian Identifikasi Marker Pertama 42 4.2.5 Pengujian Identifikasi Marker Kedua 44
Bab 5 Kesimpulan 46
5.1 Kesimpulan 46
5.2 Saran 46
Daftar Pustaka 47
Lampiran 49
xi
DAFTAR TABEL
Halaman
xii
DAFTAR GAMBAR
Halaman Gambar 2.1 Desain Antar Muka Aplikasi Perkusi AR 8
Gambar 2.2 Contoh Marker 10
Gambar 2.3 Hasil Augmentasi Objek 3D Menggunakan Vuforia 10 Gambar 2.4 Arsitektur Library QCAR SDK 11 Gambar 3.1 Diagram Ishikawa Untuk Analisis Masalah 20
Gambar 3.2 Use Case Diagram 21
Gambar 4.2 CodingSplashscreen menggunakan XML 33
Gambar 4.3 Form Login 34
Gambar 4.10 Coding Load Dataset 37
Gambar 4.11 Marker Pertama 38
Gambar 4.12 Marker Kedua 38
Gambar 4.13 Coding Inisialisasi Tracking 39
Gambar 4.14Halaman Cover 41
Gambar 4.15Halaman Menu Utama 42
vii
ABSTRAK
Penjualan pakaian merupakan salah satu lahan bisnis yang sangat berkembang saat ini. Untuk mendapatkan pelanggan dan keuntungan yang banyak dibutuhkan strategi penjualan yang baik mulai dari segi pelayanan hingga sistem penjualan. Sistem katalog merupakan salah satu pelayanan untuk mempermudah konsumen dalam memilih barang yang diinginkan. Teknologi
augmented reality merupakan salah satu cara untuk membuat sistem katalog menjadi lebih menarik. Augmented Reality merupakan penggabungan benda-benda nyata dan maya di lingkungan nyata, berjalan secara interaktif dalam waktu nyata, dan terdapat integrasi antarbenda dalam tiga dimensi. Pada penelitian ini, metode yang digunakan adalah Natural Features Tracking. Hasil penelitian menunjukkan bahwa setiap marker yang dideteksi oleh kamera menampilkan objek baju 3 dimensi sesuai dengan objek aslinya. Dengan adanya sistem katalog yang menggunakan teknologi augmented reality ini, akan memudahkan konsumen dalam menentukan pilihan untuk membeli baju yang diinginkan tanpa harus pergi ke lokasi pembelian.
viii
ABSTRACT
Sales of clothing is one of the highly developed business area at this time. To get a lot of customers and profits, it takes a good sales strategy, start in terms of services to the sales system. Catalog system is one of the services to facilitate customers to select the desired item. Augmented Reality is one way to make the system more attractive catalog. Augmented Reality is the incorporation of real objects and the virtual in the real environment, runs interactively in real time, and there is integration between objects in three dimensions. In this study, the method used is Natural Features Tracking. The results showed that each marker is detected by the camera, display 3-dimensional objects clothes according to the original object. With the catalog system that uses augmented reality technology, will enable consumers to make a choice to buy the clothes you want without having to go to the location of purchase.
2
BAB 1
PENDAHULUAN
1.1 Latar Belakang
Penjualan pakaian merupakan salah satu lahan bisnis yang sangat berkembang saat ini. Hal ini dapat dibuktikan dengan semakin banyaknya toko-toko yang menjual berbagai jenis pakaian. Untuk mendapatkan pelanggan dan keuntungan yang banyak dibutuhkan strategi penjualan yang baik mulai dari segi pelayanan hingga sistem penjualan. Sistem katalog merupakan salah satu pelayanan untuk mempermudah pelanggan dalam memilih barang yang diinginkan. Untuk membuat sistem katalog lebih menarik dapat digunakan teknologi Augmented Reality.
Augmented Reality merupakan penggabungan benda-benda nyata dan maya di lingkungan nyata, berjalan secara interaktif dalam waktu nyata, dan terdapat integrasi antarbenda dalam tiga dimensi. AR adalah cara baru dan menyenangkan dimana manusia berinteraksi dengan komputer, karena dapat membawa objek virtual ke lingkungan pengguna, memberikan pengalaman visualisasi yang alami dan menyenangkan. Tidak seperti realitas maya yang sepenuhnya menggantikan kenyataan, namun Augmented Reality hanya menambahkan atau melengkapi kenyataan dengan library QCAR (Qualcomm Company Augmented Reality) API dan marker sehingga citra atau objek dalam bentuk 3 dimensi akan muncul pada kamera android[8].
Untuk mencitrakan suatu gambar tiga dimensi, sistem Augmented Reality
2 dengan markerless tidak perlu menggunakan marker konvensional berbentuk hitam-putih melainkan menggunakan marker berwarna atau bergambar tanpa perlu bingkai hitam disekeliling markernya. Untuk membuat marker pada Vuforia, harus mendaftarkan terlebih dahulu objek yang akan dijadikan sebagai marker ke webiste Vuforia. Hal ini dilakukan karena belum tersedia tools untuk membuat marker sendiri pada ide eclipse atau unity[8].
Untuk melakukan proses tracking digunakan metode Natural Features Tracking. Dalam metode ini informasi yang diperlukan untuk tujuan pelacakan dapat diperoleh dengan cara optical-flow berbasis pencocokan template atau korespondensi fitur. Optical-flow atau aliran optik adalah pola gerakan jelas sebuah benda, permukaan, dan tepi dalam adegan visual yang disebabkan oleh gerakan relatif antara pengamat (mata atau kamera) dan adegan. Korespondensi fitur bekerja lebih baik dan lebih efektif dari pada pencocokan template karena mereka bergantung pada pencocokan fitur lokal.
Pada penelitian Zaki, Achmad, Universitas Pamulang dengan judul “Perancangan dan Implementasi Katalog Interaktif untuk Media Penjualan Furniture Berbasis Teknologi Augmented Reality”. Dalam implementasinya aplikasi dibuat untuk menggantikan katalog yang masih berbasis kertas dengan katalog yang lebih interaktif dengan menggunakan teknologi Augmented Reality
berbasis android[14].
Pada Penelitian Rohmah, Ulfah, Universitas Gunadarma Depok dengan judul skripsinya “Aplikasi Augmented Reality Tata Surya (Semua Planet Mengelilingi Matahari) Menggunakan Mobile Android”. Dalam implementasinya aplikasi dibuat untuk mempermudah masyarakat dalam mempelajari ilmu tata surya tanpa harus repot menggunakan komputer atau pun buku. Aplikasi ini dibuat menggunakan tekologi Augmented Reality dan Unity Extention v1.0.0.[11].
2 visualisasi yang lebih interaktif dibandingkan dengan gambar dua dimensi yang biasanya digunakan untuk pembelajaran peserta didik. Pada aplikasi ini terdapat tiga buah scene metamorfosis yaitu, metamorfosis capung, katak dan kupu-kupu yang pada masing-masing fase digambarkan dalam bentuk objek tiga dimensi[6].
Berdasarkan latar belakang yang telah penulis uraikan diatas, maka akan dilakukan penelitian dengan judul “Implementasi Augmented Reality Pada Perancangan Sistem Katalog Digiprocreative Berbasis Android”. Penelitian akan dilakukan di perusahaan Digiprocreative yang beralamat di Jl. Arief Rahman Hakim No.100 Medan Sumatera Utara.
1.2 Rumusan Masalah
Yang menjadi rumusan masalah dalam penelitian ini adalah bagaimana membuat suatu aplikasi katalog baju yang lebih interaktif bagi konsumen dengan teknologi
Augmented Reality.
1.3 Batasan Masalah
Untuk fokusnya penelitian ini, penulis memberi batasan sebagai berikut : 1. Metode yang digunakan adalah Natural Features Tracking.
2. Output yang dihasilkan hanya 2 objek baju 3D.
3. Marker yang digunakan adalah markerless berupa kertas Design Katalog. 4. Library yang digunakan adalah library QCAR API.
5. Bahasa pemrograman yang akan digunakan adalah bahasa pemrograman C++ dan Java, dimana C++ digunakan untuk pemrograman sistem dan Java digunakan untuk UI(User Interface).
6. Software yang digunakan untuk mendukung pembuatan aplikasi ini adalah Blender untuk membuat objek 3 dimensi, Photoshop untuk membuat design
marker, Perl untuk meng-convert file .obj menjadi file header ( file .h) dan Cygwin Terminal untuk meng-compile program.
7. Sistem yang dibangun adalah berbasis Android.
2
Tujuan dari penelitian ini adalah untuk membangun suatu aplikasi katalog baju menggunakan teknologi Augmented Reality berbasis Android.
1.5 Manfaat Penelitian
Manfaat dari penelitian ini diharapkan dapat mempermudah dalam pemasaran produk serta meningkatkan penjualan dari produk-produk Digiprocreative.
1.6 Metode Penelitian
Metode penelitian yang dilakukan dalam penelitian ini adalah : 1. Studi Literatur
Dilakukan peninjauan terhadap buku, jurnal, artikel, maupun makalah yang membahas tentang Augmented Reality berbasis Android dan semua teori yang berkaitan dengan Augmented Reality.
2. Analisis dan Perancangan
Masalah-masalah yang ada dianalisis sehingga dapat dilakukan suatu perancangan dengan baik, seperti pembuatan flowchart, UI(User Interface), UML dan perancangan sistem katalog menggunakan Augmented Reality. 3. Implementasi
Augmented Reality diimplementasikan sebagai aplikasi untuk memunculkan objek baju 3D dari marker yang berupa katalog.
4. Pengujian
Dilakukan pengujian terhadap keberhasilan proses memunculkan objek 3D dari hasil pelacakan marker katalog.
5. Dokumentasi
2
1.7 Sistematika Penulisan
Untuk membuat penulisan lebih terstruktur, maka penulisan ini dibagi menjadi lima bab, yaitu :
BAB 1 : PENDAHULUAN
Pada bab ini berisi penjelasan mengenai latar belakang masalah, perumusan masalah, batasan masalah, tujuan penelitian, manfaat penelitian, metodeologi penelitian dan sistematika penulisan.
BAB 2 : LANDASAN TEORI
Pada bab ini berisi penjelasan mengenai teori-teori yang terkait dengan penelitian ini diantaranya adalah teori Augmented Reality, Natural Features Tracking, dan teori pendukung lainnya.
BAB 3 : ANALISIS DAN PERANCANGAN
Pada bab ini berisi penjelasan tentang analisis masalah yang dibangun dalam sistem dan menganalisis tentang hal-hal yang dibutuhkan dalam membangun sistem ini, kemudian dilanjutkan dengan tahapan perancangan sistem yang berupa perancangan interface sistem.
BAB 4 : IMPLEMENTASI DAN PENGUJIAN
Pada bab ini berisi tentang implementasi sistem yang berdasarkan tahapan perancangan dengan menggunakan bahasa pemrograman Java dan C++. Kemudian dilanjutkan dengan tahapan pengujian sistem untuk menguji apakah sistem sudah berjalan sesuai dengan perancangan.
BAB 5 : KESIMPULAN DAN SARAN
22
BAB 2
LANDASAN TEORI
2.1 Augmented Reality
Augmented Reality (AR) adalah kombinasi antara dunia maya (virtual) dan dunia nyata (real) yang dibuat oleh komputer. Obyek virtual dapat berupa teks, animasi, model 3D atau video yang digabungkan dengan lingkungan sebenarnya sehingga pengguna merasakan obyek virtual berada dilingkungannya. AR adalah cara baru dan menyenangkan dimana manusia berinteraksi dengan komputer, karena dapat membawa obyek virtual ke lingkungan pengguna, memberikan pengalaman visualisasi yang alami dan menyenangkan.Augmented Reality (AR) merupakan salah satu cabang di bidang teknologi yang belum terlalu lama, namun memiliki perkembangan yang sangat cepat. Perkembangan Augmented Reality pada industri
mobile phone juga mempunyai perkembangan yang paling cepat[7].
Menurut penjelasan Haller, Billinghurst, dan Thomas (2007), riset Augmented Reality bertujuan untuk mengembangkan teknologi yang memperbolehkan penggabungan secara real-time terhadap digital content yang dibuat oleh komputer dengan dunia nyata. Augmented Reality memperbolehkan pengguna melihat objek maya tiga dimensi yang diproyeksikan terhadap dunia nyata. (Emerging Technologies of Augmented Reality: Interface and Design)[8].
22
Penggabungan benda nyata dan maya dimungkinkan dengan teknologi tampilan yang sesuai, interaktivitas dimungkinkan melalui perangkat-perangkat input tertentu, dan integrasi yang baik memerlukan penjejakan yang efektif. Selain menambahkan benda maya dalam lingkungan nyata, realitas tertambah juga berpotensi menghilangkan benda-benda yang sudah ada. Menambah sebuah lapisan gambar maya dimungkinkan untuk menghilangkan atau menyembunyikan lingkungan nyata dari pandangan pengguna. Misalnya, untuk menyembunyikan sebuah meja dalam lingkungan nyata, perlu digambarkan lapisan representasi tembok dan lantai kosong yang diletakkan di atas gambar meja nyata, sehingga menutupi meja nyata dari pandangan pengguna[1].
Menurut penjelasan Lester Madden (2011), definisi Augmented Reality
sebagai suatu teknologi yaitu:
1. Kombinasi dunia nyata dengan komputer grafis. 2. Memberikan interaksi dengan objek secara real-time. 3. Tracks objek secara real-time.
4. Memberikan pengenalan gambar atau objek. 5. Memberikan konteks real-time atau data[9].
Ada dua langkah dalam proses aplikasi Augmented Reality, yaitu:
1. Aplikasi perlu menentukan keadaan dunia nyata saat ini dan menentukan keadaan dunia maya saat ini.
2. Aplikasi perlu untuk menampilkan dunia maya dalam registration (pendaftaran) dengan dunia nyata dengan cara yang akan menyebabkan peserta untuk merasakan elemen dunia maya sebagai bagian dari dunia nyatanya dan kemudian kembali ke langkah 1 untuk beralih ke langkah selanjutnya[4].
Menurut Saphiro dan Stockman (2001, p530-p532) Pembuatan sistem Augmented
Reality membutuhkan :
22 2. Korespondensi antara dunia nyata dengan model 3D melalui kalibrasi.
3. Tracking digunakan menentukan sudut pandangan pengguna terhadap dunia nyata. 4. Real-Time Display yang digabungkan dengan citra asli dan juga grafik komputer
yang dibuat berdasarkan model.
5. Waktu respon terhadap gerakan dan akurasi antara gambar dan grafik sangat mempengaruhi keefektifan sistem[8].
Gambar 2.1 Desain Antar Muka Aplikasi Perkusi AR
(Sumber: [5])
2.1.1 Marker
Marker merupakan wadah untuk menampilkan objek 3D yang akan kita munculkan. Ada beberapa jenis marker yang sudah berkembang hingga saat ini seperti Marker Based Tracking dan Markerless.
1. Marker Based Tracking
22
Marker Based Tracking ini sudah lama dikembangkan sejak 1980-an dan pada awal 1990-an mulai dikembangkan untuk penggunaan Augmented Reality.
2. Markerless
Salah satu metode Augmented Reality yang saat ini sedang berkembang adalah metode “Markerless Augmented Reality”, dengan metode ini pengguna tidak perlu lagi menggunakan sebuah marker untuk menampilkan elemen-elemen digital. Seperti yang saat ini dikembangkan oleh perusahaan Augmented Reality terbesar di dunia Total Immersion, mereka telah membuat berbagai macam teknik Markerless Tracking sebagai teknologi andalan mereka, seperti Face Tracking, 3D Object Tracking, dan Motion Tracking[15].
Dalam penelitian ini penulis menggunakan markerless sebagai marker untuk menampilkan objek 3D. Untuk membuat marker tersebut pada Vuforia, kita harus mendaftarkan terlebih dahulu objek yang akan dijadikan sebagai marker ke website
Vuforia. Hal ini dilakukan karena belum tersedia tool untuk membuat marker sendiri pada ide eclipse atau unity. Langkah-langkah pendaftaran marker adalah sebagai berikut:
1. Login ke vuforia 2. Klik target manager
3. Jika database kita belum ada, maka klik terlebih dahulu create database.
4. Klik database yang telah kita buat tadi untuk menambahkan objek kedalamnya.
5. Pilih add target
6. Isi setiap field pada form add new target sesuai dengan ketentuan yang ada. 7. Klik add.
8. Selesai.
22 1. Centang objek yang akan digunakan sebagai marker.
2. Klik download selected targets.
3. Pada form download selected target pilih sesuai dengan yang dibutuhkan. 4. Klik create.
5. Tunggu beberapa saat hingga proses pembuatan database untuk objek yang dipilih selesai.
Gambar 2.2 Contoh Marker
2.1.2 Vuforia Qualcomm Augmented Reality
22
Gambar 2.3 Hasil Augmentasi Objek 3D Menggunakan Vuforia
Gambar 2.3 adalah pengembangan aplikasi menggunakan platform Qualcomm AR. Platform tersebut terdiri dari 2 komponen diantaranya adalah :
1. Target Management System
Mengizinkan pengembang melakukan upload gambar yang sudah diregistrasi oleh
marker dan kemudian melakukan download target gambar yang akan dimunculkan.
2. QCAR SDK Vuforia
Mengijinkan pengembang untuk melakukan koneksi antara aplikasi yang sudah dibuat dengan library static i.e libQCAR.a pada iOS atau libQCAR.so pada android.
Gambar 2.4 di bawah ini memberikan gambaran umum pembangunan aplikasi dengan Qualcomm AR Platform. Platform ini terdiri dari SDK QCAR dan Target System Management yang dikembangkan pada portal QdevNet. Seorang pengembang meng-upload gambar masukan untuk target yang ingin dilacak dan kemudian men-download sumber daya target, yang dibundel dengan App. SDK QCAR menyediakan sebuah objek yang terbagi - libQCAR.so - yang harus dikaitkan dengan app[5].
22 Vuforia adalah Augmented Reality Software Development Kit (SDK) untuk perangkat mobile yang memungkinkan pembuatan aplikasi Augmented Reality. Dulunya lebih dikenal dengan QCAR (Qualcomm Company Augmented Reality). Ini menggunakan teknologi Computer Vision untuk mengenali dan melacak gambar planar (Target Image) dan objek 3D sederhana, seperti kotak, secara real-time. Vuforia menyediakan Application Programming Interface (API) di C++, Java, Objective-C. SDK mendukung pembangunan untuk IOS dan Android menggunakan Vuforia karena itu kompatibel dengan berbagai perangkat mobile termasuk iPhone(4/4S), iPad, dan ponsel Android dan tablet yang menjalankan Android OS versi 2.2 atau yang lebih besar dan prosesor ARMv6 atau 7 dengan FPU (Floating Point Unit) kemampuan pengolahan. Qualcomm Augmented Reality memberikan beberapa keuntungan seperti :
a. Teknologi computer vision untuk menyelaraskan gambar yang tercetak dan objek 3D.
b. Mendukung beberapa alat development seperti Eclipse, Android, Xcode.
Selain itu, QCAR juga menawarkan development dan distribusi yang gratis. Vuforia SDK memerlukan beberapa komponen penting agar dapat bekerja dengan baik. Komponen tersebut antara lain :
a. Kamera
Kamera dibutuhkan untuk memastikan bahwa setiap frame ditangkap dan diteruskan secara efisien ke tracker. Para developer hanya tinggal memberi tahu kamera kapan mereka mulai menangkap dan berhenti.
b. Image Converter
Mengkonversi format kamera (misalnya YUV12) kedalam format yang dapat dideteksi oleh OpenGL (misalnya RGB565) dan untuk tracking (misalnya
luminance). c. Tracker
22 d. Video Background Renderer
Me-render gambar dari kamera yang tersimpan di dalam state object. Performa dari
video background renderer sangat bergantung pada device yang digunakan. e. Application Code
Menginisialisai semua komponen di atas dan melakukan tiga tahapan penting dalam
aplication code seperti :
1. Query state object pada target baru yang terdeteksi atau marker. 2. Update logika aplikasi setiap input baru dimasukkan.
3. Render grafis yang ditambahkan (augmented). f. Target Resources
Dibuat menggunakan on-line Target Management System. Assets yang diunduh berisi sebuah konfigurasi xml – config.xml – yang memungkinkan developer untuk mengkonfigurasi beberapa fitur dalam trackable dan binary file yang berisi database trackable[8].
2.1.3 Natural Features Tracking
22
Feature tracking adalah proses untuk menemukan posisi yang sesuai pada gambar berturut-turut ke titik-titik gambar pada gambar pertama. Ukuran korespondensi didasarkan pada kesamaan pada lingkungan gambar jendela ukuran tetap.
Feature tracking merupakan langkah proses awal yang diperlukan dari masalah struktur dari gerak yang menemukan struktur 3D yang diambil dari gambar dari waktu ke waktu. Karena fitur yang cocok adalah satu-satunya informasi awal untuk penglihatan lebih lanjut berbasis inferensi, skema pelacakan berbasis titik konvensional mencoba untuk mencari banyak poin fitur sebanyak mungkin. Kebanyakan skema sebelumnya Natural Feature Tracking telah difokuskan pada deskripsi dan pencocokan fitur antara dua gambar berturut-turut. Metode mereka mengekstrak satu set baru fitur titik dari masing-masing gambar yang baru muncul, bukannya mempertimbangkan fitur yang dicocokkan sebelumnya. Ekstraksi dan pencocokan titik yang baru ditetapkan memakan waktu dan harus dihindari terutama ketika metode ini digunakan untuk aplikasi real-time.
Dalam penglihatan aplikasi berbasis augmented reality tujuan Natural Features Tracking adalah untuk menghitung homograpi antara adegan planar dan gambar yang diproyeksikan. Untuk memastikan adanya pola, harus ada sejumlah besar titik fitur untuk pola planar dan juga jumlah titik fitur yang cukup harus disesuaikan dengan poin dalam gambar yang diproyeksikan. Untuk mengidentifikasi wilayah persegi panjang pola diproyeksikan, homograpi yang dihitung dari titik pasang dicocokkan. Sebuah aplikasi memanfaatkan homograpi untuk layanan lebih lanjut pengolahan tertentu[9].
2.1.4 Qualcomm Company Augmented Reality (QCAR)
22
mobile. Dengan memberikan generasi baru yaitu interaktif 3D, Qualcomm Augmented Reality memberikan beberapa keuntungan, seperti:
a. Teknologi komputer vision untuk menyelaraskan gambar yang tercetak dan object 3D.
b. Mendukung beberapa alat development seperti Eclipse, (AndroidTM), Xcode.
Selain itu, QCAR juga menawarkan development dan distribusi yang gratis[3].
2.1.4.1 QCAR API Reference
API reference berisi informasi tentang hirarki kelas dan fungsi member dari QCAR SDK. Sistem dari QCAR SDK ditampilkan seperti pada gambar 2.4, menyediakan : callbackevent. Contoh : sebuah image baru yang tersedia.
a. High-level access ke perangkat keras. Contoh : Kamera start/ stop. b. MultipleTrackables
1) ImageTargets
2) Multi Targets
3) FrameMarkers
c. Interaksi secara langsung dengan dunia nyata[3].
2.2 Android
22 Sejak pertama kali muncul sampai sekarang, Android telah memiliki sejumlah pembaharuan. Pembaharuan ini dilakukan untuk memperbaiki bug dan menambah fitur-fitur yang baru.
Terdapat beberapa versi android yaitu mulai dari versi 1.1 yang dirilis pada 9 Februari 2009, versi 1.5(Cupcake) pada 30 April 2009, versi 1.6(Donut) pada 15 September 2009, versi 2.0/2.1(Eclair) pada 26 Oktober 2009, versi 2.2(Froyo) pada 20 Mei 2010, versi 2.3(Gingerbread) pada 6 Desember 2010, versi 3.0(Honeycomb) pada Februari 2011, hingga versi yang terbaru yaitu versi 4.0(Ice Cram Sandwich) pada 19 Oktober 2011[13].
Versi-versi yang ada pada android yaitu : 1. Android versi 1.1
Pada tanggal 9 Maret 2009, Google merilis Android versi 1.1. Android ini dilengkapi dengan pembaruan estetis pada aplikasi, jam alarm, voice search, pengiriman pesan dengan Gmail, dan pemberitahuan email.
2. Android versi 1.5 (Cupcake)
Pada pertengahan Mei 2009, Google kembali merilis telepon seluler dengan menggunakan Android dan SDK (Software Development Kit). Terdapat beberapa pembaruan termasuk juga penambahan beberapa fitur dalam seluler versi ini, yaitu kemampuan merekam dan menonton video dengan kamera, mengunggah video ke
youtube dan gambar ke Picasa langsung dari telepon, dukungan Bluetooth A2DP, kemampuan terhubung secara otomatis ke headset Bluetooth, animasi layar, dan
keyboard pada layar yang dapat disesuaikan sistem.
3. Android versi 1.6 (Donut)
22 CDMA/EVDO, 802.1x, VPN, Gestures, dan Text-to-speech engine, kemampuan
dial kontak, teknologi text to change speech 18 (tidak tersedia pada semua ponsel, pengadaan resolusi VWGA.
4. Android versi 2.0/2.1 (Eclair)
Pada 3 Desember 2009 kembali diluncurkan ponsel Android dengan versi 2.0/2.1 (Eclair), perubahan yang dilakukan adalah pengoptimalan hardware, peningkatan Google Maps 3.1.2, perubahan User Interface (UI) dengan browser baru dan dukungan HTML5, daftar kontak yang baru, dukungan flash untuk kamera 3,2 MP,
digital Zoom, dan Bluetooth 2.1.
5. Android versi 2.2 (Froyo: Frozen Yoghurt)
Pada 20 Mei 2010, Android versi 2.2 (Froyo) diluncurkan. Perubahan-perubahan umumnya terhadap versi-versi sebelumnya antara lain dukungan Adobe Flash 10.1, kecepatan kinerja dan aplikasi 2 sampai 5 kali lebih cepat, intergrasi V8 JavaScript engine yang dipakai Google Chrome yang mempercepat kemampuan rendering pada
browser, pemasangan aplikasi dalam SD Card, kemampuan WiFi Hotspot portabel, dan kemampuan pembaruan secara otomatis dalam aplikasi Android Market.
6. Android versi 2.3 (Gingerbread)
Pada 6 Desember 2010, Android versi 2.3 (Gingerbread) diluncurkan. Perubahan-perubahan umum yang didapat dari Android versi ini antara lain peningkatan kemampuan permainan (gaming), peningkatan fungsi copy paste, desain 19 ulang layar antar muka (User Interface), dukungan format video VP8 dan WebM, efek audio baru (reverb, equalization, headphone virtualization, dan bass boost),
dukungan kemampuan Near Field Communication (NFC), dan dukungan jumlah kamera yang lebih dari satu.
7. Android versi 3.0/3.1 (Honeycomb)
22 akselerasi perangkat keras (hardware) untuk grafis. Tablet pertama yang dibuat dengan menjalankan Honeycomb adalah Motorola Xoom. Perangkat tablet dengan
platform Android 3.0 telah banyak hadir di Indonesia. Perangkat yang pertama muncul bernama Eee Pad Transformer produksi dari Asus yang masuk pasar Indonesia pada Mei 2011.
8. Android versi 4.0 (ICS: Ice Cream Sandwich)
Diumumkan pada tanggal 19 Oktober 2011, membawa fitur Ice Cream Sandwich
untuk smartphone dan menambahkan fitur baru termasuk membuka kunci dengan pengenalan wajah, jaringan data pemantauan penggunaan dan kontrol, terpadu kontak jaringan sosial, perangkat tambahan fotografi, mencari email secara offline, dan berbagi informasi dengan menggunakan NFC. Ponsel pertama yang menggunakan sistem operasi ini adalah Samsung Galxy Nexus.
9. Android versi 4.1 (Jelly Bean)
Android Jelly Bean yang diluncurkan pada acara Google I/O lalu membawa sejumlah keunggulan dan fitur baru. Penambahan baru diantaranya meningkatkan input keyboard, desain baru fitur pencarian, user interface yang baru dan pencarian melalui voice search yang lebih cepat[3].
2.3 Objek 3 Dimensi
22 pemberian bantuan, dan bahkan efek stereo sederhana, yang secara konstruksi membuat efek 2D (dalam perhitungan proyeksi perspektif, shading).
Karakteristik 3D, mengacu pada tiga dimensi spasial, bahwa 3D menunjukkan suatu titik koordinat Cartesian X, Y dan Z. Penggunaan istilah 3D ini dapat digunakan di berbagai bidang dan sering dikaitkan dengan hal-hal lain seperti spesifikasi kualitatif tambahan (misalnya: grafis tiga dimensi, 3D video, film 3D, kacamata 3D, suara 3D). Istilah ini biasanya digunakan untuk menunjukkan relevansi jangka waktu tiga dimensi suatu objek, dengan gerakan perspektif untuk menjelaskan sebuah "kedalaman" dari gambar, suara, atau pengalaman taktil. Ketidakjelasan istilah ini menentukan penggunaannya dalam beberapa kasus yang tidak jelas juga yaitu penggunaannya tidak hanya pada contoh-contohdi atas melainkan (sering dalam iklan dan media).
Saat ini 3D digambarkan untuk mensimulasikan perhitungan berdasarkan layar proyeksi dua dimensi dan efek tiga-dimensi seperti monitor komputer atau televisi. Perhitungan ini memerlukan beban pengolahan besar sehingga beberapa komputer dan konsol memiliki beberapa tingkat percepatan grafis 3D untuk perangkat yang dikembangkan untuk tujuan ini. Komputer memiliki kartu grafis panggilan/tambahan untuk meningkatkan akselerasi 3D. Perangkat ini dibentuk dengan satu atau lebih prosesor (GPU) yang dirancang khusus untuk mempercepat perhitungan yang melibatkan tiga dimensi gambar yang mereproduksi pada layar dua dimensi dan dengan melepaskan beban pengolahan pada CPU atau Central Processing Unit komputer. Dalam komputasi, model tiga dimensi (angka atau grafis) dibuat tanpa membutuhkan perhitungan yang sangat kompleks, tetapi sangat banyak. 3D dapat direpresentasikan baik oleh prospek dari berbagai arah pada layar dua dimensi (yang membuat istilah "3D" tidak benar, layar dengan hanya dua dimensi), atau pada jenis perangkat atau kacamata film yang timbul dari LCD untuk melihat gambar yang berbeda pada setiap pandangan mata[1].
35
BAB 3
ANALISIS DAN PERANCANGAN SISTEM
3.1 Analisis Sistem
Analisis sistem merupakan fase awal dalam sebuah penelitian. Analisis sistem bertujuan untuk memberikan pemahaman terhadap kebutuhan sistem dan menggambarkan proses-proses yang ada di dalam sistem untuk menghasilkan keluaran yang sesuai dengan kebutuhan user.
3.1.1 Analisis Masalah
Masalah yang akan diselesaikan dengan menggunakan sistem ini adalah menampilkan objek baju 3 dimensi dengan menggunakan teknik Augmented Reality. Metode yang digunakan adalah Natural Features Tracking.
36
Ketidakpuasan user terhadap katalog design baju yang
kurang menarik
Kertas katalog sebagai marker
Menu Start untuk memulai aplikasi Augmented Reality
Kamera sebagai penerima input
Gambar 3.1 Diagram Ishikawa Untuk Analisis Masalah
3.1.2 Analisis Persyaratan
Analisis ini bertujuan untuk mengidentifikasi dan menyatakan persyaratan apa saja yang akan dibutuhkan oleh sistem agar dapat berjalan sesuai dengan yang diharapkan. Analisis Persyaratan ini meliputi analisis kebutuhan fungsional sistem dan analisis non-fungsional sistem. Fungsional sistem adalah aktivitas dan pelayanan yang harus dimiliki oleh sebuah sistem yang dapat berupa input,
output, proses maupun data yang tersimpan. Non-fungsional sistem adalah karakteristik atau batasan yang menentukan kepuasan sebuah sistem yakni seperti kinerja, kemudahan penggunaan, anggaran, serta tenggat waktu yang mampu bekerja tanpa mengganggu fungsionalitas sistem lainnya.
3.1.2.1 Persyaratan Fungsional
Persyaratan fungsional adalah aktivitas layanan yang harus diberikan oleh sebuah sistem. Berikut adalah fungsi-fungsi yang dapat dikerjakan oleh sistem.
1. Marker yang digunakan adalah markerless berupa kertas Design Katalog. 2. Sistem dapat mengidentifikasi marker yang digunakan dengan metode Natural
Features Tracking.
37
3.1.2.2 Persyaratan Non-Fungsional
Persyaratan non-fungsional berkaitan dengan fitur, karakteristik, dan batasan lainnya yang menentukan apakah sistem memuaskan atau tidak. Untuk membantu kinerja sistem secara lebih baik, terdapat kebutuhan non-fungsional sistem yaitu:
1. Sistem yang akan dibangun harus dapat menunjukkan hasil dari proses.
2. Efektifitas dan efisiensi dapat terlihat dari waktu respon antara pengguna
(user) dengan sistem.
3. Sistem yang akan dibangun harus sederhana dan mudah dipelajari oleh pengguna (user).
3.2 Pemodelan Sistem
3.2.1. Use Case Diagram
Use case diagram adalah suatu diagram yang mendeskripsikan interaksi antara
user (pengguna) sebuah sistem dengan suatu sistem tersendiri melalui sebuah cerita bagaimana sebuah sistem dipakai. Use case diagram terdiri dari sebuah aktor dan interaksi yang dilakukannya, aktor tersebut dapat berupa manusia, perangkat keras, sistem lain, ataupun yang berinteraksi dengan sistem. Use case diagram sistem ini dapat dilihat pada Gambar 3.2 berikut.
Mendeteksi Marker
User
Natural Features Tracking
<<Depend on>>
38
Spesifikasi use case untuk mendeteksi marker yang terdapat dalam diagram use case dapat dilihat pada Tabel 3.1.
Tabel 3.1 Spesifikasi Use Case Mendeteksi Marker
Name Mendeteksi Marker
Actors Pengguna
Trigger Pengguna memilih mengarahkan marker ke kamera mobile.
Preconditions Pengguna menggunakan aplikasi Augmented Reality berbasis Android.
Post Conditions Aplikasi akan menampilkan hasil objek baju 3 dimensi. Success Scenario 1. Pengguna mengeksekusi tombol Start.
2. Pengguna mengarahkan marker ke kamera mobile.
3. Sistem mendeteksi marker.
4. Sistem menampilkan objek baju 3 dimensi.
5. Pengguna dapat melihat hasil objek baju 3 dimensi pada layar mobile.
Alternative Flows
-
3.2.2 Activity Diagram
Activity diagram merupakan diagram yang berfungsi untuk menggambarkan logika procedural, jalan kerja suatu sistem. Diagram ini hampir memiliki peran yang sama dengan diagram alir yang mana memungkinkan siapapun yang melakukan proses untuk dapat memilih urutan dalam melakukannya sesuai keinginannya.
39
User System
Mengarahkan marker ke kamera
Mendeteksi marker
Menampilkan Objek Baju 3D
Membuka Aplikasi Menampilkan Aplikasi
Apakah Marker Valid
?
T
Y
Gambar 3.3 Activity Diagram
3.2.3 Sequence Diagram
Sequence diagram merupakan diagram yang mengambarkan bagaimana objek-objek saling bersinergi dalam beberapa kebiasaan (behavior). Sequence diagram
40
User :Camera :ImageTarget :Trackable :DataSet
Marker()
Deteksi() getImageTarget()
ActiveDataSet()
getDataSet() Load3dObject()
Gambar 3.4 Sequence Diagram
3.2.4 Class Diagram
Class diagram adalah diagram yang menunjukan class-class yang ada dari sebuah sistem dan hubungannya secara logika. Class diagram menggambarkan struktur statis dari sebuah sistem. Karena itu class diagram merupakan tulang punggung atau kekuatan dasar dari hampir setiap metode berorientasi objek termasuk UML
41
setActivityPortraitMode(JNIEnv *, jobject, jboolean isPortrait) : void initTracker(JNIEnv *, jobject) : int
initApplicationNative(JNIEnv* env, jobject obj, jint width, jint height) : void deinitApplicationNative(JNIEnv* env, jobject obj) : void
startCamera(JNIEnv *,jobject) : void stopCamera(JNIEnv *, jobject) : void setProjectionMatrix(JNIEnv *, jobject) : void
activateFlash(JNIEnv*, jobject, jboolean flash) : jboolean autofocus(JNIEnv*, jobject) : jboolean
setFocusMode(JNIEnv*, jobject, jint mode) : jboolean
ImageTargetsRenderer_initRendering(JNIEnv* env, jobject obj) : void
ImageTargetsRenderer_updateRendering(JNIEnv* env, jobject obj, jint width, jint height) : void <<C++ Class>> mShutdownLock : Object = new Object() mQCARFlags : int = 0
mTextures : Vector<Texture> mFlash : boolean = false mContAutofocus : boolean = false
Gambar 3.5 Class Diagram
3.3 Flowchart
3.3.1 Flowchart Umum Sistem
42
43
Gambar 3.6 merupakan proses yang dilakukan oleh aplikasi secara umum mulai dari proses pembuatan objek 3 dimensi sampai proses menampilkan objek 3 dimensi.
3.3.2 Flowchart Proses Identifikasi Marker
Flowchart dari proses identifikasi marker yang telah dirancang pada aplikasi ini dapat dilihat pada Gambar 3.7 berikut.
Mulai
Marker
Identifikasi marker dengan kamera mobile
Apakah marker
valid?
Tampilkan objek baju 3D
T
Y
Selesai
Gambar 3.7 Flowchart Sistem
44
3.4 Perancangan Antar Muka
Antarmuka merupakan bentuk tampilan grafis yang berhubungan langsung dengan pengguna (user). Perancangan antarmuka akan disesuaikan dengan kebutuhan dan software yang digunakan. Bahasa pemrograman yang digunakan C++ dan Java. Sistem ini dirancang dalam 3 form yaitu form cover, form utama, dan formloading.
3.4.1 FormCover
Form cover merupakan form yang pertama kali muncul saat sistem ini dijalankan. Tampilan rancangan form cover dapat dilihat pada Gambar 3.8.
Judul
Logo Digipro
Nama
Nim 1
2
3
4
Gambar 3.8 InterfaceForm Cover
45
Tabel 3.2 Rincian Rancangan Interface Form Cover
No. Tipe Teks Nama Keterangan
1. TextView Judul splash_title Menampilkan judul aplikasi.
2. ImageView - logo_digipro menampilkan logo Digipro
3. TextView Nama about_me Menampilkan nama.
4. TextView Nim nim_ku Menampilkan nim.
Pada tabel 3.2 di atas merupakan penjelasan dari komponen-koponen yang dipakai untuk membangun antar muka form cover.
3.4.2 Form Menu Utama
Form Menu Utama merupakan form yang akan digunakan pengguna untuk melakukan proses augmentasi. Form Menu Utama ini memiliki 1 (satu) buah
button, yaitu button start. Tampilan rancangan form Menu Utama dapat dilihat pada Gambar 3.9.
About Application
Start
3
2 1
46
Komponen yang dipakai ntuk membangun antar muka form cover pada Gambar 3.9 dapat dilihat pada tabel 3.3 di bawah ini.
Tabel 3.3 Rincian Rancangan Interface Form Menu Utama.
No. Tipe Teks Nama Keterangan
1. TextView About Application about_text Menampilkan keterangan aplikasi.
2. ScrollView - - Untuk menggeser layar
ke atas dan ke bawah. 3. Button Start Button_start Berfungsi untuk memulai
sistem augmentasi.
Pada tabel 3.3 diatas merupakan penjelasan dari komponen-koponen yang dipakai untuk membangun antar muka form Menu Utama.
3.4.3 FormLoading
Form Loading merupakan form yang menampilkan proses loading sebelum
camera mobile menangkap objek. Tampilan rancangan form Proses Loading
47
Simbol Proses Loading 1
Gambar 3.10 InterfaceForm Proses Loading
Komponen yang dipakai untuk membangun antar muka form loading pada Gambar 3.10 dapat dilihat pada tabel 3.4 di bawah ini.
Tabel 3.4 Rincian Rancangan Interface Form Proses Loading.
No. Tipe Teks Nama Keterangan
1. ProgressBar - loading_indicator Menampilkan gambar proses
loading untuk memulai sistem augmentasi
48
BAB 4
IMPLEMENTASI DAN PENGUJIAN
4.1 Implementasi Sistem
Pada tahap ini akan dijelaskan tentang implementasi dari sistem yang telah dirancang. Adapun penjelasannya adalah sebagai berikut:
4.1.1 Menampilkan Interface Awal
Gambar 4.1Tampilan Splashscreen
49
Gambar 4.2 Coding splashscreen menggunakan XML
4.1.2 Registrasi Marker
Untuk dapat menggunakan marker sesuai dengan image yang diinginkan, image
tersebut harus ditracking terlebih dahulu agar dapat teregistrasi dan dapat digunakan untuk menampilkan objek 3 dimensi. Untuk melakukan registrasi marker qualcomm sudah menyediakan fitur registrasi marker. Berikut langkah-langkah untuk registrasi marker :
50
Gambar 4.3Form Login
2. Klik Target Manager
Gambar 4.4 Form Target Manager
3. Pilih Create Database untuk membuat database baru dimana database tersebut akan digunakan sebagai tempat image yang akan diupload.
51
4. Pilih database yang telah dibuat tadi kemudian klik add target untuk meng-upload image yang ingin dijadikan sebagai marker dan kemudian isi form sesuai dengan yang diinginkan.
Gambar 4.6Hasil Create Database
52
5. Setelah melakukan proses tracking, image yang telah diupload akan ditampilkan dalam database seperti pada gambar 4.8
Gambar 4.8Hasil Add Target
Pada gambar 4.8 terlihat perbedaan antara MarkerPertama dan MarkerKedua yaitu pada jumlah bintang yang didapat pada setiap marker. Bintang lima pada MarkerKedua menunjukkan bahwa tracking marker sangat bagus sehingga ketika proses pelacakan objek 3 dimensi menjadi lebih mudah dan lebih cepat ketika menampilkan objek 3 dimensi tersebut. Sedangkan bintang dua pada MarkerPertama menunjukkan bahwa tracking marker lemah (kurang bagus) sehingga marker akan sulit dikenali. Untuk hasil yang maksimal, jumlah bintang yang didapatkan minimal tiga bintang pada marker.
6. Download marker yang sudah teregistrasi ke dalam bentuk Eclipse package
53
Gambar 4.9 FormDownload Marker
Hasil download marker tersebut terdiri dari 2 file yaitu file.dat dan file.xml dimana file tersebut akan digunakan pada Eclipse sebagai load dataset. Code load dataset dapat dilihat pada Gambar 4.10.
Gambar 4.10 Coding Load Dataset
54
Gambar 4.11 Marker Pertama
Pada marker pertama ini objek yang ditampilkan adalah baju 3 dimensi berwarna hijau tua dengan logo IMILKOM di bagian dada sebelah kiri.
55
Pada marker kedua ini objek yang ditampilkan adalah baju 3 dimensi berwarna putih dengan kerah dan ujung lengan berwarna kuning, dan dibagian belakang baju terdapat logo Bank SUMUT.
4.1.3 Implementasi Natural Features Tracking
Algoritma ini bekerja setelah potongan semua marker diupload melalui vuforia dan menghasilkan sebuah source code (hasil dari gambar setelah di-generate vuforia) berupa file xml. File xml ini merupakan file konfigurasi dari vuforia terhadap marker - marker yang telah di upload. Prosesnya dapat dilihat pada code berikut
56
4.2 Pengujian Sistem
Pengujian untuk sistem ini dilakukan untuk mendapatkan hasil objek baju 3 dimensi. Kriteria pengujian yang dilakukan adalah sebagai berikut :
1. Marker yang digunakan adalah dua buah marker yang sebelumnya telah diregistrasi.
2. Setiap marker menghasilkan baju 3 dimensi yang berbeda.
4.2.1 Spesifikasi Perangkat Keras Smartphone
Perangkat keras pendukung yang digunakan selama pembuatan aplikasi ini memiliki spesifikasi sebagai berikut:
1. Prosesor 1 Ghz Dual Core 2. OS Android, 4.1 Jelly Bean 3. RAM 1GB
4. Kamera Belakang 5.0 MP 5. Resolusi 480*800(WVGA)
4.2.2 Tampilan Halaman Cover
57
Gambar 4.14 Halaman Cover
4.2.3 Tampilan Menu Utama
58
Gambar 4.15 Halaman Menu Utama
4.2.4 Pengujian Identifikasi Marker Pertama
Setelah button Start dieksekusi, maka proses augmentasi akan dimulai. Pengujian proses identifikasi marker dapat dilakukan dengan mengarahkan kamera mobile
59
Gambar 4.16 Tampilan Depan dari Marker Pertama
Gambar 4.16 ini merupakan tampilan dari objek baju 3 dimensi ketika kamera diarahkan ke bagian depan. Pengujian juga dilakukan ketika kamera diarahkan ke bagian samping marker yang dapat dilihat pada Gambar 4.17.
60
Gambar 4.17 ini merupakan tampilan dari objek baju 3 dimensinya ketika kamera kita arahkan ke bagian samping. Dengan demikian konsumen akan lebih mudah dalam melihat atau memilih baju yang akan dibeli.
4.2.5 Pengujian Identifikasi Marker Kedua
Pengujian proses identifikasi marker dapat dilakukan dengan mengarahkan marker ke kamera mobile. Pada saat marker diarahkan ke kamera, maka sistem mengenali marker tersebut dan menampilkan objek baju 3 dimensi. Hasil identifikasi marker kedua dapat dilihat pada Gambar 4.18 dan Gambar 4.19.
Gambar 4.18 Tampilan Depan dari Marker Kedua
61
Gambar 4.19 Tampilan Samping dari Marker Kedua
51
BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Pada penelitian ini telah berhasil dibangun sebuah aplikasi katalog baju berbasis
augmented reality yang dapat mempermudah konsumen dalam memilih baju yang diinginkan.
5.2 Saran
Adapun saran-saran yang dapat penulis berikan untuk pengembangan dan perbaikan sistem ini adalah sebagai berikut :
1. Untuk pengembangan kedepannya diharapkan aplikasi ini dapat menampilkan lebih banyak baju 3 dimensi, sehingga pembeli dapat melihat semua baju yang diproduksi oleh Digiprocreative.
2. Untuk pengembangan selanjutnya, diharapkan dapat membuat interface
yang lebih menarik seperti button untuk rotasi baju 3 dimensi dan button zoom in dan zoom out yang terletak pada layar android mobile, sehingga mempermudah pembeli untuk melihat baju secara detail.
52
DAFTAR PUSTAKA
[1] Ardhianto, Eka, Wiwien, Hadikurniawati & Edy, Winarno. 2012.
Augmented Reality Objek 3 Dimensi dengan Perangkat Artoolkit dan Blender. Jurnal Teknologi Informasi DINAMIK Vol.17
No.2: hal.108-109.
[2] Azuma, Ronald T. 1997. A Survey Of Augmented Reality.
Teleoperator and Virtual Environments (355-385), Hughes Research Laboratories, Dept Of Computer Science UNC, Los Angles, US.
[3] Chandra, Robert. 2012. Aplikasi Augmented Reality Untuk Panduan Museum Berbasis Android Menggunakan Frame Marker. Skripsi. Jakarta, Indonesia: Binus.
[4] Craig, Alan B. 2013. Understanding Augmented Reality Concept and Applications. USA: Elsevier Inc.
[5] Fathoni, Mochamad. 2012. Alat Musik Perkusi Augmented Reality Berbasis Android. Skripsi. Malang, Indonesia: Universitas Muhammadiyah.
[6] Fauzi Putra, Fahreza, dkk. 2012. Aplikasi Pembelajaran Metamorfosis Berbasis Android Augmented Reality. Jurnal Teknik Informatika
Vol 1: hal.1-8.
[7] Fernando, Mario. 2013. Membangun AR Android Dengan Vuforia + Unity. Manado: BUKU AR ONLINE.
[8] Fernando Rentor, Mario. 2013. Rancang Bangun Perangkat Lunak Pengenalan Motif Batik Berbasis Augmented Reality. Tesis. Yogyakarta, Indonesia: Universitas Atma Jaya.
[9] Gruber, Lukas, dkk. 2010. Optimization of Target Objects for Natural Feature Tracking. 2010 International Conference on Pattern Recognition. Austria dan California US.
53
[11]Rohmah, Ulfah. 2012. Aplikasi Augmented Reality Tata Surya (Semua Planet Mengelilingi Matahari) Menggunakan Mobile Android.
Skripsi. Depok, Indonesia: Universitas Gunadarma.
[12] Safaat H, Nazruddin. 2012. Pemrograman Aplikasi Mobile Smartphone dan Tablet PC Berbasis Android. Bandung: Penerbit Informatika Bandung.
[13] WK, Nikodemus. 2013. Step By Step Menjadi Programmer Android. Edisi 1. Yogyakarta: Penerbit ANDI: Semarang: WAHANA KOMPUTER.
[14] Zaki, Achmad. 2013. Perancangan dan Implementasi Katalog Interaktif Untuk Media Penjualan Furniture Berbasis Teknologi Augmented Reality. Skripsi. Pamulang, Indonesia: Universitas Pamulang.
54
LISTING PROGRAM
Kode Program splash_screen.xml:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="match_parent"
android:background="@color/holo_light_blue"
android:contentDescription="@string/content_desc_vuforia_backgroun
d">
<TextView
android:id="@+id/splash_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:layout_marginTop="24dp" android:gravity="center"
android:text="@string/splash_title" android:textColor="@color/white"
android:textSize="@dimen/splash_title" android:textStyle="bold" />
<ImageView
android:id="@+id/logo_digipro" android:layout_width="200dp" android:layout_height="200dp"
android:layout_above="@+id/about_me" android:layout_centerHorizontal="true" android:layout_marginBottom="54dp"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="10dp" android:gravity="center"
android:text="@string/nim_ku" android:textColor="@color/white" android:textSize="@dimen/about_title" android:textStyle="bold" />
55
android:id="@+id/about_me"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@+id/nim_ku" android:layout_centerHorizontal="true" android:layout_marginBottom="17dp" android:gravity="center"
android:text="@string/about_me" android:textColor="@color/white" android:textSize="@dimen/about_title" android:textStyle="bold" />
</RelativeLayout>
Kode Program about_screen.xml:
56
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/black" android:orientation="vertical">
<TextView
android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="15dip" android:padding="10dip"
android:text="@string/about_title"
android:textColor="@color/holo_light_blue" android:textSize="@dimen/about_title" />
<View
android:layout_width="match_parent" android:layout_height="1dp"
android:layout_marginTop="10dp"
android:background="@color/holo_light_blue" />
<ScrollView
android:layout_width="match_parent" android:layout_height="match_parent"
android:layout_gravity="center_horizontal" android:layout_weight="1"> android:layout_width="fill_parent" android:layout_height="wrap_content"
android:gravity="center_horizontal|center_vertical"
android:text="@string/button_start" />
</LinearLayout>
Kode Program camera_overlay.xml:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
57
android:layout_width="match_parent" android:layout_height="match_parent">
<ProgressBar
android:id="@+id/loading_indicator" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" />
58
public class AboutScreen extends Activity implements OnClickListener
{
private TextView mAboutText; private Button mStartButton;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); setContentView(R.layout.about_screen);
mAboutText = (TextView) findViewById(R.id.about_text);
mAboutText.setText(Html.fromHtml(getString(R.string.about_text)));
mAboutText.setMovementMethod(LinkMovementMethod.getInstance());
mAboutText.setLinkTextColor(getResources().getColor( R.color.holo_light_blue));
mStartButton = (Button) findViewById(R.id.button_start); mStartButton.setOnClickListener(this);
}
59
public class ImageTargets extends Activity {
private static final int FOCUS_MODE_NORMAL = 0;
private static final int FOCUS_MODE_CONTINUOUS_AUTO = 1;
private static final int APPSTATUS_UNINITED = -1; private static final int APPSTATUS_CAMERA_STOPPED = 6; private static final int APPSTATUS_CAMERA_RUNNING = 7;
private static final String NATIVE_LIB_SAMPLE = "ImageTargets";
60
static final int HIDE_LOADING_DIALOG = 0; static final int SHOW_LOADING_DIALOG = 1;
private View mLoadingDialogContainer;
private QCARSampleGLView mGlView;
private ImageTargetsRenderer mRenderer;
private int mScreenWidth = 0; private int mScreenHeight = 0;
private static final int INVALID_SCREEN_ROTATION = -1;
private int mLastScreenRotation = INVALID_SCREEN_ROTATION;
private int mAppStatus = APPSTATUS_UNINITED;
private InitQCARTask mInitQCARTask;
private LoadTrackerTask mLoadTrackerTask;
private Object mShutdownLock = new Object();
private int mQCARFlags = 0;
private Vector<Texture> mTextures;
private GestureDetector mGestureDetector;
private boolean mFlash = false;
private boolean mContAutofocus = false;
MenuItem mDataSetMenuItem = null;
boolean mIsMarkerDataSetActive = false;
private RelativeLayout mUILayout;
static {
loadLibrary(NATIVE_LIB_QCAR); loadLibrary(NATIVE_LIB_SAMPLE); }
static class LoadingDialogHandler extends Handler {
private final WeakReference<ImageTargets> mImageTargets;
LoadingDialogHandler(ImageTargets imageTargets) {
mImageTargets = new WeakReference<ImageTargets>( imageTargets);
61
private Handler loadingDialogHandler = new LoadingDialogHandler(this);
private class InitQCARTask extends AsyncTask<Void, Integer, Boolean>
{
private int mProgressValue = -1;
62
protected void onProgressUpdate(Integer... values) {
}
63
private class LoadTrackerTask extends AsyncTask<Void, Integer, Boolean>
{
protected Boolean doInBackground(Void... params) {
protected void onPostExecute(Boolean result) {
64
private void storeScreenDimensions() {
protected void onCreate(Bundle savedInstanceState) {
DebugLog.LOGD("ImageTargets::onCreate"); super.onCreate(savedInstanceState);
mTextures = new Vector<Texture>(); loadTextures();
mQCARFlags = getInitializationFlags();
mGestureDetector = new GestureDetector(this, new GestureListener());
updateApplicationStatus(APPSTATUS_INIT_APP); }
65
public native int getOpenGlEsVersionNative();
public native int initTracker(); public native void deinitTracker();
public native int loadTrackerData(); public native void destroyTrackerData();
public native void onQCARInitializedNative();
private native void startCamera(); private native void stopCamera();
private native void setProjectionMatrix();
protected void onResume() {
DebugLog.LOGD("ImageTargets::onResume"); super.onResume();
QCAR.onResume();
if (mAppStatus == APPSTATUS_CAMERA_STOPPED) {
updateApplicationStatus(APPSTATUS_CAMERA_RUNNING); }
private void updateActivityOrientation() {
Configuration config = getResources().getConfiguration();
boolean isPortrait = false;
switch (config.orientation) {
66
isPortrait = true; break;
case Configuration.ORIENTATION_LANDSCAPE: isPortrait = false;
break;
case Configuration.ORIENTATION_UNDEFINED: default:
break; }
DebugLog.LOGI("Activity is in "
+ (isPortrait ? "PORTRAIT" : "LANDSCAPE")); setActivityPortraitMode(isPortrait);
}
public void updateRenderView() {
int currentScreenRotation =
getWindowManager().getDefaultDisplay().getRotation(); if (currentScreenRotation != mLastScreenRotation) {
public void onConfigurationChanged(Configuration config) {
DebugLog.LOGD("ImageTargets::onConfigurationChanged"); super.onConfigurationChanged(config);
updateActivityOrientation();
storeScreenDimensions();
mLastScreenRotation = INVALID_SCREEN_ROTATION; }
67
{
DebugLog.LOGD("ImageTargets::onPause"); super.onPause();
updateApplicationStatus(APPSTATUS_CAMERA_STOPPED); }
private native void deinitApplicationNative();
protected void onDestroy() {
68
