KERJA PRAKTIK – IF184801
Rancang Bangun Aplikasi Bacameter untuk
Pencatatan Angka Standmeter Pelanggan
Perumdam Tirta Taman Sari Kota Madiun
Perumdam Tirta Taman Sari Kota Madiun Jl. Sulawesi No. 18.Kota Madiun, Jawa Timur 63117. Periode: 1 – 31 Juli 2020
Oleh:
Affan Ahsanul Habib 05111740000091
Pembimbing Jurusan
Dr.Eng. RADITYO ANGGORO, S.Kom., M.Sc Pembimbing Lapangan
Naryadi, S.Kom.
DEPARTEMEN TEKNIK INFORMATIKA
Fakultas Teknologi Elektro dan Informatika Cerdas Institut Teknologi Sepuluh Nopember
KERJA PRAKTIK – IF184801
Rancang Bangun Aplikasi Bacameter untuk
Pencatatan Angka Standmeter Pelanggan
Perumdam Tirta Taman Sari Kota Madiun
Perumdam Tirta Taman Sari Kota Madiun Jl. Sulawesi No. 18.
Kota Madiun, Jawa Timur 63117. Periode: 1 – 31 Juli 2020
Oleh:
Affan Ahsanul Habib 05111740000091
Pembimbing Jurusan
Dr.Eng. Radityo Anggoro, S.Kom., M.Sc Pembimbing Lapangan
Naryadi, S.Kom.
DEPARTEMEN TEKNIK INFORMATIKA
Fakultas Teknologi Elektro dan Informatika Cerdas Institut Teknologi Sepuluh Nopember
LEMBAR PENGESAHAN KERJA PRAKTIK
Rancang Bangun Aplikasi Bacameter untuk Pencatatan Angka Standmeter Pelanggan Perumdam Tirta Taman Sari Kota Madiun
Oleh:
Affan Ahsanul Habib 05111740000091
Disetujui oleh Pembimbing Kerja Praktik: 1. Dr.Eng. Radityo Anggoro, S.Kom., M.Sc
NIP. 19841016 200812 1 002
(Pembimbing Departemen)
2. Naryadi, S.Kom.
Kepala Peneliti dan Pengembangan
Rancang Bangun Aplikasi Bacameter untuk Pencatatan Angka
Standmeter Pelanggan Perumdam Tirta Taman Sari
Kota Madiun
Nama Mahasiswa : Affan Ahsanul Habib
(05111740000091)
Departemen : Teknik Informatika FTEIC-
ITS
Pembimbing Departemen : Dr.Eng. Radityo Anggoro, S.Kom., M.Sc
Pembimbing Lapangan : Naryadi, S.Kom.
ABSTRAK
Perumdam Tirta Taman Sari Kota Madiun dalam mencatat angka standmeter masih menggunakan cara konvensional. Petugas akan datang dari rumah ke rumah untuk mencatat penggunaan air yang ditunjukkan oleh alat standmeter.
Adanya Pandemi Covid-19, dikhawatirkan petugas membawa/terbawa virus ketika menjalankan tugas. Hal tersebut membuat proses pencatatan terhambat. Oleh karena itu, diperlukan adanya aplikasi yang dapat membantu dalam melakukan pencatatan angka standmeter. Aplikasi yang dibuat membuat pelanggan dapat melaporkan sendiri angka standmeter mereka dari rumah.
Aplikasi ini dibuat dengan menggunakan bahasa pemrograman seperti Dart, Flutter dan bahasa pemrograman PHP pada bagian API dengan menggunakan DBMS MySQL Server. Aplikasi ini diharapkan dapat mempermudah pelaporan angka standmeter, juga menjadi solusi dari permasalahan administrasi yang ada.
Kata kunci: Aplikasi Mobile, Covid-19, Pencatatan, Standmeter, Perumdam Tirta Taman Sari
KATA PENGANTAR
Puji syukur kami panjatkan kepada Allah SWT karena berkat rahmat-Nya kami dapat melaksanakan salah satu kewajiban kami sebagai mahasiswa Departemen Informatika, yakni Kerja Praktik (KP).
Kami menyadari masih ada kekurangan baik dalam pelaksanaan KP maupun penyusunan buku laporan ini. Namun, kami berharap buku laporan ini dapat menambah wawasan pembaca dan dapat menjadi sumber referensi. Kami mengharapkan kritik dan saran yang membangun untuk kesempurnaan buku laporan KP ini.
Melalui buku ini, kami juga ingin menyampaikan rasa terima kasih kepada orang-orang yang telah membantu, baik langsung maupun tidak langsung, dalam pelaksanaan KP hingga penyusunan laporan. Orang-orang tersebut antara lain adalah:
1. Kedua orang tua penulis.
2. Bapak Dr.Eng. Radityo Anggoro, S.Kom., M.Sc selaku dosen pembimbing KP.
3. Bapak Ary Mazharuddin Shiddiqi, S.Kom., M.Comp.Sc., selaku koordinator KP.
4. Bapak Naryadi, S.Kom. selaku pembimbing lapangan kami di Perumdam Tirta Taman Sari Kota Madiun. 5. Karyawan dan karyawati Perumdam Tirta Taman Sari
Kota Madiun khususnya di bagian Litbang.
6. Teman-teman penulis yang senantiasa memberikan semangat dan bersedia menampung keluh kesah ketika penulis melaksanakan KP.
Madiun, Desember 2020 Affan Ahsanul Habib
DAFTAR ISI
LEMBAR PENGESAHAN ... iv
ABSTRAK ... vi
KATA PENGANTAR ... viii
DAFTAR ISI ... x
DAFTAR GAMBAR ... xiii
DAFTAR TABEL... xiv
BAB I PENDAHULUAN ... 1
1.1. Latar Belakang ... 1
1.2. Tujuan ... 2
1.3. Manfaat ... 2
1.4. Rumusan Masalah ... 2
1.5. Lokasi dan Waktu Kerja Praktik ... 3
1.6. Metodologi Kerja Praktik... 3
1.7. Sistematika Laporan ... 5
BAB II PROFIL PERUSAHAAN ... 7
2.1. Profil Perusahaan ... 7
2.2. Sejarah Perusahaan ... 8
2.3. Visi dan Misi Perusahaan... 10
2.4. Tujuan ... 10
BAB III TINJAUAN PUSTAKA ... 12
3.1. Pemrograman Mobile ... 12
3.1.1 Flutter ... 12
xi
3.2. RESTful API ... 13
3.2.1 PHP ... 13
3.2.2 MySQL ... 14
BAB IV ANALISIS DAN PERANCANGAN SISTEM ... 16
4.1 Analisis Sistem ... 16
4.1.1 Definisi Umum Aplikasi ... 16
4.1.2 Analisis Kebutuhan ... 16
4.2. Diagram Kasus Penggunaan ... 20
4.3. Spesifikasi Kasus Penggunaan ... 21
4.4 Diagram Aktivitas ... 28
BAB V IMPLEMENTASI SISTEM ... 37
5.1 Implementasi Sistem... 37
5.2 Implementasi Arsitektur Sistem dan Lapisan Kontrol ... 37
5.3 Implementasi Antarmuka Pengguna ... 46
BAB VI PENGUJIAN DAN EVALUASI ... 51
6.1. Tujuan Pengujian ... 51
6.2. Kriteria Pengujian ... 51
6.3. Skenario Pengujian ... 51
6.1. Evaluasi Pengujian ... 52
BAB VII KESIMPULAN ... 54
DAFTAR PUSTAKA ... 56
DAFTAR GAMBAR
Gambar 2.1 Logo Perumdam Tirta Taman Sari Kota
Madiun ... 8
Gambar 4.1 Diagram Use Case Aplikasi Bacameter... 20
Gambar 4.2 Diagram Aktivitas Bacameter Membuka
Halaman Awal ... 28
Gambar 4.3 Diagram Aktivitas Bacameter Melakukan
Login ... 29
Gambar 4.4 Diagram Aktivitas Bacameter Membuka
Halaman Lupa Password... 30
Gambar 4.5 Diagram Aktivitas Bacameter Melakukan
Validasi Login ... 31
Gambar 4.6 Diagram Aktivitas Bacameter Melihat
Daftar Fitur ... 32
Gambar 4.7 Diagram Aktivitas Bacameter Memilih
Fitur Unggah Foto ... 33
Gambar 4.8 Diagram Aktivitas Bacameter
Mengunggah Foto Angka Standmeter ... 34
Gambar 4.9 Diagram Aktivitas Bacameter Melakukan
Logout ... 35
Gambar 5.1 Diagram Arsiterktur Sistem ... 38
Gambar 5.2 Halaman Login Bacameter ... 46
Gambar 5.3 Halaman Lupa Password ... 47
Gambar 5.4 Halaman Validasi Akun ... 48
Gambar 5.5 Halaman Daftar Fitur ... 49
DAFTAR TABEL
Tabel 4.1 Kebutuhan Fungsional Bacameter ... 17
Tabel 4.2 Kebutuhan Non-Fungsional Bacameter ... 19
Tabel 4.3 Tabel Use Case Bacameter Membuka Halaman
Awal ... 21
Tabel 4.4 Tabel Use Case Bacameter Melakukan Login.... 21
Tabel 4.5 Tabel Use Case Bacameter Membuka
Halaman Lupa Password ... 23
Tabel 4.6 Tabel Usecase Bacameter Melakukan Validasi
Login ... 23
Tabel 4.7 Tabel Use Case Bacameter Melihat
Daftar Fitur ... 24
Tabel 4.8 Tabel Use Case Bacameter Memilih Fitur
Lapor Standmeter ... 25
Tabel 4.9 Tabel Use Case Bacameter Mengunggah Foto
Angka ... 26
Tabel 4.10 Tabel Use Case Bacameter Melakukan
Logout ... 27
Tabel 6.1 Hasil Evaluasi Pengujian Aplikasi Bacameter ... 52
BAB I
PENDAHULUAN
1.1. Latar Belakang
Perumdam Tirta Taman Sari Madiun mengelola penyediaan air bersih untuk pelanggan di wilayah Kota Madiun. Dalam prosesnya, pelanggan akan mendapat pasokan air dari perumdam. Kemudian tiap bulan dicatat jumlah penggunaan air bersih untuk melihat tagihan yang perlu dibayarkan pelanggan kepada perusahaan. Untuk mengetahui jumlah air bersih yang digunakan pelanggan, diperlukan alat yang bernama standmeter. Cara menghitung jumlah air bersih yang telah digunakan pelanggan adalah angka yang tertera pada standmeter bulan ini dikurangi dengan angka yang tertera pada bulan lalu.
Selama ini proses pencatatan angka standmeter pelanggan dilakukan oleh petugas pencatat dari perusahaan. Petugas akan berkeliling dari rumah ke rumah untuk mengecek dan memfoto angka standmeter. Selain itu petugas juga mencatat kendala yang ada, seperti pipa bocor, tidak dapat mencatat karena tidak ada penghuni rumah, dll. Semua informasi ini disimpan dalam aplikasi Android dan diunggah ke database ketika sudah terkoneksi dengan jaringan internet dari perusahaan.
Proses pencatatan ini masih belum efisien. Karena banyaknya tahapan pencatatan yang panjang. Ditambah adanya Pandemi Covid-19, masyarakat diimbau untuk tetap di rumah [1]. Serta adanya kekhawatirkan petugas membawa/terbawa virus ketika menjalankan tugas. Dua hal tersebut membuat proses pencatatan terhambat.
Oleh karena itu, kami berencana untuk mempermudah jalannya proses pencatatan ini dan turut serta dalam pencegahan penyebaran Covid-19. Dengan adanya perkembangan teknologi, tahapan pencatatan oleh petugas ini dapat dipangkas menjadi pelaporan angka standmeter mandiri oleh pelanggan. Serta tidak diperlukannya petugas yang mendatangi rumah menyukseskan imbauan masyarakat untuk tetap di rumah. Maka dibuatlah sistem pencatatan angka standmeter pelanggan yang diterapkan pada
2
aplikasi Android, yaitu Aplikasi Bacameter.
1.2. Tujuan
Tujuan kerja praktik ini adalah merancang aplikasi berbasis Android untuk mempermudah Perumdam Tirta Taman Sari Madiun dalam mencatat angka standmeter pada pelanggan. Adapun tujuan dari pengimplementasian aplikasi tersebut adalah menghemat waktu dan tenaga dalam pencatatan angka standmeter pelanggan.
1.3. Manfaat
Manfaat yang dapat diperoleh dengan adanya Aplikasi Bacameter antara lain:
1. Mempermudah dalam pencatatan angka standmeter
2. Pelanggan dapat melaporkan angka standmeter secara mandiri 3. Menghindari kontak fisik antara pelanggan dengan petugas
pencatat untuk mencegah penyebaran Covid-19
1.4. Rumusan Masalah
Berikut ini rumusan masalah pada kerja praktik pembuatan Aplikasi Bacameter:
1. Bagaimana proses pencatatan angka standmeter yang diterapkan saat ini?
2. Bagaimana solusi efektif dalam pembuatan aplikasi yang dapat membantu proses pencatatan angka standmeter bagi karyawan dan pelanggan?
3. Bagaimana agar dapat menghasilkan aplikasi yang mudah digunakan oleh pelanggan?
1.5. Lokasi dan Waktu Kerja Praktik
Kerja praktik ini dilaksanakan pada waktu dan tempat sebagai berikut:
Lokasi : Perumdam Tirta Taman Sari Kota Madiun Alamat : Jl. Sulawesi No.18, Kartoharjo, Kec.
Kartoharjo, Kota Madiun, Jawa Timur 63117 Waktu : 1 – 31 Juli 2020
Hari Kerja : Senin - Sabtu
Jam Kerja : Senin - Kamis 07.00 WIB - 14.00 WIB Jumat 07.00 WIB - 10.30 WIB Sabtu 07.00 WIB - 12.00 WIB
1.6. Metodologi Kerja Praktik
Tahapan dalam pengerjaan proyek pada kerja praktik ini adalah sebagai berikut:
1. Perumusan Masalah
Untuk mengetahui skala, domain, dan fungsionalitas website yang akan dibuat, pembimbing lapangan kerja menjelaskan secara rinci bagaimana sistem yang harus dibuat. Dari penjelasan pembimbing lapangan, dihasilkan catatan-catatan penting mengenai gambaran sistem yang akan dibuat. Dengan begitu dapat diputuskan untuk membuat sistem dengan menggunakan bahasa pemrograman Dart dan kerangka kerja Flutter serta menggunakan database MySQL Server. Hal ini dikarenakan bahasa pemrograman ini mudah digunakan dan mudah dibangun dengan spesifikasi komputer yang rendah.
2. Studi Literatur
Setelah menentukan database, bahasa pemrograman, serta tools tambahan yang akan digunakan, dilakukan studi literatur mengenai cara implementasinya dalam membangun sistem sesuai yang dibutuhkan. Pada tahap ini dilakukan proses pencarian, pembelajaran, pengumpulan dan pemahaman informasi serta literatur yang berkaitan untuk membantu dalam implementasi aplikasi ini. Informasi bisa didapat dari internet untuk istilah-istilah umum yang digunakan dalam pengimplementasian suatu sistem
4 informasi.
3. Analisis dan Perancangan Sistem
Pada langkah ini terdapat penjelasan awal mengenai sistem. Bagaimana cara kerja sistem dengan skenario tertentu. Dari penjelasan awal telah didapatkan beberapa kebutuhan fungsional dan non-fungsional secara garis besar. Kemudian dilanjutkan dengan memperjelas kebutuhan- kebutuhan tersebut. Dibuatlah sebuah diagram kasus penggunaan yang mewakili skenario- skenario untuk penggunaan aplikasi Bacameter.
4. Implementasi Sistem
Implementasi sistem berdasarkan pada perancangan dan analisis sebelumnya. Kasus penggunaan dan penentuan tools juga turut mendasari pengimplementasian sistem ini. Pada tahap ini setidaknya ada dua pekerjaan utama yang dilakukan, yakni desain pada tampilan antarmuka dan juga desain fungsi-fungsi yang bekerja dalam sistem atau membuat Rest API. Pengerjaan dilakukan dengan progres setiap hari, dengan setiap harinya menargetkan perkembangan dari hari sebelumnya. Progres penyelesaian aplikasi terus dipantau oleh Bagian Litbang Perumdam Tirta Taman Sari Madiun sebagai pengguna Aplikasi Bacameter.
5. Pengujian dan Evaluasi
Pengujian dilakukan dengan menguji fitur-fitur yang telah dibuat. Kesesuaian sistem dengan kebutuhan akan menentukan keberhasilan dalam pengujian. Hal ini akan menghasilkan hasil evaluasi apakah sistem sudah sesuai dengan tujuan dan kebutuhan atau belum.
1.7. Sistematika Laporan
Buku Laporan Kerja Praktik ini terdiri dari tujuh bab. Rincian bab tersebut sebagai berikut:
1. Bab I Pendahuluan
Bab Pendahuluan menjelaskan tentang latar belakang masalah, tujuan, manfaat, rumusan masalah, tempat dan waktu pelaksanaan, dan sistematika pengerjaan kerja praktik, serta penulisan Laporan Kerja Praktik.
2. Bab II Profil Perusahaan
Pada bab ini dijelaskan mengenai profil dan sejarah perusahaan tempat pelaksanaan kerja praktik, yaitu Perumdam Tirta Taman Sari Kota Madiun.
3. Bab III Tinjauan Pustaka
Bab ini berisi mengenai tinjauan pustaka dan literatur yang digunakan dalam melaksanakan kerja praktik.
4. Bab IV Analisis dan Perancangan Sistem
Pada bab ini, dijelaskan hasil pembelajaran atau analisis terhadap apa saja yang diperlukan dan harus diperhatikan dalam pengembangan aplikasi yang dikerjakan selama kerja praktik.
5. Bab V Implementasi Sistem
Bab ini berisi penjelasan tahap-tahap yang dilakukan untuk proses implementasi aplikasi.
6. Bab VI Pengujian dan Evaluasi
Pada bab ini dijelaskan mengenai hasil pengujian dan evaluasi dari sistem yang telah dikembangkan selama pelaksanaan kerja praktik.
7. Bab VII Kesimpulan dan Saran
Bab ini berisi mengenai kesimpulan dan saran yang didapatkan dari serangkaian proses kerja praktik.
6
BAB II
PROFIL PERUSAHAAN
2.1. Profil Perusahaan
Perusahaan Umum Daerah Air Minum (Perumdam) Tirta Taman Sari Kota Madiun merupakan Badan Usaha milik Pemerintah Kota Madiun. Berkantor pusat di Jalan Sulawesi no. 18, perusahaan ini bergerak dalam penyedia air bersih di wilayah Kota Madiun. Wilayah tersebut meliputi 3 kecamatan, yaitu Kecamatan Kartoharjo, Kecamatan Manguharjo, dan Kecamatan Taman. Saat ini Perumdam Tirta Taman Sari memiliki 135 pegawai untuk melayani 38.000 pelanggan [2].
2.1.1. Makna Logo dan Warna Tirta Taman Sari
Gambar 2.1 Logo Perumdam Tirta Taman Sari Kota Madiun 1. Makna Logo
a. Tetesan air merepresentasikan PDAM Kota Madiun sebagai perusahaan yang bergerak di bidang penyediaan air bersih untuk pemenuhan kebutuhan air masyarakat khususnya Kota Madiun.
b. Gelombang air yang menyerupai tangan menggambarkan pelayanan prima yang diberikan oleh PDAM Kota Madiun dalam melayani masyarakat dengan tanggap, sigap dan santun.
8
PDAM Kota Madiun menuju pada kemakmuran dengan mengusahakan tiga misi yang dimiliki.
d. Lingkaran biru menunjukkan hubungan yang harmonis antara pemilik, pegawai dan pelanggan perusahaan [2].
2. Makna Warna
a. Warna biru muda melambangkan air yang jernih, bersih dan berkualitas yang disediakan untuk kesejahteraan masyarakat.
b. Warna biru tua memiliki arti profesionalisme dalam pekerjaan yang dimiliki oleh setiap insan PDAM Kota Madiun.
c. Warna hijau sebagai warna yang melambangkan sumber air yang sehat, alami, dan memberi kehidupan [2].
2.1.2. Makna Nama Tirta Taman Sari 1. Tirta
a. Berasal dari kata Bahasa Sansekerta yang berarti air [2].
2. Taman Sari
a. Sebuah tempat yang indah dan menarik bagi semua orang. Ini berarti PDAM Kota Madiun mempunyai daya tarik yang sangat luar biasa. Hal ini disebabkan PDAM Kota Madiun berada di tempat yang sangat strategis. b. Taman berasal dari nama tempat yaitu kelurahan/
kecamatan Taman. Sumber utama air PDAM Kota Madiun berada di wilayah kelurahan/ kecamatan Taman.
c. Sari berarti inti. Yang mana inti dari air adalah air bersih. Jadi air yang diproduksi oleh PDAM Kota Madiun adalah air bersih yang telah memenuhi standarisasi yang telah ditetapkan oleh pemerintah [2].
2.2. Sejarah Perusahaan 2.2.1. Tahun 1927
Sistem penyediaan air bersih di Kotamadya Madiun berdiri sejak tahun 1927 oleh Firmasitzc en Lauzdee, diresmikan tanggal 9 Januari 1932 oleh Burgemeester R.D Scotman dengan nama
Water Leiding Bedrijf Gemente Madiun.
2.2.2. Tahun 1945
Setelah Indonesia merdeka, dipegang oleh Pemerintah Daerah dengan nama “Urusan Air Minum” yang secara struktural dibawah Pekerjaan Umum. Pada saat ini Urusan Air Minum selain mengelola kebutuhan air minum untuk masyarakat juga mempunyai tugas mengelola pemadam kebakaran dan penanggulangan banjir.
2.2.3. Tahun 1973
Berdasarkan Surat Keputusan Walikotamadya Kepala Daerah Tingkat II Madiun Nomor : 600/13 B.SD tanggal 15 September 1973, Urusan Air Minum berdiri sendiri dan bertanggung jawab kepada Kepala Daerah.
2.2.4. Tahun 1977
Berdasarkan Peraturan Daerah Kotamadya Dati II Madiun Nomor 8 Tahun 1977, sejak 10 Maret 1977 Urusan Air Minum berubah statusnya menjadi Perusahaan Daerah Air Minum Kotamadya Madiun yang disahkan oleh Gubernur Kepala Daerah Tingkat I Jawa Timur pada tanggal 29 Maret 1978. Maka sejak saat ini telah berdiri PDAM Kota Madiun yang berbadan hukum dan mempunyai hak otonomi dalam pengelolaan air minum.
2.2.5. Tahun 2014
PDAM Kota Madiun didirikan berdasarkan Peraturan Daerah (Perda) Kotamadya Daerah Tingkat II Madiun Nomor 8 tahun 1977 dan dirubah dengan Peraturan Daerah Kota Madiun No 13 Tahun 1997 dirubah lagi dengan Peraturan Daerah Kota Madiun No 17 Tahun 2001 dan terakhir diubah dengan Peraturan Daerah Kota Madiun No. 10 Tahun 2011. Berdasarkan Keputusan Walikota Madiun No. 539-401.501/ 219 / 2014 tertanggal 01 September 2014 Nama dan Logo PDAM Kota Madiun berubah menjadi PDAM Tirta Taman Sari Kota Madiun [2].
2.2.6. Tahun 2020
10
Madiun berubah menjadi Perusahaan Umum Daerah Air Minum (Perumdam) Tirta Taman Sari Kota Madiun.
2.3. Visi dan Misi Perusahaan 2.3.1. Visi
Dalam visinya, PDAM memiliki tujuan utama, yaitu “Menjadi Perusahaan yang Sehat, Mandiri dalam Pelayanan”.
2.3.2. Misi
Memberikan Pelayanan Terbaik kepada Pelanggan dan Kontribusi kepada Pemerintah sebagai Perusahaan yang Sehat [3].
2.4. Tujuan
1. Menyelenggarakan pelayanan umum/ jasa. 2. Menyelenggarakan kemanfaatan umum. 3. Memupuk pendapatan.
12
BAB III
TINJAUAN PUSTAKA
Pada bab ini akan dijelaskan mengenai dasar teori yang digunakan dalam pengerjaan dan pengembangan aplikasi.
3.1. Pemrograman Mobile
Mobile Programming atau dalam Bahasa Indonesia Pemrograman Perangkat Bergerak adalah proses menulis kode- kode program untuk membuat aplikasi yang ditujukan untuk perangkat bergerak (Mobile)[4]. Kode-kode program tersebut ditulis dalam bahasa pemrograman khusus untuk mengembangkan aplikasi perangkat bergerak. Aplikasi Bacameter ini dikembangkan menggunakan Bahasa Pemrograman Dart dan menggunakan Kerangka Kerja Flutter.
3.1.1 Flutter
Flutter merupakan sebuah SDK (Software Development Kit) untuk pengembangan aplikasi perangkat bergerak yang dikembangkan oleh Google untuk membangun aplikasi yang memiliki kinerja tinggi serta dapat dipublikasi ke platform Android dan iOS dari codebase tunggal. Terdapat keunggulan mengembangkan aplikasi Android menggunakan Flutter daripada Android Studio, yaitu:
Flutter menggunakan bahasa pemrograman Dart. Sedangkan Android Studio menggunakan bahasa pemrograman Java dan Kotlin.
Fitur hot reload yang disediakan oleh Flutter. Setiap ada perubahan, tidak memerlukan kompilasi atau build ulang untuk melihat hasil perubahan kode. Sedangkan pada Android Studio, harus melakukan build APK di setiap men-debug dan melihat hasil aplikasi pada emulator. Proses ini memakan waktu yang cukup lama, apalagi spesifikasi komputer yang digunakan tidak terlalu tinggi.
Flutter dapat di-build ke Android dan iOS. Sedangkan Android Studio hanya bisa di-build ke Android saja [5].
3.1.2 Microsoft Visual studio code
Visual Studio Code adalah source code editor yang dikembangkan Microsoft yang bisa digunakan pada berbagai platform (Linux, Mac OS dan Microsoft). Visual Studio Code juga dapat digunakan sebagai editor source code berbagai bahasa pemrograman dari PHP, Java, Python, Javascript, Node.js, C/C++, Go, C# sampai editor untuk script website seperti HTML dan CSS [6].
Untuk mengembangkan aplikasi perangkat bergerak menggunakan Flutter diperlukan tambahan atau extension. Extension yang diperlukan adalah Flutter dan Dart.
3.2. RESTful API
API (Application Programming Interface) adalah kumpulan aturan yang memungkinkan dua atau lebih program untuk berkomunikasi satu sama lain. API dibuat di server untuk kemudian dapat memungkinkan client untuk dapat berkomunikasi dengannya.
REST (Representational State Transfer) adalah jenis dari API atau yang menggambarkan bentuk dari API. REST adalah kumpulan aturan yang diikuti oleh pengembang untuk membuat API.
Sedangkan RESTful API menjadi jembatan antara database dengan client (program yang akan mengonsumsi data). Sehingga, client dapat berkomunikasi dengan server, mengambil dan memanipulasi data yang ada di database sesuai dengan aturan - aturan yang sudah diberikan tanpa memungkinkan mereka untuk dapat merusak / mengubah sesuatu di luar aturan yang berlaku [7].
3.2.1 PHP
PHP adalah bahasa pemrograman yang mengelola web service yang menggunakan protokol HTTP. Web service ini dibuat agar bisa dipanggil atau diakses oleh aplikasi lain melalui internet dengan menggunakan format pertukaran data sebagai format pengiriman pesan.
Secara singkatnya, PHP digunakan untuk menghubungkan database dengan aplikasi tersebut. File PHP ini berisi query untuk
14
mengolah data dari database yang akan diproses pada aplikasi [8].
3.2.2 MySQL
Sistem manajemen database SQL open source yang paling populer, MySQL, memungkinkan siapa saja untuk memodifikasi dan menggunakan perangkat lunak manajemen. Merupakan suatu keuntungan besar karna software ini open source atau gratis. Perlu diketahui bahwa siapa saja dapat memilih menggunakan open source untuk versi MySQL ini, Namun jika memilih untuk menggunakan Edisi Enterprise MySQL, maka semakin banyak juga fitur pilihan yang diterima [9].
16
BAB IV
ANALISIS DAN PERANCANGAN SISTEM
4.1 Analisis Sistem
Pada bab ini akan dijelaskan mengenai tahapan dalam membangun Aplikasi Bacameter. Tahapan ini berupa analisis dari sistem yang akan dibangun. Analisis sistem tersebut dijelaskan ke dalam dua bagian, bagian pertama definisi umum aplikasi dan yang kedua analisis kebutuhan.
4.1.1 Definisi Umum Aplikasi
Secara umum, Aplikasi Bacameter merupakan sistem berbasis Android yang digunakan untuk unggah angka standmeter, bukti foto standmeter, dan keterangan kendala teknis pada saat mendapatkan distribusi air. Bacameter adalah aplikasi pencatatan angka standmeter untuk pelanggan dari Perumdam Tirta Taman Sari Madiun. Aplikasi ini dapat memudahkan perusahaan dalam melakukan pencatatan standmeter untuk keperluan tagihan yang akan diberikan kepada pelanggan. Aplikasi ini juga diharapkan dapat mempermudah pelanggan untuk melaporkan angka standmeter. Adapun pengguna aplikasi ini didefinisikan sebagai berikut:
o User, Pelanggan Perumdam Tirta Taman Sari Madiun yang dapat mengunggah foto dan angka standmeter.
4.1.2 Analisis Kebutuhan
Dalam aplikasi ini, terdapat fungsi-fungsi yang harus dipenuhi oleh sistem. Kebutuhan ini terbagi ke dalam dua jenis, yakni kebutuhan fungsional dan kebutuhan non- fungsional.
4.1.2.1. Kebutuhan Fungsional
Kebutuhan fungsional pada aplikasi ini menjelaskan bagaimana sistem itu bekerja. Kebutuhan fungsional dari Aplikasi Bacameter dijelaskan pada Tabel 4.1.
Tabel 4.1 Kebutuhan Fungsional Bacameter
Kode Kebutuhan Deskripsi kebutuhan F-001 Membuka Halaman Awal F-002 Melakukan Login
F-003 Membuka Halaman Lupa Password F-004 Melakukan Validasi Login
F-005 Melihat Daftar Fitur
F-006 Memilih Fitur Lapor Standmeter F-007 Mengunggah Foto Angka Standmeter F-008 Melakukan Logout
Berikut adalah penjelasan dari masing-masing kebutuhan fungsional:
a. Membuka Halaman Awal
Halaman awal ini berupa formulir untuk proses login dan tombol menuju Halaman Lupa Password. Sebelumnya terdapat splash screen yang menunjukkan bahwa aplikasi masih dalam proses memuat.
b. Melakukan Login
User dapat melakukan login pada halaman awal aplikasi. Formulir login terdiri dari username dan password.
c. Membuka Halaman Lupa Password
Berisi arahan untuk User mengenai tata cara mengatur ulang password, yaitu dengan mendatangi petugas yang ada di kantor. Hal ini dikarenakan sistem
18
belum dapat untuk melakukan reset password.
d. Melakukan Validasi Login
Untuk memvalidasi akun User. Jika akun yang login benar milik User, maka akan menuju Daftar Fitur. Jika bukan milik User, akan kembali ke halaman Login.
e. Melihat Daftar Fitur
User akan melihat beberapa fitur yang ada pada Aplikasi Bacameter. Untuk fitur saat ini hanya fitur untuk mengunggah foto standmeter.
f. Memilih Fitur Lapor Standmeter
User dapat memilih fitur ini ketika akan mengunggah foto standmeter.
g. Mengunggah Foto Angka Standmeter
User dapat mengunggah foto ketika memasukkan data untuk pencatatan angka standmeter.
h. Melakukan Logout
Setelah menggunakan aplikasi ini, user dapat logout dan keluar dari aplikasi.
4.1.2.2. Kebutuhan Non-Fungsional
Kebutuhan non-fungsional adalah kebutuhan pengguna untuk mendefinisikan bagaimana batasan dan karakteristik dari sebuah sistem yang dibangun. Kebutuhan non-fungsional dari Aplikasi Bacameter pada Tabel 4.2.
Tabel 4.2 Kebutuhan Non-Fungsional Bacameter
Kode
Kebutuhan Deskripsi kebutuhan NF-001 Dapat diakses oleh pengguna NF-002 Sistem dapat diakses di mana saja NF-003 Sistem memiliki tampilan (antarmuka)
yang mudah dipahami
NF-004
Sistem harus dapat memastikan bahwa data yang digunakan dalam sistem harus terlindung dari akses yang tidak berwenang
NF-005
Sistem harus dapat menyesuaikan SOP (Standard Operational Procedure) yang sudah ada
20
4.2. Diagram Kasus Penggunaan
Pembahasan dengan pembimbing lapangan mengenai fitur-fitur yang perlu ada dalam Aplikasi Bacameter menghasilkan fitur yang dibuat dalam diagram kasus penggunaan (Use Case Diagram). Use Case Diagram yang telah dibuat dapat dilihat pada Gambar 4.1.
4.3. Spesifikasi Kasus Penggunaan
4.3.1 Membuka Halaman Awal
Tabel 4.3 berikut merupakan tabel use case dari Aplikasi Bacameter membuka halaman awal.
Tabel 4.3 Tabel Use Case Bacameter Membuka Halaman Awal
Nama Membuka Halaman Awal
Kode UC001
Deskripsi Aktor dapat membuka halaman awal
Tipe Fungsional
Pemicu Aktor membuka aplikasi
Aktor User
Kondisi Awal -
Kondisi Akhir Aktor dapat membuka halaman awal Alur Kejadian Secara Normal Aktor Sistem 1. Membuka aplikasi 1.1. Menampilkan splashscreen saat aplikasis sedang loading 1.2. Menampilkan halaman login Alur Kejadian Alternatif - Pengecualian - 4.3.2 Melakukan Login
Tabel 4.4 berikut merupakan tabel use case dari Aplikasi Bacameter melakukan login.
Tabel 4.6 Tabel Use Case Bacameter Melakukan Login
Nama Melakukan Login
Kode UC002
22 dimaksud
Tipe Fungsional
Pemicu Aktor menekan tombol ‘masuk’ setelah mengisi username dan password akun
Aktor User
Kondisi Awal Formulir login ditampilkan
Kondisi Akhir Aktor dapat melakukan kegiatan pada sistem sesuai kewenangannya Alur Kejadian Secara Normal Aktor Sistem 1. Mengisi formulir login 2. Menekan tombol ‘Masuk’ 2.1. Mencocokkan data login dengan database
2.2. Menampilkan halaman validasi Alur Kejadian
Alternatif
1. Jika username dan/atau password yang diisikan tidak sesuai, maka sistem menampilkan pesan username atau password salah
2. Sistem menampilkan form login 3. Aktor mengisi kembali form login 4. Sistem mencocokkan data dengan data
pengguna pada basis data
5. Jika cocok, sistem menampilkan halaman utama untuk pengguna
Pengecualian -
4.3.3 Membuka Halaman Lupa Password
Tabel 4.5 berikut merupakan tabel use case dari Aplikasi Bacameter membuka halaman lupa password.
Tabel 4.5 Tabel Use Case Bacameter Membuka Halaman Lupa Password
Kode UC003
Deskripsi Aktor tidak dapat login karena lupa password
Tipe Fungsional
Pemicu Aktor menekan tombol ‘lupa password’ di halaman awal
Aktor User
Kondisi Awal Formulir login ditampilkan
Kondisi Akhir Aktor dapat melihat petunjuk untuk mengatur ulang password Alur Kejadian Secara Normal Aktor Sistem 1. Tidak dapat login 2. Menekan tombol ‘Lupa Password’ 2.1. Menampilkan halaman lupa password Alur Kejadian Alternatif - Pengecualian -
4.3.4 Melakukan Validasi Login
Tabel 4.6 berikut merupakan tabel use case dari Aplikasi Bacameter melakukan validasi login.
Tabel 4.6 Tabel Use Case Bacameter Melakukan Validasi Login
Nama Melakukan Validasi Login
Kode UC004
Deskripsi Aktor memvalidasi bahwa akun yang sedang login adalah miliknya
Tipe Fungsional
Pemicu Aktor menekan tombol ‘Lanjut’ setelah memastikan bahwa telah login dengan akun yang benar
Aktor User
Kondisi Awal Halaman validasi login ditampilkan
Kondisi Akhir Aktor dapat melakukan kegiatan pada sistem sesuai kewenangannya
24 Alur Kejadian Secara Normal Aktor Sistem 1. Memastikan akun yang digunakan benar 2. Menekan tombol ‘Lanjut’ 2.1. Menampilkan halaman daftar fitur Alur Kejadian Alternatif
1. Aktor memastikan akun yang digunakan salah
2. Aktor menekan tombol ‘Keluar’ 3. Sistem kembali menampilkan halaman
login Pengecualian -
4.3.5 Melihat Daftar Fitur
Tabel 4.7 berikut merupakan tabel use case dari Aplikasi Bacameter melihat daftar fitur.
Tabel 4.7 Tabel Use Case Bacameter Melihat Daftar Fitur
Nama Melihat Daftar Fitur
Kode UC005
Deskripsi Aktor melihat beberapa fitur yang ada pada Aplikasi Bacameter
Tipe Fungsional
Pemicu Aktor telah memvalidasi akun yang digunakan untuk login
Aktor User
Kondisi Awal Aktor selesai memvalidasi login akunnya Kondisi Akhir Aktor dapat melihat daftar fitur
Alur Kejadian Secara Normal Aktor Sistem 1. Melihat daftar fitur 1.1. Menampilkan halaman daftar fitur Alur Kejadian Alternatif - Pengecualian -
4.3.6 Memilih Fitur Lapor Standmeter
Tabel 4.8 berikut merupakan tabel use case dari Aplikasi Bacameter memilih fitur Lapor Standmeter.
Tabel 4.8 Tabel Use Case Bacameter Memilih Fitur Lapor Standmeter
Nama Memilih Fitur Lapor Standmeter
Kode UC006
Deskripsi Aktor memilih fitur yang akan digunakan, yaitu Lapor Standmeter
Tipe Fungsional
Pemicu Aktor menekan tombol ‘Lapor Stand Meter’ pada halaman daftar fitur
Aktor User
Kondisi Awal Halaman fitur ditampilkan
Kondisi Akhir Aktor dapat melihat formulir unggah foto Alur Kejadian Secara Normal Aktor Sistem 1. Menekan tombol ‘Lapor Stand Meter’ pada halaman daftar fitur 1.1. Menampilkan halaman unggah foto Alur Kejadian Alternatif - Pengecualian -
4.3.7 Mengunggah Foto Angka Standmeter
Tabel 4.11 berikut merupakan tabel use case dari Aplikasi Progres NCX mengunggah file BASO.
Tabel 4.9 Tabel Use Case Bacameter Mengunggah Foto Angka Standmeter
26
Nama Mengunggah Foto Angka Standmeter
Kode UC007
Deskripsi Aktor dapat mengunggah foto dan angka yang tertera pada standmeter
Tipe Fungsional
Pemicu Aktor menekan tombol ‘Upload’ setelah mengunggah berkas
Aktor User
Kondisi Awal Halaman unggah foto standmeter ditampilkan Kondisi Akhir Foto dan angka standmeter tersimpan pada
basis data Alur Kejadian
Secara Normal
Aktor Sistem
1. Memilih foto dari galeri foto atau mengambil foto secara langsung 2. Mengisi angka yang ditunjuk standmeter dan keterangan 3. Menekan tombol ‘Upload’ 3.1. Menyimpan berkas yang telah diunggah pada basis data Alur Kejadian
Alternatif
1. Aktor tidak mengunggah foto pada tanggal 3-21
2. Sistem akan menampilkan peringatan “Telah melebihi batas waktu upload foto” 1. Aktor telah mengunggah foto pada bulan
ini
2. Sistem akan menampilkan peringatan “Telah melakukan upload foto” 1. Aktor tidak mengisi foto, angka
standmeter, dan/atau keterangan 2. Sistem akan menampilkan peringatan
“Harap mengisi data dengan benar” Pengecualian -
4.3.8 Melakukan Logout
Tabel 4.10 berikut merupakan tabel use case dari Aplikasi Bacameter melakukan logout.
Tabel 4.10 Tabel Use Case Bacameter Melakukan Logout
Nama Melakukan Logout
Kode UC008
Deskripsi Aktor telah selesai menggunakan aplikasi dan ingin keluar
Tipe Fungsional
Pemicu Aktor menekan tombol ‘Keluar’ pada halaman daftar fitur
Aktor User
Kondisi Awal Aktor selesai menggunakan aplikasi Kondisi Akhir Sistem menghentikan aplikasi Alur Kejadian Secara Normal Aktor Sistem 1. Menekan tombol ‘Keluar’ 1.1. Menghentikan aplikasi Alur Kejadian Alternatif - Pengecualian -
28
4.4 Diagram Aktivitas
4.4.1 Membuka Halaman Awal
Gambar 4.2 berikut merupakan diagram aktivitas dari Aplikasi Bacameter membuka halaman awal.
4.4.2 Melakukan Login
Gambar 4.3 berikut merupakan diagram aktivitas dari Aplikasi Bacameter melakukan login.
Gambar 4.3 Diagram Aktivitas Bacameter Melakukan Login
Mengisi Formulir Login
Menekan Tombol 'Masuk' <<tidak>>
Username dan Password telah
Cocok
<<ya>>
Mencocokkan data login dengan database Sistem
Aktor
30
4.4.3 Membuka Halaman Lupa Password
Gambar 4.4 berikut merupakan diagram aktivitas dari Aplikasi Bacameter membuka halaman lupa password.
Gambar 4.4 Diagram Aktivitas Bacameter Membuka Halaman Lupa Password
Menampilkan Halaman Lupa Password Sistem
Aktor
4.4.4 Melakukan Validasi Login
Gambar 4.5 berikut merupakan diagram aktivitas dari Aplikasi Bacameter melakukan validasi login.
Gambar 4.5 Diagram Aktivitas Bacameter Melakukan Validasi Login
Akun sudah benar
<<ya>>
Menekan Tombol 'Lanjut' Menekan Tombol 'Keluar'
Menampilkan Halaman Login Menampilkan Halaman Daftar Fitur
Sistem Aktor
32
4.4.5 Melihat Daftar Fitur
Gambar 4.6 berikut merupakan diagram aktivitas dari Aplikasi Bacameter melihat daftar fitur.
4.4.6 Memilih Fitur Unggah Foto
Gambar 4.7 berikut merupakan diagram aktivitas dari Aplikasi Bacameter memilih fitur unggah foto.
34
4.4.7 Mengunggah Foto Angka Standmeter
Gambar 4.8 berikut merupakan diagram aktivitas dari Aplikasi Bacameter mengunggah foto angka standmeter.
Gambar 4.8 Diagram Aktivitas Bacameter Mengunggah Foto Angka Standmeter
Memilih foto dari galeri foto atau mengambil foto
Mengisi angka standmeter dan keterangan
<<tttiiidak>>
Menekan tombol ‘Upload’ Tanggal 3-21
<<tidak>>
<<ya>>
Telah Mengunggah
<<ya>>
<<tttiiidak>>
Data telah Diisi
<<ya>>
Menyimpan berkas pada basis data Sistem
Aktor
Menampilkan Peringatan Telah Unggah Menampilkan Peringatan Keterlambatan Unggah
4.4.8 Melakukan Logout
Gambar 4.9 berikut merupakan diagram aktivitas dari Aplikasi Bacameter melakukan logout.
36
BAB V
IMPLEMENTASI SISTEM
Bab ini membahas tentang implementasi dari perancangan sistem dan pengaplikasian sistem dalam bentuk aplikasi Android.
5.1 Implementasi Sistem
Aplikasi ini dibuat dengan menggunakan bahasa pemrograman Flutter Framework dengan DBMS yang digunakan adalah MySQL. Bahasa pemrograman untuk API yang digunakan adalah PHP.
Sistem yang dibuat merupakan sistem pencatatan angka standmeter pada proses bisnis di Perumdam Tirta Taman Sari Kota Madiun. Semua fungsi ini terbagi dalam banyak fitur seperti yang telah dipaparkan pada bagian sebelumnya. User atau dalam hal ini adalah Pelanggan Perumdam Tirta Taman Sari Kota Madiun dibuatkan 1 akun yang akan digunakan untuk melaporkan angka standmeter. Angka ini akan digunakan untuk menghitung jumlah yang harus dibayarkan pelanggan.
Seharusnya terdapat aplikasi lain berbasis web yang digunakan untuk membuatkan pelanggan akun pada Aplikasi Bacameter. Namun, aplikasi tersebut belum dapat terealisasikan.
5.2 Implementasi Arsitektur Sistem dan Lapisan Kontrol
Pada bagian ini akan digambarkan arsitektur sistem. Diagram arsitektur sistem yang diterapkan untuk Aplikasi Bacameter dapat dilihat pada Gambar 5.1 di bawah ini.
38
Gambar 5.1 Diagram Arsitektur Sistem
Selanjutnya terdapat implementasi lapisan kontrol. Lapisan kontrol ini berisi logika yang digunakan aplikasi, seperti kontrol untuk memasukkan data ke basis data, pendataan proses bisnis, serta sesi untuk semua akun pengguna.
a. User Controller
Lapisan ini digunakan untuk menampilkan halaman login dan menyimpan session saat login. Lapisan ini juga mengambil data user dan data standmeter user pada bulan lalu.
Future<List> _login() async {
final response = await http.post( "http://36.91.95.245:8084/bacameter_a pi/login.php",
body: {"nosambungan":
user.text, "password": pass.text}); var datauser = json.decode(response.body); if (datauser.length == 0) { setState(() { msg = 'Login gagal'; }); } else {
final responsePelanggan = await http.post( "http://36.91.95.245:8084/bacameter_a pi/getdataPelanggan.php", body: {"nosambungan": user.text}); var userdata = json.decode(responsePelanggan.body); final responseStan = await http.post( "http://36.91.95.245:8084/bacameter_a pi/getStan.php", body: {"nosambungan": user.text}); var datastan = json.decode(responseStan.body); setState(() { nosam = userdata[0]['nosambungan']; nama = userdata[0]['nama']; alamat = userdata[0]['alamat'];
40
b. Standmeter Controller
Menampilkan peringatan (alert) jika melewati batas unggah, data tidak lengkap, atau sudah melakukan unggah foto dan data standmeter.
tarif = userdata[0]['idtarif']; wilayah = userdata[0]['idwilayah']; jalan = userdata[0]['idjalan']; stan = datastan[0]['stan']; }); Navigator.pushReplacementNamed(contex t, '/validasi'); setState(() { username = datauser[0]['username']; }); } return datauser; } int flag;
void cekUpload() async {
final response = await http .post("http://36.91.95.245:8084/bacam eter_api/cekupload.php", body: { "nosambungan": widget.nosam, "bulan": DateTime.now().month, "tahun": DateTime.now().year }); var dataupload = json.decode(response.body);
if (dataupload.length == 0) { setState(() { flag = 0; }); } else { setState(() { flag = 1; }); } } @override void initState() { super.initState(); cekUpload(); } if (3 < DateTime.now().day && DateTime.now().day < 21) { if (stanskrg.text == null || _valCatatan == null || imageFile == null) { showDialog( context: context, builder:(BuildContext context){ return AlertDialog( title: Text("Perhatian!"), content: SingleChildScrollView( child: Text(
"Harap mengisi data dengan benar")), ); }); } else { if (flag != 1) { upload(imageFile); } else { showDialog( context: context, builder: (BuildContext context) {
42 return AlertDialog( title: Text("Perhatian!"), content: SingleChildScrollView( child: Text("Telah melakukan upload foto")), actions: <Widget>[ FlatButton( onPressed: () { Navigator.pushRepl acementNamed(context, "/home"); }, child: Text("OK")) ], ); }); } } } else { showDialog( context: context, builder: (BuildContext context) { return AlertDialog( title: Text("Perhatian!"), content: SingleChildScrollView( child: Text(
"Telah melebihi batas waktu upload foto")), );
}); }
c. Upload Standmeter Controller
Pada halaman ini melakukan unggah foto dan data stand meter. Berikut adalah potongan code dokumen controller.
Future upload(File imageFile) async {
var stream = new
http.ByteStream(DelegatingStream.typ ed(imageFile.openRead()));
var length = await imageFile.length(); var uri = Uri.parse('http://36.91.95.245:8084/ bacameter_api/upload.php'); String date = DateFormat.y().format(DateTime.now() ); String bulan = DateFormat.M().format(DateTime.now() );
String nosam = widget.nosam; String namaFile = ''; String month = ''; if (int.parse(bulan) < 10) { setState(() { month = '0$bulan'; namaFile = '$date$month- $nosam.jpg'; }); } else { namaFile = '$date$month- $nosam.jpg'; }
Position position = await Geolocator().getCurrentPositio n(desiredAccuracy:
44
var request = new
http.MultipartRequest("POST", uri); var multipartfile =
new
http.MultipartFile("image", stream, length, filename: namaFile);
request.fields['bulan'] = month; request.fields['tahun'] = date; request.fields['nosambungan'] = widget.nosam; request.fields['tglbaca'] = DateTime.now().toString(); request.fields['idtarif'] = widget.tarif; request.fields['idwilayah'] = widget.wilayah; request.fields['idjalan'] = widget.jalan; request.fields['stan'] = stanskrg.text; request.fields['pakai'] = pakai.toString(); request.fields['idcatatan'] = _valCatatan; request.fields['lat'] = position.latitude.toString(); request.fields['lon'] = position.longitude.toString(); request.fields['stanlalu'] = widget.stan; request.files.add(multipartfile); var response = await
request.send(); if (response.statusCode == 200) { print("Sukses"); print(stanskrg.text); showDialog( context: context,
builder: (BuildContext context){ return AlertDialog( title: Text("Berhasil!"), content: SingleChildScrollView( child: Text("Telah berhasil upload foto")), actions: <Widget>[ FlatButton( onPressed: () { Navigator.pushReplac ementNamed(context, "/home"); }, child: Text("OK")) ], ); }); } else { showDialog( context: context, builder:(BuildContext context) { return AlertDialog(
title: Text("Upload gagal!"), content: SingleChildScrollView( child: Text("Coba lagi nanti")), ); }); } }
46
5.3 Implementasi Antarmuka Pengguna
Gambar 5.2 berisi tampilan antarmuka awal sekaligus menampilkan isian form berisi field username dan password, diikuti dengan tombol ‘Masuk’ yang bertujuan agar pengguna dapat melakukan login ke sistem dengan akunnya masing- masing. Kemudian terdapat tombol ‘Lupa Password’. Jika ditekan akan ditunjukkan tampilan antarmuka pada Gambar 5.3. Karena sistem belum memungkinkan untuk melakukan reset password, maka halaman “Lupa Password” berisi arahan untuk menghubungi petugas administrasi di kantor.
Gambar 5.3 Halaman Lupa Password
Gambar 5.4 berisi tampilan antarmuka yang bertujuan untuk memvalidasi akun User. Jika akun yang login benar milik User, maka akan menuju Daftar Fitur. Jika bukan milik User, akan kembali ke halaman Login.
48
Gambar 5.4 Halaman Validasi Akun
Selanjutnya Gambar 5.5 Daftar Fitur, bagian ini berisi tampilan antarmuka fitur-fitur yang ada pada Aplikasi Bacameter. Untuk saat ini hanya terdapat fitur “Lapor Stand Meter”. Di sini juga terdapat tombol ‘Keluar’ untuk keluar aplikasi.
Gambar 5.5 Halaman Daftar Fitur
Gambar 5.6 berisi tampilan antarmuka yang terdiri dari data pelanggan (user). User dapat melihat data dan dapat memasukkan angka yang ditunjukkan standmeter saat ini pada bagian ‘Stan’. Sistem akan menampilkan jumlah pemakaian pada bagian ‘Pakai’. User juga dapat memberikan catatan dengan memilih pada dropdown ‘Catatan’ dan mengambil foto standmeter dengan menekan tombol ikon kamera. Kemudian terdapat tombol ‘Upload’, di bagian bawah ikon kamera, untuk user mengunggah data. Seluruh rangkaian ‘Lapor Stand Meter’ telah selesai.
50
BAB VI
PENGUJIAN DAN EVALUASI
Bab ini menjelaskan tahap uji coba yang dilakukan terhadap Aplikasi Bacameter. Pengujian dilakukan untuk memastikan kualitas perangkat lunak yang dibangun dan kesesuaian hasil eksekusi perangkat lunak dengan analisis dan perancangan perangkat lunak.
6.1. Tujuan Pengujian
Pengujian dilakukan terhadap Aplikasi Bacameter untuk menguji kesesuaian dan ketepatan fungsionalitas dari seluruh sistem aplikasi.
6.2. Kriteria Pengujian
Penilaian atas pencapaian tujuan pengujian didapatkan dengan memerhatikan beberapa hasil yang diharapkan berikut ini: a. Kemampuan aplikasi menampilkan berbagai halaman mulai
dari halaman login, halaman lupa password, halaman validasi, halaman pilihan fitur, hingga halaman upload foto standmeter. b. Kemampuan aplikasi untuk menyimpan pengisian data. c. Kesesuaian dalam memenuhi kebutuhan non-fungsional
aplikasi, yaitu:
Sistem dapat diakses dari luar area kantor
Sistem memiliki tampilan (antarmuka) yang mudah dipahami
6.3. Skenario Pengujian
Skenario pengujian dilakukan dengan melakukan peran sebagai user yang akan menjalankan fitur-fitur dan seluruh kebutuhan fungsional dari sistem. Langkah-langkah untuk setiap kebutuhan fungsional yaitu sebagai berikut:
a. User membuka aplikasi dan kemudian aplikasi menampilkan formulir login.
b. User melakukan login.
c. User melakukan konfirmasi bahwa user sedang login dengan akun yang sesuai.
52
d. User diarahkan ke halaman fitur dan kemudian memilih fitur Lapor Stand Meter.
e. User mengisi data, yaitu angka yang ditunjukkan standmeter sekarang dan foto standmeter.
f. User mengunggah data tersebut. g. User keluar (logout) dari aplikasi.
6.1. Evaluasi Pengujian
Hasil pengujian dilakukan terhadap pengamatan mengenai perilaku sistem Aplikasi Bacameter terhadap kasus skenario uji coba. Pengujian dilakukan oleh pihak pengembang, pengguna, dan pembimbing lapangan. Tabel 6.1 menjelaskan hasil uji coba terhadap aplikasi yang telah dibuat.
Tabel 6.1 Hasil Evaluasi Pengujian Aplikasi Bacameter
Kriteria Pengujian Hasil Pengujian
Membuka halaman login
Terpenuhi Melakukan login
Terpenuhi Membuka halaman validasi
akun Terpenuhi
Membuka halaman fitur Aplikasi Bacameter
Terpenuhi Membuka halaman fitur Lapor
Stand Meter
Terpenuhi Mengisi formulir di halaman
fitur Unggah Foto Standmeter
Terpenuhi Mengunggah foto dan angka
standmeter
Terpenuhi Keluar (logout) dari aplikasi Terpenuhi
Dengan hasil pengujian yang telah ditunjukkan, dapat disimpulkan bahwa secara keseluruhan Aplikasi Bacameter telah memenuhi kriteria-kriteria yang sudah disebutkan pada bagian sebelumnya.
54
BAB VII KESIMPULAN 7.1. Kesimpulan
Kesimpulan yang didapat setelah melakukan pengembangan aplikasi pada kegiatan kerja praktik di Perumdam Tirta Taman Sari Kota Madiun adalah sebagai berikut:
• Aplikasi Bacameter diharapkan dapat memudahkan karyawan dan pelanggan Perumdam Tirta Taman Sari Kota Madiun untuk melakukan pencatatan angka standmeter yang berguna dalam menghitung jumlah tagihan pelanggan.
• Aplikasi Bacameter diharapkan dapat membantu dan menunjang proses bisnis Perumdam Tirta Taman Sari Kota Madiun.
7.2. Saran
Aplikasi Bacameter ini masih memiliki banyak kekurangan. Berikut ini adalah beberapa saran yang penulis berikan untuk arah perkembangan selanjutnya:
Rencana awal terdapat aplikasi website untuk admin. Aplikasi ini bertujuan untuk registrasi user dan mereset password user. Namun aplikasi ini belum sempat terlaksana karena keterbatasan waktu. Sehingga saran dari kami adalah untuk membangun aplikasi admin tersebut.
Aplikasi Bacameter dapat dikembangkan dengan menambahkan fitur-fitur lain, seperti pengaduan, berita, dll.
56
DAFTAR PUSTAKA
[1] Materi Edukasi: Pengantar. Diakses pada 10 Oktober
2020 dari
https://covid19.go.id/edukasi/pengantar/pengantar/, Oktober 2020
[2] Profil – Perumda Air Minum Tirta Taman Sari Kota Madiun. Diakses pada 18 Agustus 2020 dari https://pdam.madiunkota.go.id/category/tentang/profil/, Agustus 2020
[3] Visi Misi – Perumda Air Minum Tirta Taman Sari Kota Madiun. Diakses pada 18 Agustus 2020 dari: https://pdam.madiunkota.go.id/2018/08/03/visi-misi- pdam-tirta-taman-sari-kota-madiun/, Agustus 2020. [4] Guntoro. 2020. Pemrograman Mobile : Panduan Untuk
Pemula. Diakses pada 7 September 2020 dari: https://badoystudio.com/pemrograman-mobile/,
September 2020.
[5] CrossTechno. 2019. Apa itu Flutter?. Diakses pada 7
September 2020 dari:
https://crosstechno.com/blog/view/apa-itu-flutter-, September 2020.
[6] Faisal, Reza. 2017. Visual Studio Code dan MySQL. Diakses pada 7 September 2020 dari: https://www.rezafaisal.net/?p=3167, September 2020. [7] Prakoso, Galih L. 2019. APA ITU RESTFUL API? -
PENGERTIAN DAN PENJELASAN SEDERHANA REST API. Diakses pada 7 September 2020 dari: https://www.galihlprakoso.com/2019/04/apa-itu-rest-ful- api-pengertian-penjelasan.html, September 2020.
[8] Ardiningrum, Paramastri, dan Lutfiyanti. 2020. Rancang Bangun Aplikasi Progres NCX dan Dokumen OBL Berbasis Web untuk Pemantauan di BGES Telkom Indonesia Divisi Regional V Surabaya. Kerja Praktik. FTEIC, Teknik Informatika, Institut Teknologi Sepuluh Nopember, Surabaya.
Diakses pada 8 September 2020 dari: https://blogs.masterweb.com/database-mysql-vs-sql- server/, September 2020
[10] Naja Anwar, Sariyun, Isworo Nugroho dan Endang Lestariningsih. 2015. Perancangan Dan Implementasi Aplikasi Mobile Semarang Guidance Pada Android. DINAMIK, 20(1), 148-158.
58
BIODATA PENULIS
Affan Ahsanul Habib, lahir pada tanggal 11 Februari 1999 di Madiun. Saat ini sedang menempuh studi di Departemen Teknik Informatika Institut Teknologi Sepuluh Nopember (ITS).
