MARKERLESS AUGMENTED REALITY UNTUK PENATAAN DESAIN INTERIOR BERBASIS ANDROID SKRIPSI MUHAMMAD RIFKI AULIA

(1)

MARKERLESS AUGMENTED REALITY UNTUK PENATAAN DESAIN INTERIOR BERBASIS ANDROID

SKRIPSI

MUHAMMAD RIFKI AULIA 111402116

PROGRAM STUDI S1 TEKNOLOGI INFORMASI

FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI UNIVERSITAS SUMATERA UTARA

MEDAN 2018

(2)

MARKERLESS AUGMENTED REALITY UNTUK PENATAAN DESAIN INTERIOR BERBASIS ANDROID

SKRIPSI

Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh ijazah Sarjana Teknologi Informasi

MUHAMMAD RIFKI AULIA 111402116

PROGRAM STUDI TEKNOLOGI INFORMASI

FAKULTAS ILMU KOMPUTER DAN TEKNOLOGI INFORMASI UNIVERSITAS SUMATERA UTARA

MEDAN 2018

Universitas Sumatera Utara

(3)

(4)

iv

PERNYATAAN

MARKERLESS AUGMENTED REALITY UNTUK PENATAAN DESAIN INTERIOR BERBASIS ANDROID

SKRIPSI

Saya mengakui bahwa skripsi ini adalah hasil karya saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing telah disebutkan sumbernya.

Medan, 16 Agustus 2018

Muhammad Rifki Aulia 111402116

(5)

PENGHARGAAN

Puji dan syukur penulis sampaikan kepada ALLAH SWT yang telah memberikan rahmat serta hidayah-Nya sehinggap penulis dapat menyelesaikan skripsi ini sebagai syarat untuk memperoleh gelar Sarjana Komputer di Universitas Sumatera Utara.

Selanjutnya, sholawat dan salam penulis sampaikan atas nabi Muhammmad SAW.

Penulis mengucapkan terima kasih kepada keluarga penulis, Ayahanda Drs. H.

Khairuddin, MA, Ibunda Dra. Hj. Ernani, MA, dan juga kepada Abang penulis dr. M.

Fikri Fadli, Adik penulis Safira Salsabila dan Zia Camila Fathma, beserta seluruh keluarga besar yang selalu memberikan dukungan, motivasi, serta doa kepada penulis sehingga dapat menyelesaikan skripsi ini.

Penulis juga mengucapkan terima kasih kepada Bapak Mohammad Fadly Syahputra, B.Sc, M.Sc, IT selaku Dosen Pembimbing I dan Bapak Dedy Arisandi, ST, M.Kom. selaku Dosen Pembimbing II yang telah meluangkan waktunya untuk membimbing penulis dalam penelitian serta penulisan skripsi ini. Terima kasih juga penulis ucapkan kepada Bapak Dani Gunawan, ST., MT. selaku Dosen Pembanding I dan Bapak Indra Aulia, S.TI., M.Kom. selaku Dosen Pembanding II yang telah memberikan saran dan kritik yang bermanfaat dalam penyempurnaan skripsi ini.

Terima kasih penulis ucapkan kepada Ketua dan Sekretaris Program Studi S1 Teknologi Informasi, Dekan dan Wakil Dekan Fakultas Ilmu Komputer dan Teknologi Informasi, dan seluruh dosen serta staf pegawai di lingkungan Program Studi S1 Teknologi Informasi, yang telah membantu dan membimbing penulis selama masa perkuliahan.

Terima kasih juga penulis ucapkan kepada teman-teman penulis yang selalu memberikan dukungan dan semangat, terutama kepada Moh. Rizqi Takarina I, S.Kom. sebagai teman seperjuangan dalam menyelesaikan skripsi ini, Khairunnisa, S.Kom. yang telah banyak membantu dalam perbaikan penulisan, Ayu Cahyany Arrumdany, S.Kom., Tifani Zata Lini FY, S.Kom., Rizky Aulia, S.Kom., Deno Sumarta, S.Kom., Indah Fatmi Utari, S.Kom., Ossie Zarina, S.Kom., Suryansyah Manik, S.Kom. dan Farhan Luthfi Nainggolan, S.Kom., serta seluruh teman-teman angkatan 2011 dan teman-teman mahasiswa Teknologi Informasi lainnya. Semoga Allah SWT membalas segala kebaikan kalian.

(6)

vi

Penulis menyadari bahwa skripsi ini masih terdapat kekurangan. Oleh sebab itu, penulis mengharapkan kritik dan saran yang bersifat membangun. Akhir kata penulis ucapkan terima kasih.

(7)

ABSTRAK

Desain Interior merupakan suatu seni dalam penataan ruang yang membuat ruangan kita lebih terlihat cantik dan menarik sesuai dengan desain yang kita inginkan. Dalam hal penataan ruang sungguh merepotkan jika kita harus memindahkan perabotan rumah tangga dengan menggesernya. Untuk itu diperlukan sebuah sistem dan teknologi baru yang bisa mendekorasi dan mendesain ruangan tanpa harus menggerakkan atau memindahkan perabotan rumah tersebut. Teknologi yang digunakan untuk penataan ruang yang dapat memudahkan kita untuk mendesain ruangan dengan menggunakan teknologi Augmented Reality. Pemanfaatan Wikitude SDK dalam pembangunan aplikasi ini mampu menampilkan objek augmented berupa objek 3 dimensi dan menggunakan teknik Simultaneous Localisation and Mapping (SLAM). Sistem pelacakan (tracking) yang digunakan untuk Augmented Reality ini menggunakan teknik markerless sehingga pengguna dapat langgung menggunakan aplikasi tanpa menggunakan marker dengan cara langsung mendeteksi permukaan (ground) yang dilakukan sistem dengan menggunakan SLAM dan menjadi tempat landasan untuk peletakan objek maya tersebut. User dapat memindahkan objek, memperbesar dan merotasi objek sehingga dapat memudahkan untuk mendesain tata ruang yang diinginkan. Teknologi SLAM yang terdapat dalam Augmented Reality dapat memungkinkan kita untuk meletakkan lebih dari satu objek. Hasil dari aplikasi ini berupa gambar yang kita ambil dari fitur capture yang ada pada aplikasi sehingga dapat menjadi referensi model untuk mendesain tata ruang yang kita inginkan.

Aplikasi ini berjalan pada platform mobile android untuk memudahkan pengguna untuk mengaksesnya.

Kata Kunci : desain interior, markerless, augmented Reality, android.

(8)

viii

ABSTRACT

Interior Design is an art in spatial planning that makes our room look more beautiful and attractive according to the design we want. In terms of spatial planning it is really troublesome if we have to move household furniture by sliding it. For this reason, a new system and technology is needed that can decorate and design a room without having to move or sliding the furniture of the house. The technology used for spatial planning can make it easier for us to design a room using Augmented Reality technology. The use of Wikitude SDK in the construction of this application is capable of displaying augmented objects in the form of 3-dimensional objects and using a Simultaneous Localization and Mapping (SLAM) technique. This tracking system used for Augmented Reality uses markerless techniques so that users can take care of using applications without using markers by directly detecting the surface (ground) carried out by the system using SLAM and being the basis for laying the virtual object. Users can move objects, enlarge and rotate objects so that it can be easier to design the desired layout. The SLAM technology contained in Augmented Reality can allow us to put more than one object. The results of this application in the form of images that we take from the capture feature that is in the application so that it can be a reference model for designing the layout we want. This application runs on the Android mobile platform to make it easier for users to access it.

Keywords : interior design, markerless, augmented Reality, android.

(9)

DAFTAR ISI

Hal.

Persetujuan iii

Pernyataan iv

Penghargaan v

Abstrak vii

Abstract viii

Daftar Isi ix

Daftar Tabel xii

Daftar Gambar xiii

BAB 1 PENDAHULUAN

1.1. Latar Belakang 1

1.2. Rumusan Masalah 2

1.3. Tujuan Penelitian 2

1.4. Batasan Masalah 3

1.5. Manfaat Penelitian 3

1.6. Metodologi Penelitian 3

1.7. Sistematika Penulisan 4

BAB 2 LANDASAN TEORI

2.1. Desain Interior 5

2.2. Augmented Reality 5

2.2.1. Komponen Augmented Reality 7

2.2.2. Sistem Display Augmented Reality 7

2.3. Marker 9

2.3.1. Marker-based tracking 9

2.3.2. Marker-less tracking 9

(10)

x

2.4.1. Gyroscope pada Augmented Reality 11

2.5. Wikitude 13

2.5.1. Fitur-fitur pada SDK Wikitude 13

2.5.2. Arsitektur Wikitude SDK 14

2.6. Unity 3D 16

2.7. Android 16

2.8. Penelitian Terdahulu 17

BAB 3 ANALISIS DAN PERANCANGAN

3.1. Analisis Sistem 19

3.2. Pemodelan Sistem 20

3.2.1. Use Case Diagram 21

3.2.2. Activity Diagram 23

3.3. Perancangan Antarmuka dan Storyboard 25 3.3.1. Rancangan Tampilan Halaman Menu Utama 25 3.3.2. Rancangan Scene Augmented Reality 26

3.3.2.1. Halaman AR Camera 26

3.3.2.2. Halaman Menu Object 27

3.3.2.3. Halaman Control Object 27

3.3.3. Rancangan Scene Pendukung 28

3.3.3.1. Halaman Gallery 28

3.3.3.2. Halaman About 29

BAB 4 IMPLEMENTASI DAN PENGUJIAN

4.1. Implementasi Sistem 30

4.1.1. Spesifikasi perangkat keras dan perangkat lunak yang

digunakan 30

4.1.2. Implementasi Perancangan Antarmuka 31 4.1.2.1. Tampilan Halaman Menu Utama 31 4.1.2.2. Tampilan Halaman AR Camera 31 4.1.2.3. Tampilan Halaman Menu Object 32 4.1.2.4. Tampilan Halaman Control Object 33 4.1.2.5. Tampilan Halaman Menu Gallery 33

(11)

4.1.2.6. Tampilan Halaman Menu About 34

4.2. Pengujian Sistem 34

4.2.1. Pengujian Kinerja Interface 34

4.2.2. Pengujian Simultaneous Localisation and Mapping (SLAM) 39 4.2.3. Pengujian Jarak Pendeteksian SLAM terhadap ground 42 4.2.4. Pengujian Posisi Objek dan pendeteksian posisi Ground 44 4.2.5. Pengujian Pencahayaan dan Bayangan Objek 46

BAB 5 KESIMPULAN DAN SARAN

5.1. Kesimpulan 50

5.2. Saran 50

DAFTAR PUSTAKA 51

(12)

xii

DAFTAR TABEL

Hal.

Tabel 2.1. Penelitian Terdahulu 18

Tabel 3.1. Defenisi Aktor 22

Tabel 3.2. Defenisi Use Case 22

Tabel 3.3. Skenario Use Case Start 22

Tabel 3.4. Rancangan Tampilan Halaman AR Camera 26 Tabel 3.5. Rancangan Tampilan Halaman Menu Object 27 Tabel 3.6. Rancangan Tampilan Halaman Control Object 27

Tabel 3.7. Rancangan Tampilan Halaman Gallery 28

Tabel 3.8. Rancangan Tampilan Halaman About 29

Tabel 4.1. Rencana Pengujian 34

Tabel 4.2. Hasil Pengujian Menu Utama 35

Tabel 4.3. Hasil Pengujian Halaman AR Camera 36

Tabel 4.4. Hasil Pengujian Menu Object 36

Tabel 4.5. Hasil Pengujian Control Object 37

Tabel 4.6. Hasil Pengujian Menu Gallery 38

Tabel 4.7. Hasil Pengujian Menu About 38

Tabel 4.8. Hasil Pengujian Exit 39

Tabel 4.9. Hasil Pengujian Menampilkan Objek 40

Tabel 4.10. Hasil Pengujian Jarak SLAM untuk Mendeteksi Ground 43 Tabel 4.11. Hasil Pengujian Posisi Objek dan Posisi Ground 45 Tabel 4.12. Hasil Pengujian Pencahayaan dan Bayangan Objek 47

(13)

DAFTAR GAMBAR

Hlm.

Gambar 2.1. Milgram’s Reality - Virtuality Continuum 6 Gambar 2.2. Pembentukan objek Virtual pada sistem display AR 8

Gambar 2.3. Fiducial Marker 9

Gambar 2.4. Markerless Image Tracking 10

Gambar 2.5. Sumbu Gyroscope 11

Gambar 2.6. Skema Pengembangan Sistem Gyroscope pada Augmented Reality 12

Gambar 2.7. Arsitektur Wikitude SDK 14

Gambar 3.1. Arsitektur Umum 19

Gambar 3.2. Use case diagram 21

Gambar 3.3. Activity diagram Start 24

Gambar 3.4. Rancangan Tampilan Menu Utama 25

Gambar 4.1. Tampilan Halaman Menu Utama 31

Gambar 4.2. Tampilan Halaman AR Camera 32

Gambar 4.3. Tampilan Halaman Menu Object 32

Gambar 4.4. Tampilan Halaman Control Object 33

Gambar 4.5. Tampilan Halaman Menu Gallery 33

Gambar 4.6. Tampilan Halaman Menu About 34

Gambar 4.7. Pengujian SLAM 39

Gambar 4.8. Indikator SLAM terhadap ground 42

(14)

BAB I PENDAHULUAN

1.1. Latar Belakang

Pesatnya perkembangan teknologi informasi dibidang perangkat lunak maupun perangkat keras semakin memberikan kemudahan bagi masyarakat. Augmented Reality merupakan salah satu perkembangan teknologi informasi dengan penggabungan dari perangkat lunak dan perangkat keras. Augmented Reality pertama kali dikenalkan pada tahun 1950an oleh Morton Heilig yang merupakan seorang cinematographer (Chowanda & Kanigoro, 2011). Augmented Reality (AR) merupakan suatu teknologi yang bertujuan untuk menggabungkan dunia nyata dengan dunia virtual. Pengembangan Augmented Reality (AR) yang dilakukan oleh developer memungkinkan teknologi ini diaplikasikan diberbagai bidang, seperti dunia entertainment, bisnis, pendidikan, dan sebagainya. Hal ini disebabkan oleh fitur yang disajikan oleh Augmented Reality dimana teknologi ini mampu memberikan tampilan visual dalam bentuk objek 2D maupun 3D yang menarik (Rosyid et al, 2011).

Desain interior menjadi suatu tren yang sangat diminati untuk memperindah tampilan ruangan. Kesulitan dalam mengubah tata letak atau menambah koleksi perabotan rumah adalah mengaturnya agar terlihat efisien, ruangan tidak terlalu sempit dan agar tatanan perabotan rumah terlihat indah dipandang. Untuk mengubah tata letak agar tepat membutuhkan pengaturan berulang-ulang sehingga cukup menyita tenaga dan waktu. Teknologi Augmented Reality memungkinkan pekerjaan tersebut menjadi mudah dan efisien, sehingga tidak akan menyita tenaga dan waktu.

Penelitian mengenai Markerless Augmented Reality Android App For Interior Decoration sebelumnya pernah dilakukan oleh Prasad Renukdas et al (2013) membuat aplikasi Augmented Reality berbasis markerless untuk mendesain interior berbasis Android, namun aplikasi ini menggunakan Metaio SDK yang sudah tidak bisa dipakai lagi secara bebas. Penelitian lainnya dilakukan oleh Jani et al (2015) melakukan

(15)

penelitian berjudul Interior Design in Augmented Reality Environment. Penelitian ini membuat Augmented Reality untuk menampilkan furnitur virtual sehingga menjadi media pembelajaran untuk desain interior menggunakan Tangible AR dan ARToolkit tetapi masih menggunakan marker dan multimarker untuk menampilkan 3D objeknya.

Dewasa ini penggunaan ponsel pintar salah satu kebutuhan kebutuhan yang sangat penting bagi masyarakat. Ponsel pintar yang memiliki banyak fungsi dapat memudahkan pengguna dalam kehidupan sehari-hari. Pada penelitian ini, penulis akan membangun sebuah sistem atau aplikasi Augmented Reality secara real-time dan berbasis mobile dan tanpa menggunakan marker atau disebut dengan markerless augmented rality dimana dapat memudahkan seseorang untuk mendesain interior ruangan dengan lebih efektif dan efisien tanpa harus mengalami kesulitan dalam mengaturnya secara manual dan juga menggunakan marker sebagai penanda untuk memunculkan objek 3D. Sistem yang akan dibangun berbasis Android. Oleh karena itu, dirancang suatu sistem aplikasi “Markerless Augmented Reality untuk Penataan Desain Interior Berbasis Android”.

1.2. Rumusan Masalah

Penataan desain interior sebuah ruangan membutuhkan sebuah model yang digambar secara manual ataupun menggunakan software desain dianggap kurang efektif dan efisien karena memerlukan waktu yang cukup lama dalam pembuatannya serta pemodelan dan hanya menyajikan model objek berbentuk 2D yang kurang akan visualisasi realitasnya. Oleh karena itu dibutuhkan sebuah aplikasi dengan menggunakan teknologi Augmented Reality (AR) berbasis Android yang dapat membantu pengguna dalam mendesain suatu ruangan sesuai keinginan dengan lebih mudah dan dapat dilakukan secara real-time. Teknologi Markerless Augmented Reality dapat membuat implementasi Augmented Reality jauh lebih efisien, praktis, menarik, dan bisa digunakan dimanapun, kapanpun tanpa perlu mencetak marker.

1.3. Tujuan Penelitian

Tujuan dari penelitian ini adalah untuk memberikan kemudahan dalam mendesain dekorasi ruangan atau Interior Design menggunakan teknologi Augmented Reality berbasis Android.

(16)

3

1.4. Batasan Masalah

Penelitian dibatasi ruang lingkup pembahasannya, yaitu :

1. Pengaplikasian menggunakan mobile berbasis android dan bersifat offline.

2. Teknologi Markerless dengan mendeteksi sudut dari lensa camera dan menggunakan sensor gyroscope dan sudut yang dilihat merupakan sudut camera terhadap bidang datar.

3. Terdapat 5 jenis perabot rumah yang disajikan, yaitu kursi, meja, lampu hias, lemari, dan hiasan.

4. Terdapat 10 contoh objek perabot rumah.

5. Sistem pencahayaan objek berasal dari sistem, tidak berasal dari sumber cahaya di dunia nyata.

1.5. Manfaat Penelitian

Adapun manfaat dari penelitian ini adalah :

1. Sebagai alat bantu untuk memudahkan dalam mendesain dan mendekorasi ruangan sesuai yang kita inginkan.

2. Sebagai referensi dalam pengembangan di bidang Augmented Reality 1.6. Metodologi Penelitian

Terdapat beberapa tahapan pada penelitian ini adalah sebagai berikut:

1. Studi Literatur

Pada tahap ini dilakukan studi kepustakaan, yaitu proses mengumpulkan bahan referensi mengenai Augmented Reality dan pemodelan objek secara tiga dimensi.

2. Analisis

Pada tahap ini dilakukan analisis terhadap studi literatur untuk mengetahui dan mendapatkan pemahaman mengenai pemodelan objek tiga dimensi melalui teknologi Augmented Reality.

3. Perancangan

Pada tahap perancangan sistem dilakukan perancangan arsitektur, pengumpulan data, dan merancang antarmuka. Proses perancangan ini dilakukan berdasarkan hasil analisis studi literatur yang telah didapatkan.

(17)

4. Implementasi

Pada tahap ini dilakukan pengkodean untuk membangun aplikasi berdasarkan analisis dan perancangan yang telah dilakukan sebelumnya.

5. Pengujian

Pada tahap ini dilakukan pengujian aplikasi untuk mencari kesalahan-kesalahan sehingga dapat diperbaiki.

1.7. Sistematika Penulisan

Sistematika penulisan skripsi ini terdiri dari lima bagian utama antara lain sebagai berikut :

Bab 1: Pendahuluan

Pada bab pendahuluan ini, penulis akan mengumpulkan informasi lebih jauh tentang rancangan Augmented Reality dalam Penataan Desain Interior Berbasis Android, objek tiga dimensi dan penerapan AR Camera untuk permasalahan ini.

Bab 2 : Landasan Teori

Tinjauan pustaka menguraikan landasan teori, kerangka pikir, dan hipotesis yang diperoleh dari acuan yang mendasari dalam melakukan kegiatan penelitian pada tugas akhir ini.

Bab 3 : Analisis dan Perancangan

Bab ini berisi analisis permasalahan serta perancangan struktur aplikasi seperti pemodelan menggunakan flowchart.

Bab 4 : Implementasi dan Pengujian Sistem

Pada bab hasil dan pembahasan akan memaparkan hasil terhadap uji coba pendekatan yang telah dilakukan dalam membangun Augmented Reality dalam Penataan Desain Interior Berbasis Android

Bab 5 : Kesimpulan dan Saran

Bab ini berisi tentang kesimpulan hasil penelitian dan saran-saran yang berkaitan dengan penelitian selanjutnya.

(18)

BAB 2

LANDASAN TEORI

2.1. Desain Interior

Desain berasal dari kata bahasa Inggris design, dalam bahasa Indonesia sering digunakan padanan katanya, yaitu rancangan, pola atau cipta. Desain merupakan suatu proses pengorganisasian unsur garis, bentuk ukuran, warna, tekstur, bunyi, cahaya, aroma dan unsur-unsur desain lainnya, sehingga tercipta suatu hasil karya tertentu (Nurhayati, 2004).

Dalam Kamus Besar Bahasa Indonesia (2008: 560), Interior adalah bagian dalam gedung atau ruang, tatanan perabot atau hiasan di dalam ruang bagian dalam gedung. Bila diartikan, desain interior adalah gagasan awal yang diperuntukkan bagi suatu ruangan atau suatu perencanaan dari bagian dalam suatu bangunan sehingga ruangan tersebut memiliki nilai kehidupan (estetika).

Menurut Suptandar (1995), desain interior berarti suatu sistem atau cara pengaturan ruang dalam yang mampu memenuhi persyaratan kenyamanan, keamanan, kepuasan kebutuhan fisik dan spiritual bagi penggunanya tanpa mengabaikan faktor estetika.

2.2. Augmented Reality

Augmented Reality (AR) merupakan variasi dari Virtual Environment (VE) atau Virtual Reality (VR). Teknologi VE secara menyeluruh membenamkan user dalam lingkungan sintetik. Saat terbenam itu, seorang user tidak dapat membedakan benda nyata disekitarnya. Sebaliknya, AR memungkinkan user untuk melihat dunia nyata, dengan objek virtual yang dilapiskan diatasnya atau digabung dengan dunia nyata.

Maka AR menambah realitas, bukan menggantinya. Idealnya, user akan merasakan benda virtual dan nyata tampil berdampingan di ruang yang sama. (Azuma, 1997).

(19)

AR pada dasarnya merupakan variasi lain dari realitas virtual. Teknologi realitas virtual membenamkan user secara penuh dengan lingkungan sintetis, pada saat masuk kedalam dunia buatan itu, user tidak dapat mengenali lingkungan nyata disekitarnya.

Namun AR tidak memisahkan yang nyata dengan virtual, namun menggabungkan keduanya pada ruang yang sama. Selain menambahkan benda virtual dalam lingkungan nyata, AR juga berpotensi menghilangkan benda-benda yang sudah ada.

Menambah sebuah lapisan gambar maya dimungkinkan untuk menghilangkan atau menyembunyikan lingkungan nyata dari penglihatan user. Misalnya, untuk menyembunyikan sebuah kursi dalam lingkungan nyata, perlu digambarkan lapisan representasi tembok dan lantai kosong yang diletakkan diatas gambar kursi nyata, sehingga menutupi kursi nyata dari pandangan user. (Milgram et al, 1994)

Gambar 2.1. Milgram’s Reality - Virtuality Continuum (Milgram et al, 1994)

Pada Gambar 2.1, Milgram et al menjelaskan ada bagian celah yang menjadi pemisah antara lingkungan nyata dan lingkungan virtual. Diantara kedua lingkungan itu terdapat dua bagian yang menjadi jembatan yang memiliki bentuk yang berbeda.

Dua bagian itu adalah Augmented Reality dan Augmented Virtuality. Posisi kedua bagian tersebut berbeda untuk Augmented Reality yang lebih dekat kepada lingkungan nyata, sedangkan Augmented Virtuality yang lebih dekat kepada lingkungan virtual.

Bagian kiri adalah lingkungan nyata yang terdapat benda – benda nyata, sedangkan pada bagian kanan adalah lingkungan virtual yang terdapat benda – benda tidak nyata seperti lingkungan yang terdapat pada film animasi 3D maupun 2D. Pada bagian Augmented Reality, lingkungan bersifat nyata dan benda bersifat virtual, sedangkan pada bagian Augmented Virtuality benda bersifat nyata dan lingkungan bersifat virtual. Pengelompokan Augmented Reality dan Augmented Virtuality sering disebut sebagai Mixed Reality karena Augmented Reality dan Augmented Virtuality

(20)

7

merupakan gabungan dari lingkungan nyata dan lingkungan virtual. (Milgram et al, 1994).

2.2.1. Komponen Augmented Reality

Terdapat beberapa komponen Augmented Reality untuk mendukung kinerja pengolahan citra digital. Komponen-komponen tersebut sebagai berikut (Silva et al, 2003) :

1. Scene Generator

Scene generator merupakan perangkat lunak untuk melakukan proses rendering.

Rendering adalah proses membangun gambar atau objek tertentu dalam aplikasi AR.

2. Tracking System

Tracking system merupakan komponen yang terpenting dalam AR. Pada proses mendeteksi objek virtual dengan objek nyata akan dideteksi dengan pola tertentu.

3. Display

Dalam pengembangan sistem AR terdapat beberapa faktor yang perlu diperhatikan yaitu faktor fleksibilitas, titik pandang, area pendeteksian, dan resolusi. Pada faktor area pendeteksian, faktor cahaya sangat mempengaruhi dalam proses display.

4. AR Devices

Saat ini AR dapat digunakan pada device smartphone maupun PC. Teknologi AR telah tersedia pada berbagai platform, yaitu Android, Iphone, Windows Phone, Windows, Linux, dan lainnya.

2.2.2. Sistem Display Augmented Reality

Sistem tampilan AR merupakan sistem pembentukan objek virtual pada jalur optik diantara mata pengamat dan objek nyata dengan menggunakan seperangkat alat optik, elektronik dan komponen mekanik (Bimber & Raskar, 2005).

(21)

Gambar 2.2. Pembentukan objek Virtual pada sistem display AR (Bimber &

Raskar, 2005)

Gambar 2.2 menggambarkan berbagai kemungkinan dari mana gambar dapat dibentuk untuk mendukung aplikasi Augmented Reality, dimana display terletak sehubungan dengan pengamat dan objek nyata, dan jenis gambar yang dihasilkan.

(Bimber & Raskar, 2005)

Pembentukan objek virtual dibagi menjadi 3 kategori, yaitu (Bimber & Raskar, 2005):

1. Head-Attached Display

Head-Attached Display merupakan sistem display AR dimana user mengenakan perangkat keras AR di kepala.

2. Hand-Held Display

Hand-Held Display merupakan sistem display AR dimana objek virtual terbentuk dalam jangkauan tangan user.

3. Spatial Display

Spatial Display merupakan sistem display AR yang memproyeksikan objek virtual ke lingkungan nyata menggunakan proyektor digital atau tergabung dengan lingkungan nyata menggunakan panel tampilan.

(22)

9

2.3. Marker

Augmented Reality membutuhkan suatu marker untuk dikenali agar dapat menentukan bagaimana dan dimana objek tambahan itu akan ditampilkan. Mengacu pada hal ini, Augmented Reality dibagi kedalam 2 jenis yaitu Marker-based tracking dan Marker- less tracking. (Johnson et al, 2010).

2.3.1. Marker-based tracking

Augmented Reality jenis ini menggunakan kamera dan penanda visual atau yang biasa disebut marker untuk menampilkan konten tambahan. Marker adalah sebuah tanda visual berbentuk persegi yang terdiri dari warna hitam dan putih dimana warna hitam merupakan garis pinggir dan tebal dan warna putih berada di bagian dalam.

Keuntungan dari penggunaan warna hitam dan putih yaitu untuk dengan mudah memisahan antara marker dan latar belakangnya. Bagian dalam dari marker merupakan penanda dari marker tersebut. Marker yang seperti ini bisa disebut sebagai fiducial marker. Contoh dari marker dapat dilihat pada Gambar 2.3, dapat terlihat marker memiliki warna hitam putih dan memiliki gambar kupu-kupu didalam kotak warna putih dibagian dalam.

Gambar 2.3. Fiducial Marker (Siltanen, 2012) 2.3.2. Marker-less tracking

Marker-less tracking merupakan sebuah metode Augmented Reality dimana proses tracking tidak lagi hanya menggunakan marker sebagai target deteksi. Dengan adanya metode ini, proses Augmented Reality tidak lagi terbatas pada marker saja, namun gambar visual, objek 3D, GPS atau wajah yang dapat dijadikan sebagai target deteksi.

Perbedaan antara marker-based dengan marker-less adalah pada proses tracking posisi kamera dan orientasi kamera dihitung dengan marker yang telah ditetapkan.

Sedangkan pada marker-less menghitung posisi dan orientasi kamera dan dunia nyata tanpa ada ketentuan tertentu, hanya menggunakan fitur alami seperti edge, corner, garis ataupun model 3D. Adapun metode marker-less yang digunakan dalam

(23)

penelitian ini adalah metode image tracking dimana gambar visual dijadikan sebagai target untuk aplikasi Augmented Reality yang dibangun. Contoh aplikasi Augmented Reality image tracking dapat dilihat pada Gambar 2.4. Dapat terlihat setelah objek teko muncul diatas marker bergambar setelah di-tracking oleh sistem.

Gambar 2.4. Markerless Image Tracking (Cushnan & El Habbak, 2013) 2.4. Gyroscope Sensor

Menurut Kamus Besar BahasaIndonesis (KBBI) gyroscope adalah alat berupa cakram yang sumbunya berputar pada dua penopang dan tetap pada posisinya apabila tidak ada pengaruh kekuatan luar. Gyroscope umumnya digunakan sebagai pengukur orientasi yang berdasarkan pada prinsip momentum sudut. Penggunaan gyroscope pada smartphone adalah untuk memeriksa kemiringan atau memutar gerakan smartphone.

Gyroscope suatu alat sensor yang digunakan untuk menentukan orientasi gerak yang bertumpu pada tiga roda cakram yang berotasi pada masing-masing sumbunya.

Gyroscope memiliki output yang peka terhadap kecepatan sudut dari arah sumbu x yang nantinya akan menjadi sudut phi (roll), dari sumbu y nantinya akan menjadi sudut theta (pitch), dan sumbu z nantinya menjadi sudut psi (yaw) (Putra, M.R.F. et al, 2016)

(24)

11

Gambar 2.5. Sumbu Gyroscope

2.4.1. Gyroscope pada Augmented Reality

Dalam Augmented Reality (AR) fitur gyroscope dimanfaatkan dalam memproyeksikan objek agar dapat dilihat dari berbagai sudut dan tidak terganggu pada lingkungan nyata. Tidak seperti teknologi Augmented Reality pada umumnya yang menggunakan marker base, dengan menggunakan gyroscope setiap bagian lingkungan bisa dijadikan sebagai target atau marker. Pada Augmented Reality , sensor gyroscope bekerja untuk menentukan objek dalam koordinat yang telah ditentukan dari setiap arah mata angin tanpa markless.

Berikut contoh skema pengembangan Augmented Reality dengan menggunakan sensor gyroscope seperti pada penelitian yang dilakukan oleh Indrawan, I.W.A., et al (2017) dapat dilihat pada Gambar

(25)

Gambar 2.6. Skema Pengembangan Sistem Gyroscope pada Augmented Reality (Indrawan, I.W.A. et al, 2017)

Proses pertama di back-end mencakup penciptaan aplikasi Augmented Reality dengan Unity dan kamera yang disebut CamGyroAR.cs dan fitur giroscope yang ada di smartphone. Proses kedua dari bagian back-end adalah menggabungkan CamGyroAR.cs (tracking giroskop) dengan model 3 dimensi. Penggabungan yang diusulkan adalah hubungan yang saling terkait antara pelacakan giroskop dan 3 dimensi model. Langkah terakhir dari bagian back-end adalah pembentukan Aplikasi File Paket (file APK). File APK dibuat untuk memungkinkan aplikasi yang dimiliki telah dibuat untuk bisa digunakan langsung di smartphone Android. Proses di front- end adalah saat file APK telah terinstal di Android smartphone atau tablet Proses utama di front-end adalah dengan melakukan tracking sensor giroskop untuk menampilkan objek 3 dimensi. Pelacakan giroskop bekerja dengan teknik rotasi 360 derajat di mana setiap putaran memiliki keluaran berbeda sesuai dengan gravitasi yang dilakukan oleh pengguna sistem. (Indrawan, I.W.A. et al, 2017).

Sensor gyroscope menjadi peran penting dalam tampilan adegan AR view karena dapat membuat kamera smartphone bisa dirotasikan 360 derajat, dan dapat bertindak sebagai koordinat untuk menempatkan objek. Dengan menggunakan gyroscope menjadikan aplikasi menjadi lebih interaktif dan realtime.

(26)

13

2.5. Wikitude

Wikitude SDK adalah Augmented Reality Software Development Kit(SDK) untuk perangkat mobile dengan sistem operasi android dan ios. Wikitude SDK merupakan produk yang diciptakan oleh Wikitude GmbH yang berlokasi di Salzburg, Austria.

Didirikan pada tahun 2008 Wikitude GmbH awalnya memfokuskan pengembangan Augmented Reality berbasis lokasi dengan produk Wikitude Browser. Namun sejak 2011 Wikitude GmbH mulai melihat potensi pasar yang cukup menjanjikan di bidang pengembangan teknologi Augmented Reality sehingga mulai menciptakan pengembangan teknologi dengan marker, 3D object rendering, pengenalan objek tiga dimensi, tracking dua dimensi maupun tiga dimensi, pengenalan wajah (face detection), serta kontrol sensor.

2.5.1. Fitur-fitur pada SDK Wikitude

1. Simultaneous Localisation and Mapping (SLAM)

Teknologi ini memungkinkan aplikasi AR untuk Mengenali Objek dan melipatgandakan augmentasi digital interaktif. Selain itu, ia mengaktifkan Pelacakan Instan posisional: SDK mengenali fitur-fitur adegan, serta posisi relatifnya dan, berdasarkan pergerakan pengguna, ia menyelaraskan konten yang diperbesar dengan sesuai.

2. Seamless Augmented Reality Tracking (SMART)

SMART mencakup mesin fitur lengkap ARKit, ARCore, dan Wikitude dalam satu SDK tunggal, cross-platform, untuk perangkat apa pun. Fitur SMART Wikitude memastikan pengiriman pengalaman AR terbaik pada berbagai perangkat yang lebih luas, mencakup 92,6% perangkat iOS dan sekitar 35%

perangkat Android yang tersedia di pasar.

3. Image Recognition

Library pada Wikitude AR bekerja hingga 1000 gambar yang dapat dikenali secara offline dan dengan ribuan gambar target yang dihosting di cloud. Fitur ini memungkinkan untuk secara instan mendeteksi gambar dalam tampilan kamera dan menghamparkannya dengan konten HTML, gambar 2D atau 3D, animasi, dan suara. Pengembang dapat mengatur pengenalan gambar untuk beberapa target secara bersamaan.

(27)

4. Geo Location

Framework pengembangan Augmented Reality Wikitude dilengkapi dengan banyak fitur mudah yang menyederhanakan bekerja dengan data geo-referensi.

Desain dan tata letak tempat menarik (Point Of Interest) sepenuhnya dapat disesuaikan untuk memenuhi berbagai kebutuhan. Pengembang dapat membuat satu atau beberapa penanda geografis dan memungkinkan pengguna untuk memilih dan berinteraksi dengan augmentasi yang melapisi geo POI.

Geospatial Augmentation bervariasi antara 2D, gambar 3D, animasi, video, dan suara. Tergantung pada usecase, lokasi digunakan melalui GPS (Global Positioning System), jaringan atau suar.

2.5.2. Arsitektur Wikitude SDK

Gambar 2.7. Arsitektur Wikitude SDK (Wikitude, Wikitude SDK Documentation, 2018)

Arsitektur Wikitude SDK memiliki dua Application Programmming Interface (API) utama yaitu Javascript API yang menggunakan Javascript sebagai struktur pengaksesesan dan pengkodean SDK dan Native API yang menggunakan bahasa native sesuai platform masing masing, misalnya android menggunakan Java, ios menggunakan Objective C, ataupun menggunakan C# jika melakukan development melalui Unity 3D dengan bantuan Wikitude Unity Plugin. Javascript API juga

(28)

15

a. Architech World

Architect World merupakan komponen Wikitude SDK yang digunakan untuk mengakses wikitudesdk.aar untuk memanggil dunia Augmented Reality dan membuka kamera secara instan. Architect World bisa diakses di kode native maupun di kode javascript. Architect World memuat tampilan transparan dengan mengaktifkan kamera smartphone, tampilan ini dinamakan architect view.

Architect World merupakan sesuatu yang wajib dan penting tanpa memanggil fungsinya pada kode program maka fungsi tracking dan pengenalan objek tidak dapat dijalankan.

b. Target Manager

Wikitude SDK menyediakan situs pengelola target image yang menjadi marker dari aplikasi. Di situs pengelolah target image pengguna Wikitude SDK dapat menambah (upload), mengubah, dan menghapus target yang akan menjadi marker dalam aplikasi yang dikembangkannya. Kemudian target bisa di host melalui wikitude Cloud Service agar dapat diakses secara online (Cloud recognition) ataupun di generate wtc filenya agar bisa diunduh dan dimasukan ke folder aset aplikasi agar dapat mengenal target-target tersebut sebagai marker secara offline. Wtc file adalah sebuah berkas yang memberikan instruksi pengenalan pola target yang terdaftar agar mampu dikenali oleh image tracker.

c. Image Tracker

Image Tracker Wikitude mengandung Computer Vision Engine yang `dapat mendeteksi dan melacak objek dunia nyata yang ada pada video kamera.

Berdasarkan gambar dari kamera, engine bertugas mengenali objek yang masuk dalam daftar yang trackable. Hasilnya adalah augmentasi data virtual pada objek nyata tersebut.

d. Location Data Service

Wikitude GmbH menyediakan Location Based Service (LBS) melalui wikitude browser, selain itu LBS juga dapat digunakan ke dalam aplikasi dengan menerapkan location strategy dari kode aplikasi melalui Wikitude SDK. Wikitude SDK menerapkan basic location strategy untuk mengakses location data service wikitude dan menampilkan POI pada lokasi tersebut. Basic Location Service adalah cara paling umum yang digunakan pengembang aplikasi berbasis lokasi

(29)

melalui GPS, pengembang juga bisa menerapkan strategi lokasi lainnya sesuai kasus aplikasi yang sesuai dengan kriteria dan preferensi (Wikitude SDK Documentation, 2014).

2.6. Unity 3D

Unity merupakan game engine cross-platform yang dibuat oleh Unity Technologies.

Game engine nya dibangun IDE dan kemampuan untuk dibuat ke berbagai platform.

Lebih dari satu juta pengembang, sampai saat ini membuat game terkenal menggunakan Unity. Hal ini dirancang untuk kemudahan user dan produktivitas yang tinggi. Dan karena cara belajar yang relatif mudah dan menawarkan versi gratis, mendorong beberapa sekolah untuk mengajarkan Unity sebagai pengantar untuk pengembangan game (Cushnan & El Habbak, 2013).

Kekuatan terbesar Unity adalah kemampuannya untuk dibuat pada sejumlah besar platform dengan mudah. Unity dapat dibuat untuk membuat game pada Windows, OS X, iOS, Android, Web Plugin, Flash, Xbox 360, PlayStation 3, dan Wii U. Membuka banyak peluang ketika mengembangkan menggunakan Unity. Unity memungkinkan user untuk memilih dari tiga bahasa untuk menulis bahasa pemrograman. Bahasa yang tersedia adalah JavaScript, C #, atau Boo. Unity menggunakan MonoDevelop untuk debugging. Dalam proyek game yang sama, kombinasi script menggunakan bahasa yang berbeda diperbolehkan, meskipun dianjurkan untuk hanya menggunakan satu bahasa di seluruh proyek untuk menghindari konflik dan menjadi lebih mudah untuk dibaca dan dipahami (Cushnan

& El Habbak, 2013).

2.7. Android

Android adalah sistem operasi mobile dan platform yang didasari oleh Linux kernel versi 2.6 dan tersedia secara bebas untuk penggunaan commercial ataupun non- commercial dan bersifat open source.

Saat kita ingin membuat game menggunakan android, platform pada android memiliki beberapa kemudahan (James, 2013), yaitu:

1. Android adalah open platform, yang artinya android tidak membatasi apa yang kita bisa akses atau apa yang bisa kita lakukan.

(30)

17

2. Android adalah mobile platform yang paling cepat berkembang, yang artinya lebih banyak orang yang akan mengunduh dan memainkan game kita.

2.8. Penelitian Terdahulu

Penelitian tentang Augmented Reality telah banyak diimplementasikan diberbagai bidang. Seperti edukasi, kedokteran, marketing, budaya, bisnis dan banyak lagi. Pada umumnya Augmented Reality diimplementasikan sebagai media pengenalan atau pembelajaran. Sehingga membuat belajar menjadi lebih menarik dan interaktif.

Jani et al (2015) melakukan penelitian berjudul Interior Design in Augmented Reality Environment. Penelitian ini membuat Augmented Reality untuk menampilkan furnitur virtual sehingga menjadi media pembelajaran untuk desain interior.

Menggunakan Tangible AR dan ARToolkit yang masih menggunakan marker dan multi marker.

Rosyid et al (2011) melakukan penelitian berjudul Perancangan dan Implementasi Aplikasi Desain Interior Berbasis Teknologi Augmented Reality.

Penelitian ini menggunakan Adobe Flex dan ARToolkit Marker Generator dengan menggunakan marker untuk menampilkan visual dalam bentuk 3D sesuai dengan yang dirancang.

Renukdas et al (2013) membuat penelitian Markerless Augmented Reality Android App For Interior Decoration. Membuat aplikasi Augmented Reality berbasis markerless untuk mendesain interior, di mana setiap pengguna pemula dapat dengan mudah menghias rumahnya. Aplikasi ini berbasis Android dan menggunakan Metaio SDK dan ARToolkit.

Chowanda dan Kanigoro (2011) membuat penelitian berjudul Pengaturan Tata Letak Perabotan Rumah Dengan Augmented Reality. Tujuan dari penelitian ini adalah untuk meneliti state-of-the-art dari teknologi, sistem, dan aplikasi dari augmentedreality dan juga penerapan teknologi Augmented Reality menggunakan marker untuk membantu pengaturan tata letak perabotan rumah.

Shedole et al (2015) membuat penelitian berjudul Markerless Augmented Reality For Interior Designing Using Android. Membuat aplikasi Augmented Reality berbasis markerless untuk mendesain interior menggunakan Junaio SDK dan ARToolkit.

(31)

Rangkuman dari penelitian terdahulu mengenai perancangan permainan dapat dilihat pada tabel 2.1.

Tabel 2.1. Penelitian Terdahulu

No. Judul Peneliti Tahun

1. Interior Design in Augmented Reality Environment Prof. B. Y. Jani et al

2015

2. Perancangan dan Implementasi Aplikasi Desain Interior Berbasis Teknologi Augmented Reality

Rosdianah Rosyid et al

2011

3. Markerless Augmented Reality Android App For Interior Decoration

Prasad Renukdas et al

2013

4. Pengaturan Tata Letak Perabotan Rumah Dengan Augmented Reality

Andry Chowanda dan Bayu Kanigoro

2011

5. Markerless Augmented Reality For Interior Designing Using Android

Akash Shedole et al

2015

6. Markless Augmented Reality Utilizing Gyroscope to Demonstrate the Position of Dewata Nawa Sanga.

Indrawan, I.W.A. et al.

2017

(32)

BAB 3

ANALISIS DAN PERANCANGAN

Bab ini membahas tentang analisa implementasi Augmented Reality dengan memanfaatkan Simultaneous Localisation and Mapping (SLAM) dan Markerless Tracking untuk menampilkan multi objek 3D. Bab ini juga membahas tentang perancangan sistem.

3.1. Analisis Sistem

Adapun arsitektur umum aplikasi ini dapat dilihat pada gambar berikut :

Pemilihan Objek 3D INPUT

Camera Ponsel

USER

PROSES Wikitude Tracker

SLAM

Markerless Tracking Method

Rendering Object

Placing, Scaling &

Rotating Object OUTPUT

Adding more Object

Capturing Preview Design

Gambar 3.1. Arsitektur umum

(33)

Berikut penjelasan tahapan-tahapan yang terdapat pada arsitektur umum : a. Input

User menjalankan aplikasi Augmented Reality Decor AR yang terdapat pada smartphone. User menekan tombol Start untuk memulai aplikasi dan akan memunculkan tampilan AR Camera. User memilih objek 3D yang ingin ditampilkannya sehingga akan muncul tampilan memilih objek perabot rumah tangga yang akan ditampilkan.

b. Proses

Sistem mengidentifikasi permukaan datar pada lantai dengan AR Tracking SLAM untuk menentukan sudut dan melacak posisi untuk menampilkan objek 3D.

Sebelumnya telah dibuat objek 3D melalui 3D Studio Max, lalu diekspor ke format OBJ atau FBX lalu diekspor melalui Unity 3D. Kemudian sistem akan menyesuaikan sesuai objek 3D yang telah dipilih. Lalu sistem akan melakukan rendering objek 3D.

Dan menampilkan objek 3D perabot rumah tangga ke layar smartphone. Objek 3D akan ditempatkan dibagian kiri bawah dari layar smartphone. dan dapat diubah letaknya dengan menggeser objek tersebut dengan menggesernya dengan menggunakan jari dan juga dapat membesarkan dan merotasi objek 3D tersebut. User juga dapat menambahkan lebih dari satu objek yang diinginkan sehingga bisa menata dan mendesai tata letak perabot rumah pada ruang tersebut.

c. Output

Output yang dihasilkan berupa objek 3D yang menyesuaikan dengan permukaan lantai. User juga dapat mengubah letaknya dengan menggeser objek tersebut dengan menggesernya dengan menggunakan jari dan juga dapat membesarkan dan merotasi objek 3D tersebut. User juga dapat menambahkan lebih dari satu objek yang diinginkan sehingga bisa menata dan mendesain tata letak perabot rumah pada ruang tersebut.

3.2. Pemodelan Sistem

Pemodelan sistem berfungsi untuk menentukan fungsi-fungsi yang dapat dilakukan oleh sistem pada aplikasi serta menentukan kelas yang dibutuhkan untuk realisasi fungsi-fungsi sistem yang telah dianalisis sebelumnya dan mendeskripsikannya

(34)

21

Tahap-tahap pemodelan dalam analisis tersebut antara lain Use Case dan Diagram, Activity Diagram.

3.2.1. Use Case Diagram

Digunakan untuk memodelkan atau menggambarkan batasan sistem dan fungsi-fungsi utamanya. Mendeskripsikan fungsi dari sebuah sistem dari perspektif pengguna. Use case terdiri dari tiga bagian yaitu definisi actor, definisi use case, dan scenario use case. Use case dari aplikasi DecorAR dapat dilihat pada Gambar 3.11.

Gambar 3.2. Use case diagram

1. Definisi Aktor

Definisi Aktor berfungsi untuk mendeskripsikan peran aktor dalam sistem ini.

Definisi tersebut dapat dilihat pada Tabel 3.1.

USER

Proses Tracking

Menampilkan 3D Model START

Melakukan Kontrol 3D Model

Menampilkan Kontrol Model

<<INCLUDE>>

<<EXTEND>>

<<INCLUDE>>

(35)

Tabel 3.1. Definisi Aktor

No. Aktor Deskripsi

Ak-01 User Merupakan aktor atau pengguna akhir yang berperan dalam penggunaan aplikasi DecorAR.

2. Definisi Use Case

Definisi Use Case berfungsi untuk menjelaskan proses yang terdapat pada setiap use case. Definisi tersebut dapat dilihat pada Tabel 3.2.

Tabel 3.2. Definisi Use case

No. Nama Use Case Deskripsi

Ucf-01 Start Fungsi utama yang menampilkan kamera Augmented Reality.

3. Scenario Use Case

Scenario Use Case berfungsi untuk menunjukkan lebih rinci penjelasan setiap bagian proses yang terdapat pada use case. Di dalam skenario use case akan tergambar jelas, dimana user memberikan perintah dan respon apa saja yang diberikan oleh sistem. Scenario Use case Start dapat dilihat pada Tabel 3.3.

Tabel 3.3. Skenario Use case Start Identifikasi

Nama Use case Start

Aktor User

Deskripsi Use case yang menampilkan kamera augmented reality, sehingga user bisa melakukan pemilihan objek.

Pre-condition Aplikasi telah dibuka/berjalan

(36)

23

Tabel 3.3. Skenario Use case Start (lanjutan) Typical course of event

Aksi Aktor Reaksi Sistem

Langkah 1:

User menekan tombol Sart

Langkah 2:

Tracking AR camera dengan mendeteksi permukaan lantai dengan SLAM.

Langkah 3:

Sistem menampilkan kamera augmented reality, menu objek dan melakukan pemilihan objek

Langkah 4:

Sistem menampilkan objek 3D perabot rumah tangga.

Langkah 5:

Sistem menampilkan menu untuk mengontrol objek (menindahkan, membesarkan/mengecilkan, dan merotasi)

Langkah 6:

User dapat mengambil gambar hasil dari desain yang telah dibuatnya.

Post Condition Tampilan desain interior objek 3D perabot rumah tangga.

3.2.2. Activity Diagram

Activity diagram atau diagram aktivitas adalah diagram yang menggambarkan berbagai alur aktivitas dalam sistem yang sedang dirancang, bagaimana masing- masing alur sistem berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi. Activity diagram Start menjelaskan aktivitas sistem aplikasi dalam menjalankan kamera untuk memulai proses tracking. Diagram aktivitas Start dapat dilihat pada Gambar 3.3.

(37)

Gambar 3.3. Activity diagram Start

U S E R S I S T E M

Buka Aplikasi Tampilan Menu

Utama

Pilih button start

Camera AR aktif Tracking SLAM aktif

Pemilihan objek 3D Rendering objek 3D

Penambahan Objek

Mengambil gambar hasil desain dengan fitur

screenshot

Menampilkan objek 3D

Back Tampilan Menu

Utama YA

TIDAK

(38)

25

3.3. Perancangan Antarmuka dan Storyboard

Dalam membangun aplikasi pada penelitian ini diperlukan adanya perancangan antarmuka (interface), yaitu gambaran umum perancangan setiap tampilan yang terdapat pada aplikasi yang dibangun. Sedangkan Storyboard merupakan narasi dan visualisasi perencanaan serta alur penggunaan aplikasi yang ingin dibangun tersebut.

Rancangan antarmuka dan storyboard ini diharapkan dapat memberikan kemudahan bagi user dalam menggunakan aplikasi. Pada aplikasi ini terdapat 2 (dua) scene dan 5 (lima) tampilan halaman. Scene yang terdapat pada aplikasi ini yaitu scene Augmented Reality dan scene Pendukung. Adapun 5 (lima) tampilan yang akan dirancang pada aplikasi ini, yaitu halaman Menu Utama, halaman AR Camera, Menu Object, Control Object, halaman Gallery, dan halaman About. Pada scene Augmented Reality didalamnya terdapat halaman AR Camera, Menu Object dan Control Object, sedangkan scene Pendukung terdapat halaman Gallery dan About.

3.3.1. Rancangan Tampilan Halaman Menu Utama

Pada halaman menu utama terdapat beberapa tombol yang dapat dipilih para pengguna aplikasi. Halaman Menu Utama ini merupakan tampilan awal untuk memulai aplikasi.

Beberapa pilihan tombolnya seperti seperti Start, Gallery, About dan Quit. Gambaran rancangan tampilan menu utama dapat dilihat pada Gambar 3.5.

Gambar 3.4. Rancangan Tampilan Menu Utama

Logo DecorAR

Galery About Start

Exit

Logo USU

Profile

(39)

Keterangan :

1. Start : Apabila user menekan tombol ini, maka akan terbuka menu untuk mengaktifkan scene Augmented Reality dan AR Camera.

2. Gallery : Tombol ini berisi hasil gambar desain yang diambil.

3. About : Tombol ini akan memunculkan informasi tentang aplikasi.

4. Exit : Tombol ini berfungsi untuk keluar atau menutup aplikasi.

3.3.2. Rancangan Scene Augmented Reality

Tabel 3.4. Rancangan Tampilan Halaman AR Camera

3.3.2.1. Halaman AR Camera

Halaman ini menunjukan penerapan dari sistem Augmented Reality. Pada tahap ini akan muncul gambar yang ditangkap oleh kamera pada smartphone user dan memunculkannya pada Layar Camera. Pada tahap ini juga halaman AR Camera masing kosong dan user dapat memilih lokasi dimana untuk menentukan ground yang menjadi peletakan objek 3D.

Keterangan Navigasi :

1. Main Menu : Berfungsi untuk kembali ke menu awal.

2. Capture : Berfungsi mengambil gambar hasil dari desain objek 3D yang ditampilkan.

3. Place Object : Berfungsi untuk menampilkan menu untuk memilih objek.

4. Light button : Berfungsi untuk membuat kondisi dari ruangan bercahaya atau tidak bercahaya

5. Clear : Berfungsi untuk menghapus semua objek 3D yang telah dimunculkan pada layar AR Camera

LAYAR CAMERA

Place Object

Capture Main

Menu

Clear Light

button

(40)

27

Tabel 3.5. Rancangan Tampilan Halaman Menu Object

3.3.2.2. Halaman Menu Object

Halaman ini berisi pilihan objek perabotan rumah yang ingin ditampilkan. User dapat memilih objek 3D yang ingin ditampilkan, maka sistem akan rendering objek 3D yang akan ditampilkan langsung pada halaman AR Camera dan memunculkan objek 3D pada layar camera.

1. Back : Berfungsi untuk kembali ke halaman AR Camera.

2. Preview Object : Tombol yang menampilkan gambar objek 3D dan juga sebagai tombol untuk memunculkan objek 3D tersebut Tabel 3.6. Rancangan Tampilan Menu Control Object

3.3.2.3. Halaman Control Object

Halaman ini berisi untuk mengontrol objek 3D dengan mengubah posisi, memperbesar dan merotasi objek 3D perabot rumah sehingga dapat mendesain ruangan lebih mudah sesuai yang diinginkan. User dapat menggunakan bar yang tersedia untuk merotasi objek dan menggunakan kedua jari untuk

memperbesar dan

memperkecil objek.

LAYAR CAMERA

Preview Object

LAYAR CAMERA

Delete Object

Name Rotate

✓

Object 3D Back

(41)

1. Delete : Berfungsi untuk menghapus objek 3D yang dipilih.

2. Object’s name : Berfungsi menampilkan nama dari objek yang ditampilkan.

3. Rotate : Berfungsi untuk merotasi atau mengubah sudut tampilan objek.

4. ✓ : Berfungsi untuk menyimpan posisi objek 3D sesuai yang telah ditentukan

3.3.3. Rancangan Scene Pendukung

Tabel 3.7. Rancangan Tampilan Halaman Gallery

3.3.3.1. Halaman Gallery

Halaman ini menunjukan kepada User hasil gambar yang kita desain pada aplikasi. User dapat mengambil setiap gambar desain dan menyimpannya ke dalam gallery aplikasi ambil dengan menggunakan fiture Capture pada aplikasi dari desain yang telah kita buat.

Keterangan Navigasi :

1. Back : Berfungsi untuk kembali ke halaman Main Menu.

2. Previous : Berfungsi untuk memunculkan hasil gambar yang sebelumnya.

3. Next : Berfungsi untuk memunculkan hasil gambar yang selanjutnya.

GAMBAR

Previous Next

Back

(42)

29

Tabel 3.8. Rancangan Tampilan Halaman About

3.3.3.2. Halaman About

Halaman About ini

menampilkan informasi kepada user tentang aplikasi dan pengembangan aplikasi tersebut.

Keterangan Navigasi :

1. Back : Berfungsi untuk kembali ke halaman Main Menu.

2. Text : Menampilkan informasi tentang aplikasi.

TEXT

Back

(43)

BAB 4

IMPLEMENTASI DAN PENGUJIAN

Bab ini akan membahas tentang hasil yang diperoleh dari implementasi teknologi Markerless Augmented Reality serta penjelasan mengenai pengujian aplikasi yang dibangun sesuai dengan analisis dan perancangan yang telah dibahas pada Bab 3.

4.1. Implementasi Sistem

Setelah proses analisa dan perancangan sistem selesai, selanjutnya proses implementasi library Wikitude SDK ke dalam aplikasi dengan menggunakan developing tool Unity3D untuk membangun aplikasi.

4.1.1. Spesifikasi perangkat keras dan perangkat lunak yang digunakan

Spesifikasi perangkat keras dan perangkat lunak yang digunakan untuk membangun sistem adalah sebagai berikut :

a. Perangkat Keras

1. Prosesor Intel Core i5-3210M CPU 2.50 GHz 2. Kapasitas harddisk 500 GB

3. Memori 8.00 RAM DDR3 4. AMD Radeon HD 7550M 5. Mouse

6. Smartphone (Asus Zenfone 3, Layar 5.2”, RAM 4GB, Memori Internal 64GB, Android 8.0. Oreo)

b. Perangkat Lunak 1. Unity 3D 2. Wikitude SDK 3. Android SDK

4. Sistem operasi yang digunakan adalah Microsoft Windows 8.1. Professional 5. Adobe Photoshop

(44)

31

4.1.2. Implementasi Perancangan Antarmuka

Adapun implementasi perancangan antarmuka berdasarkan rancangan yang telah dilakukan pada Bab 3 adalah sebagai berikut.

4.1.2.1. Tampilan Halaman Menu Utama

Setelah halaman splash screen, maka user akan ditujukan pada halaman utama. Pada tampilan utama, terdapat empat menu. Keempat menu tersebut adalah, Start, Gallery, About dan Exit. Tampilan menu utama pada aplikasi dapat dilihat pada Gambar 4.2.

Gambar 4.1. Tampilan Halaman Menu Utama

4.1.2.2. Tampilan Halaman AR Camera

Fungsi dari halaman ini adalah ini merupakan halaman dimana user dapat melihat objek 3D yang akan dipilih pada halaman menu Objek. Pada halaman ini, terdapat 4 tombol : Main Menu, Capture, Place Objects, dan Clear. Tampilan halaman AR Camera pada aplikasi dapat dilihat pada Gambar 4.3.

(45)

Gambar 4.2. Tampilan Halaman AR Camera

4.1.2.3. Tampilan Halaman Menu Object.

Fungsi dari halaman ini adalah ini merupakan halaman dimana user dapat memilih objek 3D yang akan ditampilkan pada halaman menu AR Camera. Tampilan halaman menu Objek pada aplikasi dapat dilihat pada Gambar 4.4.

Gambar 4.3. Tampilan Halaman Menu Object

(46)

33

4.1.2.4. Tampilan Halaman Control Object

Fungsi dari halaman ini adalah ini merupakan halaman dimana user dapat memindahkan posisi, memperbesar dan merotasi objek 3D yang telah ditampilkan pada halaman menu AR Camera. Tampilan halaman menu Objek pada aplikasi dapat dilihat pada Gambar 4.5.

Gambar 4.4. Tampilan Halaman Control Object

4.1.2.5. Tampilan Halaman Menu Gallery.

Tampilan menu Gallery berisi berisi hasil gambar desain rancangan kita menggunakan Screenshot dari fitur aplikasi. Tampilan halaman menu Gallery pada aplikasi dapat dilihat pada Gambar 4.6.

Gambar 4.5. Tampilan Halaman Menu Gallery

(47)

4.1.2.6. Tampilan Halaman Menu About.

Tampilan menu About berisi berisi informasi tentang aplikasi dan pengembang aplikasi. Tampilan halaman menu About pada aplikasi dapat dilihat pada Gambar 4.7.

Gambar 4.6. Tampilan Halaman Menu About

4.2. Pengujian Sistem

Pengujian sistem dilakukan untuk menguji kinerja komponen-komponen yang telah dirancang dan diimplementasikan kedalam sistem. Pengujian ini bertujuan untuk memastikan masing-masing komponen agar berfungsi dengan baik dan berjalan sesuai yang diinginkan.

4.2.1. Pengujian Kinerja Interface

Setelah perancangan interface diimplementasikan, maka selanjutnya dilakukan pengujian menggunakan blackbox testing. Adapun rencana pengujian sistem dapat dilihat pada Tabel 4.1.

Tabel 4.1. Rencana Pengujian

NO Komponen sistem yang diuji Butir uji

1 Halaman utama Pengujian tampilan dan tombol

2 Halaman AR Camera Pengujian tampilan dan tombol

(48)

35

Tabel 4.1. Rencana Pengujian (Lanjutan) NO Komponen sistem yang diuji Butir uji

3 Menu Object Pengujian tampilan dan tombol

4 Halaman Control Object Pengujian tampilan dan tombol

5 Menu Gallery Pengujian tampilan dan tombol

6 Menu About Pengujian tampilan dan tombol

Adapun hasil pengujian dari rencana pengujian pada Tabel 4.1 adalah sebagai berikut:

1. Hasil pengujian halaman Menu Utama

Tabel 4.2. Hasil Pengujian Menu Utama No Target pengujian Hasil yang

diharapkan

Hasil pengujian Status

1 Uji Tampilan Halaman Menu Utama

Menampilkan tombol-tombol

menu

Berhasil

2 Uji pemilihan tombol START

Menuju halaman AR Camera

Berhasil

3 Uji pemilihan tombol Gallery

Menuju halaman Gallery

Berhasil

4 Uji pemilihan tombol About

Menuju halaman About

Berhasil

5 Uji pemilihan tombol Exit

Keluar dari aplikasi Keluar dari aplikasi

Berhasil

(49)

2. Hasil pengujian halaman AR Camera

Tabel 4.3. Hasil Pengujian Halaman AR Camera.

No Target pengujian Hasil yang diharapkan

1 Uji Tampilan Halaman AR Camera

Menampilkan tombol-tombol menu

menu

Berhasil

2 Uji pemilihan tombol Main Menu

Menuju halaman Menu Utama

Menuju halaman Menu Utama

Berhasil

3 Uji pemilihan tombol Capture

Mengaktifkan fitur Screenshot pada

aplikasi

Mengaktifkan fitur Screenshot

pada aplikasi

Berhasil

4 Uji pemilihan tombol Clear

Menghapus semua objek 3D yang terdapat pada AR

Camera

Menghapus semua objek 3D yang terdapat pada AR

Camera

Berhasil

5 Uji pemilihan tombol Place Object

Menuju halaman Menu Object

Berhasil

3. Hasil pengujian halaman Menu Object.

Tabel 4.4. Hasil Pengujian Menu Object No Target pengujian Hasil yang

diharapkan

1 Uji Tampilan Halaman Menu Object

Menampilkan halaman Menu

Object

Menampilkan halaman Menu

Object

Berhasil

(50)

37

Tabel 4.4. Hasil Pengujian Menu Object (Lanjutan)

No Target pengujian Hasil yang

diharapkan Hasil pengujian Status 2 Uji pemilihan tombol

Preview Object

Menampilkan objek 3D dan menuju halaman Control

Object

Menampilkan objek 3D dan menuju halaman

Control Object

Berhasil

4. Hasil pengujian halaman Control Object.

Tabel 4.5. Hasil Pengujian Control Object.

No Target pengujian Hasil yang

diharapkan Hasil pengujian Status 1 Uji Tampilan Halaman

Control Object

Menampilkan halaman Control

Object

Menampilkan halaman Control

Object

Berhasil

2 Uji pemilihan tombol Rotate

Posisi objek 3D yang ditampilkan dapat berputar pada

sumbu Z

Posisi objek 3D yang ditampilkan

dapat berputar pada sumbu Z

Berhasil

3 Uji pemilihan tombol Delete

Menghapus objek 3D yang dipilih

Berhasil

4 Uji pemilihan tombol

✓

Menyimpan posisi objek dan menuju ke halaman AR Camera

Menyimpan posisi objek dan menuju

ke halaman AR Camera

Berhasil