58
6. Tabel Hukum Nama Tabel
: tbl_hukum Keterangan
: Berisi hukum hewan Primary Key
: id_hukum Tabel 4.10 Tabel Hukum
Nama Field Tipe
Panjang Keterangan
id_hukum Varchar
10 Id hukum
Hukum Varchar
20 Hukum hewan
7. Tabel Alasan Nama Tabel
: tbl_alasan Keterangan
: Berisi alasan hukum hewan Primary Key
: id_alasan Tabel 4.11 Tabel Alasan
Nama Field Tipe
Panjang Keterangan
id_alasan Varchar
20 Id alas an
Alasan Varchar
100 Alasan hukum hewan
5.3.6 Perancangan Antar Muka
Untuk rancangan antar muka, disesuaikan dengan model berbasis web, sehingga setiap halaman akan terlihat header dan footer. Rancangan tampilan-
tampilan yang akan dibuat didasarkan pada tujuan-tujuan yang telah didefinisikan pada model-model sebelumnya. Untuk tampilan-tampilan antar
muka tersebut, dapat dilihat sebagai berikut :
59
1. Antar Muka Halaman Awal Berikut merupakan tampilan awal dari aplikasi penentu hukum
halal haram makanan dari jenis hewan.
Gambar 4. 4 Gambar Antar Muka Halaman Awal 2. Antar Muka Pencarian Terstruktur
Berikut merupakan tampilan aplikasi apabila user ingin melakukan pencarian melalui menu pencarian terstruktur Dalam menu ini bisa
langsung di link ke menu pencarian umu ataupun menu database apabila user
tidak mengetahui ciri hewan yang mereka cari tahu.
Gambar 4.5 Gambar Antar Muka Menu Pencarian Terstruktur HEADER
SELAMAT DATANG HOME
PENCARIAN TERSTRUKTUR
PENCARIAN UMUM
DATABASE ADMIN
FOOTER
HEADER
Dimanakah habitat hewan yang anda maksudkan? HOME
PENCARIAN TERSTRUKTUR
PENCARIAN UMUM
DATABASE ADMIN
FOOTER DARAT
AIR DARAT dan AIR
TIDAK TAHU
60
3. Antar Muka Hasil Pencarian Berikut merupakan tampilan aplikasi hasil pencarian apabila user
menggunakan menu pencarian terstruktur.
Gambar 4.6 Gambar Antar Muka Hasil Pencarian
4. Antar Muka Pencarian Umum Berikut merupakan tampilan aplikasi apabila user ingin melakukan
pencarian melalui menu pencarian umum, menu pencarian umum ini bisa merupakan link dari menu pencarian terstruktur apabila user tidak
mengetahui ciri hewan yang ingin mereka cari tahu. Dalam menu ini, user juga bisa melakukan pencarian menggunakan nama maupun ciri hewan
yang mereka cari. HEADER
Halal Tampilkan seluruh daftar hewan air
UTAMA PENCARIAN
TERSTRUKTUR PENCARIAN
UMUM DATABASE
ADMIN
FOOTER
61
Gambar 4.7 Gambar Antar Muka Menu Pencarian Umum 5. Antar Muka Menu Database
Berikut merupakan tampilan menu yang menampilkan daftar hewan- hewan yang ada dalam aplikasi. Menu ini bisa merupakan link dari menu
pencarian terstruktur apabila user tidak mengetahui ciri hewan yang mereka cari.
HEADER
Nama Habitat
: -
Darat -
Air -
Darat dan Air -
Tidak tahu Ciri lainnya
:
CARI
HOME PENCARIAN
TERSTRUKTUR PENCARIAN
UMUM DATABASE
ADMIN
FOOTER
CARI
62
Gambar 4.8 Gambar Antar Muka Menu Pencarian 6. Antar Muka Menu Admin login
Berikut merupakan tampilan menu admin log-in, admin bisa menambahkan data maupun menghapus dan merubah data hewan.
Gambar 4.9 Gambar Antar Muka Menu Admin Login HEADER
1. Ayam 2. Anjing
3. Babi 4. Kerbau
5. Kambing
Page 1I 2 FOOTER
HOME PENCARIAN
TERSTRUKTUR PENCARIAN
UMUM DATABASE
ADMIN
HEADER HOME
PENCARIAN TERSTRUKTUR
PENCARIAN UMUM
DATABASE ADMIN
username :
password :
signin
FOOTER
63
7. Antar Muka Menu edit data Dalam menu ini, admin dapat melakukan perubahan data hewan
yang sudah ada dalam database.
Gambar 4.10 Gambar Antar Muka Menu Edit Data 8. Antar Muka Menu Hapus Data
Berikut merupakan tampilan aplikasi apabila admin ingin menghapus data hewan.
HEADER
Hai Admin, log out EDIT DATA
Id Nama hewan
Nama arab Ciri_1
Ciri_2 Ciri_3
Ciri_umum Hukum
Alasan Keterangan
HOME LIST
TAMBAH
FOOTER
submit
64
Gambar 4.11 Gambar Antar Muka Menu Hapus Data 9. Antar Muka Menu Tambah Data
Berikut merupakan tampilan aplikasi apabila admin ingin menambahkan data hewan ke dalam database.
Gambar 4.12 Gambar Antar Muka Menu Tambah Data HEADER
Hai Admin, log out TAMBAH DATA
Id Nama hewan
Nama arab Ciri_1
Ciri_2 Ciri_3
Ciri_umum Hukum
Alasan Keterangan
HOME LIST
TAMBAH HEADER
Hai Admin, log out No
Nama Nama
arab
Ciri 1
Ciri 2
Ciri 3
Ciri umum
Hukum
Alasan keterangan Aksi
1. Anjing
Al-kalba 1
1 1
Haram
X HOME
LIST TAMBAH
Anda yakin menghapus data anjing? ok
cancel
FOOTER
FOOTER
submit
65
5.4 Construction
