pembuatan aplikasi augmented reality edukasi …

17
library.uns.ac.id digilib.uns.ac.id PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI TRANSPORTASI SEBAGAI MEDIA PEMBELAJARAN UNTUK ANAK USIA DINI BERBASIS ANDROID TUGAS AKHIR Disusun Untuk Memenuhi Salah Satu Syarat Dalam Memperoleh Gelar Ahli Madya Pada Program Studi Diploma III Teknik Informatika Universitas Sebelas Maret Disusun Oleh : NINDA SARASWATI NIM. M3115098 PROGRAM DIPLOMA III TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SEBELAS MARET SURAKARTA 2018

Upload: others

Post on 28-Oct-2021

17 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI

TRANSPORTASI SEBAGAI MEDIA PEMBELAJARAN UNTUK ANAK

USIA DINI BERBASIS ANDROID

TUGAS AKHIR

Disusun Untuk Memenuhi Salah Satu Syarat Dalam Memperoleh Gelar Ahli

Madya Pada Program Studi Diploma III Teknik Informatika

Universitas Sebelas Maret

Disusun Oleh :

NINDA SARASWATI

NIM. M3115098

PROGRAM DIPLOMA III TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SEBELAS MARET

SURAKARTA

2018

Page 2: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

ii

HALAMAN PERSETUJUAN

Page 3: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

iii

HALAMAN PENGESAHAN

Page 4: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

iv

HALAMAN PERNYATAAN

Page 5: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

v

ABSTRACT

Ninda Saraswati, 2018. "MAKING AN “EDUKASI TRANSPORTASI

”APPLICATIONS AS A LEARNING MEDIA FOR ANOTHER EARLY

CHILDREN BASED ON ANDROID". Diploma Program III Informatics

Engineering Faculty of Mathematics and Natural Sciences Sebelas Maret

University Surakarta.

Based on the 2013 curriculum (kindergarten), the introduction of objects in

the surrounding environment is an indicator of the developmental achievements of

children aged 4-6 years to train children's memory. One of them is the teacher

introducing various types of transportation in order to train children's motor power

and imagination. In this introduction process, the teacher usually shows with

pictures or stories, but this is not interesting enough because the child cannot see

the whole form, how it works, and how it sounds. So that children are less interested

and feel bored, especially for now more sophisticated technology.

The application of “Edukasi Transportasi” is using Vuforia Developer to

create marker feature, Vuforia SDK to get ARCamera and ImageTarget, Unity3D

to create Augmented Reality, Blender for 3D and CorelDraw object creation to

create marker design and user interface.

By utilizing Augmented Reality technology in learning media application is

expected to provide easiness in learning about the introduction of various kinds of

transportation and provide innovative learning media that is interesting, fun and

easy to understand for children in learning.

Keywords: Augmented Reality, Transportation, “Edukasi Transportasi”, Media

Learning

Page 6: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

vi

ABSTRAK

Ninda Saraswati, 2018. “PEMBUATAN APLIKASI EDUKASI

TRANSPORTASI SEBAGAI MEDIA UNTUK ANAK USIA DINI

BERBASIS ANDROID”. Program Diploma III Teknik Informatika Fakultas

Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret Surakarta.

Berdasarkan pada kurikulum 2013 (Taman Kanak-kanak), pengenalan

benda-benda di lingkungan sekitar merupakan indikator pencapaian perkembangan

anak usia 4-6 tahun untuk melatih daya ingat anak. Salah satunya adalah guru

memperkenalkan macam-macam transportasi guna melatih daya motorik dan

imajinasi anak. Pada proses pengenalan ini biasanya guru menunjukkan dengan

gambar ataupun cerita, tetapi hal ini belum cukup menarik karena anak tidak dapat

melihat keseluruhan bagaimana bentuk aslinya, bagaimana cara kerjanya, dan

bagaimana suaranya. Sehingga anak kurang tertarik dan merasa bosan, apalagi

untuk saat ini teknologi semakin canggih.

Pembuatan aplikasi Edukasi Transportasi ini menggunakan berbagai

software yaitu Vuforia Developer untuk membuat fitur marker, Vuforia SDK untuk

mendapatkan ARCamera dan ImageTarget, Unity3D untuk membuat Augmented

Reality, Blender untuk pembuatan objek 3D dan CorelDraw untuk membuat desain

marker dan user interface.

Dengan memanfaatkan teknologi Augmented Reality pada aplikasi media

pembelajaran ini diharapkan dapat memberikan kemudahan dalam pembelajaran

tentang pengenalan macam-macam alat transportasi dalam bentuk 3D, pada aplikasi

ini disajikan Game play untuk menampilkan objek 3D dengan mengarahkan kamera

pada marker yang dapat memberikan inovasi media pembelajaran yang menarik,

menyenangkan dan mudah dimengerti bagi anak-anak dalam belajar.

Kata kunci : Augmented Reality, Transportasi, Edukasi Transportasi, Media

Pembelajaran.

Page 7: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

vii

HALAMAN MOTTO

“Tidak ada masalah yang tidak bisa diselesaikan selama ada komitmen bersama

untuk menyelesaikannya.”

“Perubahan tidak akan pernah terjadi jika kita terus menunggu waktu atau orang

yang tepat. Kita adalah perubahan itu sendiri.”

(Barack Obama)

Page 8: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

viii

HALAMAN PERSEMBAHAN

Sebuah karya tulisan ini saya persembahkan untuk :

1. Allah Yang Maha Esa atas segala rahmat dan karunia-Nya yang telah diberikan.

2. Kedua orang tua dan kakak tercinta yang tidak pernah berhenti untuk

mendukung dan mendoakan.

3. Adik-adik pengguna aplikasi, semoga dapat mempermudah dalam proses

pembelajaran.

4. Dosen dan Staf Pengajar Program Diploma III Teknik Informatika Universitas

Sebelas Maret Surakarta khususnya bapak Fendi Aji Purnomo, S.Si, M.Eng

selaku pembimbing, terimakasih selalu mendukung, membimbing dan

memberikan ilmu yang bermanfaat.

5. Sahabat-sahabat saya Nimpuna Dewanggani, Lufti Puspitasati, Nabila

Ardhiana, dan Lisya Agustina yang selalu memberi semangat kepada saya.

6. Teman- teman studio yang selalu menemani dan membantu dalam pengerjaan

tugas akhir ini.

7. Teman- teman seperjuangan D3 Teknik Informatika 2015, terkhusus teman-

teman kelas TID.

Page 9: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

ix

KATA PENGANTAR

Puji syukur penulis panjatkan kepada Tuhan Yang Maha Esa, atas berkat

dan rahmat-Nya penulis dapat menyelesaikan Tugas Akhir dengan judul

“Pembuatan Aplikasi Augmented Reality Edukasi Transportasi Sebagai

Media Pembelajaran Untuk Anak Usia Dini Berbasis Android”.

Laporan Tugas Akhir ini dibuat untuk memenuhi salah satu syarat dalam

memperoleh gelar Ahlimadya (A.Md) pada Program Studi Diploma III Teknik

Informatika Universitas Sebelas Maret Surakarta. Dalam melakukan penelitian dan

penyusunan laporan Tugas Akhir ini penulis mendapatkan banyak dukungan dan

bantuan dari berbagai pihak. Oleh karena itu penulis mengucapkan terima kasih

kepada :

1. Allah S.W.T yang telah memberikan kesehatan dan kesempatan waku

dalam mengerjakan Tugas Akhir ini.

2. Prof.Ir.Ari Handono Ramelan,M.Se.(Hons),Ph.D selaku Pimpinan Fakultas

Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret

Surakarta.

3. Abdul Aziz, S.Kom., M.Cs. selaku Ketua Program Diploma III Teknik

Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas

Sebelas Maret Surakarta.

4. Fendi Aji Purnomo,S.Si, M.Eng selaku dosen pembimbing Tugas Akhir.

5. Dosen-dosen DIII Teknik Informatika Fakultas Matematika dan Ilmu

Pengetahuan Alam Universitas Sebelas Maret Surakarta.yang telah

memberikan ilmu dan wawasan dalam pengerjaan Tugas Akhir.

6. Bapak, Ibu dan Kakak tercinta yang selalu memberikan doa, semangat serta

dukungan baik secara moral maupun material.

7. Serta semua pihak yang terkait yang telah membantu penulis

menyelesaikan laporan Tugas Akhir yang tidak bisa penulis sebutkan satu

persatu.

Page 10: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

x

Page 11: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xi

DAFTAR ISI

HALAMAN PERSETUJUAN ................................................................................ ii

HALAMAN PENGESAHAN ................................................................................ iii

HALAMAN PERNYATAAN ............................................................................... iv

ABSTRACT ............................................................................................................ v

ABSTRAK ............................................................................................................. vi

HALAMAN MOTTO ........................................................................................... vii

HALAMAN PERSEMBAHAN .......................................................................... viii

KATA PENGANTAR ........................................................................................... ix

DAFTAR ISI .......................................................................................................... xi

DAFTAR GAMBAR ........................................................................................... xiv

DAFTAR TABEL ............................................................................................... xvii

BAB I PENDAHULUAN ....................................................................................... 1

1.1. Latar Belakang ......................................................................................... 1

1.2. Rumusan Masalah .................................................................................... 1

1.3. Batasan Masalah ....................................................................................... 2

1.4. Tujuan ....................................................................................................... 2

1.5. Manfaat ..................................................................................................... 2

1.6. Metodologi Penelitian .............................................................................. 2

1.7. Sistematika Penulisan ............................................................................... 4

BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI ............................... 6

2.1. Tinjauan Pustaka ...................................................................................... 6

2.2. Landasan Teori ......................................................................................... 8

2.2.1. Belajar dengan Media Transportasi .................................................. 8

2.2.2. Augmented Reality ........................................................................... 8

2.2.3. Marker ............................................................................................... 8

2.2.4. Animasi ............................................................................................. 9

2.2.5. Audio ................................................................................................. 9

2.2.6. Android ............................................................................................ 10

Page 12: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xii

2.2.7. Unity 3D .......................................................................................... 10

2.2.8. Bahasa Pemrograman #C ................................................................ 11

2.2.9. Vuforia ............................................................................................ 12

2.2.10. Blender ........................................................................................ 13

2.2.11. CorelDraw ................................................................................... 14

2.2.12. Adobe Audition ............................................................................ 15

BAB III ANALISIS DAN PERANCANGAN SISTEM ..................................... 16

1.1. Konsep Dasar Pengembangan Multimedia ............................................ 16

1.1.1. Proposal ........................................................................................... 16

1.1.2. Target Pengguna.............................................................................. 16

1.1.3. Dukungan Platform, Teknologi, dan Multiplayer ........................... 17

1.2. Manajemen Proyek Pengembangan Multimedia .................................... 17

1.2.1. Kebutuhan dan Peran ...................................................................... 17

1.2.2. Perencanaan Jadwal ........................................................................ 17

1.2.3. Software dan Hardware dalam Pembuatan Multimedia ................. 18

1.3. Perancangan Multimedia ........................................................................ 20

1.3.1. Perancangan Interaktif (Interactive Design) ................................... 20

1.3.2. Perancangan Marker ....................................................................... 21

1.3.3. Perancangan Antar Muka (Interface Design) ................................. 22

1.3.4. Perancangan Objek 3 Dimensi ........................................................ 25

1.3.5. Perancangan Audio ......................................................................... 25

1.4. SRS Functional ....................................................................................... 26

1.4.1. Display System ............................................................................... 26

1.4.2. Player Input ..................................................................................... 26

1.4.3. Display Karakter ............................................................................. 27

BAB IV IMPLEMENTASI DAN PENGUJIAN .................................................. 29

4.1. Implementasi Aset dan Seni ................................................................... 29

4.1.1. Implementasi Elemen Grafis ........................................................... 29

4.1.2. Implementasi Marker ...................................................................... 34

4.1.3. Implementasi Antarmuka (Interface Design).................................. 39

4.1.4. Implementasi Objek 3D .................................................................. 49

Page 13: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xiii

4.1.5. Implementasi Audio ........................................................................ 56

4.2. Implementasi Pemrogaman (Progamming) ............................................ 57

4.2.1. Script menampilkan Scene Loading Bar ......................................... 57

4.2.2. Script Menampilkan Menu Utama .................................................. 58

4.2.3. Script Menampilkan Menu Tentang ............................................... 58

4.2.4. Script Menampilkan Menu Panduan ............................................... 58

4.2.5. Script Menampilkan Menu Jenis Transportasi ................................ 59

4.2.6. Script Menampilkan Menu Transportasi Darat, Udara dan Laut .... 59

4.2.7. Script Menampilkan Menu 2D ........................................................ 60

4.2.8. Script Pembuatan Scene Game Play ............................................... 61

4.2.9. Script Benar Salah dan Skor pada Game ........................................ 62

4.2.10. Mengubah Aplikasi ke Format .apk ............................................ 63

4.3. Pengujian ................................................................................................ 64

4.3.1. Pengujian Fungsional Aplikasi (Functional Testing) ..................... 64

4.3.2. Pengujian Penerimaan (Accepting Testing) .................................... 65

4.2.3. Pengujian Kompatibilitas (Compatibility Testing).......................... 67

4.2.4. Pengujian Pengguna (Beta Testing) ................................................ 70

BAB V PENUTUP ............................................................................................... 74

5.1 Kesimpulan ............................................................................................. 74

5.2 Saran ....................................................................................................... 74

DAFTAR PUSTAKA ........................................................................................... 75

Page 14: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xiv

DAFTAR GAMBAR

Gambar 1.1 Rancangan Metodelogi Penelitian ....................................................... 3

Gambar 3.1 Gambar Interaktif AR........................................................................ 20

Gambar 3.2 Gambar Interaktif Game.................................................................... 21

Gambar 3.3 Perancangan Marker ......................................................................... 21

Gambar 3.4 Tampilan Splash Screen .................................................................... 22

Gambar 3.5 Tampilan Main Menu ........................................................................ 22

Gambar 3.6 Tampilan Main Menu ........................................................................ 23

Gambar 3.7 Tampilan Petunjuk ............................................................................ 23

Gambar 3.8 Tampilan Tentang ............................................................................. 24

Gambar 3.9 Tampilan GamePlay Transportasi .................................................... 24

Gambar 3.10 Tampilan Game Pengenalan Pengemudi......................................... 25

Gambar 3.11 Gambar Skesta Objek 2 Dimensi Transportasi ............................... 25

Gambar 3. 12 Tampilan Display System ............................................................... 26

Gambar 3.13 Tampilan Player Input AR............................................................... 26

Gambar 3. 14 Tampilan Player Input Game ......................................................... 27

Gambar 3.15 Tampilan Display Karakter ............................................................. 27

Gambar 3.16 Tampilan Keseluruhan .................................................................... 28

Gambar 4.1 Screen Awal ...................................................................................... 29

Gambar 4.2 Main Menu ........................................................................................ 30

Gambar 4.3 Menu Panduan ................................................................................... 30

Gambar 4.4 Menu Panduan ................................................................................... 31

Gambar 4.5 Menu 2D ............................................................................................ 31

Gambar 4.6 Menu Jenis Transportasi.................................................................... 32

Gambar 4.7 Deskripsi 2D ...................................................................................... 32

Gambar 4.8 Layout kamera Vuforia ...................................................................... 33

Gambar 4.9 Menu 2D ............................................................................................ 34

Gambar 4.10 Homepage Vuforia .......................................................................... 36

Gambar 4.11 Login Vuforia .................................................................................. 36

Page 15: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xv

Gambar 4.12 Target Manager Vuforia ................................................................. 37

Gambar 4.13 Create Database .............................................................................. 37

Gambar 4.14 Create Target Manager ................................................................... 38

Gambar 4. 15 Download Database 1 ................................................................... 38

Gambar 4.16 Download Database 2 ..................................................................... 39

Gambar 4.17 Tampilan Splash Screen pada Unity................................................ 40

Gambar 4.18 Tampilan Splash Screen pada Smartphone ..................................... 40

Gambar 4.19 Tampilan Main Menu pada Unity ................................................... 41

Gambar 4.20 Tampilan Main Menu pada Smartphone ......................................... 41

Gambar 4.21 tampilan panduan pada unity ........................................................... 42

Gambar 4.22 Tampilan Panduan pada Smartphone .............................................. 42

Gambar 4.23 Tampilan Tentang pada Unity ......................................................... 43

Gambar 4.24 Tampilan Tentang pada smartphone ............................................... 43

Gambar 4.25 Tampilan Jenis Transportasi pada Unity ......................................... 44

Gambar 4.26 Tampilan Nama Transportasi pada Unity ........................................ 44

Gambar 4.27 Tampilan Deskripsi Transportasi pada Unity .................................. 44

Gambar 4.28 Tampilan Deskripsi 2D pada Smartphone ...................................... 45

Gambar 4.29 Tampilan Game pada Unity............................................................. 45

Gambar 4.30 Tampilan Game pada Smartphonez................................................. 46

Gambar 4.31 Pembuatan Scene AR ....................................................................... 46

Gambar 4.32 Download Database ........................................................................ 47

Gambar 4.33 Pembuatan Tampilan Scene Play Marker ....................................... 47

Gambar 4.34 Pembuatan Tampilan Scene Play 3D .............................................. 48

Gambar 4.35 Pembuatan animasi pada objek 3D ................................................. 48

Gambar 4.36 Implementasi Game Play Motor ..................................................... 49

Gambar 4.37 Tampilan Game play pada Smartphone .......................................... 49

Gambar 4.38 Pembuatan badan mobil dan roda 3D ............................................. 50

Gambar 4.39 Pembuatan badan mobil dan roda 3D ............................................. 51

Gambar 4.40 Pembuatan 3D mobil 3D Warna ..................................................... 51

Gambar 4.41 Pembuatan Model Ambulan 3D ...................................................... 52

Gambar 4.42 Texture Ambulan............................................................................. 53

Page 16: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xvi

Gambar 4.43 Pembuatan Model Ambulan dan Texturing Warna 3D .................. 53

Gambar 4.44 Pembuatan Badan Nahkoda dan Topi 3D ....................................... 53

Gambar 4.45 Pembuatan Badan Nahkoda dan Mobil Nahkoda ........................... 54

Gambar 4.46 Tekstur Nakhkoda ........................................................................... 55

Gambar 4.47 Pemberian material pada objek nahkoda dan topi nahkoda ............ 55

Gambar 4.48 Menu Export .................................................................................... 56

Gambar 4.49 Pembuatan Audio Backsound pada Adobe Audition ....................... 57

Gambar 4.50 Script Splash Screen ........................................................................ 57

Gambar 4.51 mainmenu.cs .................................................................................... 58

Gambar 4.52 Script Menu tentang ........................................................................ 58

Gambar 4.53 Script Menu Panduan ...................................................................... 59

Gambar 4.54 Script Menu Jenis Transportasi ....................................................... 59

Gambar 4.55 Script Transportasi darat, udara dan laut ......................................... 60

Gambar 4.56 Script Menu 2D ............................................................................... 60

Gambar 4.57 Script Button Back ........................................................................... 61

Gambar 4.58 Script dataTraget.cs ......................................................................... 62

Gambar 4.59 Script Benar Salah dan Skor............................................................ 63

Gambar 4.60 Proses Mengubah Format Aplikasi Menjadi .apk ........................... 64

Page 17: PEMBUATAN APLIKASI AUGMENTED REALITY EDUKASI …

library.uns.ac.id digilib.uns.ac.id

xvii

DAFTAR TABEL

Tabel 3.1 Deskripsi Perencanaan Jadwal Pembuatan Aplikasi ............................. 17

Tabel 4. 1 Model Marker ...................................................................................... 34

Tabel 4. 2 Blackbox Testing pengujian aplikasi .................................................... 64

Tabel 4. 3 Pengujian Jarak .................................................................................... 65

Tabel 4. 4 Pengujian Intensitas Cahaya ................................................................ 66

Tabel 4. 5 Sudut Kemirigan Marker ..................................................................... 67

Tabel 4. 6 Pengujian Compatibility Aplikasi pada beberapa device ..................... 67

Tabel 4. 7 Gambar Pengujian pada Device ........................................................... 69