nuharta.files.wordpress.com · web viewtampulan form client di buat dengan menggunakan photoshop...

27
SISTEM BILLING WARNET OLEH : I GEDE NUHARTA NEGARA (1005021101) JURUSAN MANAJEMEN INFORMATIKA FAKULTAS TEKNIK DAN KEJURUAN

Upload: buingoc

Post on 04-Apr-2019

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

SISTEM BILLING

WARNET

OLEH :

I GEDE NUHARTA NEGARA (1005021101)

JURUSAN MANAJEMEN INFORMATIKA

FAKULTAS TEKNIK DAN KEJURUAN

UNIVERSITAS PENDIDIKAN GANESHA

SINGARAJA

Page 2: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

2012

2

Page 3: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

1.1 Rancangan Sistem

Perancangan system Billing warnet ini menggunakan pemodelan UML

(United Modeling Language) dengan menggunakan Rasional Rose dalam

penggambaran atau pemodelan dari sistem ini. Rational Rose merupakan salah

satu software yang paling banyak digunakan untuk membuat desain software

melalui pendeketan UML. Rational Rose merupakan software yang menyediakan

banyak fungsi-fungsi seperti design proses, generate code, reserve engineering

serta banyak fungsi-fungsi yang lain. UML menyediakan notasi standar yang bisa

digunakan sebagai alat komunikasi bagi para pelaku dalam proses analisis yaitu

Use Case Diagram, Class Diagram, dan Sequence Diagram.

Dengan menggunakan UML dapat membuat model untuk semua jenis

aplikasi piranti lunak, dimana aplikasi tersebut dapat berjalan pada piranti keras,

sistem operasi dan jaringan apapun, serta ditulis dalam bahasa pemrograman

apapun. Tetapi karena UML juga menggunakan class dan operation dalam konsep

dasarnya, maka ia lebih cocok untuk penulisan piranti lunak dalam bahasa-bahasa

berorientasi objek seperti C++, Java, C# atau VBNet. Walaupun demikian, UML

tetap dapat digunakan untuk model aplikasi procedural dalam VB atau C. Seperti

bahasa-bahasa lainnya, UML mendefinisikan notasi dan syntak atau semantic.

Notasi UML merupakan sekumpulan bentuk khusus untuk menggambarkan

berbagai diagram piranti lunak. Setiap bentuk memiliki makna tertentu, dan UML

syntax mendefinisikan bagaiman bentuk-bentuk tersebut dapat dikombinasikan.

Rancangan sistem secara menyeluruh digambarkan dalam bentuk diagram

use case, diagram activity, diagram sequence, diagram VOPC, dan diagram Class.

Berikut pemjabaran dari masing-masing diagram.

1.1.1 Use Case Diagram

Use Case Diagram menggambarkan fungsionalitas yang

diharapkan dari sebuah sistem. Use Case Diagram menggambarkan

interaksi antara actor dengan proses atau system yang dibuat. Berikut

adalah Diagram Use Case dari Sistem Billing Warnet :

1

Page 4: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 1.1 Use Case Diagram Sistem Billing Warnet

1.1.2 Activity Diagram

Activity Diagram menggambarkan berbagai alir aktivitas dalam

sistem yang sedang dirancang. Activity Diagram merupakan state diagram

khusus, dimana sebagaian besar state adalah action dan sebagaian besar

transisi ditrigger oleh selesainya state sebelumnya (internal processing).

Oleh karna itu, Activity Diagram tidak menggambarkan behavior internal

sebuah sistem dan interaksi dalam subsistem secara eksak, tetapi lebih

menggambarkan proses-proses dan jalur-jalur aktivitas dari level-level atas

secara umum.

1.1.3 Sequence Diagram

Sequence Diagram menggambarkan interaksi antara objek di dalam

dan di sekitar sistem (termasuk penggunaan, display dan sebagainya)

berupa massage yang digambarkan terhadap waktu. Sequence Diagram

2

Melakukan Browsing

Cetak Pendapatan

Login Admin

Monitor Client

Mengirim Pesan

Client

Login Client

Edit Data

Cotrol Client

Mengirim Pesan

Admin

Manipulasi Data

<<extend>><<extend>>

<<extend>>

Page 5: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

terdiri atas dimensi vertical (waktu) dan dimensi horizontal (objek-objek

yang terkait). Sequence Diagram digunakan untuk menggambarkan

scenario atau rangkaian langkah-langkah yang dilakukan sebagai respon

dari sebuah event untuk menghasilkan output tertentu. Diawali dari apa

yang men-trigger aktivitas tersebut, proses dan perubahan apa saja yang

terjadi secara internal dan output apa yang dihasilkan.

1.1.4 Class Diagram

Class diagram merupakan gabungan dari activity diagram dan

sequence diagram. Yang dimana isinya merupakan basis data tempat

penyimpanan data-data yang di input.

Untuk penjelasan mengenai Activity Diagram, Sequens Diagram, dan

Class Diagram dari Use Case Sistem Billing Warnet dapat dipaparkan sebagai

berikut :

1. Login Admin

a. Diagram aktivitas Login Admin

Kondisi awal pada saat membuka sistem pertama muncul form login. admin

terlebih dahulu harus login memasukan username dan password agar bisa

masuk ke sistem. Pada saat memasukan username dan password sistem akan

mengecek ke tabel admin apakah sesuai dengan yang tersimpan di database

atau tidak, jika semua kondisi akhir akan muncul tampilan form login, jika

salah kembali disuruh memasukan username dan password yang benar.

Diagram activity Login Admin terlihat pada gambar 1.2 berikut :

3

Page 6: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Start

Muncul Form Login

Masukan username & password

Cek Validasi Data

Muncul Pesan Kesalahan

Salah

Muncul Halaman Sistem

Benar

Finish

tbadmin

adminsistem

Gambar 1.2 Diagram Aktivitas Login Admin

b. Diagram Sequence Login Admin

Pertama admin akan memasukkan username dan password kemudian

selanjutkan akan dilakukan pengecekan ke tabel admin dimana pada sistem

diberi nama “tbadmin”, jika username atau password salah maka akan

muncul pesan kesalahan, selanjutnya jika benar maka akan muncul halaman

utama Taman Bermain. Diagram sequence login admin dapat dilihat pada

gambar 1.3 berikut :

4

Page 7: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 1.3 Diagram Sequence Login Admin

c. Diagram Class Login Admin

Untuk mengetahui variabel-variabel yang terlibat dalam proses login dapat

dilihat pada Gambar 1.4 berikut.

5

: Admin Form login Kontrol login tbadmin Form Sistem

1. tampilkan form login

2. masukan username dan password

3. cek kebenaran input

4. mengambil data ke basis data

5. menampilkan pesan proses no 4

jika ada, maka proses dilanjutkanjika tidak, maka proses kembali ke no 2

6. tampilkan Form Sistem

Page 8: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 1.4 Diagram Class Login Admin

2. Control Client

a. Diagram Aktivitas Control Client

Setelah admin berhasil login selanjutnya pada system server terdapat

beberapa sub menu, yaitu pengaturan, control clien, cetak pendapatan dan

pesan. Admin dapat mengontrol client yakni shutdown, stop client, log off,

dan restart. Sebelmu admin melakukan hal itu, admin terlebih dahulu harus

melakukan koneksi terhadap IP client. Proses lebih jelasnya dapat dilihat

pada gambar 1.8 berikut :

6

Floginadmin

usernamepassword

login()

Fsistem

halaman Sistem

halaman sistem()

tbadmin

idid_userpassword

control_login

login()

Page 9: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

7

start

Tampil Halaman Control Client

Koneksi Ke IP Client

Pilih Control Shutdown, Restart, Stop Client, Log Off

Finish

Admin

Page 10: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 1.8 Diagram Aktivitas Control Client

b. Diagram Sequence Menambah Data

Pertama admin akan memasukkan koneksi terhadap IP client. Setelah

memasukan koneksi, admin dapat memilih control shutdown, log off, stop

client, dan restart client. Untuk lebih jelasnya bisa dilihat pada Gambar 1.9

berikut.

8

Page 11: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 1.9 Diagram Sequence Menambah data permainan

c. Diagram Class Menambah Data Permainan

Class Diagram manipulasi Data Transaksi dapat dilihat pada gambar 2.0

berikut.

Gambar 2.0 Diagram Class Menambah Data Perminan

9

: Admin Form Admin Form Control

1. Tampil Halaman Control Client

2. Koneksi Ke IP Client

3. Pilih Control Shutdown, Restart, Log Off, Stop Client

4. Control Client

Fcontrol

Control Client

Fadmin

Masukan IP ClientPil ih Control

Page 12: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

1.2 Rancangan Basis Data

Database adalah sekumpulan data yang saling berhubungan. Data adalah

fakta yang dapat direkam dan memiliki arti secara implicit. Dalam

implementasinya, sistem Billing Warnet menggunakan 3 buah tabel, yaitu:

1.2.1 Tabel Admin (tbadmin)

Tabel Admin adalah tabel yang digunakan untuk membuka server dari

billing warnet. Pada saat user melakukan log-in. Terdiri dari nama, dan

password. Pada saat login yang diminta dan disesuaikan ke dalam tabel

hanya nama dan password. Data yang tidak ada dalam tabel ini maka tidak

akan

dianggap

sebagai

admin.

Seperti

terlihat pada tabel 1.2.1 berikut ini :

Tabel 1.2.1 tbadmin

1.2.2 Tabel Harga (tbharga)

Tabel Harga adalah tabel yang digunakan untuk menyimpan, mengubah

data harga dari system billing warnet. Terdiri dari kode, harga, aboben.

Terlihat pada tabel 1.2.2 berikut :

No Nama Field Keterangan

10

No Nama Field Keterangan

1 Id_user Id_admin

3 password Password

Page 13: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

1 kode Kode

2 harga Harga

3 abodemen abodemen

Tabel 1.2.2 tbharga

1.2.3 Tabel Server (server1)

Tabel Server adalah tabel yang digunakan untuk menyimpan data client

yang telah melakukan browsing. Terdiri dari IP, Nama, Jam_Masuk,

Jam_Keluar, Tanggal, Status, dan Total. Terlihat pada tabel 1.2.3 berikut :

No Nama Field Keterangan

1 IP IP

2 Nama Nama Client

3 Jam_Masuk Jam Mulai

4 Jam_Keluar Jam Selesai

5 Tanggal Tanggal

6 Status Status Koneksi

7 Total Total Harga

Tabel 1.2.4 server

11

Page 14: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

1.3 Rancangan Tampilan Antarmuka

Rancangan antarmuka merupakan rancangan tampilan dari Sistem Billing

Warnet. Rancangan antarmuka Sistem Billing Nuhata.net ini adalah :

1.3.1 Rancangan Antarmuka Form Login Admin

Form Login admin merupakan form yang pertama muncul setelah

menjalankan program, sebelum mengakses yang lain. Admin diminta

untuk memasukkan username dan password. Jika username dan password

yang dimasukkan benar maka form server dari program ini akan muncul

dan Jika salah maka akan keluar pesan bahwa username dan password

yang dimasukkan salah. Rancangan antarmuka Form Login terlihat pada

gambar 3.1 berikut :

Gambar 3.1 Form login admin

12

Page 15: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

1.3.2 Rancangan Antarmuka Form Login Client

Form Login client merupakan form yang muncul setelah memilih

submenu login, form login client berbeda dengan login admin. Dalam

form ini client bebas untuk memasukan username. Setelah client

memasukan username disin barulah client dapat menikmati internet.

Rancangan antarmuka Form Login terlihat pada gambar 3.2 berikut :

Gambar 3.2 Form Login Client

1.3.3 Rancangan Antarmuka Form Server

Form Server merupakan form menu yang hanya bisa dimasuki oleh admin.

Di form server terdapat menu pengaturan, centak pendapatan, control

client, dan pesan. Dalam submenu tersebut ada subnya lagi. Rancangan

antarmuka form Server terlihat pada gambar 3.3 berikut :

13

Page 16: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 3.3 Form Server

1.3.4 Rancangan Antarmuka Form Client

Form client merupakan form menu yang dibuat dengan tampilan yang

menarik dan dengan gambar di dalam button tujuannya agar client

nantinya tidak bosan untuk melakukan browsing. Tampulan form client di

buat dengan menggunakan photoshop CS5 dengan membuat desain yang

cerah. Dalam form client ini terdapat menu shutdown, restart, log off dan

login, dimana client bisa menggunakan menu tersebut. Rancangan

antarmuka form menu pegawai terlihat pada gambar 3.4 berikut :

14

Page 17: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 3.4 Form Client

1.3.5 Rancangan Antarmuka Form Control Client

Form control cilent merupakan form yang dilakukan oleh admin, dimana

pada form ini admin dapat mengontrol client, contohnya Stop clien,

shutdown , log off. Sebelum melakukan tersebut, disini admin melakukan

koneksi terlebih dahulu dengan memasukan IP client. Rancangan

antarmuka form control client terlihat pada gambar 3.5 berikut :

15

Page 18: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 3.5 Form Control Client

1.3.6 Rancangan Antarmuka Form Pesan

Form pesan hampir sama dengan form control client, disini juga

menginputkan IP dari client, hanya saja disini admin hanya bisa mengirim

pesan terhadap client dan client juga dapat mengirim pesan terhadap

admin. Agar nantinya jika terdapat keluhan dari client, client cukup

mengirimkan pesan ke admin, maka admin akan dapat membantu client,

atau admin dan client dapat mengobrol dengan mengirimkan pesan terus

menerus. Rancangan antarmuka form transaksi terlihat pada gambar 3.6

berikut :

16

Page 19: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 3.6 Form Pesan

1.3.7 Rancangan Antarmuka Form Pengaturan

Form pengaturan, disini terdapat 3 jenis menu, yaitu simpan, edit, dan

keluar, disini admin dapat mengubah harga yang diberikan. Dengan cara

mengedit data yang sudah ditetapkan. Rancangan antarmuka form laporan

transaksi terlihat pada gambar 3.7 berikut :

17

Page 20: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

Gambar 3.7 Form Pengaturan

1.3.8 Rancangan Antarmuka Form Logout Server

Form logout, sebelum keluar dari server, admin harus memasukan

password terlebih dahulu, disini fungsi dari inputan password pada form

logout, agar tidak ada yang bisa mengeluarkan server kecuali admin

sendiri. Penginputan password pada form logout agar server lebih aman

dari tangan-tangan yang jail. Rancangan antarmuka form laporan transaksi

terlihat pada gambar 3.8 berikut :

Gambar 3.8 Form Logout

18

Page 21: nuharta.files.wordpress.com · Web viewTampulan form client di buat dengan menggunakan photoshop CS5 dengan membuat desain yang cerah. Dalam form client ini terdapat menu shutdown,

PENUTUP

1) Simpulan

Rancangan Sistem Billing warnet ini menggunakan usecase. Dimana

rancangannya dari diagram usecasenya, diagram activitinya, diagram sequence

dan class diagram. Rancangan basis datanya meliputi tabel-tabel yang terdiri

dari tabel admin (tbadmin), tabel server (server1), tabel harga (tbharga).

Rancangan interfacenya disini meliputi form login admin, form login client,

form server, form client, form pengaturan, form control client, form pesan,

form logout. Dan tahap pengembangan program ini dilakukan dengan bahasa

pemprograman Microsoft Visual Basic 6.0 dan database dengan

menggunakan Microsoft Acces 2010.

2) Saran

Program ini masih banyak kekurangannya, masih bisa dikembangkan lagi

yang lebih luas dan lebih baik, serta lebh lengkap. Sehinnga penulis

menyarankan agar pembaca bisa mengembangkan program ini agar lebih

bermanfaat di masyarakat.

19