17
AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA Naskah Publikasi Disusun oleh Singgih Priyambodo 08.11.2481 JURUSAN TEKNIK INFORMATIKA SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM YOGYAKARTA 2012

AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

Embed Size (px)

Citation preview

Page 1: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

AUGMENTED REALITY

PADA PERMAINAN ULAR TANGGA

Naskah Publikasi

Disusun oleh

Singgih Priyambodo

08.11.2481

JURUSAN TEKNIK INFORMATIKA

SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER

AMIKOM

YOGYAKARTA

2012

Page 2: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah
Page 3: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

AUGMENTED REALITY AT SNAKES AND LADDERS GAME

Augmented Reality Pada Permainan Ular Tangga

Singgih Priyambodo

Hanif Al Fatta

Jurusan Teknik Informatika

STMIK AMIKOM YOGYAKARTA

ABSTRACT

Reality increases, or sometimes known by the abbreviation AR (Augmented Reality) in English, is a technology that can combine virtual objects two-dimensional or three-dimensional into a real three-dimensional environment and projecting the virtual objects in real time. Unlike virtual reality which completely replaces reality, reality is just adding or complete reality.

Ronald T. Azuma (1997) defines Augmented Reality as objects merging real and virtual in the real environment, runs interactively in real time, and there is integration between objects in three dimensions, which integrates virtual objects in the real world. Merging real and virtual objects possible with the appropriate display technology, interactivity is possible through certain input devices, and good integration requires effective tracking.

Snakes and ladders is a board game for children who are played by two people or more. Game board is divided into small boxes and some boxes drawn in a "ladder" or "snake" that connect it with another box. Snakes and ladders game here will be visualized into 3D so it looks more real and more interesting. So based on the description above, the authors take the title Augmented Reality At Snakes and Ladders Game.

Keyword : Augmented Reality, Snakes And Ladders, Game

Page 4: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

1. PENDAHULUAN

Dewasa ini perkembangan dan kemajuan teknologi informasi makin pesat, pada

pengembangan 3D yang sudah populer di masyarakat khususnya pada AR. Penggunaan

AR untuk saat ini telah melebar ke banyak aspek di dalam kehidupan dan diproyeksikan

sehingga mengalami sebuah perkembangan yang signifikan. Hal ini dikarenakan

penggunaan AR sangat menarik dan memudahkan penggunanya dalam mengerjakan

sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah desain, ataupun

pemroyeksian 3D dalam suatu permainan.

Saat ini sudah banyak berkembangnya teknologi AR di berbagai bidang, salah

satu nya di bidang permainan yaitu ular tangga. Di era modern ini hampir semua orang

memainkan ular tangga di dunia nyata lengkap dengan kelengkapannya. Permainan

yang dimainkan dengan papan untuk anak-anak yang dimaikan oleh 2 orang atau lebih.

Kemudian bagaimana jika permainan itu kita bawa ke dalam dunia virtual reality. Dengan

inovasi baru, permainan ular tangga ini akan divisualisasikan menjadi 3D melalui media

webcam. Agar tampak nyata serta memberikan antusias positif bagi anak-anak.

Bedasarkan latar belakang diatas dalam skripsi ini penulis mengambil judul Augmented

Reality pada Permainan Ular Tangga.

2 ANALISIS DAN PERANCANGAN SISTEM

2.1 Analisis SWOT

Analisis yang digunakan untuk menemukan setiap permasalahan yang

ditemukan, di mana secara langsung dapat mempengaruhi pembuatan permainan ular

tangga dengan menggunakan teknologi AR (Augmented Reality). Analisis SWOT

(Strengths, Weaknesses, Opportunities, dan Threats) di pilih oleh penulis sebagai

evaluasi dalam suatu proyek atau suatu spekulasi bisnis. Berikut analisis SWOT pada

Augmented Reality untuk permainan ular tangga :

Page 5: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

2.1.1 Kekuatan (Strength)

Penggabungan antara obyek-obyek virtual 2 Dimensi atau 3 Dimensi sehingga

seolah-olah terlihat nyata dan menyatu dengan dunia nyata serta memberikan konten

untuk individu berinteraksi dengan ruang-ruang atau benda-benda itu dan menyediakan

suatu pengalaman yang lebih banyak.

2.1.2 Kelemahan (Weakness)

Permainan ular tangga ini bisa dijalankan melalui komputer dengan webcam

eksternal dan notebook yang mempunyai spesifikasi tertentu.

2.1.3 Peluang (Opportunity)

Ular tangga adalah Permainan yang dimainkan dengan papan untuk anak-anak

yang dimaikan oleh 2 orang atau lebih. Dengan inovasi baru, Permainan ular tangga

akan divisualisasikan ke dunia nyata secara realtime menjadi 3D melalui media webcam.

Ini akan menjadi semakin menarik dan mampu mencakup pemasaran ular tangga yang

sangat luas, akan menjadi peluang yang sangat baik.

2.1.4 Ancaman (Threat)

Karena Augmented Reality berkembang dengan sangat cepat, maka akan

banyak muncul aplikasi menarik, terutama di aplikasi permainan lainnya menggunakan

augmented reality.

19

Page 6: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

2.2 Perancangan Sistem

Sebelum memasuki Perancangan sistem, terlebih dahulu kita harus mengetahui

apakah yang di maksud dengan ular tangga. Ular tangga adalah permainan yang

dimainkan dengan papan untuk anak-anak yang dimaikan oleh 2 orang atau lebih.

Penjelasan permainan ini adalah papan permainan ini dibagi dalam kotak-kotak kecil dan

di beberapa kotak digambar sejumlah "tangga" atau "ular" yang menghubungkannya

dengan kotak lain.

Setiap pemain melemparkan dadu secara bergiliran untuk memindahkan

bidaknya, dan apabila pemain berhenti di tangga maka akan langsung naik ke atas kotak,

tetapi jika pemain berhenti pada ular maka harus turun kotak. Setelah itu tinggal pemain

menyelesaikannya sampai kotak yang paling atas. Demikian gambaran umum permainan

Ular tangga.

Dalam membuat sebuah aplikasi Augmented Reality maka terlebih dahulu harus

mendownload semua library dan juga software yang digunakan untuk dapat membuat

programnya, karena program tidak akan bisa di jalankan bila librarynya tidak ada dan

akan muncul banyak error dalam setiap baris program. Pada tahap ini di uraikan tentang

perancangan sistem yang akan dibuat untuk terwujudnya penelitian yang diinginkan, di

mana pada dasarnya sistem ini dikerjakan secara software saja.

3. IMPLEMENTASI SISTEM

Pada bab ini penulis akan membahas implemantasi sistem dari Augmented

Reality pada ular tangga. Tapi sebelumnya kita perlu mengetahui arti dari implementasi

sistem. Implementasi Sistem adalah proses realisasi dari model sistem yang telah

dirancang sebelumnya. Dalam membuat sebuah aplikasi Augmented Reality maka tahap

awal yang perlu di siapkan adalah library dan software untuk membuat aplikasi ini,

karena aplikasi tidak dapat di jalankan dan akan muncul banyak error.

Page 7: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

3.1 Pembuatan Marker Objek-Objek Permainan Ular Tangga

Tahap selanjutnya dilakukan proses inisialisasi marker untuk disimpan sebagai

pattern yang berfungsi sebagai acuan dalam pembacaan marker.

Cara kerja marker sebagai berikut, kamera menyorot marker kemudian

membaca pola marker tersebut, bila pola sudah terdeteksi maka kamera akan

mencocokan pola marker yang di sorot dengan pola marker yang ada di template memori

ARToolKit. Selanjutnya bila pola cocok, maka objek tinggal dirender. Untuk membuat

pattern ini dapat digunakan tool mk_patt.exe yang sudah tersedia di dalam software

library ARToolKit.

Software mk_patt dapat digunakan untuk membuat pola marker, kemudian

marker sudah terpola oleh mk_patt ini dapat disimpan di dalam template memori

ARToolKit, sehingga marker dapat dibaca oleh ARToolKit.

Pembuatan marker dapat dilakukan dengan langkah-langkah berikut ini :

1. Buka ARToolKit masuk ke folder pattern

2. Buka file blankpatt.gif menggunakan paint atau photoshop CS3

3. Buatlah tanda ditengah-tengah kotak putih sesuai keinginan

4. Save file tersebut ke folder yang sama, format save .gif

Berikut langkah-langkah membuat marker dan Memperkenalkan marker agar dapat

dideteksi oleh webcam :

1. Mendesign marker yang akan digunakan dalam permainan ular tangga ini.

Caranya adalah dengan membuka file blankpatt.gif yang ada dalam folder

ARToolKit/pattern :

Page 8: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

Gambar 3.1 Membuka Blankpatt

2. Lalu Kita design Blankpatt tersebut dengan pattern yang kita inginkan. Dan

kemudian kita simpan dengan cara file – save as – namapattern.gif

Gambar 3.2 Pola Marker Ular Tangga

Gambar 3.3 Pola Marker Player

Page 9: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

3. Kemudian langkah selanjutnya adalah memperkenalkan marker yang sudah

kita buat agar dapat dibaca oleh kamera. Caranya adalah dengan membuka

mk_patt.exe yang ada di dalam folder ARToolKit/bin. Kemudian hadapkan

pola marker yang sudah kita buat ke kamera agar diinisialisasi. Klik pada

tampilam mk_patt tersebut apabila garis merah hijau telah membaca marker

yang kita buat, dan otomatis camera akan ter-pause.

Gambar 3.4 Inisialisasi Pola Marker

4. Kemudian simpan marker yang sudah terpola oleh mk_patt di dalam template

memory ARToolKit. Lalu pindahkan patt.ular tangga dan semua pattern objek

yang telah dibuat kedalam folder ARToolKit/bin/data.

Gambar 3.5 Penyimpanan Deteksi Marker

Page 10: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

3.2 Desain Objek 3D Permainan Ular Tangga

Desain permainan ular tangga ini di buat menjadi beberapa model yaitu berupa

gambar 3D, yang akan menjadi desain Augmented Reality pada ular tangga ini. Berikut

desain objek 3D permainan ular tangga :

1. Design 3D Papan Ular Tangga

2. Design 3D Ular

3. Design 3D Tangga

4. Design 3D Player

Berikut Tampilan Design 3D dari masing-masing objek yang akan dibuat:

1. Desain 3D Papan Ular Tangga

Gambar 3.6 Desain 3D Papan Ular Tangga

2. Design 3D Ular

Gambar 3.7 Desain 3D Ular

Page 11: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

3. Design 3D Tangga

Gambar 3.8 Desain 3D Tangga

4. Design 3D Player

Gambar 3.9 Desain 3D Player

3.3 Penyisipan Objek 3D ke ARToolKit

Objek 3D yang telah dibuat di 3DS Max 2010, harus disisipkan kedalam

ARToolKit, sehingga terbentuk permainan ular tangga yang menggunakan Augmented

Reality. Langkah - langkah dalam penyisipan adalah sebagai berikut :

1. Melakukan Eksport file 3DS Max ke file *.Wrl.

Langkah-langkahnya adalah klik tombol paling kiri atas berlogo 3DS lalu pilih

Export kemudian simpan dengan *.WRL tekan save lalu akan tampil WRML97

Exporter seperti gambar dibawah tinggal klik ok. Jika kita menggunakan texture

pada objek 3D, maka pilih paling bawah yaitu pada use prefix, kita ganti ../maps

menjadi ./textures

Page 12: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

Gambar 3.10 Eksport File 3DS Max ke file *.Wrl

2. File *.Wrl yang telah di ekspor, dipindahkan ke dalam folder ARToolKit/bin/wrl.

3. Membuka file *.dat yang telah tesedia di ARToolKit, dan membuka filenya

dengan menggunakan wordpad. Setelah file terbuka, nama file yang ada di

dalam file *.dat ini diganti dengan nama file *.wrl, yang telah kita salin di dalam

folder Wrl. Berikut adalah source code untuk file *.dat.

ulartangga.wrl

0.0 0.0 0.0 # Translation

0.0 0.0 0.0 0.0 # Rotation

10.0 10.0 10.0 # Scale

4. Nama file *.dat yang telah disalin di dalam folder wrl ARToolKit, disisipkan ke

source code object_data_vrml, dengan wordpad. sebagai contoh, file *.dat yang

digunakan adalah ulartangga.dat. Berikut adalah potongan

source code:

#pattern 1

VRML Wrl/ulartangga.dat

Page 13: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

5. Kita memilih pattern atau pola yang telah dibuat sebelumnya dengan

mk_patt.exe. sebagai contoh, pattern yang digunakan adalah patt.ulartangga,

maka pattern tersebut disisipkan di dalam source code object_data_vrml yang

ada di dalam folder ARToolKit/bin/data membukanya dengan mengunakan

wordpad. Berikut adalah potongan sourcecode:

Data/patt.ulartangga

6. File *.dat yang disisipkan ke source code object_data_vrml, bisa satu atau lebih,

tetapi dalam penelitian ini, objek yang disisipkan berjumlah 5 objek. Berikut

potongan source code, untuk mengatur banyaknya objek yang dirender oleh

kamera:

#the number of patterns to be recognized

5

7. Kemudian setelah semua file *.dat diatur di source code object_data_vrml, maka

semua objek 3D siap dirender oleh kamera, dengan software library ARToolKit.

a. Uji coba Aplikasi

Setelah proses pembacaan objek selesai, maka akan muncul jendela kamera.

Setelah itu, maka semua markernya diarahkan ke kamera, dan kemudian kamera

melakukan render terhadap pola yang ada setiap marker. Berikut adalah hasil dari

rendering webcam dengan masing-masing objek pada permainan ular tangga :

Page 14: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

Gambar 3.11 Hasil Dari Rendering Webcam

Berikut adalah hasil pengujian yang didapatkan :

1. Pada saat menjalankan aplikasi permaian ini, hal pertama yang perlu kita

perhatikan adalah lamanya waktu loading model.

2. Masalah lain yang muncul adalah ketika ukuran objek 3D yang terlalu kecil

ataupun terlalu besar, ataupun posisi objek3D yang kurang tepat. Masalah ini

dapat diatasi dengan memperbesar atau memperkecil ataupun merotasikan

objek langsung pada software 3DSMax, kemuadian diexport ke vrml lagi.

3. Cahaya sangat berpengaruh besar, yaitu apabila marker terlalu gelap maka tidak

akan terbaca, begitupula bila terlalu terang. Lalu apabila marker sebagian objek

bayangan yang gelap, objek tidak akan muncul. Jadi cahaya yang dibutuhkan

kamera dalam menangkap marker dapat diatur sendiri sampai kira-kira cahaya

tersebut mencukupi.

4. Objek yang terkadang hilang dan muncul, itu dikarenakan posisi dan sudut

pandang terhadap marker yang kurang sesuai dan pengaruh oleh cahaya.

Page 15: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

5. Spesifikasi kamera juga dapat mempengaruhi muncul tidaknya objek. Marker

dapat dibaca kamera dengan ukuran maksimal selebar layar yang ditangkap

webcam, dan ukuran minimal tertentu sesuai spesifikasi dari kamera tersebut.

Jika Objek tidak muncul dikarenakan marker yang terlalu kecil dan tidak terbaca

kamera.

6. Jarak antara marker dengan webcam juga dapat mempengaruhi muncul tidaknya

objek 3D tersebut. Jika terlalu jauh, maka objek akan seolah tertelan ke dalam

dimensi lain, dan semakin jauh objek semakin hilang.

Berikut contoh tampilannya :

Gambar 3.12 Objek Terlihat Seluruhnya Dengan Jarak Normal

Gambar 3.13 Objek Terlihat Menghilang Dengan Jarak Terlalu Jauh

Page 16: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

4. KESIMPULAN DAN SARAN

4.1 Kesimpulan

Dari hasil penuliasan skripsi ini, maka dapat diambil kesimpulan sebagai berikut :

1. Augmented Reality Pada Permainan Ular Tangga ini dapat di bangun

dengan langkah-langkah sebagai berikut :

a. Membuat Objek 3D

b. Membuat marker

c. Mengidentifikasi marker

d. Membuat coding di simple vrml

e. Menjalankan simpleVRML

2. Augmented Reality pada permainan ular tangga ini telah di uji menggunakan

tabel pengujian marker dan hasil yang di dapat berjalan cukup baik.

3. Augmented Reality pada permainan ular tangga ini dapat di buat dengan

objek-objek yang di buat unik dan animasi yang menarik.

4. Augmented Reality pada permainan ular tangga ini cara memainkannya

masih manual.

4.2 Saran

Augmented Reality pada permainan ular tangga ini masih jauh dari sempurna

sehingga perlu dilakukan perbaikan, pengembangan serta penambahan pada objek 3D.

Augmented Reality pada permainan ular tangga ini dapat berjalan dengan baik

menggunakan software ARToolKit. Apabila pembaca ingin mencoba hasil yang berbeda,

dapat mengeksplorasi ke library lain seperti FlARToolKit, NyARToolKit dan OpenSpace.

Page 17: AUGMENTED REALITY PADA PERMAINAN ULAR TANGGA …repository.amikom.ac.id/files/Naskah_Publikasi 08.11.2481.pdf · sesuatu hal, seperti contohnya pada penyampaian presentasi sebuah

DAFTAR PUSTAKA

3D Objek Player, http://archive3d.net/?a=download&id=5263655c diakses pada tanggal

7 April 2012.

Anggi Andriyadi,(2010),“Belajar Augmented Reality”,http://belajar-ar.blogspot.com/

diakses pada tanggal 1 Maret 2012.

Google Inc, 2006 ,“Medical Training Augmented Reality”,

http://www.youtube.com/watch?v=Vycvec8Tl7I diakses pada tanggal 17 juni 2012.

Proses cara kerja ARToolKit http://www.hitl.washington.edu/artoolkit

/documentation/userarwork.htm diakses pada tanggal 30 april 2012.

Soma Arial Hari.Ir, Animasi Kreatif Fundamental dengan 3DS MAX, PT Elex Media

Komputindo, 2007.