Penerapan Aplikasi QR Code Reader dan QR Code Generator Secara Mobile Untuk

Mengelola Benda Cagar Budaya Kota Salatiga

Skripsi

Diajukan kepada Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Oleh: Asih Kurniati

NIM : 672007113

Program Studi Teknik Informatika Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana Salatiga

November 2011

ii

iii

Pernyataan

Skripsi yang berikut ini:

Judul : Penerapan Aplikasi QR Code Reader dan

QR Code Generator Secara Mobile Untuk

Mengelola Benda Cagar Budaya Kota

Salatiga

Pembimbing : 1. Prof. Dr. Ir. Eko Sediyono, M.Kom.

2. Titin Pranoto, S.E., M.Si.

adalah benar hasil karya saya:

Nama : Asih Kurniati

NIM : 672007113

Saya menyatakan tidak mengambil sebagian atau seluruhnya dari

hasil karya orang lain kecuali sebagaimana yang tertulis pada daftar

pustaka.

Pernyataan ini dibuat dengan sebenarnya sesuai dengan ketentuan

yang berlaku dalam penulisan karya ilmiah.

Salatiga, November 2011

Asih Kurniati

iv

Prakata

Puji Syukur penulis panjatkan atas kehadirat Allah SWT,

yang atas rahmat-Nya maka penulis dapat menyelesaikan

penyusunan skripsi yang berjudul ” Penerapan Aplikasi QR Code

Reader dan QR Code Generator Secara Mobile Untuk Mengelola

Informasi Benda Cagar Budaya Kota Salatiga”.

Skripsi ini diajukan untuk memenuhi salah satu persyaratan

guna memperoleh gelar Sarjana Komputer di Program Studi Teknik

Informatika, Fakultas Teknologi Informasi, Universitas Kristen

Satya Wacana Salatiga.

Dalam menyelesaikan skripsi ini, penulis tidak lepas dari

dukungan beberapa pihak. Untuk itu, penulis mengucapkan terima

kasih yang sebesar-besarnya kepada :

1. Bapak Andeka Rocky Tanaamah, S.E., M.Cs., selaku Dekan

Fakultas Teknologi Informasi, Universitas Kristen Satya

Wacana Salatiga.

2. Bapak Dian W. Chandra, S.Kom., M.Cs., selaku Ketua

Program Studi Teknik Informatika Fakultas Teknologi

Informasi Universitas Kristen Satya Wacana Salatiga.

3. Bapak Prof. Dr. Ir. Eko Sediyono, M.Kom., selaku dosen

pembimbing pertama yang selalu memberikan arahan dan

dukungan dalam penyelesaian skripsi ini.

4. Ibu Titin Pranoto, S.E., M.Si., selaku pembimbing kedua yang

sabar dalam membimbing penulis, masukan-masukan yang

sangat berarti untuk penulis, serta kata-kata positif yang selalu

membangkitkan semangat penulis.

5. Bapak Adriyanto Juliastomo Gundo, S.Si., M.Pd., selaku

v

Koordinator KP/TA, Fakultas Teknologi Informasi,

Universitas Kristen Satya Wacana Salatiga.

6. Keluarga Besar Dinas Perhubungan Komunikasi Budaya dan

Pariwisata Kota Salatiga yang telah membantu dan

memberikan kesempatan penulis untuk melakukan penelitian.

7. Bapak Eddy Supangkat yang telah membantu dalam

memberikan referensi data-data kepada penulis.

8. Teman-teman di FTI angkatan 2007 dan seperjuangan, Dwi

Handayani, Valentina Ika, Wahyu Retno N, Widya Irawati,

Hagar M Samon, Winda Pangesti Utami, Mulyati, dan lainnya.

Terima kasih atas semangat yang selalu disalurkan.

9. Bapak, Ibu, kakak- kakakku Mas Dedy, Mas Heru yang telah

sabar memberi dukungan dan doa kepada penulis untuk

menyelesaikan skripsi.

10. Seluruh Staf Pengajar dan Karyawan Fakultas Teknologi

Informasi Universitas Kristen Satya Wacana Salatiga.

11. Semua pihak yang tidak dapat penulis sebutkan satu per satu

yang telah mendukung penulis dalam menyelesaikan skripsi.

Penulis menyadari pembuatan skripsi ini masih belum

sempurna. Oleh karena itu, kritik dan saran yang membangun sangat

penulis harapkan dalam pengembangan skripsi khususnya, dan

dalam pengembangan ilmu pengetahuan ke depannya.

Salatiga, November 2011

Asih Kurniati

vi

Daftar Isi Halaman Halaman Judul ............................................................................ i Lembar Pengesahan .................................................................... ii Pernyataan ................................................................................... iii Prakata ...................................................................................... iv Daftar Isi ..................................................................................... vi Daftar Gambar ............................................................................ viii Daftar Tabel ................................................................................ x Daftar Kode Program .................................................................. xi Daftar Lampiran .......................................................................... xii Arti Singkatan ............................................................................. xiii Abstract ...................................................................................... xiv Bab 1 Pendahuluan .................................................................. 1

1.1 Latar Belakang .................................................... 1 1.2 Rumusan Masalah ............................................... 3 1.3 Tujuan dan Manfaat ............................................ 3 1.4 Batasan Masalah .................................................. 3 1.5 Sistematika Penulisan .......................................... 4

Bab 2 Tinjauan Pustaka ........................................................... 7 2.1 Penelitian Sebelumnya ........................................ 7 2.2 PHP (Hypertext Preprocessor) ........................... 8 2.3 MySQL ................................................................ 10 2.4 QR Code .............................................................. 11 2.5 QR Code Reader ................................................. 15 2.6 QR Code Generator ............................................ 16 2.7 Algoritma QR Code Generator ........................... 17

2.7.1 Menentukan Kapasitas ............................ 17 2.7.2 Encode Data ............................................ 18 2.7.3 Decode Data ............................................ 20

2.8 QR Code Position Detection Pattern .................. 21 2.9 Google Maps API ................................................ 22

Bab 3 Metode dan Perancangan Sistem .................................. 29

3.1 Metode Perancangan Sistem ............................... 29 3.2 Identifikasi Kebutuhan Pengguna ....................... 30 3.3 Perancangan Sistem ............................................ 35

3.3.1 Use Case Diagram ................................... 36

vii

3.3.2 Activity Diagram ...................................... 36 3.3.3 Sequence Diagram ................................... 42 3.3.4 Class Diagram ......................................... 50

3.4 Perancangan Database ........................................ 51 3.5 Perancangan Antarmuka ..................................... 57

Bab 4 Hasil dan Pembahasan .................................................. 63

4.1 Prototype Website Cagar Budaya Salatiga .......... 63 4.1.1 Prototype Satu Website Cagar Budaya ..................................................... 63 4.1.2 Tampilan Prototype Dua Website Cagar Budaya .......................................... 66 4.1.3 Detail Benda Cagar Budaya Dengan Scan QR Code ......................................... 68 4.1.4 Fungsi Deteksi Perangkat ........................ 69 4.1.5 Fungsi Cek Session Publik ...................... 70 4.1.6 Fungsi Detail Benda Tanpa Scan QR Code .................................................. 71 4.1.7 Fungsi Generate QR Code ...................... 72 4.1.8 Fungsi Beri Komentar ............................. 74 4.1.9 Fungsi Beri Rating ................................... 76 4.1.10 Fungsi Login Member ............................. 77 4.1.11 Fungsi Daftar Member ............................ 78 4.1.12 Login Administrator ................................ 80 4.1.13 Fungsi Tambah Data Benda .................... 80 4.1.14 Fungsi Cetak QR Code Benda ................. 82

4.2 Hasil Pengujian ................................................... 83 Bab 5 Kesimpulan dan Saran Pengembangan ......................... 87

5.1 Kesimpulan ......................................................... 87 5.2 Saran Pengembangan .......................................... 87

Daftar Pustaka ............................................................................. xv Lampiran

viii

Daftar Gambar Halaman Gambar 2.1 Contoh QR Code ................................................. 11 Gambar 2.2 Contoh QR Code Beserta Bagian-bagiannya ...... 12 Gambar 2.3 Perbedaan QR Code dan Bar Code ..................... 12 Gambar 2.4 Logo Aplikasi Scanlife ........................................ 15 Gambar 2.5 Contoh Nilai dari Parameter pada Sintaks dan Hasil QR Code .............................................. 16 Gambar 2.6 QR Code Pattern ................................................. 21 Gambar 2.7 QR Code Pattern ................................................. 22 Gambar 2.8 Contoh Tampilan Google Maps .......................... 23 Gambar 2.9 Gambar Peta Statis yang Dihasilkan. .................. 27 Gambar 3.1 Metode Prototyping ............................................ 29 Gambar 3.2 Use Case Diagram Website Cagar Budaya Salatiga 35 Gambar 3.3 Activity Diagram Akses Benda Melalui Pemindaian QR Code .......................................... 36 Gambar 3.4 Activity Diagram Cek Session Member ............... 37 Gambar 3.5 Activity Diagram Deteksi Perangkat (Device) ............................................................... 38 Gambar 3.6 Activity Diagram Beri Komentar Benda ............. 39 Gambar 3.7 Activity Diagram Beri Nilai Rating Benda .......... 40 Gambar 3.8 Activity Diagram Cek Session Pengguna Administrator ...................................................... 41 Gambar 3.9 Activity Diagram Kelola Data ............................. 41 Gambar 3.10 Activity Diagram Proses Moderasi Komentar ..... 42 Gambar 3.11 Sequence Diagram Akses Detail Benda Melalui Scan QR Code ........................................ 42 Gambar 3.12 Sequence Diagram Akses Beranda Halaman Publik .................................................................. 43 Gambar 3.13 Sequence Diagram Akses Daftar Benda ............. 44 Gambar 3.14 Sequence Diagram Cari Benda ............................ 44 Gambar 3.15 Sequence Diagram Beri Komentar ...................... 44 Gambar 3.16 Sequence Diagram Beri Rating ........................... 45 Gambar 3.17 Sequence Diagram Login Member ...................... 45 Gambar 3.18 Sequence Diagram Daftar Member Baru ............ 45 Gambar 3.19 Sequence Diagram Login Administrator ............. 46 Gambar 3.20 Sequence Diagram Cetak QR Code .................... 46 Gambar 3.21 Sequence Diagram Kelola Benda ........................ 47 Gambar 3.22 Sequence Diagram Kelola Komentar .................. 48 Gambar 3.23 Sequence Diagram Kelola Halaman .................... 49

ix

Gambar 3.24 Class Diagram Website Cagar Budaya ................ 50 Gambar 3.25 Tampilan Antar Muka Beranda Mobile .............. 58 Gambar 3.26 Tampilan Antar Muka Halaman Mobile ............. 58 Gambar 3.27 Tampilan Antar Muka Halaman Desktop ........... 59 Gambar 3.28 Tampilan Antar Muka Panel Kiri ........................ 60 Gambar 3.29 Tampilan Antar Muka Form Login Anggota ...... 60 Gambar 3.30 Tampilan Antar Muka Konten Halaman ............. 60 Gambar 3.31 Tampilan Antar Muka Login Administrator ....... 61 Gambar 3.32 Tampilan Antar Muka Halaman Administrator ...................................................... 61 Gambar 4.1 Prototype Satu Format Mobile ............................ 63 Gambar 4.2 Prototype Satu Format Desktop .......................... 64 Gambar 4.3 Contoh Tampilan Breadcrumb ............................ 65 Gambar 4.4 Tampilan Halaman Login Administrator ............ 65 Gambar 4.5 Tampilan Depan Halaman Administrator Setelah Login ....................................................... 66 Gambar 4.6 Tampilan Beranda dalam Format Mobile ........... 66 Gambar 4.7 Tampilan Beranda dalam Format Desktop .......... 67 Gambar 4.8 Tampilan Detail Benda ....................................... 68 Gambar 4.9 Tampilan Detail Benda Dalam Format Desktop ................................................................ 73 Gambar 4.10 QR Code Benda ................................................... 74 Gambar 4.11 Form Komentar Format Desktop ........................ 75 Gambar 4.12 Tampilan Fungsi Rating dalam Format Mobile ................................................................. 76 Gambar 4.13 Tampilan Login Member ..................................... 77 Gambar 4.14 Form Pendaftaran Member Format Desktop ....... 79 Gambar 4.15 Tampilan Form Tambah Data Benda Baru ......... 82 Gambar 4.16 Hasil Fungsi Cetak QR Code Benda ................... 83

x

Daftar Tabel

Halaman Tabel 2.1 Perbedaan QR Code dengan Barcode ...................... 14 Tabel 2.2 Tabel Parameter Permintaan Google Chart API ...... 17 Tabel 2.3 Tabel Tipe Data ........................................................ 18 Tabel 2.4 Tabel Pola Data QR Code ........................................ 20 Tabel 2.5 Tabel Format Informasi ........................................... 20 Tabel 3.1 Tabel Member .......................................................... 51 Tabel 3.2 Tabel Benda ............................................................. 52 Tabel 3.3 Tabel Admin ............................................................ 53 Tabel 3.4 Tabel Counter ........................................................... 53 Tabel 3.5 Tabel Halaman ......................................................... 54 Tabel 3.6 Tabel Istilah ............................................................. 54 Tabel 3.7 Tabel Trivia .............................................................. 54 Tabel 3.8 Tabel Komentar ....................................................... 55 Tabel 3.9 Tabel Rating ............................................................. 55 Tabel 3.10 Tabel Benda Belum Normal .................................... 56 Tabel 3.11 Tabel Hasil Normalisasi ........................................... 57 Tabel 4.1 Tabel Hasil Pengujian Terhadap Responden ........... 85

xi

Daftar Kode Program

Halaman Kode Program 4.1 Contoh Link URL ...................................... 68 Kode Program 4.2 Fungsi detail benda .................................... 69 Kode Program 4.3 Fungsi Deteksi Perangkat .......................... 70 Kode Program 4.4 Fungsi Cek Session .................................... 71 Kode Program 4.5 URL akses detail benda ............................. 71 Kode Program 4.6 Fungsi Detail Benda Tanpa Scan QR Code .................................................... 72 Kode Program 4.7 Fungsi Generate QR Code ......................... 72 Kode Program 4.8 URL Beri Komentar .................................. 74 Kode Program 4.9 Fungsi Beri Komentar ................................ 75 Kode Program 4.10 URL Beri Rating ........................................ 76 Kode Program 4.11 Fungsi Beri Rating ..................................... 77 Kode Program 4.12 Fungsi Login Member ................................ 78 Kode Program 4.13 Fungsi Daftar Member ............................... 79 Kode Program 4.14 Fungsi Login Member ................................ 80 Kode Program 4.15 Fungsi Tambah Benda ............................... 81 Kode Program 4.16 Fungsi Simpan Benda ................................ 81 Kode Program 4.17 Fungsi Cetak QR Code .............................. 82

xii

Daftar Lampiran Halaman Lampiran 1 Surat Keterangan Rekomendasi Penelitian dari Kesbangpolinmas kota Salatiga ...................... xvii Lampiran 2 Surat Keterangan Penelitian di Dishubkombudpar kota Salatiga ........................ xvii Lampiran 3 Kuesioner ............................................................... xix

xiii

Arti Singkatan

Dishubkombudpar Dinas Perhubungan Komunikasi Kebudayaan

dan Pariwisata PHP PHP (Hypertext Processor) QR Quick Response API Application Programming Interface HTML Hypertext Markup Language OOP Object Oriented Programming SQL Structured Query Language DBMS Database Management System GPL General Public License URL Uniform Resource Locator SMS Short Message Service HTTP Hypertext Transfer Protocol UML Unified Modelling Language

xiv

Abstract Cultural heritage property created by a nation society in the past time, become a national identity and history in the present day. Salatiga which was a resort (rest area) in the Dutch Government Period, has some ancient buildings as historical heritage. The purpose of this research is creating website to socialize the existence of Salatiga’s cultural heritage property to society. Therefore the society has information and expected to protect and take care of the Salatiga’s cultural heritage property This research used Prototyping method to design and develop the website system. The result of this research is a “Benda Cagar Budaya kota Salatiga” website, which can be accessed by mobile phone or computer desktop. This application using QR Code to keep the complete information about Salatiga’s cultural heritage property. This application including Google Map to show the map of cultural heritage property’s location. This application become a portal for society to access information and to give feedback about a cultural heritage property. Keywords : Cultural Heritage Property, QR Code, Mobile Website.