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
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
iii
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 iv
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
v
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 vi
3.4 3.5
3.3.2 Activity Diagram ...................................... 36 3.3.3 Sequence Diagram ................................... 42 3.3.4 Class Diagram ......................................... 50 Perancangan Database ........................................ 51 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
vii
Daftar Gambar Gambar 2.1 Gambar 2.2 Gambar 2.3 Gambar 2.4 Gambar 2.5 Gambar 2.6 Gambar 2.7 Gambar 2.8 Gambar 2.9 Gambar 3.1 Gambar 3.2 Gambar 3.3 Gambar 3.4 Gambar 3.5 Gambar 3.6 Gambar 3.7 Gambar 3.8 Gambar 3.9 Gambar 3.10 Gambar 3.11 Gambar 3.12 Gambar 3.13 Gambar 3.14 Gambar 3.15 Gambar 3.16 Gambar 3.17 Gambar 3.18 Gambar 3.19 Gambar 3.20 Gambar 3.21 Gambar 3.22 Gambar 3.23
Halaman Contoh QR Code ................................................. 11 Contoh QR Code Beserta Bagian-bagiannya ...... 12 Perbedaan QR Code dan Bar Code ..................... 12 Logo Aplikasi Scanlife ........................................ 15 Contoh Nilai dari Parameter pada Sintaks dan Hasil QR Code.............................................. 16 QR Code Pattern ................................................. 21 QR Code Pattern ................................................. 22 Contoh Tampilan Google Maps .......................... 23 Gambar Peta Statis yang Dihasilkan. .................. 27 Metode Prototyping ............................................ 29 Use Case Diagram Website Cagar Budaya Salatiga 35 Activity Diagram Akses Benda Melalui Pemindaian QR Code .......................................... 36 Activity Diagram Cek Session Member............... 37 Activity Diagram Deteksi Perangkat (Device) ............................................................... 38 Activity Diagram Beri Komentar Benda ............. 39 Activity Diagram Beri Nilai Rating Benda .......... 40 Activity Diagram Cek Session Pengguna Administrator ...................................................... 41 Activity Diagram Kelola Data ............................. 41 Activity Diagram Proses Moderasi Komentar ..... 42 Sequence Diagram Akses Detail Benda Melalui Scan QR Code........................................ 42 Sequence Diagram Akses Beranda Halaman Publik .................................................................. 43 Sequence Diagram Akses Daftar Benda ............. 44 Sequence Diagram Cari Benda............................ 44 Sequence Diagram Beri Komentar ...................... 44 Sequence Diagram Beri Rating ........................... 45 Sequence Diagram Login Member ...................... 45 Sequence Diagram Daftar Member Baru ............ 45 Sequence Diagram Login Administrator ............. 46 Sequence Diagram Cetak QR Code .................... 46 Sequence Diagram Kelola Benda ........................ 47 Sequence Diagram Kelola Komentar .................. 48 Sequence Diagram Kelola Halaman.................... 49 viii
Gambar 3.24 Gambar 3.25 Gambar 3.26 Gambar 3.27 Gambar 3.28 Gambar 3.29 Gambar 3.30 Gambar 3.31 Gambar 3.32 Gambar 4.1 Gambar 4.2 Gambar 4.3 Gambar 4.4 Gambar 4.5 Gambar 4.6 Gambar 4.7 Gambar 4.8 Gambar 4.9 Gambar 4.10 Gambar 4.11 Gambar 4.12 Gambar 4.13 Gambar 4.14 Gambar 4.15 Gambar 4.16
Class Diagram Website Cagar Budaya ................ 50 Tampilan Antar Muka Beranda Mobile .............. 58 Tampilan Antar Muka Halaman Mobile ............. 58 Tampilan Antar Muka Halaman Desktop ........... 59 Tampilan Antar Muka Panel Kiri ........................ 60 Tampilan Antar Muka Form Login Anggota ...... 60 Tampilan Antar Muka Konten Halaman ............. 60 Tampilan Antar Muka Login Administrator ....... 61 Tampilan Antar Muka Halaman Administrator ...................................................... 61 Prototype Satu Format Mobile ............................ 63 Prototype Satu Format Desktop .......................... 64 Contoh Tampilan Breadcrumb ............................ 65 Tampilan Halaman Login Administrator ............ 65 Tampilan Depan Halaman Administrator Setelah Login ....................................................... 66 Tampilan Beranda dalam Format Mobile ........... 66 Tampilan Beranda dalam Format Desktop .......... 67 Tampilan Detail Benda ....................................... 68 Tampilan Detail Benda Dalam Format Desktop ................................................................ 73 QR Code Benda................................................... 74 Form Komentar Format Desktop ........................ 75 Tampilan Fungsi Rating dalam Format Mobile ................................................................. 76 Tampilan Login Member..................................... 77 Form Pendaftaran Member Format Desktop ....... 79 Tampilan Form Tambah Data Benda Baru ......... 82 Hasil Fungsi Cetak QR Code Benda ................... 83
ix
Daftar Tabel Tabel 2.1 Tabel 2.2 Tabel 2.3 Tabel 2.4 Tabel 2.5 Tabel 3.1 Tabel 3.2 Tabel 3.3 Tabel 3.4 Tabel 3.5 Tabel 3.6 Tabel 3.7 Tabel 3.8 Tabel 3.9 Tabel 3.10 Tabel 3.11 Tabel 4.1
Halaman Perbedaan QR Code dengan Barcode ...................... 14 Tabel Parameter Permintaan Google Chart API ...... 17 Tabel Tipe Data........................................................ 18 Tabel Pola Data QR Code ........................................ 20 Tabel Format Informasi ........................................... 20 Tabel Member .......................................................... 51 Tabel Benda ............................................................. 52 Tabel Admin ............................................................ 53 Tabel Counter........................................................... 53 Tabel Halaman ......................................................... 54 Tabel Istilah ............................................................. 54 Tabel Trivia .............................................................. 54 Tabel Komentar ....................................................... 55 Tabel Rating ............................................................. 55 Tabel Benda Belum Normal .................................... 56 Tabel Hasil Normalisasi ........................................... 57 Tabel Hasil Pengujian Terhadap Responden ........... 85
x
Daftar Kode Program Kode Program 4.1 Kode Program 4.2 Kode Program 4.3 Kode Program 4.4 Kode Program 4.5 Kode Program 4.6 Kode Program 4.7 Kode Program 4.8 Kode Program 4.9 Kode Program 4.10 Kode Program 4.11 Kode Program 4.12 Kode Program 4.13 Kode Program 4.14 Kode Program 4.15 Kode Program 4.16 Kode Program 4.17
Halaman Contoh Link URL ...................................... 68 Fungsi detail benda .................................... 69 Fungsi Deteksi Perangkat .......................... 70 Fungsi Cek Session .................................... 71 URL akses detail benda ............................. 71 Fungsi Detail Benda Tanpa Scan QR Code .................................................... 72 Fungsi Generate QR Code......................... 72 URL Beri Komentar .................................. 74 Fungsi Beri Komentar................................ 75 URL Beri Rating ........................................ 76 Fungsi Beri Rating ..................................... 77 Fungsi Login Member................................ 78 Fungsi Daftar Member ............................... 79 Fungsi Login Member................................ 80 Fungsi Tambah Benda ............................... 81 Fungsi Simpan Benda ................................ 81 Fungsi Cetak QR Code .............................. 82
xi
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
xii
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
xiii
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.
xiv