e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
PENGEMBANGAN APLIKASI E-COMMERCE DI PT.
PUTRA SUMBER ABADI MENGGUNAKAN FLUTTER
Muhammad Hendriawan1.
Thomas Budiman2.
Verdi Yasin.
Asih Septia Rini4 Program Studi Teknik Informatika1.
Program Studi Teknik Informatika 2.
Program Studi Teknik Informatika 3.
Program Studi Teknik Informatika 4 Sekolah Tinggi Manajemen Informatika dan Komputer Jayakarta, 1,2,3 Sekolah Tinggi Manajemen Informatika dan Komputer Jayakarta, 4 17570035@stmik.
id1,thomas@stmik.
verdiyasin29@gmail.
com3,asihseptiarini@stmik.
Received: February 06, 2021.
Revised: March 08, 2021.
Accepted: April 20.
Published: June 20, 2021.
Issue Period: Vol.
5 No.
Pp.
Abstrak: PT.
Putra Sumber Abadi merupakan suatu perusahaan yang bergerak dalam bidang penjualan electrical dan technical.
Pembangunan situs e-commerce ini mengacu pada sistem manual yang sedang berjalan.
Sistem manual yang berjalan saat ini berupa penjualannya yang hanya berdasarkan konsumen yang datang langsung ke toko tersebut atau melalui telepon dan Dalam proses pembangunan situs e-commerce ini menggunakan teknik analisis data menggunakan metode pembangunan perangkat lunak secara waterfall.
Untuk pembayaran dari transaksi yang terjadi dapat transfer antar rekening bank.
Tujuan yang ingin dicapai dari pembangunan sistem e-commerce ini adalah mempermudah pembeli untuk melakukan pemesanan barang tanpa harus datang langsung ke toko dan mempermudah dalam melakukan manajemen produk.
Setelah melalui tahapan sesuai dengan metode pengembangan yang dipilih maka dalam pengimplementasian sistem e-commerce ini memiliki tindak lanjut pengujian sistem.
Setelah dilakukan pengujian, dapat ditarik kesimpulan bahwa secara fungsional sistem sudah dapat menghasilkan hasil yang diharapkan walaupun belum sempurna dan sistem e-commerce ini dinilai cukup mudah digunakan, dengan tampilan aplikasi yang cukup menarik, dapat mempercepat pengolahan data.
Kata kunci: e-commerce.
Data Flow Diagram, metode waterfall Abstract: PT.
Putra Sumber Abadi is a company engaged in the sale of electricity and technical.
This e-commerce site development refers to the manual system that is running.
The manual system currently in operation is in the form of sales based only on customers who come directly to the store or via telephone and email.
In this e-commerce site development process using data analysis techniques using the waterfall software development method.
For payments from transactions that occur, you can transfer between bank accounts.
The goal of this e-commerce development system is to make it easier for buyers to order goods without having to comedirectly to the store and make it easier for product After going through the stages with the chosen development method, the implementation of this e- commerce system has a follow-up testing system.
After testing, it can be concluded that functionally the system is able to produce the expected results even though it is not yet perfect DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
and this e-commerce system is quite easy to use, with a fairly interesting application appearance, it can speed up data processing.
Keywords: e-commerce.
Data Flow Diagram, waterfall method
PENDAHULUAN
Latar Belakang E-commerce merupakan salah satu konsep yang cukup berkembang dalam dunia Internet.
Pengguna sistem ini sebenarnya dapat menguntungkan banyak pihak, baik pihak konsumen, produsen maupun penjual.
Konsep online shoping menyediakan banyak kemudahan dan kelebihan jika dibandingkan dengan konsep belanja yang konvensional.
Selain proses transaksi bisa menjadi lebih cepat, di Internet telah disediakan hampir semua barang yang biasanya di jual secara lengkap.
PT.
Putra Sumber Abadi Electrical dan Technical adalah distributor, supplier dan eceran berbagai barang diantaranya kabel, saklar, lampu, aksesoris lampu, panel, pipa listrik, klem pipa, pipa besi, pipa PVC, sok pipa.
T-dus, tubing, penangkal listrik, perlengkapan listrik, air tools, handtools, powertools, work tools, security and safety tools, test and measurements, teknik , aksesories teknik, controller, fan, pesawat telpon, speaker dan Mekanisme penjualan yang terjadi di PT.
Putra Sumber Abadi yaitu konsumen datang ke toko untuk mencari dan memilih barang yang ingin dibeli atau melalui telepon yang langsung tersambung dengan pihak marketing PT.
Putra Sumber Abadi.
Maka dari itu perlu dilakukannya pengembangan aplikasi e-commerce pada PT.
Putra Sumber Abadi.
Dengan adanya sistem ini diharapkan dapat meningkatkan penjualan dan keuntungan yang maksimal.
Sekaligus juga dapat memperluas daerah pemasaran tanpa harus mengeluarkan biaya tambahan yang lebih mahal.
Selain itu, dengan adanya pembangunan aplikasi e-commerce ini, pembeli dapat dengan mudah mengakses informasi tentang produk-produk yang baru dari mana saja dan kapan saja dengan menggunakan fasilitas Internet.
Dari uraian tersebut penulis tertarik mengembangkan sebuah perangkat lunak yang diharapkan dapat membantu sistem jual beli secara online dengan judul AuPENGEMBANGAN APLIKASI E-COMMERCE DI PT.
PUTRA SUMBER ABADI MENGGUNAKAN FLUTTERAy.
Identifikasi Masalah Dalam mengelola data penjualan pihak toko sudah menggunakan sistem informasi berbasis Web.
Tidak menutup kemungkinan jika aplikasi e-commerce sudah berjalan dengan baik maka data penjualan tokopun sudah berbasis mobile.
Hal ini tentu saja dapat mempercepat kinerja toko dalam melakukan penjualan produknya.
Dengan dibangunnya aplikasi e-commerce pada PT.
Putra Sumber Abadi, maka sistem ini diharapkan dapat meningkatkan penjualan dan keuntungan yang maksimal.
Sekaligus juga dapat memperluas daerah pemasaran tanpa harus mengeluarkan biaya tambahan yang lebih mahal.
Selain itu, dengan adanya pengembangan aplikasi e-commerce ini, pembeli dapat dengan mudah mengakses informasi tentang produk-produk yang baru dari mana saja dan kapan saja dengan menggunakan fasilitas Internet.
Pembatasan Masalah Pembatasan masalah dalam Pembangunan Aplikasi e-commerce di PT.
Putra Sumber Abadi ini adalah sebagai berikut:
Administrator yang bertanggung jawab dalam mengelola situs penjualan di toko User / pengunjung yang hanya dapat melihat barang tanpa bisa membeli barang Member dapat memesan dan membeli barang Rumusan Masalah Berdasarkan penelitian yang dilakukan pada PT.
Putra Sumber Abadi, adapun permasalahan yang dihadapi dapat dirumuskan sebagai berikut:
Pemasaran yang kurang efektif seperti brosur dan pemasaran manual lainnya.
Sehingga jangkauan pemasaran produk tidak luas.
Proses pengolahan data yang masih ada yang manual Sulitnya konsumen untuk mengetahui informasi toko.
DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Sulitnya melakukan pembelian produk karena semua konsumen harus menghubungi pihak toko terlebih dahulu.
METODE DAN MATERI
E-Commerce Definisi e-commerce menurut Wikipedia .
alam Sunarto, 2009:.
adalah perdagangan elektronik atau e-dagang .
ahasa Inggris: electronic commerc.
yaitu penyebaran, pembelian, penjualan, pemasaran barang dan jasa melalui sistem elektronik seperti internet atau televisi, world wide web dan jaringan komputer lainnya.
Ecommerce dapat melibatkan transfer dana elektronik, pertukaran data elektronik, sistem manajemen inventaris otomatis, dan sistem pengumpulan data otomatis.
Dart Dart adalah bahasa pemrograman yang dioptimalkan klien untuk aplikasi pada berbagai platform.
Bahasa ini dikembangkan oleh Google dan digunakan untuk membangun aplikasi seluler, desktop, server, dan web.
Dart adalah bahasa yang berorientasi objek, berbasis kelas, dengan sintaks C-style.
Dart dapat dikompilasi ke kode asli atau JavaScript.
Ini mendukung antarmuka, mixin, kelas abstrak, generik reified, dan tipe inferensi.
Flutter Flutter adalah Mobile App SDK (Software Development Ki.
untuk membuat aplikasi Android dan iOS dari satu codebase dengan performa tinggi.
Artinya kita hanya perlu mempelajari Flutter untuk membangun aplikasi mobile untuk 2 platform.
Versi pertama Flutter dikenal sebagai "Sky" dan berjalan pada sistem operasi Android.
Diresmikan pada perhelatan Dart developer summit tahun 2015, dengan tujuan untuk mampu merender grafis secara konsisten pada 120 fps.
Android Studio Android Studio adalah Lingkungan Pengembangan Terpadu (Integrated Development Environment/IDE) resmi untuk pengembangan aplikasi Android, yang didasarkan pada IntelliJ IDEA.
Selain sebagai editor kode dan fitur developer IntelliJ yang andal.
Android Studio menawarkan banyak fitur yang meningkatkan produktivitas anda dalam membuat aplikasi Android PostgreSQL PostgreSQL adalah sebuah sistem basis data yang disebarluaskan secara bebas menurut Perjanjian lisensi BSD.
Peranti lunak ini merupakan salah satu basis data yang paling banyak digunakan saat ini, selain MySQL dan Oracle.
PostgreSQL menyediakan fitur yang berguna untuk replikasi basis data.
Fitur-fitur yang disediakan PostgreSQL antara lain DB Mirror.
PGPool.
Slony.
PGCluster, dan lain-lain.
Data Flow Diagram DFD merupakan alat yang digunakan pada metodologi pengembangan sistem yang terstruktur .
tructured analysis and desig.
DFD merupakan alat yang cukup populer sekarang ini, karena dapat menggambarkan arus data di dalam sistem dengan terstruktur dan jelas.
Lebih lanjut DFD juga merupakan dokumentasi dari sistem yang baik.
Flowmap Penjualan Barang Adapun proses-proses dalam prosedur penjualan Barang yang sedang berjalan di PT.
Putra Sumber Abadi adalah sebagai berikut:
Konsumen memilih atau menanyakan barang yang akan dibelinya.
Setelah konsumen mendapatkan barang yang akan dibelinya, konsumen meminta invoice kepada staff Marketing.
Staff Marketing menerima barang yang akan dibeli oleh konsumen, kemudian di cek apakah barang yang dibeli tersedia atau tidak.
Jika tidak tersedia maka Staff Marketing akan memberitahukan kepada konsumen bahwa barang yang di inginkan tidak ada dan jika barang yang dibeli tersedia maka staff Marketing memberitahu staff Gudang untuk mempersiapkan barangnya lalu memberikan invoice barang DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
kepada konsumen.
Admin Gudang membuat invoice penjualan invoice penjualan tersebut berjumlah rangkap dua dimana satu buah untuk konsumen dan satu buah lagi untuk di jadikan arsip invoice penjualan.
Staff Marketing memberikan invoice penjualan tersebut kepada konsumen.
Konsumen membayar sesuai dengan total harga yang tertera dalam invoice penjualan.
Kemudian barang akan diberikan kepada konsumen.
Gambar 3.
1 Flowmap Penjualan Barang Flowmap Laporan Gambar 3.
2 Flowmap Laporan Paradigma Penelitian Pendekatan kualitatif merupakan pendekatan penelitian yang berlandaskan fenomenologi dan paradigma konstruktivisme dalam mengembangkan ilmu pengetahuan.
Moleong .
4: 10-.
menjabarkan sebelas karakteristik pendekatan kualitatif yaitu: menggunakan latar alamiah, menggunakan manusia sebagai instrumen DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
utama, menggunakan metode kualitatif .
engamatan, wawancara, atau studi dokume.
untuk menjaring data, menganalisis data secara induktif, menyusun teori dari bawah ke atas .
rounded theor.
, menganalisis data secara deskriptif, lebih mementingkan proses daripada hasil, membatasi masalah penelitian berdasarkan fokus, menggunakan kriteria tersendiri .
eperti triangulasi, pengecekan sejawat, uraian rinci, dan sebagainy.
untuk memvalidasi data, menggunakan desain sementara .
ang dapat disesuaikan dengan kenyataan di lapanga.
, dan hasil penelitian dirundingkan dan disepakati bersama oleh manusia yang dijadikan sebagai sumber data.
Desain Penelitian Desain penelitian merupakan tahapan yang akan dilakukan untuk mempermudah peneliti sebelum menuju proses yang lebih jauh lagi dalam melakukan penelitian.
Tahapan yang akan dilakukan dalam penelitian skripsi ini ialah sebagai berikut:
Studi Literatur Mempelajari data yang akan digunakan seperti data laptop beserta spesifikasinya.
Mempelajari konsep pembuatan e-commerce.
Mempersiapkan alat dan bahan penelitian.
Alat yang dipersiapkan berupa perangkat keras dan perangkat lunak yang menunjang pembuatan sistem, sedangkan bahan penelitiannya ialah data-data yang sudah dikumpukan melalui wawancara kepada informan.
Hasil dari penelitian yang telah dilakukan kemudian disusun ke dalam bentuk dokumen skripsi Implementasi dengan menyelesaikan tahapan yang dikerjakan dan dilakukan seperti survei permasalahan penelitian, pemahaman metode, pengumpulan data, perancangan dan pembangunan perangkat lunak serta survei untuk mengetahui kinerja system.
Sumber Data Sumber data untuk penelitian dapat diperoleh dari berbagai macam hal.
Berdasarkan cara memperoleh data penelitian, sumber data untuk penelitian berasal dari dua sumber yaitu sumber data primer dan data sekunder.
Data primer adalah data yang diperoleh langsung dari sumbernya, contohnya data yang diperoleh dari responden melalui kuesioner, kelompok fokus, panel atau juga data hasil wawancara peneliti dengan narasumber.
Sedangkan menurut Sugiono .
, sumber data sekunder adalah sumber data yang tidak langsung memberikan data kepada peneliti atau data yang diperoleh peneliti dari sumber yang sudah ada, misalnya catatan, dokumentasi perusahaan, data yang diperoleh dari majalah dan lain sebagainya.
Sumber data dalam penelitian ini diperoleh melalui hasil wawancara peneliti dengan narasumber.
Sedangkan jenis perolehan data pada penelitian ini adalah :
Studi Literatur (Library Researc.
Metode ini dilakukan dengan mencari data yang mendukung objek pembahasan dengan mengumpulkan dan mempelajari literature seperti buku-buku, artikel-artikel, undang-undang dan peraturan lainnya yang terkait.
Studi Lapangan (Field Researc.
Studi Lapangan dilakukan dengan metode Wawancara dengan pihak-pihak yang terkait dengan pembahasan masalah penelitian untuk mendapatkan informasi yang diinginkan.
Wawancara dilakukan dengan pedoman wawancara yang telah disiapkan peneliti namun tidak menutup kemungkinan peneliti mengajukan pertanyaan diluar pedoman wawancara yang akan berguna dalam menggali lebih rinci perihal pembahasan penelitian.
Wawancara penelitian ini dilakukan dengan menggali informasiinformasi yang relevan.
Mengadakan tanya jawab atau wawancara untuk memperoleh data secara langsung dengan para pegawai kantor pajak yang berkompeten dalam bidangnya, para professional di bidang hukum pajak dan para ahli di bidang e-commerce.
Narasumber atau informan yang dihadirkan dalam penelitian ini merupakan informan kunci yang disengaja dipilih oleh peneliti.
Studi Virtual, yaitu mengumpulkan data-data serta bahan-bahan yang diperoleh dari situs di internet.
Infroman, yaitu orang yang memberikan informasi tentang seseorang atau organisasi kepada sebuah Analisis Sistem Analisis sistem dapat didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahanpermasalahan, kesempatan- kesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
diharapkan sehingga dapat diusulkan perbaikan-perbaikannya.
Sebagai analisis pada sistem yang sedang berjalan, akan dibahas bagaimana prosedur dan aliran dokumen yang sedang berjalan dan analisis sistem non fungsional yang meliputi perangkat keras dan perangkat lunak yang digunakan, serta analisis user yang terlibat.
Analisis Perangkat Lunak Perangkat lunak yang dibutuhkan dalam pembangunan aplikasi ini adalah tercantum pada table sebagai Tabel 2.
1 Analisis Perangkat Lunak
Perangkat Lunak
Keterangan Sistem Operasi
Windows 10 Enterprise Bahasa Pemrograman Dart
Framework
Flutter
IDE
Android Studio
DBMS
PostgreSQL Analisis Perangkat Keras Analisis perangkat keras .
merupakan proses analisis yang lebih menekankan kepada aspek pemanfaatan perangkat keras.
Adapun spesifikasi perangkat keras smartphone yang ada di PT.
Putra Sumber Abadi adalah sebagai berikut:
Processor Snapdragon 660 Kapasitas RAM 3 GB OS Android 8.
1 Oreo Kapasitas Harddisk 32 Gb Kebutuhan minimal perangkat keras yang akan dibagun memiliki spesifikasi sebagai berikut :
Processor Mediatek Helio X10 processor RAM sebesar 1 GB OS Android 5.
0 Lolipop
Kapasitas free Harddisk 2 GB
PEMBAHASAN DAN HASIL
Implementasi Basis Data Pembuatan database dilakukan dengan menggunakan aplikasi DBMS PostgreSQL.
Implementasi database dalam bahasa SQL adalah sebagai berikut:
Tabel Admin Tabel ini berisi data admin yang memuat username, password, nama, email, dan token.
Yang berhak membuat data admin hanyalah administrator, sehingga user tidak bisa membuatnya atau tidak bisa melakukan pendaftaran sendiri.
Data Admin berguna saat admin melakukan login pada aplikasi dengan mengisikan username dan password.
DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Gambar 4.
1 Tabel Admin Tabel Register Tabel ini berisi data user yang memuat username, password, nama, email, nomor, dan token.
Saat user melakukan registrasi, maka data user akan dimasukkan ke dalam tabel registrasi.
Data user berguna saat user melakukan login pada aplikasi dengan mengisikan username atau email dan password.
Gambar 4.
2 Tabel Register Tabel Barang Tabel barang berisi data barang yang memuat itemid, itemdesc, brandname, baseprice, disc, netprice, dan img.
Data barang memuat semua detail barang.
Gambar 4.
3 Tabel Barang DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Tabel Alamat Tabel ini berisi data alamat user yang memuat token, nama alamat, nama penerima, nomor penerima, provinsi, detail alamat, maps, dan type alamat.
Saat user ingin melakukan pemesanan barang, maka user harus membuat alamat pengiriman.
Jadi, saat user menambahkan data alamat, maka data alamat akan masuk ke dalam tabel alamat.
Gambar 4.
4 Tabel Alamat Tabel Cart Tabel ini berisi data keranjang barang user yang memuat itemid, qty, dan token.
Saat user memilih barang dan memasukkan ke dalam keranjang.
Maka, barang yang dipilih user akan masuk ke dalam tabel cart.
Gambar 4.
5 Tabel Cart Tabel Payment Tabel ini berisi data metode pembayaran yang memuat payid, dan payname.
Gambar 4.
6 Tabel Payment DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Tabel Ordered Tabel ini berisi data pemesanan user yang memuat token, invoice, itemid, qty, subtotal, payid, addressid, status, timestamp, dan upload.
Saat user sudah memilih barang, alamat utama, metode pembayaran maka user sudah bisa melakukan proses pemesanan.
Jika user menekan tombol checkout maka data pemesanan akan masuk ke dalam tabel ordered.
Gambar 4.
7 Tabel Ordered Implementasi Antarmuka Implementasi antarmuka dilakukan setiap tampilan program yang dibangun dan pengkodeannya dalam bentuk file program.
Berikut ini adalah implementasi antarmuka untuk pengguna dan admin.
Tabel 4.
1 Implementasi Antarmuka Admin Menu Halaman Splash Register Login Halaman Utama Halaman Profil Halaman Alamat Halaman Tambah Alamat Halaman Pesanan Halaman Detail Deskripsi Nama File Halaman Awal yang memuat logo Halaman untuk melakukan pendaftaran Halaman login pengguna Halaman yang memuat rincian semua Halaman yang memuat profil pengguna Halaman yang memuat semua alamat Halaman yang digunakan untuk menambahkan alamat pengguna Halaman untuk melihat barang Pesanan yang sudah dipesan Halaman yang memuat rincian barang yang di pilih Halaman yang memuat rincian barang screen/register.
screen/login.
screen/main.
screen/profil.
screen/alamat.
screen/add_address.
screen/order.
screen/detail.
screen/cart.
DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Keranjang Halaman Checkout Halaman Pembayaran Halaman Detail Order yang kita masukkan dalam keranjang Halaman untuk melakukan check out Halaman untuk memilih metode Halaman yang memuat detail pesanan screen/checkout.
screen/payment.
screen/detail_order.
Tabel 4.
2 Implementasi Antarmuka Admin Menu Deskripsi Nama File Halaman Splash Halaman Awal yang memuat logo admin/splash.
Login Halaman login admin admin/login.
Halaman Utama Halaman yang memuat rincian semua admin/main.
Halaman Profil Halaman yang memuat profil admin admin/profil.
Halaman Detail Order Halaman yang memuat detail pesanan admin /detail_order.
Antarmuka Admin Antarmuka admin memuat: Halaman Awal.
Halaman Login.
Halaman Utama.
Halaman Profil.
Halaman Pesanan.
Halaman Detail Pesanan Admin.
Halaman Splash Halaman Awal pada aplikasi, atau biasa kita sebut sebagai splash screen.
Halaman ini terdiri dari gambar yang memakan seluruh ruang layar dan terlihat saat aplikasi dibuka.
Biasanya, yang ditampilkan adalah logo atau informasi branding lainnya tentang aplikasi yang digunakan.
Splash Screen menciptakan kesan bahwa aplikasi memuat lebih cepat.
Gambar 4.
8 Splash Screen DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Login Admin Form Login, biasanya digunakan untuk membatasi hak akses bagi user untuk melihat dan berinteraksi dengan data.
Hanya user yang sudah terdaftar yang bisa mengaksesnya.
Form Login juga harus memiliki validation.
Yang mana jika field username atau Field password tidak diisi diberikan suatu pesan.
Contohnya Auusername dan password tidak boleh kosongAy atau sebuah alert untuk memberitahu bahwa username atau password salah Gambar 4.
9 Login admin Gambar 4.
10 Login Validation Halaman Utama Admin Halaman utama adalah halaman pertama yang admin lihat setelah admin melakukan login ke Halaman ini memuat nama admin, profil admin, dan data pemesanan user.
Saat Admin mengklik icon person maka admin akan di arahkan ke Halaman Profil.
Jika admin mengklik salah satu dari 5 kategori pemesanan maka admin akan di arahkan ke Halaman Pemesanan sesuai kategori yang dipilih.
Gambar 4.
11 Main Page Admin Halaman Profil Admin Halaman ini memuat semua profil admin.
Gambar 4.
12 Profil Admin DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Pesanan Halaman ini memuat semua proses pemesanan yang dilakukan oleh user.
Halaman Pesanan terbagi menjadi beberapa kategori, diantaranya: belum bayar, dikemas, dikirim, selesai, dan dibatalkan.
Admin bertanggung jawab untuk melakukan update pada proses pemesanan user.
Halaman Pesanan memuat data barang dan total harga barang.
Saat admin mengklik data barang, maka admin akan dialihkan ke Halaman Detail Pesanan.
Gambar 4.
13 Belum Bayar Admin Gambar 4.
14 Dikemas Admin Gambar 4.
16 Selesai Admin Gambar 4.
15 Dikirim Admin Gambar 4.
17 Dibatalkan Admin Halaman Detail Pesanan Halaman ini memuat detail pemesanan yang dilakukan oleh user.
Halaman Detail Pesanan terbagi menjadi beberapa kategori, diantaranya: belum bayar, dikemas, dikirim, selesai, dan dibatalkan.
Data user diantaranya: data barang, metode pembayaran, total pembayaran, opsi pengiriman, alamat pengiriman, dan nomor invoice.
Admin bertanggung jawab untuk melakukan update pada proses pemesanan user.
Gambar 4.
Detail Belum Bayar Admin Gambar 4.
Batalkan Pesanan Gambar 4.
Konfirmasi Pesanan DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Antarmuka User Antarmuka user memuat: Halaman Awal.
Halaman Register.
Halaman Login.
Halaman Profil.
Halaman Alamat.
Halaman Pesanan User.
Halaman Utama.
Halaman Pencarian Barang.
Halaman Detail Barang.
Halaman Keranjang.
Halaman Checkout.
Halaman Metode Pengiriman.
Halaman Metode Pembayaran, dan Halaman Info Pembayaran.
Halaman Awal Halaman Awal pada aplikasi, atau biasa kita sebut sebagai splash screen.
Halaman ini terdiri dari gambar yang memakan seluruh ruang layar dan terlihat saat aplikasi dibuka.
Biasanya, yang ditampilkan adalah logo atau informasi branding lainnya tentang aplikasi yang digunakan.
Splash Screen menciptakan kesan bahwa aplikasi memuat lebih cepat Gambar 4.
21 Splash Screen Halaman Login Form Login, biasanya digunakan untuk membatasi hak akses bagi user untuk melihat dan berinteraksi dengan data.
Hanya user yang sudah terdaftar yang bisa mengaksesnya.
Form Login juga harus memiliki validation.
Yang mana jika field username atau Field password tidak diisi diberikan suatu pesan.
Contohnya Auusername dan password tidak boleh kosongAy atau sebuah alert untuk memberitahu bahwa username atau password salah.
Jika user tidak punya akun, maka user bisa melakukan registrasi dengan mengklik tulisan daftar disini Gambar 4.
22 Login User Gambar 4.
23 Login User Validation Halaman Registrasi Form registrasi atau halaman registrasi adalah satu bagian yang sangat penting untuk sebuah Biasanya satu paket dengan halaman login dan fitur ini dikenal dengan Authority.
Authority biasanya terdiri dari Login dan Register.
Form Register juga harus memiliki validation.
Yang mana jika salah satu field tidak diisi maka akan diberikan suatu pesan untuk harus mengisinya.
Contohnya Auusername dan password tidak boleh kosongAy serta sebuah alert untuk memberitahu bahwa username atau email sudah terdaftar.
Jika user berhasil membuat akun maka akan diberikan sebuah alert dialog bahwa user berhasil membuat akun.
Setelah itu user akan dialihkan ke Halaman login DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Gambar 4.
24 Register User Gambar 4.
25 Register Validation Gambar 4.
26 Register Success Halaman Utama User Halaman utama adalah halaman pertama yang user lihat setelah user melakukan login ke Halaman ini memuat beberapa informasi di dalamnya, diantaranya: data user, data barang, data keranjang, dan data pesanan user.
User bisa melihat data profil user, data alamat user, data pesanan user dengan mengklik ikon garis tiga di pojok kiri tampilan.
User juga bisa mencari barang dengan mengklik ikon cari barang.
User bisa melihat detail barang dengan mengklik barang yang dipilihnya lalu bisa memasukkannya ke dalam Jika user ingin melihat daftar keranjang, user harus mengklik icon cart, sehingga user akan dialihkan ke Halaman Keranjang.
27 Main Page User Halaman Drawer User Halaman Drawer memuat beberapa informasi seperti: nama user, email user, halaman profil, halaman alamat saya, halaman pesanan saya, dan logout.
Saat memilih salah satu halaman di dalam menu drawer, maka user akan di alihkan menuju halaman yang diinginkan user.
28 Drawer User DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Profil User Halaman Profil User memuat data profil user, seperti: nama, username, password, handphone, email, dan alamat.
Saat user mengklik alamat, maka user akan dialihkan ke Halaman Alamat.
Gambar 4.
29 Profil User Halaman Alamat User Halaman ini memuat data alamat yang sudah pengguna tambahkan sebelumnya.
Jika belum, maka tampilan ini akan kosong.
Jika user ingin menambahkan alamat baru, maka user bisa mengklik button Tambah Alamat Baru, sehingga user akan dialihkan ke Halaman Tambah Alamat.
User juga bisa memilih alamat yang baru menjadi alamat utama dengan mengklik button Alamat Utama.
Button Hapus Alamat akan menghapus alamat yang dipilih user.
Button Delete All akan menghapus semua alamat user.
Gambar 4.
30 Alamat User Halaman Tambah Alamat Halaman Tambah Alamat memuat sesuatu yang harus pengguna isi sebagai alamat pengguna Di Halaman ini memuat hal-hal seperti: Lokasi Detail yang akan direct ke Halaman Google Maps yang terhubung dengan API Google Maps.
Nama alamat .
ontoh: Alamat Ruma.
, nama penerima, nomor telepon penerima, alamat detail penerima, provinsi penerima, dan alamat detail penerima.
Gambar 4.
31 Alamat User Gambar 3.
32 Halaman Google Maps Gambar 3.
33 Halaman Provinsi DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Cari Barang Saat user menekan tombol AuCari BarangAy di Halaman Utama atau Icon Button Search di Halaman Detail Barang maka pengguna akan dialihkan ke dalam menu ini.
Pengguna bisa mencari barang yang pengguna inginkan dengan menginput beberapa kata dari barang yang pengguna inginkan.
Jika menginput kata yang pengguna maksud maka tampilan akan menampilkan semua barang yang berkaitan dengan kata tersebut.
Gambar 3.
34 Search Page Halaman Detail Barang Halaman Detail Barang memuat detail barang setelah user mengklik barang di Halaman Utama, atau di Halaman Pencarian Barang.
Data pada Halaman Detail barang merupakan data yang sama seperti data yang berada pada Halaman Utama.
Saat pengguna menekan icon keranjang tambah yang berada di bawah maka akan muncul sebuah toast yang berisikan pesan AuBarang berhasil di tambahkanAy.
Maka secara otomatis barang akan di tambahkan ke dalam Halaman Cart.
Namun sedikit berbeda saat pengguna menekan tombol AuBeli SekarangAy.
Jika pengguna menekannya maka secara otomatis menambahkan barang ke dalam Halaman Cart dan langsung diarahkan ke Halaman Cart.
Saat data pengguna menekan tombol keranjang tambah ataupun tombol AuBeli SekarangAy maka data tersebut akan dimasukkan ke dalam data keranjang.
Gambar 3.
35 Detail Barang Gambar 3.
36 Toast Add to Cart Halaman Keranjang User Halaman Keranjang User memuat semua barang user, saat user menambahkan sebelumnya.
Halaman ini pengguna bisa menghapus data tersebut dengan menekan tombol icon tempat sampah untuk menghapus data yang dipilihnya.
Atau menekan tombol AuDelete AllAy untuk menghapus semua barang yang terdapat di Halaman Keranjang Saya.
User juga bisa menambahkan qty barang dengan mengklik icon tambah dan mengurangi qty barang dengan mengklik icon kurang.
Sub Total akan bertambah atau berkurang secara otomatis jika user merubah total qty pada data barang tersebut.
Jika user ingin melakukan checkout, user bisa mengklik button Checkout.
Maka user akan dialihkan ke Halaman Checkout DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Gambar 3.
37 Cart Page User Halaman Checkout User Halaman Checkout user memuat beberapa menu, diantaranya: item barang yang merupakan data barang user yang sudah di tambahkan di Halaman Keranjang Saya.
Alamat Pengiriman yang sudah ditambahkan sebelumnya di Halaman Alamat Saya.
Opsi Pengiriman, dan Metode Pembayaran.
User tidak bisa melakukan pemesanan jika user belum memiliki alamat utama, belum memilih opsi pengiriman, dan metode pembayaran.
Jika user sudah melengkapi semua data yang diperlukan, maka user bisa membuat pesanan dengan mengklik button Buat Pesanan dan user akan dialihkan ke Halaman Info Pembayaran.
Gambar 3.
38 Checkout User Halaman Metode Pembayaran Halaman ini memuat metode pembayaran.
Metode pembayaran yang disediakan hanya bisa dicek Gambar 3.
39 Payment Method DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Halaman Info Pembayaran Halaman Info Pembayaran memuat total pembayaran, detail bank yang dipilih seperti:
rekening, cabang bank, dan nama rekening.
User bisa langsung mengupload bukti pembayaran dengan mengklik button upload bukti sekarang atau mengklik button upload bukti nanti.
Saat user mengklik upload bukti sekarang, maka user akan di alihkan ke Halaman Konfirmasi Bukti Pembayaran.
Jika user mengklik button Upload Bukti Transfer nanti, maka user akan di alihkan ke Halaman Pesanan User.
Gambar 3.
40 Info Pembayaran Page Halaman Pesanan User Halaman Pesanan User memuat data barang dan juga beberapa kategori, diantaranya: belum bayar, dikemas, dikirim, selesai, dan dibatalkan.
User bisa membatalkan pesanan dengan mengklik barang yang dipilih, maka user akan di alihkan ke Halaman Detail Pesanan.
Gambar 3.
41 Pesanan User Halaman Detail Pesanan Halaman Detail Pesanan User memuat data barang, metode pembayaran, opsi pengiriman, alamat pengiriman, dan nomor pesanan.
User bisa melakukan pembatalan pesanan dengan mengklik button batalkan pesanan.
DOI: 10.
52362/jisicom.
Ciptaan disebarluaskan di bawah Lisensi Creative Commons Atribusi 4.
0 Internasional.
e-ISSN : 2597-3673 (Onlin.
, p-ISSN : 2579-5201 (Printe.
Vol.
5 No.
Juni 2021 Journal of Information System.
Informatics and Computing Website/URL: http://journal.
id/index.
php/jisicom Email: jisicom@stmikjayakarta.
id , jisicom2017@gmail.
Gambar 3.
42 Detail Pesanan User Analisis Berdasarkan hasil pengujian sistem yang telah dilakukan secara keseluruhan memberikan kesimpulan bahwa proses pada aplikasi e-commerce telah melalui tahap perbaikan dan sudah dimaksimalkan terhadap proses-proses tersebut dan secara fungsionalitas system sudah dapat KESIMPULAN Berdasarkan hasil yang didapat dalam pengembangan aplikasi ini, maka dapat ditarik kesimpulan sebagai berikut:
Sistem penerapan e-commerce untuk sistem penjualan ini dapat berjalan sesuai dengan tujuannya, yaitu membantu penjual dalam mempromosikan barangnya secara online.
Memudahkan pembeli dalam membeli barang tanpa dibatasi waktu dan tempat.
Memudahkan dalam mengelola data barang.
Dapat memberikan informasi yang tepat kepada pembeli mengenai barang yang dijual Dari semua hasil yang telah dicapai saat ini, masih mempunyai beberapa kekurangan.
Disarankan untuk menambahkan fitur-fitur yang dapat melengkapi aplikasi mobile ini dimasa yang akan datang sehingga menarik minta pelanggan.
Diantaranya adalah:
Pemberian desain yang lebih menarik Fitur-fitur tambahan lainnya Kemanan yang harus ditingkatkan REFERENSI