Perancangan Aplikasi Mobile Commerce
dengan Memanfaatkan Teknologi Push Notification
Berbasis Android
(Studi Kasus : Toko Batik Putra Bengawan,
Surakarta)
Artikel Ilmiah
Peneliti :
Toreo Agni Suci Ayu Pamungkas (672011083) Radius Tanone, S.Kom., M.Cs.
Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Kristen Satya Wacana
Salatiga Desember 2015
Perancangan Aplikasi Mobile Commerce
dengan Memanfaatkan Teknologi Push Notification
Berbasis Android
(Studi Kasus : Toko Batik Putra Bengawan,
Surakarta)
Artikel Ilmiah
Peneliti :
Toreo Agni Suci Ayu Pamungkas (672011083) Radius Tanone, S.Kom., M.Cs.
Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Kristen Satya Wacana
Salatiga Desember 2015
Perancangan Aplikasi Mobile Commerce
dengan Memanfaatkan Teknologi Push Notification
Berbasis Android
(Studi Kasus : Toko Batik Putra Bengawan, Surakarta)
1)Toreo Agni Suci Ayu Pamungkas, 2)Radius Tanone Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana Jl. Diponegoro 52-60, Salatiga 50771. Indonesia Email : 1)toreoagni@gmail.com, 2)radiustanone@gmail.com
Abstract
Batik Putra Bengawan shop utilize the website and BBM (Blackberry Messenger)
as a medium for ordering goods. The use of such media still experiencing problems in which the provision of good confirmation of the buyer and seller sluggish. Of the problem of giving the confirmation slow, then the design m-commerce applications by utilizing push notification technology as a medium for the delivery process which briefly unsettled transactions. The study was conducted through several phases, namely a needs analysis and data collection is done through the interview process to the store, the application design by utilizing phonegap, jquery mobile, google cloud messaging, as well as the use of the method as alpha and beta testing media applications. Results of this research is m-commerce applications based on Android that utilizes push notification technology as a medium to deliver information about each process transactions that occur both from a buyer to a seller and vice versa. This application is expected to make it easier for buyers to make transactions and to improve services of the store.
Keywords: Mobile Commerce, the Push Notification, Android.
Abstrak
Toko Batik Putra Bengawan memanfaatkan website dan BBM (Blackberry
Messenger) sebagai media pemesanan barang. Penggunaan media tersebut masih
mengalami kendala dimana pemberian konfirmasi baik dari pihak pembeli maupun penjual lamban. Dari masalah pemberian konfirmasi yang lamban tersebut, maka dilakukan perancangan aplikasi m-commerce dengan memanfaatkan teknologi
push notification sebagai media penyampaian proses transaksi yang terjadi.
Penelitian dilakukan melalui beberapa tahapan, yaitu analisis kebutuhan dan pengumpulan data yang dilakukan melalui proses wawancara kepada pihak toko, perancangan aplikasi dengan memanfaatkan phonegap, jquery mobile, google
cloud messaging, serta penggunaan metode alpha dan beta sebagai media
pengujian aplikasi. Hasil penelitian ini adalah aplikasi m-commerce berbasis
android yang memanfaatkan teknologi push notification sebagai media
penyampaian informasi mengenai setiap proses transaksi yang terjadi baik dari pembeli ke penjual maupun sebaliknya. Aplikasi ini diharapkan dapat mempermudah pembeli untuk melakukan transaksi dan dapat meningkatkan pelayanan dari pihak toko.
Kata Kunci : Mobile Commerce, Push Notification, Android.
1.
Mahasiswa Fakultas Teknologi Informasi Program Studi Teknik Informatika, Universitas Kristen Satya Wacana
1 1. Pendahuluan
Batik merupakan salah satu produk sandang yang sedang berkembang saat ini. Perkembangan ini dimulai sejak UNESCO pada tahun 2009 menetapkan batik sebagai warisan budaya dunia asal Indonesia [1]. Industri batik semakin menunjukkan perkembangannya setelah pemerintah mengeluarkan ketentuan kewajiban untuk menggunakan pakaian batik pada hari kerja bagi pegawai negeri dan swasta serta bagi pelajar [2]. Berdasarkan hal-hal tersebut peluang bisnis batik semakin berkembang, antara toko batik saling bersaing untuk menawarkan produk-produk batik yang ada.
Batik putra bengawan merupakan salah satu toko batik yang ada di kota Solo yang bergerak dalam bidang fashion. Toko ini menawarkan berbagai macam baju batik, kain batik, dan sebagainya. Toko Batik Putra Bengawan tidak hanya menjual produk-produknya di toko, namun juga memanfaatkan media-media lain yang ada seperti website (putrabengawan.com) dan Blackberry Messenger.
Semakin berkembangnya teknologi informasi, promosi produk-produk batik mulai memanfaatkan teknologi informasi yang ada. Blackberry Messenger merupakan salah satu media sosial yang memiliki pengguna terbanyak dan Indonesia memasuki peringkat kedua sebagai penggunanya [3]. Pihak dari Batik Putra Bengawan mengatakan bahwa promosi menggunakan Blackberry
Messenger dilakukan dengan menjadikan gambar produk sebagai display picture.
Pemanfaatan Blackberry Messenger untuk media promosi produk masih kurang mendukung karena display picture hanya bisa menampilkan satu produk yang ingin dipromosikan. Pemberian keterangan mengenai promosi tersebut juga kurang jelas karena dalam menggunakan personal message terdapat batas penulisan. Apabila memanfaatkan grup BBM tidak semua pembeli dapat dimasukkan ke dalam satu grup yang sama karena dalam satu grup BBM hanya mampu menampung maksimal 50 anggota saja.
Batik Putra Bengawan dalam menjualkan produknya melalui website dan
Blackberry Messenger untuk mempermudah pemesanan barang, akan tetapi
penggunaan layanan tersebut belum maksimal. Kendala yang dihadapi oleh pembeli saat ini adalah kurangnya pemberitahuan mengenai konfirmasi-konfirmasi pemesanan, sedangkan pesan konfirmasi-konfirmasi tersebut sangat lamban diterima oleh pihak pembeli. Konfirmasi pemesanan tersebut dapat dikirimkan menggunakan layanan push notification.
Push notification adalah suatu pesan singkat yang dikirimkan ke mobile user
mengenai suatu peristiwa, bahkan ketika pengguna sedang tidak menggunakan aplikasi yang bersangkutan [4]. Push notification memiliki beberapa kelebihan yaitu dalam proses pengiriman pesan memerlukan biaya yang murah, proses pengiriman pesan yang cepat, konsisten karena di dalam push notification dapat mengimplementasikan tampilan yang user-friendly.
Berdasarkan latar belakang masalah, maka dilakukan penelitian yang bertujuan untuk merancang aplikasi m-commerce pada perangkat Android dengan memanfaatkan push notification. Aplikasi ini diharapkan dapat meningkatkan promosi produk dan pelayanan melalui pemanfaatan push notification.
Tujuan dari penelitian yang dilakukan adalah merancang aplikasi
2
Manfaat dari penelitian yang dilakukan adalah untuk meningkatkan promosi produk serta pelayanan yang dilakukan antara pihak penjual dengan pembeli.
Rumusan masalah pada penelitian yang dilakukan adalah “Bagaimana merancang aplikasi m-commerce dengan memanfaatkan teknologi push
notification berbasis Andorid?” Dengan batasan masalah sebagai berikut; aplikasi
dibangun pada Android platform, aplikasi ini tidak membahas tentang keamanan sistem, aplikasi ini hanya membahas tentang penggunaan push notification dari
Google Cloud Messaging.
2. Kajian Pustaka
Penelitian sebelumnya dengan judul Penerapan Teknologi Google Cloud
Messaging Service Sebagai Pengiriman Push Notification pada Aplikasi Mobile Commerce Berbasis Android, menyatakan bahwa perkembangan teknologi
informasi tidak hanya berhenti pada perkembangan e-commercer saja namun sudah mulai memanfaatkan mobile device untuk melakukan proses jual beli online yang sering disebut m-commerce dengan memanfaatkan media sosial yang berjalan di mobile device. Proses m-commerce dilakukan salah satunya dengan memasang gambar produk di display picture BBM (Blacberry Messenger). Proses pengiriman informasi mengenai transaksi masih dilakukan melalui SMS, telepon ataupun chatting. Hal ini membuat pelanggan kurang percaya karena proses timbal balik yang dilakukan oleh penjual relatif lama. Penggunaan notification
message memiliki peran untuk mengirimkan konfirmasi dari pihak penjual kepada
pembeli mengenai pemesanan yang terjadi dan informasi yang digunakan untuk mengkonfirmasi pembayaran dan pengiriman barang [5].
Penelitian yang dilakukan sebelumnya pada aplikasi mobile commerce dengan menerapkan Google Cloud Messaging Service sebagai pengiriman Push
Notification kepada pembeli mengenai pemesanan yang terjadi dan informasi
yang digunakan untuk mengkonfirmasi pembayaran dan pengiriman barang. Perbedaan dengan penelitian yang dilakukan saat ini adalah pemanfaatan push
notification untuk mempromosikan produk-produk baru dan promo-promo yang
diberikan oleh pihak penjual, adanya fitur wishlist membuat pembeli dapat mendapatkan informasi mengenai produk yang diinginkan apabila produk tersebut sudah tersedia, fitur comment sehingga pembeli dapat memberikan komentar mengenai produk-produk yang ada sehingga pihak penjual dapat mengetahui setiap respon yang diberikan oleh pembeli, fitur chat membuat pembeli dan penjual dapat berinteraksi secara langsung, dan fitur cek resi sehingga pembeli dapat mengetahui proses pengiriman barang yang sudah dibeli.
Penelitian sebelumnya dengan judul Aplikasi Pemesanan Makanan Berbasis
Android (Studi Kasus : Rumah Makan Steak Moen-Moen, Surakata), menyatakan
bahwa aplikasi pemesanan makanan ini dapat memudahkan pihak rumah makan dalam mempromosikan makanannya serta memberikan kemudahan bagi pelanggan untuk melakukan pemesanan. Penggunaan teknologi Push Notification
Google Cloud Messaging yang dapat membantu pelanggan menerima konfirmasi
3
Berdasarkan penelitian sebelumnya, mengenai aplikasi pemesanan makanan berbasis android menerapkan push notification sebagai media konfirmasi dari pihak penjual. Perbedaan dengan penelitian yang dilakukan saat ini adalah pemanfaatan push notification untuk pemberian konfirmasi dari setiap proses transaksi yang dilakukan. Pemberian konfirmasi tidak hanya dari sisi penjual saja namun juga dari sisi pembeli.
Mobile commerce merupakan sistem perdagangan elektronik dengan
menggunakan peralatan portabel atau mobile seperti mobile device, smartphone, PDA, notebook, dan lain lain. Pada saat penggunaan peralatan mobile berpindah dari satu tempat ke tempat lain, penggunaan peralatan mobile tersebut dapat melakukan transaksi jual beli produk di internet dengan menggunakan sistem
mobile commerce. Pada dasarnya mobile commerce adalah gabungan e-commerce
dengan mobile computing [7].
Phonegap adalah framework HTML5 yang digunakan untuk
mengembangkan apliaksi mobile melalui teknologi web. Phonegap dapat diimplementasikan diberbagai platform salah satunya adalah Android. Phonegap menggunakan browser modern untuk mengembangkan aplikasi berbasis HTML5 dan CSS3.
Phonegap framework yang utama adalah Javascript Library yang
memungkinkan HTML atau Javascript mengakses device fiture. Sebuah aplikasi yang dibangun menggunakan Phonegap pasti memiliki dua bagian penting yaitu :
1. Javascript Business Logic Part¸ yang bertanggung jawab tentang UI
dan fungsionalitas
2. Javascript Part, yang berfungsi untuk mengakses dan mengontrol
device (phone or tablet) [8]
Jquery merupakan library javascript yang berguna untuk meningkatkan
produktivitas developer dan membantu developer dengan kompatibilitas
cross-platform. Terdapat banyak plug-ins yang tersedia di dalam jquery, salah satunya
adalah jquerymobile [9]. JqueryMobile adalah framework yang dapat merancang
user interface yang responsif dan dapat digunakan pada semua
platformsmartphone, tablet dan desktop [10].
Push Notification merupakan komunikasi jaringan dimana server akan
mengirimkan pesan ke client jika ada perubahan data, sehingga client tidak perlu melakukan proses request data tiap periode untuk mengambil data notifikasi. Pada teknologi Push Notifikasi untuk devicemobile sangat efektif karena berjalan pada
background proses sehingga memungkinkan aplikasi menerima pesan. Push Notification dapat diimplementasikan pada beberapa devicemobile salah satunya
adalah Android, pada sistem operasi Android proses Push Notification dapat memanfaatkan layanan Google Cloud Messaging (GCM) untuk mengirim pesan atau notifikasi [11].
3. Tahapan Penelitian
Penelitian ini memiliki lima tahapan penelitian, yaitu analisis kebutuhan dan pengumpulan data, perancangan sistem, perancangan aplikasi/program, implementasi dan pengujian sistem serta analisis hasil pengujian, dan penulisan laporan hasil penelitian [12]. Tahap pertama yaitu tahap analisis kebutuhan dan
4
pengumpulan data. Pada tahap ini peneliti mengumpulkan data-data yang di perlukan dalam pembuatan aplikasi ini. Data yang didapat dapat berasal dari wawancara dan studi pustaka. Pada aplikasi ini peneliti mendapatkan data dari hasil wawancara dengan manager toko Batik Putra Bengawan. Data yang didapat adalah data barang yang berupa deskripsi barang (harga, model, ukuran, jumlah). Tahap kedua yaitu perancangan sistem meliputi perancangan proses (UML) seperti usecase diagram, activity diagram, sequence diagram, class diagram dan
deployment diagram. Pada tahap ini juga dilakukan perancangan arsitektur,
perancangan database dan perancangan antarmuka. Tahap ketiga yaitu perancangan aplikasi atau program. Pada tahap ini peneliti melakukan perancangan aplikasi yang dibutuhkan oleh client yang didapat berdasarkan hasil wawancara dengan client. Tahap keempat yaitu implementasi dan pengujian sistem, serta analisis hasil pengujian. Pada tahap ini merupakan tahap pembuataan aplikasi sesuai dengan rancangan yang telah dibuat. Setelah aplikasi selesai dibuat maka akan dilakukan pengujian, apakah aplikasi ini sesuai dengan yang diharapkan atau tidak. Setelah tahap pengujian selesai dilakukan, maka akan masuk keproses analisis hasil pengujian sistem. Tahap terakhir yaitu penulisan laporan hasil penelitian, yaitu mendekomentasikan setiap proses yang dikerjakan dalam pembuatan aplikasi m-commerce ini [12].
Pada penelitian ini, metode penelitian yang digunakan dalam perancangan sistem yaitu model prototyping. Pemilihan model prototyping dikarenakan belum diketahuinya sistem bisnis yang ada. Metode ini memungkinkan pengembang dan pelanggan dapat saling berinteraksi selama proses pembuatan sistem. Bagan mengenai prototype model dapat dilihat pada Gambar 1.
Gambar 1 Bagan Prototype Model [13]
Proses atau tahapan dalam penyelesaian masalah pada prototyping model yaitu : 1) Pengumpulan kebutuhan di mana pihak developer mencari tahu kebutuhan client, tujuan umum dan gambar bagian-bagian yang akan dibutuhkan berikutnya. 2) Pengkodean sistem merupakan suatu tahap di mana jika
prototyping sudah disepakati maka prototype tersebut akan diterjemahkan ke
dalam bahasa pemrograman yang sesuai, pada bagian ini implementasi dan pengembangan sistem dalam bentuk nyata dilakukan. Pengujian sistem dilakukan
5
bila sistem sudah dibentuk menjadi suatu perangkat lunak, maka pada tahap selanjutnya adalah menguji sistem tersebut dengan variabel-variabel real sesuai dengan kebutuhan client. Tahap ini sering juga disebut testing, sehingga kesalahan-kesalahan kerja pada sistem dapat dihindari. 3) Evaluasi sistem merupakan suatu tahap dimana client akan mengevaluasi kerja sistem yang sudah selesai, apakah sesuai dengan yang diharapkan. Apabila sistem tidak sesuai dengan yang diharapkan oleh client maka sistem akan dibangun ulang maupun diperbaiki melalui tahap pengkodean sistem dan selanjutnya. Perulangan ketiga proses ini terus berlangsung hingga semua kebutuhan terpenuhi.
Aplikasi m-commerce yang telah dibuat memiliki dua pengguna, yang pertama 1) Pelanggan dapat melihat daftar barang-barang yang dijual di aplikasi
m-commerce ini. 2) Pelanggan harus melakukan registrasi terlebih dahulu ke
GCM untuk mendapatkan registration id. 3) Pelanggan yang sudah login dapat melihat daftar barang-barang yang sudah dipesan. Pelanggan juga bisa mengubah dan menghapus barang yang sudah dipesan. Jika pelanggan sudah melakukan konfirmasi pemesanan, maka sistem akan mengirimkan konfirmasi ke penjual melalui GCM. 4) Pelanggan melakukan konfirmasi pembayaran dan sistem akan secara otomatis mengirimkan konfirmasi ke penjual melalui GCM. 5) Pelanggan dapat melakukan cek proses pengiriman barang yang sudah dipesan. 6) Pelanggan yang sudah login dapat memberikan pertanyaan ke penjual melalui chat dan sistem akan mengirimkan notifikasi ke penjual melalui GCM. 7) Pelanggan dapat melakukan facebook sharing terhadap produk yang diinginkan sehingga orang lain dapat memberikan pendapat mengenai produk yang dibagikan. 8) Pelanggan dapat memberikan komentar mengenai produk yang ada.
Pengguna sistem yang kedua adalah manager toko batik putra bengawan yang berperan sebagai admin yang dapat melakukan aktivitas sebagai berikut : 1) Pada aplikasi m-commerce, admin harus melakukan registrasi terlebih dahulu ke GCM untuk mendapatkan registration id. 2) Pada aplikasi m-commerce admin yang sudah login dapat melihat daftar pesanan dan daftar transaksi yang sudah dilakukan oleh pembeli. 3) Pada aplikasi m-commerce, admin dapat melakukan konfirmasi pengiriman ke pelanggan. 4) Pada aplikasi m-commerce, admin dapat membalas pesan yang diterima dari pelanggan. 5) Pada halaman web, admin dapat menambah, mengedit, menghapus dan melihat daftar barang.
Dalam perancangan aplikasi m-commerce ini, diperlukan hardware dan
software yang mendukung implementasi sistem.Aplikasi m-commerce dapat
dijalankan pada Android device yang mempunyai OS 2.2 ke atas dan juga memiliki Google account dan Google Play Store yang terpasang di dalamnya.
Perancangan sistem dibutuhkan untuk menggambarkan cara kerja sistem aplikasi yang dibangun. Perancangan sistem pada penelitian ini menggunakan UML (Unified Modeling Language) yang dibagi menjadi beberapa tahapan sebagai berikut.
Pada use case diagram, terdapat tiga aktor yang bertindak sebagai guest, pembeli dan penjual. Aktor guest dapat melihat daftar barang, detail barang dan
facebook share tanpa harus melakukan login terlebih dahulu. Aktor pembeli dapat
melakukan pemesanan barang dimana ketika pembeli melakukan pemesanan barang, pembeli dapat mengubah serta mebatalkan pemesanan. Apabila proses
6
Mengganti pesananMenghapus pesanan Melakukan Facebook Sharing Memesan Barang Melakukan Konfirmasi Pengiriminan TambahDataBarang HapusDaftarBarang UbahDataBarang
Melakukan Cek resi <<extend>>
<<extend>>
<<extend>> Pemesanan Barang
<<extend>>
Olah Data Barang <<extend>> <<extend>> <<extend>> Melakukan Konfirmasi Pembayaran <<include>> <<include>> Memberikan Komentar Pembeli Melakukan Chatting Penjual Guest Melihat Daftar Barang
<<extend>>
<<extend>>
<<extend>>
pemesanan sudah berhasil, maka pembeli harus memberikan konfirmasi pembayaran. Pembeli juga dapat membagikan informasi mengenai suatu produk melalui facebook share. Dalam fitur facebook share informasi yang dibagikan berupa link ke website toko. Pembeli juga dapat mengecek proses pengiriman, memberikan komentar mengenai suatu produk serta melakukan chatting kepada penjual. Aktor penjual dapat menambah, menghapus dan mengubah data barang. Penjual memberikan konfirmasi pembayaran dan konfirmasi pengiriman ke pembeli serta penjual dapat memberikan komentar. Penjual juga memiliki fungsi untuk mengelola transaksi (melihat daftar transaksi dan menghapus daftar transaksi), melihat daftar pesanan, melakukan konfirmasi pembayaran, melakukan konfirmasi pengiriman dan mengirimkan daftar produk baru. Gambar 2 Gambar
use case diagram.
Gambar 2 Use Case Diagram
Activity diagram adalah gambaran aliran proses yang terdapat dalam sistem
mulai aktivitas start sampai aktivitas stop. Dalam proses pembelian di aplikasi
m-commerce ini melibatkan pembeli, penjual, sistem, database dan GCM. Proses
pembelian dimulai dari pembeli login kemudian memilih produk yang dipesan. Setiap barang yang dipesan oleh pembeli akan masuk ke dalam halaman cart, dimana pembeli dapat mengubah jumlah pesanan. Pembeli dapat kembali ke menu katalog jika ingin menambah pesanan. Setelah itu, pembeli mengisi data alamat pengiriman. Setiap data tersebut akan di simpan di dalam database. Data-data pemesanan akan ditampilkan di dalam halaman detail order. Pembeli dapat mengubah dapat data alamat pengiriman. Apabila proses pemesanan sudah selesai dilakukan, maka sistem akan mengirimkan pesan notifikasi kepada penjual melalui GCM server. Pesan yang dikirimkan oleh GCM server akan ditampilkan oleh sistem. Gambar 3 Activity Diagram.
7 Start Memilih Produk Mengisi Alamat Pengiriman Stop Login Menerima Notifikasi Tidak Tidak Menampilkan List Order Request penambahan pesanan Request Penambahan Alamat Pengiriman Menampilkan detail pemesanan Menampilkan Notifikasi dari GCM Ya Menyimpan data di tabel wp_postmeta
Menyimpan alamat pengiriman di tabel wp_postmeta Ya Mengirimkan Notifikasi GCM Database Sistem Penj ual Pembeli
Gambar 3 Activity Diagram
Sequence diagram digunakan untuk menggambarkan skenario atau
rangkaian langkah-langkah yang dilakukan sebagai respon dari sebuah event untuk menghasilkan output tertentu. Salah satu peran GCM dalam proses jual beli
m-commerce yaitu pada proses pemesanan barang. Saat pembeli melakukan
konfirmasi pembayaran, setiap data yang dimasukkan oleh pembeli akan tersimpan di dalam database dan GCM akan mengirimkan notifikasi ke penjual. Sedangkan di aplikasi penjual, penjual akan mengirimkan konfirmasi pengiriman dan status pemesanan akan berubah. Setiap perubahan yang terjadi akan disimpan di dalam database. Gambar mengenai sequence diagram pembeli dan penjual dapat di lihat di Gambar 4 dan Gambar 5.
8
Pembeli : Actor Transaksi : Boundary Transaksi : Controller wp_posts : Table GCM 1. Melakukan Konfirmasi Pembayaran
2. Request Konfirmasi Pembayaran
4. Cek DB 5. Mengirimkan Sender Id 7. Mengirimkan Pesan 8. Menerima Pesan 9. Destroy 3. OpenDB 6. CloseDB
Gambar 4 Sequence Diagram Pembeli
Penjual : Actor Pengiriman : Boundary Pengiriman : Controller wp_posts : Table GCM
1. Melakukan Konfirmasi Pengiriman
2. Mengirimkan Request 4. Update DB 5. Mengirmkan Sender ID 7. Mengirimkan Pesan 8. Menerima Pesan 9. Destroy 6. Close DB 3. Open DB
9
Class diagram merupakan suatu diagram yang digunakan untuk
menampilkan class-class yang dibutuhkan dalam sistem tersebut. Pada aplikasi
m-commerce terdapat 6 class yang dibutuhkan, yaitu GCM, registrasi user, chat, cek
resi, kometar, bill, orderan baru, alamat pengiriman dan produk. Class GCM berfungsi untuk menyimpan setiap data dari device yang mendaftar pada GCM. Atribut registration id digunakan untuk mengirimkan pesan ke setiap device sesuai dengan application id yang dikirimkan oleh device. Class registrasi user berfungsi untuk menyimpan data-data member baru yang masuk. Setiap member baru juga memiliki atribut registration id yang berfungsi untuk mengirim dan menerima notifikasi. Class chat berfungsi untuk menyimpan dan menampilkan setiap chat yang telah dilakukan user. Class cek resi berfungsi untuk melihat proses pengiriman dari produk yang telah dibeli. Class komentar berfungsi untuk mengirimkan dan melihat komentar yang dilakukan oleh user. Class bill berfungsi untuk melihat detail pesanan dan melakukan konfrimasi pembayran. Class orderan baru berfungsi untuk menyimpan orderan-orderan yang dilakukan oleh pembeli, sehingga pembeli dapat melihat, mengubah dan menghapus barang yang sudah dipesan. Class alamat pengiriman berfungsi untuk menyimpan, melihat dan mengubah setiap data alamat pengiriman yang dimasukkan oleh user. Class produk berfungsi untuk menampilkan setiap barang yang dijual, sehingga pembeli dapat melihat setiap detail produk yang ada. Class diagram pada aplikasi
m-commerce ini dapat dilihat pada Gambar 6.
10
Deployment diagram merupakan gambaran proses-proses yang terjadi pada
suatu sistem yang berjalan dan bagaimana relasi yang terjalin di dalamnya. Pada aplikasi m-commerce ini aplikasi web pada penjual, aplikasi mobile pada penjual, dan aplikasi mobile pada pembeli dijembatani oleh RESTfFullweb service untuk mengambil data yang ada di dalam database. Sedangkan aplikasi server dihubungkan dengan GCM server melalui koneksi HTTP protokol. Deployment
diagram pada aplikasi m-commerce ini bisa dilihat pada Gambar 7.
GCM Server Web Server Web Admin Mobile Admin Mobile Client Restful Web Service
Restful Web Service
Restful Web Service HTTP Protokol
Gambar 7 Deployment Diagram
Arsitektur aplikasi yang digunakan dalam aplikasi m-commerce ini dapat dilihat pada Gambar 8.
Gambar 8 Arsitektur Aplikasi
Pada Gambar 8 dapat dijelaskan bahwa pembuatan aplikasi m-commerce terdiri dari 4 komponen yaitu database, server, google cloud messaging dan
mobile device dengan OS android. Database berfungsi sebagai penyimpanan data. Server berfungsi sebagai jembatan antara database dengan mobile device dan google cloud messaging. Hubungan antara aplikasi, google cloud messeging, server dan database yaitu : Pertama, aplikasi akan mengirimkan application id ke
11
google cloud messeging. Kedua, google cloud meseging akan mengirimkan registration id dimana setiap device memiliki registration id yang berbeda.
Ketiga, registration id yang dikirimkan oleh google cloud messeging akan diproses di server untuk disimpan di dalam database. Keempat, setiap data yang diberikan oleh pembeli disimpan dalam database. Kelima, dalam proses pengiriman notification maka sistem akan mengambil data register id dari
database. Keenam, register id dan apikey dikirimkan ke google cloud messaging server. Ketujug, google cloud messaging server mengirimkan nitification kepada
pihak yang menerima pesan. 4. Hasil dan Pembahasan
Terdapat dua user dalam aplikasi m-commerce ini yaitu pembeli dan penjual. Pembeli dapat melakukan registrasi, login, melihat daftar produk, melihat detail produk, memberikan komentar pada produk, memasukkan produk ke dalam wishlist, melakukan pemesanan produk dimana pembeli dapat menghapus dan mengubah produk yang sedang dipesan, melihat detail pemesanan, melihat proses pengiriman dari barang yang dipesan, melakukan
sharing produk ke facebook, melakukan chatting dengan pihak penjual dan
melakukan konfirmasi pembayaran setelah pembeli selesai melakukan proses pemesanan dan mendapat notifikasi dari pihak penjual. Pihak penjual dapat melakukan login, melihat daftar pesanan, memberikan komentar, melakukan
chatting dengan pembeli, memberikan konfirmasi pengiriman, mengirimkan
pemberitahuan mengenai produk baru dan promo. Penjual dapat menambah, mengubah dan menghapus produk melalui aplikasi web serta melihat list pemesanan.
Pada saat pembeli membuka aplikasi ini, maka app id dikirimkan ke GCM
server kemudian registration id yang didapatkan dari GCM server akan
dikirimkan ke pembeli. Registration id yang didapat akan disimpan ke dalam
database ketika pembeli melakukan registrasi. Sistem akan melakukan
pengecekan registration id ketika pembeli melakukan login. Apabila registration
id yang didapatkan berbeda, maka registration id pada database akan diubah.
Pelanggan dapat melakukan proses pemesanan setelah proses login selesai. Pelanggan dapat melihat daftar-daftar produk yang tersedia dan memilih produk yang diinginkan. Sistem akan mengirimkan notifikasi ke penjual apabila proses pemesanan yang dilakukan oleh pembeli telah selesai. Pada proses pemesanan sistem akan melakukan pengecekkan. Apabila stok barang pada barang yang dipesan sudah habis, maka sistem akan mengirimkan pemberitahuan kepada penjual. Kode Program 1 merupakan proses untuk mengirimkan notifikasi.
Kode Program 1 Kode Program untuk Mengirimkan Notifikasi
1. $url = 'https://android.googleapis.com/gcm/send';
2. $fields = array( 'registration_ids' => array($serv), 'data' => array("message" => $psn , "title" => "Orderan Baru"),);
3. $headers = array('Authorization: key=' . $_POST['apiKey'], 'Content-Type: application/json');
4. $ch = curl_init();
5. curl_setopt( $ch, CURLOPT_URL, $url ); 6. curl_setopt( $ch, CURLOPT_POST, true );
7. curl_setopt( $ch, CURLOPT_HTTPHEADER, $headers); 8. curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); 9. curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
10. curl_setopt( $ch, CURLOPT_POSTFIELDS, json_encode( $fields ) ); 11. $result = curl_exec($ch);
12
Baris kedua dan baris ketiga pada Kode Program 1 digunakan untuk menginisialisasikan isi dari data yang akan dikirimkan ke GCM server. Data yang dikirimkan berupa registration id, pesan notifikasi dan apikey. Baris keempat sampai ke-10 berfungsi untuk melakukan pengiriman data yang didapat ke GCM
server. Baris ke-11 digunakan untuk menampung hasil pengiriman. Kode
Program 2 merupakan proses untuk menerima notifikasi.
Kode Program 2 Kode Program untuk Menerima Notifikasi
Kode program 2 menjelaskan tentang kode JavaScript untuk menangkap pesan dari Google Cloud Messaging. Baris keempat digunakan untuk mengecek kondisi aplikasi aktif atau tidak. Jika kondisi aplikasi aktif maka sound akan menyala. Setiap pesan notifikasi yang dikirimkan dari GCM akan ditampilkan pada notification bar pada perangkat mobile. Hasil notifikasi yang diterima oleh penjual dapat dilihat pada Gambar 9 dan Gambar 10.
Gambar 9 Notifikasi Orderan Baru
Gambar 10 Notifikasi Stok Habis
Pembeli yang telah melakukan pemesanan akan mendapatkan kode pemesanan yang akan ditampilkan di menu sidebar. Menu sidebar tidak hanya berisi kode pemesanan namun juga terdapat beberapa menu yang lainnya seperti
wishlist, cart, cek resi, kategori produk, dan lain sebagainya. Tampilan menu sidebar dapat dilihat pada Gambar 11.
1. function onNotification(e) { 2. switch( e.event ) {
3. case 'message': 4. if (e.foreground) {
5. var soundfile = e.soundname || e.payload.sound;
6. var my_media = new Media("/android_asset/www/"+ soundfile); 7. my_media.play();} 8. else{ 9. if (e.coldstart){} else{}} 10. title=e.payload.title; 11. isipesan = e.payload.message; 12. alert("title= "+title+”isipesan= “); 13. break;}}
13
Gambar 11 Tampilan Menu Sidebar
Pembeli yang telah melakukan pemesanan, dapat melakukan konfirmasi pembayaran dengan mengisi data-data yang dibutuhkan. Data-data tersebut akan disimpan ke dalam database dan server akan mengirimkan pesan notifikasi melalui GCM ke aplikasi m-commerce di pihak penjual. Notifikasi konfirmasi pembayaran yang dikirimkan ke pihak penjual dapat di lihat pada Gambar 12.
Gambar 12 Notifikasi Konfirmasi Pembayaran
Penjual akan mengirimkan konfirmasi pembayaran kepada pembeli jika data-data yang dikirimkan pembeli sudah sesuai dengan pesanan pembeli. Penjual juga akan mengirimkan konfirmasi pengiriman kepada pembeli dengan mengirimkan nomer resi pengiriman dan tanggal pengiriman sampai ke pihak pembeli. Pesan notifikasi konfirmasi pemabayaran dan konfirmasi pengiriman ke pihak pembeli dapat di lihat pada Gambar 13 dan Gambar 14.
Gambar 13 Notifikasi Konfirmasi Pembayaran
14
Setiap nomer resi yang dikirimkan penjual akan muncul di menu side bar. Pembeli dapat melakukan cek proses pengiriman dengan memilih nomer resi yang sudah diterima. Sistem akan menampilkan proses pengiriman dengan meng-link-an ke halammeng-link-an website jne. Halammeng-link-an proses pengirimmeng-link-an dapat dilihat pada Gambar 15.
Gambar 15 Halaman Website Proses Pengiriman
Pada aplikasi m-commerce ini pembeli dapat melakukan facebook share dimana pembeli dapat membagikan produk ke facebook sehingga viewer dapat memberikan komentar mengenai produk yang dibagikan. Proses facebook share dengan cara menge-link-kan gambar produk ke halaman post facebook.
Kode Program 3 Kode Program untuk Melakukan Facebook Share
Kode Program 3 berfungsi untuk melakukan facebook sharing. Proses yang terjadi dalam facebook sharing ini yaitu dengan mengirimkan link halaman detail produk yang ada di website toko Batik Putra Bengawan. Interface halaman
facebook share dapat dilihat pada Gambar 16.
Gambar 16 Interface Halaman Facebook Share
Pada aplikasi m-commerce yang telah dirancang oleh peneliti memiliki fitur komentar dan chatting, sehingga pembeli dan penjual dapat saling berinteraksi baik melalui komentar maupun chatting. Proses komentar maupun chatting memanfaatkan google cloud messaging sebagai media pengiriman notifikasi ke pihak pembeli maupun penjual. Sehingga setiap komentar maupun chatting yang dilakukan mengirimkan pemberitahuan ke pihak penjual maupun pembeli. Notifikasi chatting dapat dilihat pada Gambar 17.
1. $('#ff').append('<div class="social-sharing" data-permalink="'+ul+'">'+ 2. '<a target="_blank" href="http://www.facebook.com/sharer.php?u='+ul+'"
class="share-facebook">'+
3. '<span class="icon icon-facebook" aria-hidden="true"></span>'+ 4. '<span class="share-title">Share</span>'+'</a>'+'</div>');
15
Gambar 17 Notifikasi Chatting
Pada aplikasi m-commerce bagi penjual, penjual dapat memberikan pemberitahuan mengenai produk-produk baru yang tersedia serta promo yang sedang berlangsung. Sistem notifikasi ini memanfaatkan google cloud messeging sebagai media pengiriman notifikasi. Notifikasi produk-produk baru dapat dilihat pada Gambar 18.
Gambar 18 Notifikasi Produk Baru
Pada aplikasi m-commerce ini, produk yang tidak memiliki stok tetap ditampilkan di halaman katalog sehingga pembeli tetap bisa memesan produk tersebut. Pemesanan produk yang tidak memiliki stok akan ditampilkan di dalam menu wishlist. Setiap pesanan wishlist yang dilakukan pembeli akan dikirimkan ke pihak penjual melalui pesan notifikasi. Apabila produk yang terdapat dalam menu wishlist sudah tersedia maka pembeli yang melakukan pemesanan akan mendapatkan pesan notifikasi. Pemberian pesan notifikasi kepada pihak pembeli agar pembeli dapat melakukan proses pemesanan selanjutnya. Notifikasi wishlist dapat dilihat pada Gambar 19.
Gambar 19 Notifikasi Wishlist
Pengujian aplikasi dilakukan untuk melihat sejauh mana aplikasi dapat berjalan. Pengujian aplikasi menggunakan teknik Alpha dan Beta Test. Pengujian
Alpha merupakan pengujian program yang dilakukan oleh pembuat aplikasi
ataupun orang-orang yang terlibat di dalamnya. Pengujian aplikasi pada tahap ini menggunakan black box, yaitu pengujian fungsional tanpa melihat alur eksekusi program, namun cukup dengan memperhatikan apakah setiap fungsi sudah berjalan dengan baik sesuai dengan yang diharapkan. Hal yang diuji dan hasil pengujian dapat dilihat pada Tabel 1.
16
Tabel 1 Tabel Hasil Pengujian Android Applicatin Fungsi yang Diuji Kondisi Output yang Diharapkan Output Aplikasi Hasil Konfirmasi Pemesanan Button selanjutnya dipilih Notification pemesanan dikirimkan ke penjual Notification pemesanan dikirimkan ke penjual Valid Konfirmasi Pembayaran Button konfirmasi pembayaran dipilih Notification konfirmasi pembayaran dikirimkan ke pihak penjual Notification konfirmasi pembayaran dikirimkan ke pihak penjual Valid Konfirmasi Pengiriman Button konfirmasi pengiriman dipilih Notification konfirmasi pengiriman dikirimkan ke pembeli Notification konfirmasi pengiriman dikirimkan ke pembeli Valid Komentar Button komentar dipilih Notification komentar dikirimkan ke pihak penjual Notification komentar dikirimkan ke pihak penjual Valid
Chatting Button chat dipilih Notification chat dikirimkan ke pihak penjual Notification chat dikirimkan ke pihak penjual Valid
Cek Resi Button cek resi dipilih Menampilkan proses pengiriman pada halaman web JNE Menampilkan proses pengiriman pada halaman web JNE Valid Facebook Share Button facebook share dipilih Menampilkan share produk pada halaman web facebook Menampilkan share produk pada halaman web facebook Valid Pemberitahuan Produk Baru Button new arrival dipilih Notification produk baru dikirimkan ke pihak pembeli Notification produk baru dikirimkan ke pihak pembeli Valid
Berdasarkan hasil pengujian sistem pada Tabel 1 dapat disimpulkan bahwa aplikasi m-commerce sudah memenuhi tujuan penelitian.
17
Pengujian beta dilakukan dengan cara memberikan kuisioner kepada responden, yaitu dengan cara menjawab kuisioner sesudah menggunakan aplikasi. Pengujian ini digunakan untuk mengetajui sejauh mana aplikasi ini berfungsi dengan baik dan apakah aplikasi sudah sesuai dengan kebutuhan pembeli. Pengujian beta dilakukan dengan cara pembagian kuisioner kepada pelanggan. Pengujian untuk pelanggan dilakukan kepada 40 responden melalui kuisioner yang harus diisi bersamaan dengan pengujian aplikasi secara langsung. Hal yang diuji dan hasil pengujian dapat dilihat pada Tabel 2.
Tabel 2 Daftar Pertanyaan Kuisioner dan Tabulasi Jawaban Responden
NO Soal Skor Jawaban
1 2 3 4 5
1 Apakah aplikasi m-commerce ini mudah untuk
digunakan? 11 23 6
2
Apakah dengan aplikasi ini anda dapat dengan mudah mendapatkan informasi mengenai
produk-produk baru dan promo?
9 28 3
3
Apakah dengan aplikasi ini anda dapat dengan mudah mendapatkan informasi mengenai proses
transaksi yang dilakukan?
6 27 7
4 Apakah dengan aplikasi ini anda dapat dengan
mudah memberikan komentar? 13 21 6
5 Apakah dengan aplikasi ini anda dapat dengan
mudah melakukan chatting dengan penjual? 13 16 11 6 Apakah dengan aplikasi ini anda dapat dengan
mudah melakukan cek proses pengiriman? 14 19 7 7 Apakah menurut anda tampilan aplikasi ini cukup
menarik? 20 15 5
Tabel 2 merupakan hasil pengujian responden.Dengan menggunakan skala
likert, maka mendapatkan hasil sebagai berikut; pertanyaan pertama sebanyak
77,5% responden mengatakan bahwa aplikasi m-commerce ini mudah untuk digunakan. Pertanyaan kedua sebanyak 77% responden mengatakan bahwa dengan aplikasi m-commerce ini pembeli dapat dengan mudah mendapatkan informasi mengenai produk-produk baru dan promosi. Pertanyaan ketiga sebanyak 80,5% responden mengatakan bahwa dengan aplikasi ini dapat dengan mudah mendapatkan informasi mengenai proses transaksi yang dilakukan. Pertanyaan keempat sebanyak 76,5% responden mengatakan bahwa dengan aplikasi ini dapat dengan mudah untuk memberikan komentar mengenai suatu produk. Pertanyaan kelima sebanyak 79% responden mengatakan bahwa dengan adanya fitur chatting pada aplikasi ini dapat mempermudah bertanya jawab dengan pihak penjual. Pertanyaan keenam sebanyak 76,5% responden mengatakan bahwa dengan adanya fitur cek resi pada aplikasi ini dapat mempermudah melihat proses pengiriman. Pertanyaan ketujuh sebanyak 72,5% responden mengatakan bahwa tampilan aplikasi ini cukup menarik.
Berdasarkan wawancara dari karyawan toko Batik Putra Bengawan, ada beberapa pendapat yang diberikan oleh pihak toko yaitu: Pertama, tampilan aplikasi m-commerce bagi pihak penjual cukup menarik dan mudah untuk digunakan. Kedua, fitur yang ada cukup membantu untuk memberikan informasi
18
mengenai produk-produk baru yang ada serta promo yang diberikan oleh pihak toko. Ketiga, dengan adanya fitur chatting dapat mempermudah komunikasi antara penjual dengan pembeli. Keempat, melalui fitur komentar pihak toko dapat mengetahui komentar-komentar mengenai produk yang ada di toko sehingga dapat meningkatkan kualitas dan pelayanan toko.
Berdasarkan dari hasil pengujian aplikasi m-commerce terhadapat 50 device
mobile mengenai pengiriman notifikasi membutuhkan waktu 5 detik. Hal ini
menunjukkan bahwa pengiriman pesan notifikasi membutuhkan waktu yang singkat. Pengiriman pesan notifikasi yang singkat membuat penjual maupun pembeli dapat segera mendapatkan informasi mengenai pemesanan.
5. Simpulan
Berdasarkan penelitian yang telah dilakukan dapat disimpulkan bahwa aplikasi m-commerce yang memanfaatkan teknologi push notification dapat mempermudah penjual dan pembeli dalam mendapatkan informasi pemesanan. Pengiriman push notification membutuhkan waktu yang singkat sehingga penjual dan pembeli dapat segera mendapatkan informasi mengenai proses pemesanan. Adanya fitur-fitur tambahan dalam aplikasi m-commerce ini seperti wishlist dapat membantu pembeli dalam membuat pesanan apabila produk yang ingin dibeli sudah habis.
Saran untuk pengembangan aplikasi kedepan adalah aplikasi dapat didesain lebih menarik, meningkatkan performa aplikasi sehingga setiap fungsi dapat berjalan dengan lebih cepat, dan dapat digunakan untuk multi platform.
6. Pustaka
[1] Suryanto. 2012. Industri Batik Berkembang Pesat Setelah Pengakuan
UNESCO.
http://www.antaranews.com/berita/309634/industri-batik-berkembang-pesat-setelah-pengakuan-unesco (diakses tanggal 12 Juli 2015). [2] Suhendra. 2010. Pemerintah Wajibkan PNS Pakai Batik.
http://finance.detik.com/read/2010/08/24/121451/1426573/4/pemerintah-wajibkan-pns-pakai-batik (diakses tanggal 12 Juli 2015)
[3] Hermawan, Bobby. 2012. Peran Blackberry Messenger Sebagai Media
Pemasaran. Jawa Timur : Universitas Pembangunan Nasional “Veteran”.
[4] Pielot, Martin, Karen Church, Rodrigo de Oliveira. 2014. An In-Situ Study of
Mobile Phone Notifications. Canada : Toronto.
[5] Pratama, Ferdian Aditya. 2014. Penerapan Teknologi Google Cloud
Messaging Service Sebagai Pengiriman Push Notification pada Aplikasi Mobile Commerce Berbasis Android. Salatiga: Universitas Kristen Satya
Wacana.
[6] Pramana, Michael Indra. 2014. Aplikasi Pemesanan Makanan Berbasis
Android (Studi Kasus : Rumah Makan Steak Moen-Moen, Surakata).
Salatiga: Universitas Kristen Satya Wacana.
[7] Wiley & Sons. 2007. Mobile Commerce Beyond Electronic Commerce :
Issue and Challenge.
[8] Gathol, Rohit & Yogesh Pathel. Beginning PhonegapMobile Weg
19
[9] Franklin, Jack. Beginning Jquery.
[10] Anonim. Seriously Cross-Platform With HTML 5. https://jquerymobile.com/ (diakses pada 15 Oktober 2015)
[11] Wilibanks. Mike. 2011. Mobile: Push for sync & Notifications. USA: Zend / PHP Confrence.
[12] Hasibuan, Zainal A. 2007. Metodologi Penelitian Pada Bidang Ilmu
Komputer dan Teknologi Informasi : Konsep, Teknik, dan Aplikasi. Jakarta :
Ilmu Komputer Universitas Indonesia.
[13] Pressman, Roger S. 2001. Rekayasa Perangkat Lunak.Edisi ke-2. Yogyakarta: Andi.
![Gambar 1 Bagan Prototype Model [13]](https://thumb-ap.123doks.com/thumbv2/123dok/4481730.2990119/12.892.148.760.551.947/gambar-bagan-prototype-model.webp)
