ANALISIS DAN PERANCANGAN WEBSITE PENJUALAN OMNICHANNEL VENDPAD MENGGUNAKAN FRAMEWORK LARAVEL 4.2 DAN ANGULARJS 1.4.9 DI CV.IMEDIA INFORMATIKA
NASKAH PUBLIKASI
diajukan oleh Febri Arga Pratama 13.11.7020
kepada SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM YOGYAKARTA YOGYAKARTA 2016
ANALISIS DAN PERANCANGAN WEBSITE PENJUALAN OMNICHANNEL VENDPAD MENGGUNAKAN FRAMEWORK LARAVEL 4.2 DAN ANGULARJS 1.4.9 DI CV. IMEDIA INFORMATIKA Febri Arga Pratama1), Ali Mustopa2), 1)
Teknik Informatika STMIK AMIKOM Yogyakarta Sistem Informasi STMIK AMIKOM Yogyakarta Jl Ringroad Utara, Condongcatur, Depok, Sleman, Yogyakarta Indonesia 55283 2)
Email :
[email protected]),
Abstract - This research is motivated by the problem of online shop owner difficulties in controling and reporting on CV. Imedia Informatika. In case of control, the online shop owner is using different kind of selling channels. An example is using social medias for selling purpose. This will leave some customers unprocessed. Also the owner is still using manual report application. Those are the source of ineffective and inefficient. By those problems, came out an idea to build an application based on web for the online shop owner that do channels controlling. As well as doing records for customers, products, and invoices. Methodology for the developing application is Waterfall. And programming languages are PHP, HTML, CSS, Javascript and Mysql as DBMS. Laravel as PHP framework and AngularJs as javascript framework. Tools are SublimeText 2, and XAMPP. Supported by the provided channel’s API(Application Programming Language). This application will be used for controlling channels and reports for customers, products, and invoices. With this Omnichannel Sales Website should be an answer for the online shop owner to simplify controling the channels and maximizing sales in the same time with easy, fast and accurately report.
Omnichannel berasal dari kata omnis yang berarti semua atau keseluruhan dan channel yang berarti saluran atau cabang. Sehingga omnichannel adalah penghubung ke semua saluran atau cabang pelanggan untuk mempermudah pengawasan (Peter J. Mcgoldrick Tesco : 2007). Namun, menghubungkan berbagai saluran berjualan seperti media sosial tidaklah gampang, karena harus berbagi data yang nantinya akan diolah dan digabungkan sehingga pengguna dapat melakukan pengawasan. Hingga ditemukanlah sebuah solusi yaitu menggunakan Application Programming Language (API) yang dapat digunakan untuk mengambil informasi dari suatu media sosial atau saluran untuk diolah menjadi suatu data yang dapat dibaca. Oleh karena itu, untuk mendukung sistem penjualan Omnichannel yang efektif dan pengembangan peluang bisnis dari penjualan sistem Omnichannel dibuatlah penelitian dengan judul “Analisis dan Perancangan Website Penjualan Omnichannel Vendpad Menggunakan Framework Laravel 4.2 dan Angularjs 1.4.9 di CV. Imedia Informatika”. 1.2 Rumusan Masalah Berdasarkan latar belakang masalah yang sudah diuraikan sebelumnya, maka dalam penelitian ini penulis merumuskan masalahnya adalah sebagai berikut: 1.
Bagaimana merancang website penjualan yang dapat terkoneksi dengan berbagai saluran penjualan agar dapat menjangkau berbagai jenis konsumen dan kebutuhannya?
2.
Bagaimana memperoleh peluang bisnis dari penjualan web aplikasi?
Keywords - Web Application, Omnichannel Sales, Shop Report, Invoice Management. 1 1.1
Pendahuluan Latar Belakang Masalah
CV. Imedia Informatika merupakan sebuah badan usaha yang bergerak pada pembuatan, pengembangan perangkat lunak, dan toko online. CV. Imedia Informatika pada prosesnya berjualan melalui media sosial, aplikasi chatting, dan online marketplace. Dimana dalam hal ini sering kali terjadi permasalahan pada pengawasan dan pencatatan penjualan yang kurang cepat dan akurat. Sehingga sering terjadi kesalahan penghitungan laporan penjualan dan kehilangan calon pelanggan karena sulitnya pengawasan antar lapak. Selain itu bagaimana memperoleh peluang bisnis dari pembuatan aplikasi untuk menambah penghasilan. Salah satu alternatif, pemilik memerlukan sebuah platform web aplikasi jual beli omnichannel.
[email protected])
Menguraikan hasil analisis kualitatif dan/atau kuantitatif dengan penekanan pada jawaban atas permasalahan[2]. 1.3 Batasan Masalah Untuk menghindari pembahasan yang melebar, maka masalah yang dibahas penulis pada penulisan penelitian ini adalah aplikasi web omnichannel pada CV. Imedia Informatika dan hanya mencakup beberapa batasan sebagai berikut:
1
1.
Objek penelitian dilaksanakan di CV. Imedia Informatika.
2.
Pengkoneksian langsung ke saluran hanya saluran penjualan Facebook, Twitter dan Instagram.
3.
Proses pembuatan menggunakan framework php Laravel 4.2 dan angular js 1.4.9.
1.5.2 Sistem Informasi Penjualan Sistem Informasi Penjualan adalah suatu sistem yang terdiri dari kumpulan orang, peralatan dan prosedur yang memadukan antara pekerjaan mesin (komputer) dan manusia yang menyajikan keakuratan informasi untuk memecahkan masalah didalam perusahaan [2]. 1.5.3 Omnichannel
1.4 Tujuan Penelitian 1.
2.
Menurut Wojciech Piotrowicz dan Richard Cuthbertson (2014), omnichannel adalah sebuah konsep yang berasal dari evolusi dari multichannel. Multichannel hanya mengacu pada toko asli dan toko online. Sedangkan omnichannel, pelanggan dapat bebas datang dari toko offline, toko online, dan perangkat mobile dan dapat diproses dalam satu proses transaksi.
Membuat aplikasi berbasis web untuk mengimplementasikan Omnichannel untuk meningkatkan pengawasan dan pencatatan penjualan pada pemilik toko online CV. Imedia Informatika. Mengembangkan sistem agar bisa dipakai secara komersial oleh pemilik toko online selain pemilik CV. Imedia Informatika dengan menerapkan sistem berlangganan berbayar maupun gratis.
1.5.4 Unified Modeling Language (UML) Unified Modeling Language (UML) adalah bahasa standar yang di gunakan untuk menjelaskan dan memivisulisasikan artifak dari proses analisis dan desain berorentasi obyek. UML di kembangkan oleh Grady Booch, Jim Rumbaugh, dan Ivan Jacobson. Diagram-diagram yang digunakan didalam UML adalah Usecase Diagram, Activity Diagram, Class Diagram, dan Sequence Diagram [3].
1.5 Landasan Teori 1.5.1 Tinjauan Pustaka Penggunaan metode omnichannel untuk penjualan ini sebelumnya sudah pernah dibahas, namun dengan media pengaplikasian yang berbeda-beda. Sebagai pembanding dan bahan acuan dalam pengembangan website penjualan dalam penelitian ini, penulis mengkaji mengenai jurnal ilmiah oleh peneliti-peneliti sebelumnya. 1.
Wojciech Piotrowicz and Richard Cuthbertson (2014) pengenalan omnichannel yaitu integrasi saluran, pengaruh terhadap teknologi mobile, pertumbuhan pengguna sosial media, perubahan fungsi dari gedung toko, kebutuhan menanggapi perbedaan pelanggan, keseimbangan antara personalisasi dan privasi, dan perancangan rantai persediaan.
2.
Maik Hammerschmidt, Tomas Falk, and Bert Weijters (2015) menjelaskan tentang sebuah model pengintegrasian untuk mengetahui kepuasan pelanggan dalam sistem saluran yang tergabung.
3.
Venkatesh Shankar (2014) penjelasan tentang online dan mobile marketing, yang menghasilkan sebuah cara pengintegrasian.
2 Pembahasan 2.1 Analisis Kebutuhan Sistem 2.1.1 Kebutuhan Fungsional Aplikasi web ini harus dapat memenuhi kebutuhan fungsional sebagai berikut. 1. Aplikasi web harus bisa terhubung ke beberapa channel penjualan. 2. Aplikasi web harus bisa mendapatkan real-time notifikasi dari beberapa channel penjualan. 3. Aplikasi web harus bisa membuat member baru dan membuat brand baru. 4. Aplikasi web harus bisa menampilan katalog produk. 5. Aplikasi web dapat digunakan untuk melakukan order produk. 6. Aplikasi web dapat digunakan untuk menampilkan hasil laporan penjualan. 2.1.2 Kebutuhan Non Fungsional Analisis kebutuhan non fungsional dilakukan untuk mengetahui spesifikasi kebutuhan untuk sistem. Spesifikasi kebutuhan melibatkan analisis perangkat keras/hardware, analisis perangkat lunak/software, analisis pengguna/user.
1.5.2 Website Website atau situs juga dapat diartikan sebagai kumpulan halaman yang menampilkan informasi data teks, data gambar diam atau animasi, data animasi, suara, video dan atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang membentuk suatu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink) [1].
1. Analisis Perangkat Keras (Hardware) a. Processor Intel Core i3 @ 1.6 Ghz b. Harddisk 500 Gb c. Memory 4096 Mb d. VGA 1024 Mb
2
e. f. g.
Monitor 19’’ Modem internet Logitech Printer Ink Jet
2.Analisis Perangkat Lunak(Software) Perangkat lunak (software) yang digunakan di CV.Imedia Informatika untuk kantor saat ini adalah sebagai berikut. a. Sistem Operasi : Microsoft Windows 10 b. Mozilla firefox dan Google Chrome sebagai browser Perangkat lunak (software) yang digunakan untuk proses pengembangan aplikasi. a. Sublime text 2.0 b. Database Management System MySql. c. Xampp. d. PHP 5.4 e. Laravel 4.2 f. AngularJs 1.4.9 g. NodeJs
Gambar 2 Use Case Member dan Submember 2.2.2 Activity Diagram Berikut ini adalah diagram yang menunjukan alur aksi pada penambahan channel), seperti terlihat pada gambar Gambar 3 Activity Diagram Penambahan Channel. User Sistem
2.2 Perancangan Sistem 2.2.1 Use Case Diagram
Sistem
Berdasarkan analisis kebutuhan, di dalam aplikasi ini yang berperan sebagai aktor adalah admin, member dan karyawan (submember), seperti terlihat pada gambar 1 use case admin dan gambar 2 use case member berikut.
Gambar 3 Activity Diagram Penambahan Channel 2.2.3 Class Diagram Class Diagram mendiskripsikan jenis-jenis objek dalam sistem dan berbagai macam hubungan statis yang terjadi, seperti terlihat pada gambar 4 class diagram berikut.
Gambar 1 Use Case Admin
3
2.3 Implementasi Sistem 2.3.1 Halaman Landing Page Halaman Landing Page adalah halaman dimana member pertama kali mengakses web aplikasi tersebut, seperti terlihat pada gambar 6 Tampilan Landing Page.
Gambar 6 Tampilan Landing Page 2.3.2 Halaman Dashboard Brand Halaman ini adalah halaman untuk mengelola Brand atau toko yang dimiliki oleh member, seperti terlihat pada gambar 7 Tampilan Halaman Dashboard Brand.
Gambar 4 Class Diagram 2.2.4 Sequence Diagram
Gambar 7 Tampilan Halaman Dashboard Brand
Berikut adalah sequence diagram yang menunjukkan interaksi object pada manajemen channel, seperti terihat pada gambar 5 Sequence Diagram Manajemen Channel.
2.3.3 Halaman Aplikasi Halaman ini digunakan untuk mengelola aplikasi yang tersemat dalam brand, seperti terlihat pada gambar 8 Tampilan Halaman Aplikasi.
Gambar 8 Tampilan Halaman Aplikasi
Gambar 5 Sequence Diagram Manajemen Channel
4
2.3.4 Halaman Report Halaman ini digunakan untuk melihat report pendapatan dan keuntungan serta biaya lain seperti ongkos kirim dari penjualan, seperti terlihat pada gambar 9 Tampilan Halaman Report.
Gambar 12 Tampilan Reply Channel Gambar 9 Tampilan Halaman Report 2.3.8 Tampilan Kiriman Channel 2.3.5 Halaman Sales
Tampilan ini digunakan untuk melihat daftar kiriman dari beberapa channel secara bersamaan, seperti terlihat pada gambar 13 Tampilan Kiriman Channel.
Halaman ini digunakan untuk mengelola invoice dari sebuah brand. Member dapat melakukan penambahan, pembaruan dan penghapusan data invoice, seperti terlihat pada gambar 10 Tampilan Halaman Sales.
Gambar 10 Tampilan Halaman Sales Gambar 13 Tampilan Kiriman Channel
2.3.6 Halaman Channel
2.3.9 Tampilan Form Invoice
Halaman ini digunakan untuk memantau channel dari sebuah brand, seperti terlihat pada gambar 11 Tampilan Halaman Channel.
Tampilan ini digunakan untuk membuat dan memperbarui invoice dari pelanggan, seperti terlihat pada gambar 14 Tampilan Form Invoice.
Gambar 11 Tampilan Halaman Channel 2.3.7 Tampilan Reply Channel. Gambar 14 Tampilan Form Invoice
Tampilan ini digunakan untuk membalas pesan calon pelanggan dari sebuah channel, seperti terlihat pada gambar 12 Tampilan Reply Channel.
5
3 Kesimpulan dan Saran 3.1 Kesimpulan
Biodata Penulis Febri Arga Pratama, memperoleh gelar Sarjana Komputer (S.Kom), Jurusan Teknik Informatika STMIK AMIKOM Yogyakarta, lulus tahun 2016.
Dari semua tahap perancangan, pembuatan serta pengujian sistem yang telah dilakukan, maka dapat diambil kesimpulan antara lain : 1. Dengan adanya aplikasi Vendpad pengawasan channel dan pencatatan penjualan menjadi lebih mudah dan cepat pada pemilik toko online CV. Imedia Informatika. 2. Aplikasi Vendpad terdapat fitur mulitiuser dan fitur berlangganan sehingga dapat dipakai secara komersial oleh pemilik CV. Imedia Informatika.
Ali Mustopa, memperoleh gelar Sarjana Komputer (S.Kom), Jurusan Teknik Informatika STMIK AMIKOM Yogyakarta, lulus tahun 2008. Memperoleh gelar Magister Komputer (M.Kom) Program Pasca Sarjana Magister Teknologi Informasi STMIK AMIKOM Yogyakarta, lulus tahun 2014. Saat ini menjadi Dosen di STMIK AMIKOM Yogyakarta.
3.2 Saran Berdasarkan kesimpulan yang telah diuraikan di atas, maka saran yang diberikan diharapkan dapat menyempurnakan Aplikasi Vendpad, diantaranya adalah : 1. Penambahan channel yang dapat diintegrasikan sehingga dapat menjangkau pelanggan lebih banyak. 2. Penambahan fitur seleksi pelanggan untuk melakukan pengecekkan duplikasi data pelanggan yang datang dari channel yang berbeda. 3. Penambahan fitur pembayaran satu pintu dan otomatis sehingga pelanggan dapat mudah membayar secara langsung. 4. Penyempurnaan fitur kolaborasi dalam mengelola brand sehingga antar pengguna dapat memaksimalkan kerja sama. 5. Penambahan fitur offline sehingga saat user mengalami masalah jaringan internet, data yang dimasukkan tidak akan tetap tersimpan. Daftar Pustaka [1] Yuhefizar, Ha, M., & Rahmat, H. 2009. Cara Mudah Membangun Website Interaktif Menggunakan Content Management System Joomla (CMS). Jakarta: Elexmedia. [2] Kotler, Philip. 2009. Manajemen Pemasaran. Jakarta: Erlangga. [3] A, S., & Gunaidi. 2008. Visual Modeling Menggunakan UML dan Rational Rose. Bandung: Informatika.
6
