Institutional Repository | Satya Wacana Christian University: Perancangan Aplikasi Informasi Hotel dan Kuliner Di Kota Salatiga Berbasis Android Menggunakan JSON

  

Perancangan Aplikasi Informasi Hotel dan Kuliner

Di Kota Salatiga Berbasis Android Menggunakan JSON

Artikel Ilmiah

  

Diajukan kepada

Fakultas Teknologi Informasi untuk

Memperoleh Gelar Sarjana Komputer

  

Peneliti :

Steven Jodie Kurniahu (672011119)

Evangs Mailoa, S.Kom., M.Cs.

  

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

  

Desember 2014

  

Perancangan Aplikasi Informasi Hotel dan Kuliner

Di Kota SalatigaBerbasis Android Menggunakan JSON

_{1) 2)}

Steven Jodie Kurnia, Evangs Mailoa

  

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Abstract

  

Salatiga is one of the tourist destinations of nature, history and education, which is

located in Central Java, Indonesia. The related information about lodging and culinary

still very limited and not easily accessible that makes tourists are hesistant to come visit

Salatiga.The government still seeking to provide an efficient and effective information to

promote the area of tourism. In order to help the government to overcome the existing

problems, the author create mobile applications on Android platform using JSON as

connector from mobile application to database on webserver.This research produce a

Tripmate Salatiga v.1 infromation application based on mobile and has location based

service and facebook share as addition. This application provide an information of hotel

and culinary place on Salatiga with interactive and responsive display for user.

  

Keywords: Tripmate Salatiga, Hotel, Restaurant, Database, Server, Mobile Application,

JSON, Location Based Service, Facebook Share.

  

Abstrak

Salatiga merupakan salah satu kota tujuan wisata alam, sejarah, dan pendidikan, yang

berada di Jawa Tengah, Indonesia. Informasi terkait penginapan dan tempat

kuliner/makan masih sangat terbatas dan belum dapat diakses dengan mudah sehingga

para wisatawan terkadang ragu untuk mengunjungi Salatiga. Pemerintah kota sedang

mengupayakan untuk menyediakan layanan informasi yang efisien dan efektif, sehingga

nantinya mampu mengangkat pariwisata daerah. Aplikasi mobile pada platform Android

menggunakan JSON sebagai penghubung aplikasi mobile dengan database pada

  webserver, dibuat untuk mengatasi permasalahan yang ada . Penelitian ini

  

menghasilkan aplikasi TripMate Salatiga v.1 yang merupakan aplikasi sistem informasi

berbasis mobile dan memiliki location based service serta facebook share sebagai fungsi

tambahan. Aplikasi ini menyediakan informasi penginapan/hotel dan tempat kuliner di

Salatiga dalam tampilan yang interaktif dan responsif kepada pengguna.

  

Kata Kunci: TripMate Salatiga, Hotel, Restoran, Database, Server Mobile Application,

JSON, Location Based Service, Facebook Share.

  1) Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya Wacana Salatiga

2) Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga

1. Pendahuluan Salatiga adalah sebuah kota kecil yang terletak di provinsi Jawa Tengah.

  Kota ini berbatasan dengan Kabupaten Semarang. Salatiga terletak 49 km sebelah selataKota ini juga terletak di lereng timur Gunung Merbabu. Kota Salatiga terletak di dataran tinggi yang memiliki udara yang sejuk sehingga kota ini sering menjadi kota tujuan wisata alam sekaligus tempat peristirahatan. Selain wisata alam, Salatiga juga menjadi pusat pembelajaran sejarah. Kota ini sudah berdiri jauh sebelum Indonesia merdeka. Pada saat penjajahan Belanda, Salatiga dijadikan sebagai tempat peristirahatan para kepala/pimpinan VOC. Hal ini juga yang menyebabkan banyak sekali bangunan tua peninggalan Belanda di Salatiga yang sampai saat ini tetap dipelihara dan dijadikan tujuan wisata sejarah. Selain sebagai tujuan wisata alam dan sejarah, Salatiga juga menjadi kota tujuan pendidikan. Terdapat beberapa sekolah dan perguruan tinggi di Salatiga yang diminati sebagai tempat tujuan menimba ilmu. Begitu beragamnya siswa dan mahasiswa dari berbagai pelosok Indonesia yang belajar di kota ini menyebabkan muncul semboyan “Salatiga adalah Indonesia mini”.

  Sebagai salah satu kota tujuan wisata, informasi-informasi terpercaya terkait penginapan/hotel dan tempat kuliner/makan masih sangat terbatas dan sulit untuk diakses. Informasi-informasi terkait penginapan dan tempat kuliner di Salatiga yang berada di internet tidaklah lengkap dan tidak dapat dipercayai kebenarannya. Pemerintah kota Salatiga melalui Kesbangpol (Badan Kesatuan Bangsa dan Politik), mempunyai data lengkap tentang hotel dan tempat kuliner yang ada di kota Salatiga yang disimpan pada bagian Cipkataru (Cipta Karya dan Tata Ruang). Data-data ini tidak disediakan secara online sehingga belum dapat diakses oleh para wisatawan. Dibutuhkan sebuah aplikasi sistem informasi agar memudahkan wisatawan mengakses data-data tersebut. Adanya aplikasi sistem informasi ini diharapkan mampu membantu memajukan pariwisata daerah.

  Teknologi dapat dimanfaatkan sebagai alat untuk mencari informasi, terutama menggunakan telepon genggam (mobile). Kemajuan teknologi pada bidang mobile banyak sekali memberikan keuntungan dan kemudahan dalam penghematan waktu. Universitas Ryeson pernah melakukan penelitian terhadap para mahasiswa dan mendapati lebih dari 50% responden mengatakan bahwa mereka mengakses layanan perpustakaan melalui handphone karena menghemat waktu [1].

  Android adalah mobile platform yang bebas untuk di develop. Tidak ada lisensi atau biaya royalti untuk pengembangan aplikasi pada platform Android. Android memberikan kesempatan pengembang untuk melakukan pengembangan sesuai dengan yang diharapkannya. Sistem operasi yang mendasari Android dilisensikan dibawah GNU. Android juga didistribusikan dibawah lisensi Apache

  

Software (ASL/Apache2), yang memungkinkan untuk distribusi kedua dan

seterusnya [2].

  Protokol JSON (JavaScript Object Notation) dipilih sebagai penghubung aplikasi mobile dikarenakan kemampuannya untuk melakukan pertukaran data yang ringan, mudah dibaca dan ditulis oleh manusia, serta mudah diterjemahkan dan dibuat (generate) oleh komputer [3]. Kelebihan dari JSON adalah memiliki ukuran file data yang kecil, memiliki kecepatan transfer dan parsing data yang cepat dan lebih menghemat bandwidth, dapat menggunakan tipe data dengan menggunakan javascript tanpa membutuhkan library tambahan, memiliki format penulisan yang sederhana dan mudah dimengerti oleh pengguna C, C++, C# dan Java. [4]

  Mengatasi masalah yang ada, dilakukan penelitian berupa penerapan teknologi untuk memudahkan penyediaan informasi terkait tempat penginapan dan tempat kuliner di Salatiga. Penelitian ini menghasilkan aplikasi TripMate Salatiga v.1 yang interaktif dan responsif bagi pengguna. Protokol yang digunakan untuk menghubungkan TripMate Salatiga dengan database webserver adalah JSON. Protokol ini dipilih agar aplikasi dapat menampilkan informasi dengan kecepatan maksimum supaya tercapai tujuan interaktif dan responsif bagi pengguna, sehingga memudahkan pengguna aplikasi mendapatkan informasi tentang penginapan dan tempat kuliner di kota Salatiga.

2. Kajian Pustaka

  Penelitian sebelumnya dengan judul “Perancangan Antarmuka Layanan

  

Informasi Wisata dan Kuliner di DIY Berbasis Web dan Mobile Web ”

  menghasilkan perancangan aplikasi untuk wisata kuliner di Yogyakarta berbasis

  

web dan Mobile Web. Pengguna dapat mengakses aplikasi dan melihat informasi

  Wisata dan Kuliner di Yogyakarta. Penelitian yang dilakukan sebelumnya pada aplikasi informasi wisata kuliner memanfaatkan teknologi dari HTML sebagai bahasa pemrograman dalam pembuatan aplikasi yang berjalan [5].

  Persamaan dengan penelitian yang dilakukan saat ini adalah sama-sama membuat aplikasi yang bertujuan untuk menampilkan informasi, sementara perbedaan dengan penelitian yang dilakukan saat ini adalah metode dan bahasa pemrograman yang digunakan untuk membangun aplikasi. Penelitian saat ini menggunakan bahasa pemrograman Java-Eclipse dan JSON (web service) yang berfungsi untuk menghubungkan aplikasi mobile dan aplikasi web dengan

  

database pada server, sementara pada penelitian sebelumnya menggunakan

bahasa pemrograman HTML dan HTML5.

  Penelitian lain yang dijadikan pembanding adalah yang ber judul “M-

  

Library Berbasis Android Menggunakan Protokol JSON (Studi Kasus : FT-

Umrah)

  ”. Penelitian tersebut menghasilkan aplikasi M-Library menggunakan protokol JSON. Persamaan dengan penelitian saat ini adalah sama-sama dijalankan pada platform Android dan menggunakan protokol JSON sebagai penghubung aplikasi mobile dan web dengan database pada server [6]. Perbedaannya, penelitian sebelumnya diterapkan pada aplikasi perpustakaan sedangkan penelitian ini mencoba menerapkan pada aplikasi informasi penginapan dan tempat kuliner.

  Dari kedua penelitian sebelumnya, dilakukan percobaan membangun aplikasi informasi TripMate Salatiga menggunakan HTML5 dan protokol JSON. Setelah dibandingkan, didapati bahwa protokol JSON jauh lebih mudah untuk diimplementasikan dibandingkan HTML5 karena memiliki struktur bahasa yang mirip dengan Java, sehingga JSON dipilih untuk dijadikan protokol penghubung aplikasi dengan database.

  Android

  Android adalah mobile platform yang bebas untuk di develop. Tidak ada lisensi atau biaya royalti untuk pengembangan aplikasi pada platform Android. Android memberikan kesempatan pengembang untuk melakukan pengembangan sesuai dengan yang diharapkannya. Sistem operasi yang mendasari Android dilisensikan dibawah GNU. Android juga didistribusikan dibawah lisensi Apache Software (ASL/Apache2), yang memungkinkan untuk distribusi kedua dan seterusnya [2]. Android SDK adalah tools API (Application Programming Interface) yang diperlukan untuk mulai mengembangakan aplikasi pada platform Android menggunakan bahasa pemrograman java [2].

  Eclipse

  Eclipse merupakan Bahasa tingkat tinggi pemrograman yang menggabungkan dari beberapa bahasa pemrograman lainnya, seperti C, C++, Java, PHP, juga Ruby sehingga programmer baru yang menggunakannya tidak akan merasa asing dan lebih mudah memahami [7].

  MySQL dan PhpMyAdmin

  MySQL adalah salah satu jenis database server yang sangat terkenal karena menggunakan Structure Query Language (SQL) sebagai dasar untuk mengakses basis datanya. Selain itu, MySQL bersifat free pada berbagai platform (kecuali pada Windows, yang bersifat shareware). MySQL termasuk jenis Relational

  

Database Management System (RDBMS). Sebuah basis data mengandung satu

  atau sejumlah tabel, tabel terdiri atas sejumlah baris dan setiap baris mengandung satu atau beberapa kolom [8].

  JSON ( Java Script Object Notation)

  JSON (JavaScript Object Notation) adalah format pertukaran data (lightweight ), mudah dibaca dan ditulis, serta mudah diterjemahkan

  data-interchange format

  dan di-generate. Format ini dibuat berdasarkan bagian dari Bahasa Pemrograman JavaScript, Standar ECMA-262. JSON merupakan format teks yang tidak bergantung pada bahasa pemrograman apapun karena menggunakan gaya bahasa yang umum digunakan oleh programmer keluarga C termasuk C, C++, C#, Java, JavaScript, dan Perl [2].

  JSON memiliki ukuran yang lebih kecil dibandingkan dengan XML (ukuran XML lebih besar karena overhead dan nametag), memiliki kecepatan

  

transfer dan parsing data yang lebih cepat, memiliki format penulisan yang lebih

  sederhana dibandingkan XML. [6] Penggunaan JSON sebagai webservice untuk melakukan pertukaran data ke database webserver memiliki kecepatan transfer yang lebih cepat dibandingkan dengan XML dikarenakan file JSON memiliki ukuran lebih kecil daripada file XML. Keunggulan dari JSON tersebut dikarenakan XML membutuhkan overhead dan namatag yang membuat file XML menjadi besar dan lambat untuk di proses [9]. Selain itu JSON memiliki format susunan yang lebih mudah dimengerti, bahkan untuk pemula. Contoh perbandingan dari penulisan

  

format JSON dan XML didalam database dapat dilihat pada Kode Program 1 dan

Kode Program 2. _{1. 2.} {"hotel": 1. <tempat> [{"ID":"1", 2. _3.

  <hotel> "nama":"Wahid",

  3. _4.

  <ID>1</ID> "alamat":"Jl.Sudirman", _5.

  4. <nama>Wahid</nama> _6. "harga":"300000", 5. <alamat>Jl.Sudirman</alamat> _7. "rating":"4.7" 6. <harga>300000</harga> }] 7. _8.

  <rating>4.7</rating> }

  8.

  </hotel> 9. </tempat>

  Kode Program 1. Format JSON Kode Program 2. Format XML

  Potongan kode program di atas membuktikan bahwa JSON memiliki

  

format penulisan database yang lebih ringkas dan mudah dimengerti daripada

  penulisan XML. Perbedaan yang paling penting adalah ukuran penulisan dan jumlah text pada JSON lebih kecil dan sedikit dibandingkan dengan XML, sehingga JSON memiliki kecepatan transfer dan parsing yang lebih cepat dari XML.

  JSON juga mudah untuk dipahami karena JSON menggunakan format penulisan yang hampir mirip seperti Bahasa pemrograman Java dan C. Tabel perbandingan antara fungsi operasi di JSON dan Java dapat dilihat pada Tabel 1.

  Tabel 1. Perbandingan Fungsi JSON dan Java JSON Java createObject(objectName) createJavaType(typeName) addChildObject() setSimpleValue() setPairValue(name,value) setFieldValue(name, value) getNextPair() getFieldValue() returnObject() returnType()

  Tabel 1 menampilkan bahwa fungsi operasi yang digunakan di JSON tidak berbeda jauh dengan fungsi-fungsi pada Java. Kemiripan dengan bahasa pemrograman Java membuat JSON lebih mudah dipahami oleh programmer atau developer yang menguasai bahasa pemrograman Java.

  Kecepatan transfer dan parsing data pada JSON terbukti lebih cepat dari

  XML setelah dilakukan eksperimen untuk mengecek peforma pengiriman data dari JSON dan XML. Percobaan dilakukan pada PC dengan 1.73 Intel Core Duo CPU, RAM 2GB, dengan Windows XP Professional SP3 sebagai OS-nya. Java Virtual Machine yang digunakan adalah JDK 1.6.0 dan Apache Tomcat 5.5. Eksperimen dilakukan dengan menghitung waktu yang dibutuhkan untuk melakukan transfer data sebesar 12kb [10]. Perbandingan waktu yang dibutuhkan JSON dan XML dapat dilihat pada Gambar 1.

  Gambar 1. Kecepatan Transfer JSON dan XML

3. Tahapan Penelitian

  Penelitian ini dilakukan melalui lima tahapan penelitian, yaitu: 1). Analisis kebutuhan dan pengumpulan data yang diperlukan. 2). Perancangan Sistem. 3). Perancangan aplikasi / program. 4). Implementasi dan pengujian sistem, serta analisis hasil pengujian. 5). Penulisan laporan hasil penelitian. Tahapan

• – tahapan yang dilakukan dalam penelitian ini ditampilkan pada Gambar 2.

  Gambar 2. Tahapan Penelitian

  Berdasarkan bagan pada Gambar 2, dapat dijelaskan bahwa tahapan dari penelitian yang dilakukan adalah sebagai berikut: 1) Tahap Pertama: Analisis kebutuhan dan pengumpulan data. Pada tahap ini dilakukan analisa kebutuhan aplikasi dalam proses pembuatannya dan melakukan pengumpulan data-data tempat penginapan dan kuliner, yang ada pada Dinas Cipta Karya dan Tata Ruang Kota Salatiga; 2) Tahap Kedua: Melakukan perancangan sistem proses dengan menggunakan UML seperti usecase diagram, activity diagram, sequence

  

diagram , dan class diagram. Serta menentukan arsitektur yang akan digunakan,

  merancang database dan membuat tampilan (interface) aplikasi; 3) Tahap Ketiga: Perancangan aplikasi, yaitu mulai merancang dan membangun aplikasi berdasarkan hasil dari analisis kebutuhan dan pengumpulan data yang telah dilakukan; 4) Tahap Keempat: Implementasi dan pengujian sistem, melakukan proses pengujian sistem untuk mengetahui apakah aplikasi yang telah dibuat sudah memenuhi kebutuhan dari client atau belum, jika belum maka aplikasi akan diperbaiki kembali; 5) Tahap Kelima: Penulisan laporan hasil penelitian, yaitu mendokumentasikan setiap proses yang telah dilakukan selama penelitian ke dalam bentuk laporan tertulis berupa jurnal.

  Pada tahapan perancangan sistem dan perangkat lunak untuk menggambarkan prosedur dan proses kerja dari sistem aplikasi yang dibangun. Proses perancangan sistem dalam penelitian ini menggunakan UML (Unified

  

Modeling Language ) dengan beberapa proses yang akan dijelaskan sebagai

  berikut: Pada use case diagram, terdapat dua aktor utama yang berada didalam sistem ini, yaitu user dan admin. Dalam use case diagram tersebut digambarkan semua fungsi yang dapat dilakukan oleh masing-masing actor. Aktor User memiliki fungsi untuk mendaftar sebagai member, view informasi tempat,view letak lokasi tempat,view harga, share, insert review, melihat lokasi hotel, melihat lokasi restoran dan share pada situs jejaring sosial facebook. Sementara aktor

  

Admin memiliki fungsi untuk mengelola data hotel, mengelola data rumah makan,

  mengelola data user, dan fungsi yang berhubungan dengan user adalah fungsi untuk view informasi hotel serta view informasi rumah makan. Gambar dari use

  case diagram dapat dilihat pada Gambar 3. _{Melihat Lokasi Hotel Insert Data User <<extend>> <<include>> View Data User Mendaftar Member} Insert Review Hotel <<extend>> _{View Informasi Hotel Admin Mengelola Data User <<extend>> <<extend>> <<extend>> Delete Data User Update Data User Share Status di Facebook Insert Review Rumah Makan}

_{User <<extend>>}

_{<<extend>> View Informasi Rumah Makan <<extend>> Mengelola Data Rumah Makan Insert Data Hotel <<extend>>} Mengelola Data Hotel _{<<extend>> Update Data Hotel Delete Data Hotel Melihat Lokasi Rumah Makan Insert Data Rumah Makan Delete Data Rumah Makan} <<extend>> _{Update Data Rumah Makan} Gambar 3. Use Case Diagram

  Activity diagram memberikan visualisasi mengenai aliran tindakan dalam

  sistem yang dibuat, percabangan tindakan yang terjadi, bagaimana tindakan awal dari sistem dan bagaimana tindakan akhir yang terjadi pada sistem. Dalam aktivitas proses yang terjadi pada aplikasi ini melibatkan user, admin dan

  

database . Proses Activity DiagramUser diawali dengan melakukan signup terlebih

  dahulu jika belum memiliki ID. Saat proses signup, data dimasukkan kedalam database tb_user. Jika sudah punya ID, user dapat langsung menuju ke halaman

  

login . Setelah login, user akan menuju ke menu utama. User dapat memilih menu

  Hotel dan Rumah Makan, setelah memilih maka User akan mendapatkan informasi dari apa yang dipilih sebelumnya (informasi yang didapat berupa nama, lokasi, harga, share,rating, komentar). User dapat melihat letak lokasi yang dihubungkan ke Google Map dan memberikan review. Gambar dari activity

  diagram user dapat dilihat pada Gambar 4.

  _Tidak

_{Sign Up Input Data User Memasukkan}

USER SISTEM MOBILE DATABASE _{Punya ID? Data ke tb_user Login} Ya _{Menu Utama Menu Hotel Mengambil Data Hotel Memberikan Menampilkan Review Informasi Halaman Memasukkan Review Data Review} Menu Rumah MengambiI Data _{Makan Makanan} Menampilkan _Review

  Gambar 4.Activity Diagram User Sequence Diagram berfungsi untuk menggambarkan interaksi antara setiap komponen baik didalam maupun disekitar sistem secara berurutan.

Sequence diagram menunjukkan urutan dari sebuah aksi dan memberikan

  response untuk menghasilkan output tertentu. Gambar 5 menampilkan salah satu contoh sequence diagram untuk insert. _{: Admin : MerubahDataHotel : UpdateData() : tb_hotel 1: MenambahDataHotel( )}

  2: getData _{4: InsertData() 3: OpenDb 5: CloseDb 7: ReturnDone()} 6: ReturnDone() Gambar 5. Sequence Diagram Insert

  Class diagram merupakan diagram yang digunakan untuk menampilkan

  beberapa class yang ada di dalam suatu sistem yang sedang dikembangkan.Class

  

diagram dibagi menjadi dua bagian yaitu: Database dan Sistem.Class

diagramDatabase memberikan gambaran mengenai informasi dari database

  beserta tabel didalamnya dan relasi yang terjadi.Class Diagram Database pada aplikasi ini dapat dilihat pada Gambar 6.

  Gambar 6. Class Diagram Database Class Diagram Sistem memberikan gambaran mengenai class yang berada

  didalam sistem, attribute, operasi atau fungsi yang digunakan dan hubungan relasi yang terjadi diantara class. Class Diagram Sistem dapat dilihat pada Gambar 7.

  Gambar 7. Class Diagram Sistem

  Pada tahapan arsitektur aplikasi, sistem yang dibangun dapat menggunakan Facebook service dan memanfaatkan teknologi JSON Web Service sebagai sarana penghubung pengambilan data dari aplikasi mobile ke database dan pengaksesan location based service. Arsitektur dari aplikasi ini dapat dilihat pada Gambar 8.

  Gambar 8. Arsitektur Sistem

  Arsitektur sistem yang dibangun memiliki 6 (enam) komponen, yaitu

  

Mobile Phone , Internet, Web Service JSON, Facebook Service, Location Based

Service dan Database Server. Pengguna mobile phone harus terhubung dengan

  internet terlebih dahulu untuk dapat menjalankan aplikasi TripMate Salatiga. Pengguna mobile phone dapat menggunakan Facebook service untuk melakukan

  

share status pada halaman facebook pengguna. Pengguna juga dapat mengakses

  lokasi dari dan menuju hotel atau tempat kuliner berdasarkan data dari database

  

server dengan menggunakan Location Based Service. Dalam proses pengambilan

dan pengiriman dari setiap data harus melalui webservice JSON.

4. Hasil dan Pembahasan

  User dapat menggunakan aplikasi ini untuk melakukan pendaftaran ke

  dalam aplikasi, melihat informasi dari hotel dan tempat kuliner yang berada di Salatiga, melihat lokasi tempat, melakukan share media sosial, memberikan komentar, melihat komentar dari user lain, mencari tempat dengan kata kunci tertentu.

  Aplikasi TripMate Salatiga v.1 dilengkapi dengan fitur location based

  

service (LBS) agar pengguna dapat dengan mudah mencari hotel atau tempat

  kuliner yang ingin dituju dengan panduan peta yang ditampilkan. Aplikasi TripMate Salatiga v.1 juga dilengkapi dengan fitur share ke media sosial agar pengguna dapat dengan mudah berbagi informasi terkait hotel dan tempat kuliner kepada teman-temannya yang terhubung lewat media sosial facebook.

  Penambahan fitur-fitur tersebut untuk memenuhi tujuan awal penelitian agar aplikasi TripMate Salatiga yang dibuat mampu menyediakan informasi kepada pengguna secara informatif dan responsive, sehingga memudahkan pengguna dalam menggunakan aplikasi ini.

  Aplikasi mobile yang digunakan oleh user ini memiliki 7 interface yaitu :interface login, signup, verification, menu utama, list, detail, map, share, dan interface review .

  User yang berhasil melakukan login, akan diarahkan pada interface menu

  utama. Interface tersebut menyediakan tampilan yang berisi tiga menu utama, yaitu: hotel, restaurant, about. Menu hotel berfungsi untuk melihat daftar hotel yang terdapat di Salatiga, sementara menu restaurant berfungsi untuk melihat daftar restoran, dan menu about berfungsi untuk melihat keterangan dari aplikasi. Selain kedua fungsi itu, juga terdapat fungsi searchyang dapat mencari hotel / restoran dengan memasukkan kata kunci. Gambar dari Interface Menu Utama dapat dilihat pada Gambar 9.

  Gambar 9 Interface Menu Utama InterfaceList , yaitu interface yang berisi list data dari hotel / restoran, yang

  dilengkapi juga dengan tombol search. Gambar Interface List dapat dilihat pada Gambar 10.

  Gambar 10 Interface List

  Proses pengambilan data-data restoran pada Interface List diawali dengan memanggil fungsi dengan menggunakan JSON untuk mengambil data yang terdapat didalam database lalu menampungya kedalam Arraydan di encode oleh JSON. Kode Program 3 merupakan potongan kode program pada PHP yang dijalankan oleh JSON untuk melakukan proses pengambilan data.

  Kode Program 3 Kode Select List 1. $response["tampilan"] = array(); 2. while ($row = mysql_fetch_array($result)){ 3. $tampilan = array(); 4. $tampilan["id"] = $row["id"]; 5. $tampilan["nama"] = $row["nama"]; 6. $tampilan["gambar"] = base64_encode($row["gambar"]); 7. $tampilan["totalRating"] = "".$row["totalRating"];

  8. $tampilan["totalKomen"] = $row["totalKomen"]; 9. $tampilan["posisi"] = $row["posisi"]; 10. array_push($response["tampilan"], $tampilan); 11. }

  12. 13. echo json_encode($response);

  Kode baris ke 1-10 digunakan untuk menampung data yang diambil dari

  

database webserver kedalam sebuah array. Kode baris ke 13 berfungsi untuk

  melakukan parsing data-data yang sudah ditampung di Array tersebut kedalam format JSON.

  Data yang diambil dari database webserver akan ditampilkan ke dalam

  

layout pada Eclipse. Data yang dikirim oleh JSON akan tampil apabila dilakukan

  proses parsing terlebih dahulu. Kode Program 4 merupakan potongan kode program pada Eclipse yang dijalankan untuk mengambil data dari JSON dan melakukan parsing.

  Kode Program 4Kode Parsing JSON

  1. JSONParser jsonParser = new JSONParser();

  2. JSONObject json = jsonParser.makeHttpRequest("http://stevenjodie.esy.es/SelectListTampilan. php", "POST", param);

  3. JSONArray jsonArray = json.getJSONArray("tampilan"); 4. for (int i = 0; i<jsonArray.length(); i++){

  5. JSONObject c = jsonArray.getJSONObject(i); 6. item_details = new GetterSetterTampilan(); 7. item_details.setId(c.optInt("id")); 8. item_details.setPosisi(c.optInt("posisi")); 9. item_details.setNama(c.optString("nama")); 10. byte[] bt =

  Base64.decode(c.optString("gambar").getBytes(), 0);

11. item_details.setGambar(BitmapFactory.decodeByteArray(bt,

0, bt.length)); 12. item_details.setTotalKomen(c.optInt("totalKomen"));

  13. }

  Kode baris ke 1-2 berfungsi untuk melakukan parsing data dari format JSON agar dapat dibaca dan dimasukkan kedalam Bahasa pemrograman Java. Baris ke 3-12 berfungsi untuk mengambil data dari hasil parsing format JSON yang dikirimkan dari database webserver.

  Dengan memilih hotel / restoran yang terdapat dalam list, maka aplikasi akan menampilkan Interface Detail, yang berisi detail informasi seperti: nama, gambar, alamat, telepon, harga, share, rating, grafik rating dan list komentar dari hotel / restoran yang telah dipilih. Gambar dari Interface Detail dapat dilihat pada Gambar 11 dan Gambar 12.

  Gambar 12 Interface Detail 2 Gambar 11 Interface Detail 1 Aplikasi TripMate Salatiga juga dilengkapi dengan fasilitas Location

  

Based Service untuk menampilkan letak lokasi dari tempat User saat ini dan

  lokasi dari tempat tujuan yang disambungkan kedalam Google Map. Dengan menggunakan fungsi dari location based service, maka pengguna akan dapat melihat letak secara detail dari tempat tujuan mereka yang ditunjukkan dengan menggunakan marker berwarna merah, dan juga dapat melihat posisi pengguna saat ini yang ditunjukkan dengan menggunakan marker berwarna biru. Gambar Location Based Service dapat dilihat pada Gambar 13.

  Gambar 13. Location Based Service

  Potongan kode program untuk menampilkan Location Based Service dapat dilihat pada Kode Program 5.

  Kode Program 5 Location Based Service

  

1. MarkerOptions marker = new MarkerOptions().position(new LatLng(latitude,

longitude)).title("");

2. marker.icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory

.HUE_RED)); 3. googleMap.addMarker(marker);

  

4. CameraPosition cameraPosition = new CameraPosition.Builder().target(new

LatLng(latitude,longitude)).zoom(15).build();

5. googleMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosit

ion));

  Kode baris ke 1 berfungsi untuk membuat marker berdasarkan letak dari tempat tujuan (ditentukan oleh longitude dan latitude). Kode baris ke 2 berfungsi untuk mengganti warna marker dari tempat tujuan. Kode baris ke 4-5 untuk melakukan pengaturan zoomdan animasi pada kamera.

  Aplikasi ini juga memanfaatkan kemampuan media sosial dan dapat melakukan share status ke Facebook untuk melakukan post mengenai tempat yang dikunjunginya. Dengan menggunakan fungsi share facebook maka hal tersebut akan meningkatkan tingkat promosi pada hotel / restoran karena akan dipublikasikan oleh orang-orang di dalam media social mereka masing-masing. Gambar Facebok Share Status dapat dilihat pada Gambar 14 dan Gambar 15.

  .

   Gambar 14. Facebook Share Status 1 Gambar 15. Facebook Share Status 2 Kode Program 6 Facebook Share Status 1. private void postStatusUpdate() { 2. if (canPresentShareDialog) {

  3.

  

4. FacebookDialog shareDialog = createShareDialogBuilderForLink().build();

5. uiHelper.trackPendingDialogCall(shareDialog.present()); 6. } else if (user != null && hasPublishPermission()) { 7. final String message = getString(R.string.status_update,user.getFirstName(), (new Date().toString()));

  8.

  9. Request request =

Request.newStatusUpdateRequest(Session.getActiveSession(), message,

place, tags, new Request.Callback() { 10. 11. @Override 12. public void onCompleted(Response response) { 13. showPublishResult(message, response.getGraphObject(), response.getError()); 14. }

  Kode baris ke 2-8 berfungsi untuk memunculkan share dialog yang dipanggil dari facebook SDK. Kode baris ke 9 berfungsi untuk melakukan untuk melakukan update status. Kode baris ke 12-14 berfungsi untuk

  Request memunculkan hasil dari status yang di update.

  Aplikasi Tripmate melakukan penyimpanan database pada webserver yang membuat aplikasi ini dapat diakses secara online. Dengan menggunakan JSON sebagai penghubung pertukaran data dari mobile ke webserver membuat akses online menjadi bertambah cepat dan menghemat bandwidth. Aplikasi ini merupakan aplikasi yang interaktif dan informatif, dengan menyediakan berbagai informasi seperti letak tempat tujuan dengan Location Based Service, nomer telepon, harga, share media sosial dan sistem rating.

5. Simpulan

  TripMate Salatiga v.1 merupakan aplikasi mobile yang menyediakan informasi hotel dan tempat kuliner di kota Salatiga bagi pengguna. Aplikasi ini menyediakan informasi bagi pengguna secara informatif karena dilengkapi

  

location based service juga share lewat media social. Aplikasi ini juga

  menyediakan informasi bagi pengguna secara responsif karena dapat diakses dengan HP jenis apapun asalkan menggunakan Android. Pemanfaatan teknologi JSON sebagai penghubung antara mobile phone dan webserver berjalan baik dan memiliki kecepatan transfer yang cepat.

6. Pustaka

  [1] Mayank Trivedi, Vishnu Suthar. 2011. “A plan Of M-library For Smt.

  Hansa Metha Library:Astudy

  ”. Volume 1 No. 3.International Journal of Information and Communication Technology Research. [2] Nazaruddin Safaat. 2012. “Pemrograman Aplikasi Mobile, Smartphone,

  Dasar ”. Jakarta : Gunadarma. [3]

  Hardianto R, 2014. “Perangkat Lunak Informasi Wisata di Bandung dan Sekitarnya Berbasis Android ”. Volume 1, No. 1, Jurnal LPKIA. [4] Saternos Casimir

  . 2014. “Client-Server Web Apps with JavaScript and

  Java ”. O’Reilly.

  [5] Rizki Aditya, Widyawan, Sunarfri Bimo. 2013. “Perancangan Antarmuka Layanan Informasi Wisata Kuliner di DIY Berbasis Web dan Mobile Web ”.

  [6] Daeng Zainuddin, Nikentari Nerfita, Kurniawan Hendra. 2013. “M- Library Berbasis Android Menggunakan Protokol JSON (Studi Kasus:FT- UMRAH)”.

  [7] Lee Wei-Meng. 2012.

  “Beginning Android 4 Application Development”. Jakarta. Balai Pustaka. [8] Edi Susanto. 2008. “Introducing MySQL & Visual Basic”. Connection Strings.

  [9] Syed A. Ahson, Ilyas Mohammad. 2012. “Mobile Web 2.0: Developing

  and Delivering Services to Mobile Devices ”. Taylor and Francis Group.

  [10] Dunlu Pen

g, Lidong Cao, Wenjie Xu. 2012. “Using JSON for Data

  Exchanging in Web Service Applications ”.