BAB 4.
PERANCANGAN
4.1. Perancangan Use Case Diagram
Gambar 4.1 Use case diagram
1. Use case siswa memilih kandidat Tabel 4.1 Deskripsi use case siswa memilih kandidat Nama Use case
Use case siswa memilih kandidat
Nama Aktor
Siswa, admin
Deskripsi
Pada proses ini ditampilkan layout proses Login dan melakukan pemilihan kandidat
Pra Kondisi
Siswa setelah login dapat memilih kandidat, namun admin tidak bisa, tugas admin hanya memantau saja
Scenario
Siswa setelah login dapat melakukan pemilihan
4-27
http://digilib.mercubuana.ac.id/
kandidat, admin tidak Hasil
Siswa dan admin dapat melihat langsung jumlah suara yang sudah masuk
2. Use case melakukan rekap administrasi Table 4.2 Deskripsi Use case melakukan rekap administrasi Nama use case
Use case rekap administrasi
Nama aktor
Admin
Deskripsi
Pada proses ini admin melakukan pemantauan data siswa yang masuk
Pra Kondisi
Untuk melakukan pemantauan admin cukup login ke sistem
Skenario
Siswa melakukan login lalu memilih kandidat, admin dapat memantau siapa saja siswa yang sudah memilih kandidat
Hasil
Admin
dapat
melakukan
pemantauan
dan
administrasi secara komputerisasi
4.2. Activity Diagram Activity diagram merupakan sebuah diagram yang menggambarkan alir sebuah aktifitas pada sebuah sistem yang sedang dirancang, bagaimana masing-masing berawal, decision yang mungkin terjadi dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan proses parallel yang mungkin terjadi pada beberapa eksekusi. Adapun activity diagram usulan dalam penulisan sebagai berikut.
3.2.1. Diagram Activity Login
4-28
http://digilib.mercubuana.ac.id/
N Y
Gambar 4.2 Diagram Activity Login Table 4.3 Deskripsi Diagram Activity Login Nama
Diagram Activity Login
Deskripsi singkat
Pada diagram ini menjelaskan proses user login
Aktor
User, admin
Pra-kondisi
-
Tindakan utama
Memasukkan username dan password
Pasca kondisi
Jika user berhasil login maka masuk halaman utama, jika gagal maka user harus kembali login
3.2.2. Diagram Activity Proses Pemilihan 4-29
http://digilib.mercubuana.ac.id/
T Y
Gambar 4.3 Diagram Activity Proses Pemilihan Kandidat
Nama
Tabel 4.4 Deskripsi Diagram Activity Proses Pemilihan Diagram Activity Proses Pemilihan Kandidat
Deskripsi Singkat
Pada diagram ini menampilkan proses siswa memilih kandidat
Actor
Siswa
Pra-kondisi
-
Tindakan utama
Siswa memilih menu pilih kandidat
Pasca kondisi
Sistem akan menyimpan data ke database dan akan langsung diproses selanjutnya oleh admin
4-30
http://digilib.mercubuana.ac.id/
4.3. Pemodelan Diagram Sequence 1.3.1. Diagram Sequence Login Siswa
Gambar 4.4 Diagram Sequence Login Siswa untuk Memilih Kandidat
Gambar 4.4 menunjukkan proses siswa yang harus login terlebih dahulu menggunakan user nis dan password untuk kemudian masuk ke-menu utama agar dapat melakukan pemilihan pada kandidat yang ada. 1.3.2. Diagram Sequence Login Administrator
Gambar 4.5 Sequence Diagram Login Administrator untuk Melihat Siapa Saja Yang Sudah Melakukan Pemilihan dan Hasil Pemilihan 4-31
http://digilib.mercubuana.ac.id/
Pada gambar 4.5 menampilkan login administrator untuk melihat siapa saja siswa yang telah melakukan proses pemilihan tersebut, serta hasil dari prmilihan tersebut akan terlihat pada menu ini. Admin berhak menambahkan info terkait kandidat yang ada, namun tidak bisa merubah hasil suara yang masuk.
4.4. Perancangan Basis Data Pembuatan aplikasi ini membutuhkan database untuk pengolahan datanya. Maka database tersebut dibuat menggunakan Phpmyadmin dan MySQL, sebagai berikut: 4.4.1 Struktur Tabel Struktur tabel adalah penjelasan tentang field, tipe data dan ukuran data. Berikut tabeltabel yang digunakan dalam pembuatan aplikasi: 1. Tabel Siswa Tabel ini menyimpan data siswa. Tabel ini sendiri terdiri dari: Tabel 4.5 Tabel Siswa No
Nama Field
Tipe Data
Ukuran
Keterangan
1
Id_siswa
Int
3
Primary key
2
No_induk
Varchar
8
3
Nama_siswa
Varchar
20
4
Kelas
Varchar
8
5
Password
Varchar
50
2. Tabel Kandidat Tabel ini adalah table untuk menampilkan para kandidat pemilihan organisasi siswa tersebut. Tabel 4.6 Tabel Kandidat No
Nama Field
Tipe Data
Ukuran
Keterangan
1
Id_kandidat
Int
3
Primary key
2
No_induk
Varchar
20
3
Nama_kandidat
Varchar
20
4
Kelas
Varchar
8
4-32
http://digilib.mercubuana.ac.id/
5
Jumlah_suara
Int
4
6
Photo
Varchar
20
7
Motto
Varchar
20
3. Tabel Data Pemilih Tabel pemilih memiliki 4 field dan id_pemilih sebagai primary key. Tabel ini digunakan untuk menyimpan daftar pemilih. Tabel 4.7 Tabel Data Pemilih No
Nama Field
Tipe Data
Ukuran
Keterangan
1
Id_pemilihan
Int
5
Primary key
2
Id_siswa
Varchar
3
3
Id_kandidat
Varchar
3
4
Waktu
Date
4. Tabel Data Pemilu Tabel ini memiliki 4 field dengan id_pemilu sebagai primary key. Tabel 4.8 Tabel data pemilu No
Nama Field
Tipe Data
Ukuran
Keterangan
1
Id_pemilu
Int
11
Primary key
2
Id_kandidat
Int
3
3
Id_pemilih
Int
5
4
Tgl_dipilih
date
4.5. Class Diagram Pada tahap berikutnya akan dijelaskan dalam bentuk class diagram yang meliputi one to one, one to many, many to many. Dalam aplikasi ini digunakan untuk menunjukkan
4-33
http://digilib.mercubuana.ac.id/
alur pada pemanggilan class disetiap form yang saling berkaitan dalam penyewaan area staging sebagai berikut:
Gambar 4.6 Class Diagram
4.6. Rancangan Dialog Interface 4.6.1 Struktur Tampilan Halaman Siswa
Halaman utama
Home
Lihat Kandidat
Lihat Tata Cara Pilih
Memilih kandidat
Lihat Hasil Sementara
Gambar 4.7 Struktur Tampilan Halaman Siswa
Pada struktur halaman siswa ini, siswa hanya bisa melihat kandidat yang ditampilakan, lalu tata cara pemilihan serta memilih kandidat.
4.6.2 Struktur Tampilan Halaman Admin
Halaman utama
Home
Lihat Daftar Pemilih
Tambah Edit Kandidat
Melihat Hasil Pemilihan
Tambah Edit cara memilih
Gambar 4.8 Struktur Tampilan Halaman Administrator 4-34
http://digilib.mercubuana.ac.id/
Pada halaman ini, akses admin dapat melihat daftar pemilih yang sudah melakukan pemilihan, dapat menambah atau meng-edit informasi data kandidat yang ada, dapat melihat hasil pemilihan yang sedang berlangsung, serta menambah dan meng-edit tata cara pemilihan pada web tersebut.
4-35
http://digilib.mercubuana.ac.id/
