39 2
id_admin int
3. isi_berita text
4 Tanggal_liris
date f.
Buku tamu no Nama_field
type ukuran
1 no
int 5
PK 2
Nama varchar
50 3
email varchar
50 4
komentar Text
3.1.6 Perancangan menu
Perancangan menu dibuat dengan harapan agar pengguna dapat menggunakan aplikasi tanpa kesulitan. Berikut adalah perancangan menu unutuk pengunjung sperti
terlihat pada gambar 3.12 Srtuktur menu Pengunjung
Home
Menu Utama
Profile Produk
Pengalman Berita
Berita
Gambar 3.12 Struktur Menu pengunjung
Perancangan struktur menu untuk admin terdapat pada gambar 3.13 struktur menu admin
40
Login
Data Profil
view data profil
Tambah data profil
Menu Utama
Data Produk
View data produk
Tambah data produk
Data Berita
View data berita
Tambah data berita
Data Pengalaman
View pengalaman
Tambah pengalaman
Data Buku Tamu
View buku tamu
Data Admin
logout View admin
Tambah admin
Gambar 3.13 Struktur Menu admin
3.1.7 Perancangan Antarmuka
Perancangan antarmuka diperlukan pada program aplikasi ini dengan tujuan untuk mempermudah pengguna dalam menggunakan program aplikasi ini. Dengan
adanya perancangan antarmuka ini berbagai pengguna baik awam, maupun yang sudah berpengalaman dapat mengoperasikan aplikasi ini tanpa adanya kesulitan yang
besar. 1. Perancangan antar muka tampilan utama pengunjung
a.
Perancangan Tampilan utama pengunjung T01
41
- Klik home untuk Ke T01
- Klik Buku tamu untuk ke
T02 - Klik Profil
untuk ke T03 - Klik produk
ke T04 - Klik
pengalaman untuk ke T05
- Klik Berita untuk ke T06
T01
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu
profil produk
pengala man
berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Gambar 3.14 perancangan tampilan utama pengunjung
a. Perancangan Tampilan buku tamu T02
- Klik home untuk Ke T01
- Klik Buku tamu untuk ke
T02 - Klik Profil
untuk ke T03 - Klik produk
ke T04 - Klik
pengalaman untuk ke T05
- Klik Berita untuk ke T06
T02
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu
profil produk
pengala man
berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Buku tamu
nama email
komentar kirim
batal
42
Gambar 3.15 perancangan tampilan buku tamu
b. Perancangan Tampilan halaman profil T03
- Klik home untuk Ke T01
- Klik Buku tamu untuk ke
T02 - Klik Profil
untuk ke T03 - Klik produk
ke T04 - Klik
pengalaman untuk ke T05
- Klik Berita untuk ke T06
T03
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu profil
produk pengala
man berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Profile
halaman
Gambar 3.16 perancangan tampilan halaman profil
c.
Perancangan
Tampilan halaman produk T04
43
- Klik home untuk Ke T01
- Klik Buku tamu untuk ke
T02 - Klik Profil
untuk ke T03 - Klik produk
ke T04 - Klik
pengalaman untuk ke T05
- Klik Berita untuk ke T06
T04
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu profil
produk pengala
man berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
man produk
Nama Produk
Pelayanan
Gambar 3.17 perancangan tampilan halaman produk
d.
Perancangan
Tampilan halaman pengalaman T05
44
- Klik home untuk Ke T01
- Klik Buku tamu untuk ke
T02 - Klik Profil
untuk ke T03 - Klik produk
ke T04 - Klik
pengalaman untuk ke T05
- Klik Berita untuk ke T06
T05
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu
profil produk
pengala man
berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
man pengalaman
Nama pekerjaan lokasi
alamat
Gambar 3.18 perancangan tampilan halaman pengalaman
e. Perancangan Tampilan halaman berita T06
45 - Klik home
untuk Ke T01 - Klik Buku
tamu untuk ke T02
- Klik Profil untuk ke T03
- Klik produk ke T04
- Klik pengalaman
untuk ke T05 - Klik Berita
untuk ke T06
T06
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Buku
tamu profil
produk pengala
man berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
BERITA
halaman
Gambar 3.19 perancangan tampilan halaman berita
b.
Perancangan antar muka tampilan utama admin a. Perancangan Tampilan login admin T07
46 - Klik home
untuk Ke T01 - Klik Buku
tamu untuk ke T02
- Klik Profil untuk ke T03
- Klik produk ke T04
- Klik pengalaman
untuk ke T05 - Klik Berita
untuk ke T06
T07
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
USERNAME PASSWORD
Login
Gambar 3.20 perancangan tampilan login admin
47 b. Perancangan Tampilan menu utama admin T08
- Klik home untuk Ke T08
- Klik View Buku tamu untuk ke T09
- Klik View Profil untuk ke T10
- Klik Tambah profil ke T11
- Klik View produk unutk ke T12
- klik tanmbah produk untuk ke
T13 -klik view
pengalaman untuk ke T14
- Klik Tambah pengalaman untuk
ke T15 -klik view Berita
untuk ke T16 - klik tambah berita
untuk ke T17 -klik view admin
untuk ke T18 -klik tamabah
admin untuk ke T19
-klik logut untuk ke T07
T08
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Gambar 3.21 perancangan tampilan menu utama admin
c. Perancangan Tampilan view buku tamu T09
48
- Klik home untuk Ke T08
- Klik View Buku tamu untuk ke T09
- Klik View Profil untuk ke T10
- Klik Tambah profil ke T11
- Klik View produk unutk ke T12
- klik tanmbah produk untuk ke
T13 -klik view
pengalaman untuk ke T14
- Klik Tambah pengalaman untuk
ke T15 -klik view Berita
untuk ke T16 - klik tambah berita
untuk ke T17 -klik view admin
untuk ke T18 -klik tamabah
admin untuk ke T19
-klik logut untuk ke T07
T09
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Daftar buku tamu no
waktu nama
email pesan
Gambar 3.21 perancangan tampilan view buku tamu
d. Perancangan Tampilan view profil T10
49
- Klik home untuk Ke T08
- Klik View Buku tamu untuk ke T09
- Klik View Profil untuk ke T10
- Klik Tambah profil ke T11
- Klik View produk unutk ke T12
- klik tanmbah produk untuk ke
T13 -klik view
pengalaman untuk ke T14
- Klik Tambah pengalaman untuk
ke T15 -klik view Berita
untuk ke T16 - klik tambah berita
untuk ke T17 -klik view admin
untuk ke T18 -klik tamabah
admin untuk ke T19
-klik logut untuk ke T07
T08
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Profile
halaman
Gambar 3.23 perancangan tampilan view profil
e. Perancangan Tampilan view profil T11
50
T11
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Tambah Profile
Nama profil
deskripsi save
batal
Gambar 3.24 perancangan tampilan tambah profil
f. Perancangan Tampilan tambah produk T12
51
T12
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
produk
Nama Produk
Pelayanan id_produk
Gambar 3.25 perancangan tampilan view produk
g. Perancangan Tampilan tambah produkT13
52
T13
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Tambah produk
Nama produkl
pelayanan save
batal
Gambar 3.26 perancangan tampilan tambah produk
h. Perancangan Tampilan view pengalaman T14
53
T14
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
pengalaman
Nama pekerjaan
keteranaga n
idpengalam ank
Gambar 3.27 perancangan tampilanview pengalaman
i. Perancangan Tampilan tambah pengalaman T15
54
T15
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Tambah pengalaman
Nama pekerjaan
lokasi save
batal alamat
Gambar 3.28 perancangan tampilan tamabah pengalaman
j. Perancangan Tampilan tambah berita T17
55
T17
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Isi berita save
batal
Tambah berita
Gambar 3.29 perancangan tampilan tambah berita
k. Perancangan Tampilan view berita T16
56
T16
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
berita
Judul berita
Isi berita Id berita
Gambar 3.30 perancangan tampilan view berita
l. Perancangan Tampilan tambah admin T18
57
T19
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Tambah admin
username password
save batal
nam
Gambar 3.31 perancangan tampilan tambah admin
m. Perancangan Tampilan view admin T19
58
T19
LOGO
PT. LIMA PILAR ABADI UTAMA
a helping hand for your bussines
home Data Buku tamu
View bukutamu Data profil
View profil Tambah profil
Data produk View produk
Tambah produk Data Pengalaman
View pengalaman
Tambah pengalaman Data berita
View berita Tamabah berita
Ukuran 1024 x 768 warna sesuai dengan setting windows
Warna tema Abu-abu, putih
Data admin View admin
Tambah admin Logout
Data admin
Nama admin
Data admin Id_admin
Gambar 3.32 perancangan tampilan view admin
59
3.1.8 Perancangan Pesan
