Anda di halaman 1dari 27

BAB III

PENGOLAHAN DATA

3.1 Requirements
Requirement merupakan tahap pengumpulan kebutuhan secara lengkap yang
kemudian dianalisis dan didefinisikan oleh program yang akan dibangun. Hasil yang
didapat adalah berupa user requirement atau data yang berhubungan dengan
keinginan pengguna.
1. Spesifikasi hardware yang digunakan dalam pembuatan aplikasi Kelusu sebagai
berikut:
a. Laptop HP S85QESSJ
b. RAM 4 GB
c. Proccessor Intel (R) Celeron (R) CPU 63060

Sumber: Dekstop
Gambar 3.1. Spesifikasi Hardware

2. Spesifikasi software yang digunakan dalam pembuatan aplikasi sebagai berikut:


a. Java NetBeans 8.1
Sumber: Netbeans 8.1.
Gambar 3.2. Spesifikasi Netbeans 8.1.

3.2. Pembuatan Interface


3.2.1. Pembuatan Project
Dibawah ini adalah tahapan dalam pembuatan sebuah Project adalah sebagai
berikut:
1. Buka software NetBeans IDE 8.1
Sumber : NetBeans IDE 8.1.
Gambar 3.3. Tampilan Awal NetBeans 8.1.

2. Setelah itu pilih menu file pada pojok kiri atas setelah itu pilih New Project ,lalu
pada Categories pilih Java dan dan pada project pilih Java Application maka
akan muncul tampilan seperti pada gambar

Sumber : NetBeans IDE 8.1


Gambar 3.4. Langkah Pembuatan Project
3. Setelah itu buat nama pada Project Name kemudian klik finish

Sumber : NetBeans IDE 8.1


Gambar 3.5. Langkah Pembuatan Project

4. Maka setelah itu barulah terbentuk sebuah Project

3.2.2. Pembuatan Package


Dibawah ini langkah-langkah dalam pembuatan package adalah sebagai
berikut :
1. Klik kanan pada project yang telah dibuat pada tahap sebelumnya kemudian pilih
New dan setelah itu pilih Java Package
Sumber : NetBeans IDE 8.1
Gambar 3.6. Langkah Pembuatan Package

2. Setelah itu pembuatan Package selesai dan akan muncul seperti pada gambar

Sumber : NetBeans IDE 8.1


Gambar 3.7. Langkah Pembuatan Package
3.2.3. Pembuatan Class
Dibawah ini langkah-langkah dalam pembuatan Class adalah sebagai berikut :
1. Klik kanan pada Java Project yang telah dibuat kemudian pilih New dan setelah
itu pilih Java Class

Sumber : NetBeans IDE 8.1


Gambar 3.8. Langkah Pembuatan Class

2. Setelah itu klik Finish pada tombol finish

Sumber : NetBeans IDE 8.1


Gambar 3.9. Langkah Pembuatan Class
3. Maka pembuatan Class selesai dan akan terlihat seperti pada gambar

Sumber : NetBeans IDE 8.1


Gambar 3.10. Langkah Pembuatan Class

3.3. Pembuatan Graphical User Interface (GUI)


3.3.1. Tahapan Pembuatan Form
Setelah package selesai dibuat, maka langkah selanjutnya adalah pembuatan
form. Klik package yang telah dibuat lalu klik New. Setelah itu klik JFrame Form.

Sumber: NetBeans 8.1


Gambar 3.11. Tampilan Pembuatan Form
Beri nama form yang akan dibuat dan pilih tempat penyimpanan form
tersebut. Lalu klik Finish.

Sumber: NetBeans 8.1


Gambar 3.12. Tampilan Nama dan Lokasi New jFrame Form

Maka tampilan akhir New JFrame Form akan terlihat seperti berikut.

Sumber: NetBeans 8.1


Gambar 3.13. Tampilan Akhir New jFrame Form
3.3.2. Interface Program Form
Dalam pembuatan interface program form, terdapat 7 form yaitu :
1. Form Start
Form awal yang diakses untuk pengguna lama ataupun pengguna baru.
2. Form Log in
Form yang diakses untuk mengenali pengguna lama.
3. Form Pendaftaran
Form yang diakses untuk mendaftar bagi pengguna baru.
4. Form Jenis Barang
Form yang berisikan produk yang dijual.
5. Form Pembelian
Form yang berisikan nama barang serta harga yang akan dibayar.
6. Form Metode Pembayaran
Form yang berisikan pilihan pembayaran yang bisa dipilih oleh pelanggan
berupa ATM dan COD.
7. Form Menu Bank
Form yang berisikan nama bank yang bisa dipilih pengguna untuk melakukan
pembayaran.

3.3.2.1. Form Start


Objek yang ditambahkan pada Form Start adalah sebagai berikut:
1. Terdapat 2 buah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana:
a. jLabel1, digunakan untuk menampilkan “Hai Shopper!´
b. jLabel2, digunakan untuk menampilkan “Silahkan daftar / log in!”
2. Terdapat 2 buah objek jButton yang berfungsi:
a. jButton1, untuk masuk ke form Daftar.
b. jButton2, untuk masuk ke form Log in
Sumber: NetBeans 8.1
Gambar 3.14. Tampilan Awal Form Start

3.3.2.2. Form Login


Objek yang ditambahkan pada Form Login adalah sebagai berikut:
1. Terdapat 2 buah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana:
a. jLabel1, digunakan untuk menampilkan “Kode Pelanggan”
b. jLabel2, digunakan untuk menampilkan “Password”.
2. Terdapat 2 buah objek jTextField, digunakan untuk menampilkan teks, dimana:
a. jTextField1, digunakan untuk meng-input Kode Pelanggan
b. jTextField2, digunakan untuk meng-input password
3. Terdapat 2 buah objek jButton yang berfungsi:
a. jButton1, untuk masuk ke form Start
b. jButton2, untuk masuk ke form Menu Barang
Sumber: NetBeans 8.1
Gambar 3.15. Tampilan Awal Form Login

3.3.2.3. Form Pendaftaran


Objek yang ditambahkan pada Form Pendaftaran adalah sebagai berikut:
1. Terdapat 4 buah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana:
a. jLabel1, digunakan untuk menampilkan “Nama Pelanggan”
b. jLabel2, digunakan untuk menampilkan “Jenis Kelamin”
c. jLabel3, digunakan untuk menampilkan “Alamat”
d. jLabel4, digunakan untuk menampilkan “Password”
2. Terdapat 3 buah objek jTextField, digunakan untuk menampilkan teks, dimana:
a. jTextField1, digunakan untuk menampilkan teks dari “Nama Pelanggan”
b. jTextField2, digunakan untuk menampilkan teks dari “Alamat”
c. jTextField3, digunakan untuk menampilkan teks dari “Password”
3. Terdapat 2 buah objek jButton yang berfungsi:
a. jButton1, untuk melakukan register.
b. jButton2, untuk kembali ke form login.
Sumber: NetBeans 8.1
Gambar 3.16. Tampilan Awal Form Pendaftaran

3.3.2.4. Form Pembelian


Objek yang ditambahkan pada Form Pembelian adalah sebagai berikut:
1. Terdapat 6 buah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana :
a. jLabel1, digunakan untuk menampilkan “Selamat Berbelanja”
b. jLabel2, digunakan untuk menampilkan “Nama Barang”
c. jLabel3, digunakan untuk menampilkan “Harga”
d. jLabel4, digunakan untuk menampilkan “Quantity”
e. jLabel5, digunakan untuk menampilkan “Warna”
f. jLabel6, digunakan untuk menampilkan “Jenis Kayu”
2. Terdapat 4 buah objek jButton yang berfungsi :
a. jButton1, untuk total harga
b. jButton2, untuk beralih ke form menu barang
c. jButton3, untuk beralih ke form menu bank
d. jButton4, untuk beralih ke form start
3. Terdapat 5 buah objek jTextField, digunakan untuk menampilkan teks, dimana:
a. jTextField1, digunakan untuk menampilkan teks dari “Nama Barang”
b. jTextField2, digunakan untuk menampilkan teks dari “Harga”
c. jTextField3, digunakan untuk menampilkan teks dari “Quantity”
d. jTextField4, digunakan untuk menampilkan teks dari “warna”
e. jTextField5, digunakan untuk menampilkan teks dari “Jenis Kayu”

Sumber: NetBeans 8.1


Gambar 3.17. Tampilan Awal Form Pembelian

3.3.2.5. Form Menu Barang


Objek yang ditambahkan pada Form Menu Barang adalah sebagai berikut:
1. Terdapat 1 buah objek jButton yang berfungsi :
a. jButton1, untuk melakukan kembali ke form pembelian
Sumber: NetBeans 8.1
Gambar 3.16. Tampilan Awal Form Menu Barang

3.3.2.6. Form Metode Pembayaran


Objek yang ditambahkan pada Form Food adalah sebagai berikut:
1. Terdapat sebuah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana :
a. jLabel1, digunakan untuk menampilkan “Metode Pembayaran”
2. Terdapat 2 buah objek jButton yang berfungsi:
a. jButton1, untuk melakukan pembayaran secara ATM.
b. jButton2, untuk melakukan pembayaran secara COD.
Sumber: NetBeans 8.1
Gambar 3.17. Tampilan Awal Form Metode Pembayaran

3.3.2.7. Form Menu Bank


Objek yang ditambahkan pada Menu Bank adalah sebagai berikut:
1. Terdapat 2 buah objek jLabel, digunakan untuk menampilkan sejumlah kriteria
dari Text, dimana:
a. jLabel1, digunakan untuk menampilkan “Menu Bank”
b. jLabel2, digunakan untuk menampilkan “Nama Bank”
2. Terdapat 2 buah objek JButton yang berfungsi:
a. jButton1, untuk kembali ke form Metode Pembayaran.
b. jButton2, untuk menyelesaikan pembelian.
Sumber: NetBeans 8.1
Gambar 3.18. Tampilan Awal Form Menu Bank

3.4. Perubahan Nilai Properties Object


3.4.1. Properties Form Start
Pengaturan properties dari masing-masing objek pada Form Start dapat
dilihat pada Tabel 3.1.
Tabel 3.1. Properties Objek pada Form Start
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Hai Shopper!
jLabel2 Variable Name jLabel2
Text Silahkan Daftar/Log in!
Sumber: NetBeans 8.1

3.4.2. Properties Form Login


Pengaturan properties dari masing-masing objek pada Form Login dapat
dilihat pada Tabel 3.2.
Tabel 3.2. Properties Objek pada Form Log in
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Log in
jLabel2 Variable Name jLabel2
Text Kode Pelanggan
jLabel3 Variable Name jLabel3
Text Password
jTextField1 Variable Name jTextField_KodePelanggan
Text (Dikosongkan)
jTextField2 Variable Name jpassword
Text (Dikosongkan)
jButton1 Variable Name jButton1
Text kembali
jButton2 Variable Name jButton1
Text selanjutnya
Sumber: NetBeans 8.1

3.4.3. Properties Form Pendaftaran


Pengaturan properties dari masing-masing objek pada Form Pendaftaran
dapat dilihat pada Tabel 3.3.
Tabel 3.3. Properties Objek pada Form Pendaftaran
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Pendaftaran
jLabel2 Variable Name jLabel2
Text Nama pelanggan
jLabel3 Variable Name jLabel3
Text Jenis Kelamin
jLabel4 Variable Name jLabel4
Text Alamat
jLabel5 Variable Name jLabel5
Text Password
jTextField2 Variable Name jnama
Text (Dikosongkan)
jTextField3 Variable Name jpass
Text (Dikosongkan)
jTextField4 Variable Name jalamat
Text (Dikosongkan)
Tabel 3.3. Properties Objek pada Form Pendaftaran (Lanjutan)
Objek Properties Nilai
jButton1 Variable Name jButton1
Text kembali
jButton2 Variable Name jButton1
Text selanjutnya
Sumber: NetBeans 8.1

3.4.4. Properties Form Home Page


Pengaturan properties dari masing-masing objek pada Form Home Page
dapat dilihat pada Tabel 3.4.
Tabel 3.4. Properties Objek pada Form Pembelian
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Selamat berbelanja
jLabel2 Variable Name jLabel2
Text Nama barang
jLabel3 Variable Name jLabel3
Text Harga
jLabel4 Variable Name jLabel4
Text Quantity
jLabel5 Variable Name jLabel5
Icon Warna
jLabel6 Variable Name jLabel6
Icon Jenis Kayu
jButton1 Variable Name jButton1
Text Total harga
jButton2 Variable Name jButton2
Text Menu Barang
Variable Name jButton3
jButton3
Text Selanjutnya
jButton4 Variable Name jButton4
Text Kembali
Sumber: NetBeans 8.1

3.4.5. Properties Form Menu Barang


Pengaturan properties dari masing-masing objek pada Form Menu Barang
dapat dilihat pada Tabel 3.5.
Tabel 3.5. Properties Objek pada Form Menu Barang
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Kembali
Sumber : NetBeans 8.1

Tabel 3.6. Properties Objek pada Form Metode Pembayaran


Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Metode Pembayaran
Variable Name jButton1
jButton1
Text COD
jButton2 Variable Name jButton2
Text ATM
Sumber: NetBeans 8.1

3.4.6. Properties Form Menu Bank


Pengaturan properties dari masing-masing objek pada Form Menu bank dapat
dilihat pada Tabel 3.6.
Tabel 3.7. Properties Objek pada Form Food
Objek Properties Nilai
jLabel1 Variable Name jLabel1
Text Menu Bank
jLabel2 Variable Name jLabel2
Text Nama Bank
Variable Name jButton1
jButton1
Text Kembali
jButton2 Variable Name jButton2
Text Selanjutnya
Sumber : Netbeans 8.1

3.5. Penulisan Kode Program


3.5.1. Penulisan Kode Program Pada Form Start
Berikut ini adalah kode program yang digunakan dalam pembuatan form
start.
Sumber: NetBeans 8.1
Gambar 3.19. Kode Program pada Form Start

3.5.2. Penulisan Kode Program Pada Form Log in


Berikut ini adalah kode program yang digunakan dalam Form Log in .

Sumber: NetBeans 8.1


Gambar 3.20. Kode Program pada Form Log in
3.5.3. Penulisan Kode Program Pada Form Pendaftaran
Berikut ini adalah kode yang digunakan dalam pembuatan form pendaftaran.

Sumber: NetBeans 8.1


Gambar 3.21. Code pada Form Pendaftaran

3.5.4. Penulisan Kode Program Pada Form Pembelian


Berikut ini adalah kode yang digunakan dalam pembuatan form Pembelian.
Sumber: NetBeans 8.1
Gambar 3.22. Code pada Form Pembelian

3.5.5. Penulisan Kode Program Pada Form Menu Barang


Berikut ini adalah kode program yang digunakan pada pembuatan form
Menu Bank.

Sumber: NetBeans 8.1


Gambar 3.23. Kode Program pada Form Menu Barang
3.5.6. Penulisan Kode Program Pada Form Metode Pembayaran
Berikut ini adalah Code yang digunakan dalam pembuatan form Metode
Pembayaran.

Sumber: NetBeans 8.1


Gambar 3.24. Code pada Form Metode Pembayaran

3.5.7. Penulisan Kode Program Pada Form Menu Bank


Berikut ini adalah code yang digunakan dalam pembuatan Menu Bank

Sumber: NetBeans 8.1


Gambar 3.25. Code pada Form Menu Bank

3.6. Tampilan Akhir Program Aplikasi


Tampilan akhir program aplikasi dapat dilihat pada gambar dibawah ini.
1. Tampilan Akhir Form Start
Sumber: NetBeans 8.1
Gambar 3.26. Tampilan Akhir Form Start

2. Tampilan Akhir Form Log in

Sumber: NetBeans 8.1


Gambar 3.27. Tampilan Akhir Form Log in
3. Tampilan Akhir Form Pendaftaran

Sumber: NetBeans 8.1


Gambar 3.28. Tampilan Akhir Form Pendaftaran

4. Tampilan Akhir Form Pembelian

Sumber: NetBeans 8.1


Gambar 3.29. Tampilan Akhir Form Pembelian
5. Tampilan Akhir Form Menu Barang

Sumber: NetBeans 8.1


Gambar 3.30. Tampilan Akhir Form Menu Barang

6. Tampilan Akhir Form Metode Pembayaran

Sumber: NetBeans 8.1


Gambar 3.31. Tampilan Akhir Form Metode Pembayaran
7. Tampilan Akhir Form Menu Bank

Sumber: NetBeans 8.1


Gambar 3.32. Tampilan Akhir Form Menu Bank

Anda mungkin juga menyukai