4.5.1. Desain Interface Web User Mango Terrace Resto
4.5.1.1. Desain Interface Index Web User Mango Terrace Resto
Halaman index merupakan halaman utama web site, yaitu halaman tempat diawalinya aktivitas browsing. Pada halaman index ini terdapat navigation bar untuk menghubungkan user ke halaman home Mango Terrace Resto. Navigation bar ini berisi gambar bendera Indonesia dan Inggris untuk mengakses halaman home Indonesia atau halaman home Inggris. Selain itu, pada halaman index juga terdapat counter yang menunjukkan jumlah pengunjung web site Mango Terrace Resto.
Desain interface index web site user Mango Terrace Resto tampak pada Gambar 4.12.
Jumlah Pengunjung Website 2. Gambar Bendera Inggris 1. Gambar
Bendera Indonesia
Photo Menu Mango Terrace Resto (File Flash) Logo Mango Terrace
Resto
Tulisan Welcome To Mango Terrace Resto
Background Halaman Index
Gambar 4.12. Desain Interface Halaman Index Web User Keterangan Gambar:
1. Sebagai link untuk mengakses halaman home Indonesia.
2. Sebagai link untuk mengakses halaman home Inggris.
4.5.1.2. Desain Interface Home Web Umum
Halaman home merupakan halaman akan ditampilkan setelah user memilih navigation bar site Indonesia atau site Inggris. Halaman home dibedakan menjadi dua bagian, yaitu halaman home Indonesia dan home Inggris. Dalam desain, home Indonesia dan home Inggris sama, yang membedakan hanyalah penggunaan bahasa pada setiap halaman web. Di dalam halaman home ini terdapat menu-menu utama yang akan menjelaskan segala sesuatu secara lebih detail mengenai Mango Terrace Resto. Desain interface halaman home web umum dapat dilihat pada Gambar 4.13.
Footer
Motto Mango Terrace Resto
Menu Rancangan Paket Pesta Customer (File Flash)
Login Member Username Password
Ubah Password???
Reset Submit
Background Orange
Logo Mango Terrace Resto (File Flash)
Pengenalan Mengenai Mango Terrace Resto
2. Pilihan menu secara top-down Tulisan Mango’s
Promotion
1. Pilihan menu yang sering
diakses
Gambar 4.13. Desain Interface Halaman Home Web Umum
Keterangan gambar:
1. Pilihan menu yang sering diakses oleh user, yaitu: home, menu terbaru (new menus), menu favorit (favorite menus), paket promosi (promotion package), paket pesta (party package), reservasi tempat (place reservation), reservasi pesta (party reservation), dan lihat meja (see table).
2. Pilihan menu, yaitu home, tentang restaurant (about us), photo album, fasilitas (facilities, menu, menu Mango (Mango’s menus), menu terbaru (new menus), menu favorit (favorite menus), paket (package), paket promosi (promotion package), paket pesta (party package), daftar hiburan (entertainment list), grafik (graph), grafik menu terlaris (favorite menu graph), grafik pengunjung (guest graph), reservasi (reservation), lihat meja (see table), reservasi tempat (place reservation), reservasi pesta (party reservation), cari (search), buku tamu (guest book), Bahasa Inggris/Bahasa Indonesia.
4.5.1.3. Desain Interface Menu Web Umum
a. Desain Interface Halaman Tentang Restaurant Web Umum
Desain interface halaman tentang restaurant web umum, baik Bahasa Indonesia maupun Bahasa Inggris, tampak dalam Gambar 4.14.
Footer
Nama, Alamat, dan Telepon Mango Terrace
Resto
Judul Halaman
Tulisan TENTANG RESTAURANT
Motto Mango Terrace Resto
Background Orange Logo Mango Terrace
Resto (File Flash)
Tentang Mango Terrace Resto (About Us)
Login Member Username
Password
Ubah Password???
Reset Submit
2. Pilihan menu secara top-down Tulisan Mango’s
Promotion
1. Pilihan menu yang sering
diakses
Gambar 4.14. Desain Interface Halaman Tentang Restaurant Web Umum Keterangan gambar :
1. Pilihan menu yang sering diakses oleh user, yaitu: home, menu terbaru (new menus), menu favorit (favorite menus), paket promosi (promotion package), paket pesta (party package), reservasi tempat (place reservation), reservasi pesta (party reservation), dan lihat meja (see table).
2. Pilihan menu, yaitu home, tentang restaurant (about us), photo album, fasilitas (facilities), menu, menu Mango (Mango’s menus), menu terbaru (new menus), menu favorit (favorite menus), paket (package), paket promosi
(promotion package), paket pesta (party package), daftar hiburan (entertainment list), grafik (graph), grafik menu terlaris (favorite menu graph), grafik pengunjung (guest graph), reservasi (reservation), lihat meja (see table), reservasi tempat (place reservation), reservasi pesta (party reservation), cari (search), login, buku tamu (guest book), bahasa Inggris/bahasa Indonesia.
Setiap halaman pada web site umum Mango Terrace Resto memiliki desain interface yang serupa dengan Gambar 4.14. Yang membedakan adalah isi pada desain berupa kotak yang diberi warna-warna tertentu. Untuk kotak berwarna hijau (pilihan menu yang sering diakses), perbedaan isi pilihan menu hanya terdapat pada halaman menu, menu terbaru (new menus), dan menu favorit (favorite menus).
b. Desain Interface Halaman Photo Album Web Umum Keterangan gambar:
¾ Kotak berwarna biru berisi tulisan “PHOTO ALBUM”.
¾ Kotak berwarna merah muda berisi daftar photo album Mango Terrace Resto.
c. Desain Interface Halaman Fasilitas (Facilities) Web Umum Keterangan gambar:
¾ Kotak berwarna biru berisi tulisan “FASILITAS” (“FACILITIES”).
¾ Kotak berwarna merah muda berisi fasilitas (facilities) Mango Terrace Resto.
d. Desain Interface Halaman Menu Web Umum
¾ Kotak berwarna hijau berisi pilihan menu, yaitu menu terbaru (new menus), menu favorit (favorite menus), hidangan pembuka (temptation), grill steaks, masakan jepang (japanesse food), mie dan masakan china (noodles), minuman special (specially drinks), minuman (beverages), juice (juices), hidangan penutup (dessert). Selain itu, juga terdapat tulisan “MENU MANGO TERRACE RESTO”.
¾ Kotak berwarna biru berisi tulisan “MENU”.
¾ Kotak berwarna merah muda berisi keterangan mengenai menu yang ditawarkan Mango Terrace Resto.
e. Desain Interface Halaman Menu Mango (Mango’s Menus) Web Umum
¾ Kotak berwarna biru berisi tulisan “MENU”.
¾ Kotak berwarna merah muda berisi daftar menu (Mango’s menus) Mango Terrace Resto.
f. Desain Interface Halaman Menu Terbaru (New Menus) Web Umum
¾ Kotak berwarna hijau berisi pilihan menu, yaitu menu terbaru (new menus), menu favorit (favorite menus), hidangan pembuka (temptation), grill steaks, masakan jepang (japanesse food), mie dan masakan china (noodles), minuman special (specially drinks), minuman (beverages), juice (juices), hidangan penutup (dessert). Selain itu, juga terdapat tulisan “MENU MANGO TERRACE RESTO”.
¾ Kotak berwarna biru berisi tulisan “MENU TERBARU” (“NEW MENUS”).
¾ Kotak berwarna merah muda berisi daftar menu terbaru (new menus) Mango Terrace Resto.
g. Desain Interface Halaman Menu Terlaris (Favorite Menus) Web Umum
¾ Kotak berwarna hijau berisi pilihan menu, yaitu menu terbaru (new menus), menu favorit (favorite menus), hidangan pembuka (temptation), grill steaks, masakan jepang (japanesse food), mie dan masakan china (noodles), minuman special (specially drinks), minuman (beverages), juice (juices), hidangan penutup (dessert). Selain itu, juga terdapat tulisan “MENU MANGO TERRACE RESTO”.
¾ Kotak berwarna biru berisi tulisan “MENU FAVORIT” (“FAVORITE MENUS”).
¾ Kotak berwarna merah muda berisi daftar menu favorit (favorite menus) Mango Terrace Resto.
h. Desain Interface Halaman Paket (Package) Web Umum
¾ Kotak berwarna biru berisi tulisan “PAKET” (“PACKAGE”).
¾ Kotak berwarna merah muda berisi informasi mengenai paket (package) yang ditawarkan Mango Terrace Resto.
i. Desain Interface Halaman Paket Promosi (Promotion Package) Web Umum
¾ Kotak berwarna biru berisi tulisan “PAKET PROMOSI” (“PROMOTION PACKAGE”).
¾ Kotak berwarna merah muda berisi daftar paket promosi (promotion package) Mango Terrace Resto.
j. Desain Interface Halaman Paket Pesta (Party Package) Web Umum
¾ Kotak berwarna biru berisi tulisan “PAKET PESTA” (“PARTY PACKAGE”).
¾ Kotak berwarna merah muda berisi daftar paket pesta (party package) Mango Terrace Resto.
kl. Desain Interface Halaman Daftar Hiburan (Entertainment List) Web Umum
¾ Kotak berwarna biru berisi tulisan “HIBURAN” (“ENTERTAINMENT”).
¾ Kotak berwarna merah muda berisi daftar hiburan (entertainment) Mango Terrace Resto.
l. Desain Interface Halaman Grafik (Graph) Web Umum
¾ Kotak berwarna biru berisi tulisan “GRAFIK” (“GRAPH”).
¾ Kotak berwarna merah muda berisi informasi dalam bentuk grafik (graph).
m. Desain Interface Halaman Grafik Menu Terlaris (Favorite Menu Graph) Web Umum
¾ Kotak berwarna biru berisi tulisan “GRAFIK MENU TERLARIS”
(“FAVORITE MENU GRAPH”).
¾ Kotak berwarna merah muda berisi informasi mengenai menu terlaris dalam bentuk grafik menu terlaris (favorite menu graph).
n. Desain Interface Halaman Grafik Pengunjung (Guest Graph) Web Umum
¾ Kotak berwarna biru berisi tulisan “GRAFIK PENGUNJUNG” (“GUEST GRAPH”).
¾ Kotak berwarna merah muda berisi informasi mengenai jumlah pengunjung dalam bentuk grafik pengunjung (guest graph).
o. Desain Interface Halaman Reservasi (Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI” (“RESERVATION”).
¾ Kotak berwarna merah muda berisi informasi mengenai reservasi (reservation) di Mango Terrace Resto.
p. Desain Interface Halaman Lihat Meja (See Table) Web Umum
¾ Kotak berwarna biru berisi tulisan “MEJA” (“TABLE”).
¾ Kotak berwarna merah muda berisi informasi dalam bentuk peta meja (see table).
q. Desain Interface Halaman Reservasi Tempat (Place Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI TEMPAT” (“PLACE RESERVATION”).
¾ Kotak berwarna merah muda berisi informasi mengenai prosedur reservasi tempat (place reservation) di Mango Terrace Resto.
Desain interface bagian reservasi tempat tampak dalam Gambar beriku 4.15.
Tidak Setuju Setuju
Prosedur Reservasi Tempat
Gambar 4.15. Desain Interface Halaman Reservasi Tempat Web Umum r. Desain Interface Halaman Input Reservasi Tempat (Entry Place Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI TEMPAT” (“PLACE RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan reservasi tempat (entry place reservation).
Desain interface bagian input reservasi tempat tampak dalam Gambar 4.16.
Batal Cek Reservasi Tempat
Nama Pemesan :
Alamat :
Telepon :
HP :
Email :
No Meja :
Jumlah Orang :
Tanggal Reservasi : Tanggal Bulan Tahun
Tanggal Pelaksanaan : Tanggal Bulan Tahun
Waktu : Jam Menit
Gambar 4.16. Desain Interface Halaman Input Reservasi Tempat Web Umum s. Desain Interface Halaman Input Menu Reservasi Tempat (Entry Menu Place Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI TEMPAT” (“PLACE RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan menu reservasi tempat (entry menu place reservation).
Desain interface bagian input menu reservasi tempat tampak dalam Gambar 4.17.
Detail Menu : Jumlah :
Nama Menu Jumlah Harga Hapus
Sub Total : Rp.
PPN 10 % : Rp.
Total : Rp.
Pilih Menu
Hapus
Simpan
Gambar 4.17. Desain Interface Halaman Input Menu Reservasi Tempat Web Umum
t. Desain Interface Halaman Reservasi Pesta (Party Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI PESTA” (“PARTY RESERVATION”).
¾ Kotak berwarna merah muda berisi informasi mengenai prosedur reservasi pesta (party reservation).
Desain interface bagian reservasi pesta tampak dalam Gambar 4.18.
Tidak Setuju Setuju
Prosedur Reservasi Pesta
Gambar 4.18. Desain Interface Halaman Reservasi Pesta Web Umum
u. Desain Interface Halaman Input Reservasi Pesta (Entry Party Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI PESTA” (“PARTY RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan reservasi pesta (entry party reservation).
Desain interface bagian input reservasi pesta tampak dalam Gambar 4.19
Batal Cek Reservasi Pesta
Nama Customer :
Alamat :
Telepon :
HP :
Email :
Tema Pesta :
Jumlah Orang :
Tanggal Reservasi : Tanggal Bulan Tahun Tanggal Acara : Tanggal Bulan Tahun
Waktu : Jam Menit
Paket Pesta :
Gambar 4.19. Desain Interface Halaman Input Reservasi Pesta Web Umum
v. Desain Interface Halaman Input Menu dan Hiburan Reservasi Pesta (Entry Menu and Entertainment Party Reservation) Web Umum
¾ Kotak berwarna biru berisi tulisan “RESERVASI PESTA” (“PARTY RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan menu dan hiburan reservasi pesta (entry menu and entertainment party reservation).
Desain interface bagian input menu dan hiburan reservasi pesta tampak dalam Gambar 4.20.
Detail Menu :
Gambar 4.20. Desain Interface Halaman Input Menu dan Hiburan Reservasi Pesta Web Umum
w. Desain Interface Halaman Data Meja (Table Data) Web Umum
¾ Kotak berwarna biru berisi tulisan “MEJA” (“TABLE”).
¾ Kotak berwarna merah muda berisi informasi data meja (table data).
Desain interface bagian data meja tampak dalam Gambar 4.21.
Gambar 4.21. Desain Interface Halaman Data Meja Web Umum Nama Menu Harga Hapus
Pilih Menu
Hapus
Detail Hiburan :
Nama Hiburan Harga Hapus
Sub Total : Rp.
Hapus
PPN 10 % : Rp.
Total : Rp.
Simpan
Reservasi Tempat No Meja : Area : Kapasitas : Detai Reservasi Meja :
Tanggal Waktu
x. Desain Interface Halaman Buku Tamu (Guest Book ) Web Umum
¾ Kotak berwarna biru berisi tulisan “BUKU TAMU” (“GUEST BOOK”).
¾ Kotak berwarna merah muda berisi daftar buku tamu (guest book).
y. Desain Interface Halaman Input Buku Tamu (Entry Guest Book) Web Umum
¾ Kotak berwarna biru berisi tulisan “BUKU TAMU” (“GUEST BOOK”).
¾ Kotak berwarna merah muda berisi form penginputan buku tamu (entry guest book).
Desain interface bagian input buku tamu tampak dalam Gambar 4.22.
Batal Simpan
Nama :
Komentar :
Gambar 4.22. Desain Interface Halaman Input Buku Tamu Web Umum z. Desain Interface Halaman Hidangan Pembuka (Temptation) Web Umum
¾ Kotak berwarna biru berisi tulisan “HIDANGAN PEMBUKA”
(“TEMPTATION”).
¾ Kotak berwarna merah muda berisi daftar hidangan pembuka (temptation).
aa. Desain Interface Halaman Grill Steaks Web Umum
¾ Kotak berwarna biru berisi tulisan “GRILL STEAKS”.
¾ Kotak berwarna merah muda berisi daftar grill steaks.
bb. Desain Interface Halaman Masakan Jepang (Japanesse Food) Web Umum
¾ Kotak berwarna biru berisi tulisan “MASAKAN JEPANG” (“JAPANESSE FOOD”).
¾ Kotak berwarna merah muda berisi daftar masakan jepang (japanesse food).
cc. Desain Interface Halaman Mie dan Masakan China (Noodles) Web Umum
¾ Kotak berwarna biru berisi tulisan “MIE & MASAKAN CHINA”
(“NOODLES”).
¾ Kotak berwarna merah muda berisi daftar mie dan masakan china (noodles).
dd. Desain Interface Halaman Minuman Spesial (Specially Drinks) Web Umum
¾ Kotak berwarna biru berisi tulisan “MINUMAN SPESIAL” (“SPECIALLY DRINKS”).
¾ Kotak berwarna merah muda berisi daftar minuman spesial (specially drinks).
ee. Desain Interface Halaman Minuman (Beverages) Web Umum
¾ Kotak berwarna biru berisi tulisan “MINUMAN” (“BEVERAGES”).
¾ Kotak berwarna merah muda berisi daftar minuman (beverages).
ff. Desain Interface Halaman Juice (Juices) Web Umum
¾ Kotak berwarna biru berisi tulisan “JUICE”.
¾ Kotak berwarna merah muda berisi daftar juice (juices).
gg. Desain Interface Halaman Hidangan Penutup (Dessert) Web Umum
¾ Kotak berwarna biru berisi tulisan “HIDANGAN PENUTUP” (“DESSERT”).
¾ Kotak berwarna merah muda berisi daftar hidangan penutup (dessert).
hh. Desain Interface Halaman Cari (Search) Web Umum
¾ Kotak berwarna biru berisi tulisan “CARI” (“SEARCH”).
¾ Kotak berwarna merah muda berisi form pencarian data (search).
Desain interface bagian cari (search) tampak dalam Gambar 4.23.
Kata Kunci :
Gambar 4.23. Desain Interface Halaman Cari Web Umum ii. Desain Interface Halaman Login Web Umum
¾ Kotak berwarna biru berisi tulisan “LOGIN”.
¾ Kotak berwarna merah muda berisi form umtuk login.
Desain interface bagian login tampak dalam Gambar 4.24.
Gambar 4.24. Desain Interface Halaman Login Web Umum Kriteria Pencarian :
Cari Batal
Username : Password :
Reset Submit
4.5.1.4. Desain Interface Home Web Member
Secara keseluruhan desain interface halaman home web member mirip dengan desain interface pada halaman home umum. Hanya saja, pada halaman home web member terdapat beberapa tambahan menu. Desain interface halaman home web member tampak dalam Gambar 4.25. Tambahan menu tersebut meliputi sub-menu grafik keaktifan member (member participation graph), dan menu member. Menu member memiliki dua sub-menu, yaitu data member (member data), dan report keaktifan member (member participation report).
4.5.1.42. Desain Interface Menu Web Member Footer
Motto Mango Terrace Resto
Menu Rancangan Paket Pesta Customer (File Flash)
Background Orange
Logo Mango Terrace Resto (File Flash)
Pengenalan Mengenai Mango Terrace Resto
2. Pilihan menu secara top-down Tulisan Mango’s
Promotion
1. Pilihan menu yang sering
diakses
Gambar 4.25. Desain Interface Halaman Home Web Member Keterangan gambar:
1. Pilihan menu yang sering diakses oleh user, yaitu: home, menu terbaru (new menus), menu favorit (favorite menus), paket promosi (promotion package),
paket pesta (party package), reservasi tempat (place reservation), reservasi pesta (party reservation), dan lihat meja (see table).
2. Pilihan menu, yaitu home, tentang restaurant (about us), photo album, fasilitas (facilities), menu, menu Mango (Mango’s menus), menu terbaru (new menus), menu favorit (favorite menus), paket (package), paket promosi (promotion package), paket pesta (party package), daftar hiburan (entertainment list), grafik (graph), grafik menu terlaris (favorite menu graph), grafik pengunjung (guest graph), grafik keaktifan member (member participation graph), reservasi (reservation), lihat meja (see table), reservasi tempat (place reservation), reservasi pesta (party reservation), data member (member data), report keaktifan member (member participation report), cari (search), buku tamu (guest book), Bahasa Inggris/Bahasa Indonesia, dan logout.
4.5.1.5. Desain Interface Menu Web Member
Desain interface menu web member mirip dengan desain interface menu web umum. Perbedaannya terletak pada tidak adanya bagian login di setiap halaman menu web member dan beberapa perbedaan pada halaman input reservasi tempat dan input reservasi pesta.
a. Desain Interface Halaman Tentang Restaurant Web Member
Desain interface halaman tentang restaurant web member, baik Bahasa Indonesia maupun Bahasa Inggris, tampak dalam Gambar 4.26.
Background Orange
1. Pilihan Menu yang sering
diakses
Footer
Nama, Alamat, dan Telepon Mango Terrace
Resto
Tulisan TENTANG RESTAURANT
Motto Mango Terrace Resto Logo Mango Terrace
Resto (File Flash)
Tentang Mango Terrace Resto (About Us)
2. Pilihan menu secara top-down Tulisan Mango’s
Promotion
Gambar 4.26. Desain Interface Halaman Tentang Restaurant Web Member Keterangan gambar:
1. Pilihan menu yang sering diakses oleh user, yaitu: home, menu terbaru (new menus), menu favorit (favorite menus), paket promosi (promotion package), paket pesta (party package), reservasi tempat (place reservation), reservasi pesta (party reservation), dan lihat meja (see table).
2. Pilihan menu, yaitu home, tentang restaurant (about us), photo album, fasilitas (facilities), menu, menu Mango (Mango’s menus), menu terbaru (new menus), menu favorit (favorite menus), paket (package), paket promosi (promotion package), paket pesta (party package), daftar hiburan (entertainment list), grafik (graph), grafik menu terlaris (favorite menu graph), grafik pengunjung (guest graph), grafik keaktifan member (member participation graph), reservasi (reservation), lihat meja (see table), reservasi tempat (place reservation), reservasi pesta (party reservation), data member (member data), report keaktifan member (member participation report), cari
(search), buku tamu (guest book), Bahasa Inggris/Bahasa Indonesia, dan logout.
Halaman photo album, fasilitas (facilities), menu, menu Mango (Mango’s menus), menu terbaru (new menus), menu favorit (favorite menus), paket (package), paket promosi (promotion package), paket pesta (party package), daftar hiburan (entertainment list), grafik (graph), grafik menu terlaris (favorite menu graph), grafik pengunjung (guest graph), grafik keaktifan member (member participation graph), reservasi (reservation), lihat meja (see table), reservasi tempat (place reservation), reservasi pesta (party reservation), cari (search), buku tamu (guest book) memiliki desain interface yang serupa dengan desain interface halaman menu web umum, hanya saja pada setiap halaman tidak terdapat bagian untuk melakukan login.
Halaman input reservasi tempat, input reservasi pesta, grafik keaktifan member, member, data member, report keaktifan member mempunyai desain interface yang serupa dengan Gambar 4.26. Yang membedakan adalah isi pada desain berupa kotak yang diberi warna-warna tertentu.
b. Desain Interface Halaman Input Reservasi Tempat (Entry Place Reservation) Web Member
¾ Kotak berwarna biru berisi tulisan “RESERVASI TEMPAT” (“PLACE RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan reservasi tempat (entry place reservation).
Desain interface bagian input reservasi tempat tampak dalam Gambar 4.27.
Batal Cek Reservasi Tempat
Id Member :
No Meja :
Jumlah Orang :
Tanggal Reservasi : Tanggal Bulan Tahun
Tanggal Pelaksanaan : Tanggal Bulan Tahun
Waktu : Jam Menit
Gambar 4.27. Desain Interface Halaman Input Reservasi Tempat Web Member
c. Desain Interface Halaman Input Reservasi Pesta (Entry Party Reservation) Web Member
¾ Kotak berwarna biru berisi tulisan “RESERVASI PESTA” (“PARTY RESERVATION”).
¾ Kotak berwarna merah muda berisi form penginputan reservasi pesta (entry party reservation).
Desain interface bagian input reservasi pesta tampak dalam Gambar 4.28.
Batal Cek Reservasi Pesta
Id Member :
Tema Pesta :
Jumlah Orang :
Tanggal Reservasi : Tanggal Bulan Tahun Tanggal Acara : Tanggal Bulan Tahun
Waktu : Jam Menit
Paket Pesta :
Gambar 4.28. Desain Interface Halaman Input Reservasi Pesta Web Member d. Desain Interface Halaman Grafik Keaktifan Member (Member Participation Graph) Web Member
¾ Kotak berwarna biru berisi tulisan “GRAFIK KEAKTIFAN MEMBER”
(“MEMBER PARTICIPATION GRAPH”).
¾ Kotak berwarna merah muda berisi informasi mengenai partisipasi member dalam bentuk grafik (member participation graph).
e. Desain Interface Halaman Member Web Member
¾ Kotak berwarna biru berisi tulisan “MEMBER”.
¾ Kotak berwarna merah muda berisi informasi pengaksesan member.
f. Desain Interface Halaman Data Member (Member Data) Web Member
¾ Kotak berwarna biru berisi tulisan “MEMBER”.
¾ Kotak berwarna merah muda berisi informasi seluruh data member yang yang bersangkutan (member data).
g. Desain Interface Halaman Report Keaktifan Member (Member Participation report) Web Member
¾ Kotak berwarna biru berisi tulisan “REPORT KEAKTIFAN MEMBER”
(“MEMBER PARTICIPATION REPORT”).
¾ Kotak berwarna merah muda berisi informasi partisipasi member dalam bentuk report (member participation report).
4.5.2. Desain Interface Administrator
4.5.2.1. Desain Interface Index Web Administrator Mango Terrace Resto
Halaman index merupakan halaman utama web site administrator. Pada halaman index ini, user diharuskan memasukkan username dan password tertentu untuk dapat melakukan pengaksesan halaman home, Desain interface index web site administrator Mango Terrace Resto tampak pada Gambar 4.29.
Tulisan Welcome To Database Mango Terrace Resto (File Flash)
Reset
Username : Password :
Submit
Logo Mango Terrace Resto
Gambar 4.29. Desain Interface Halaman Index Web Admnistrator
4.5.2.2. Desain Interface Home Web Administrator
Halaman home merupakan halaman akan ditampilkan setelah user melakukan login dengan username dan password yang benar. Di dalam halaman home ini terdapat menu-menu utama yang akan menjelaskan segala sesuatu secara lebih detail mengenai Mango Terrace Resto. Desain interface halaman home web umum dapat dilihat pada Gambar 4.30.
Tulisan Input, Update, dan
Delete (File Flash) Logo Mango Terrace Resto
1. Menu yang
dapat diakses Gambar Mango Terrace Resto
Gambar 4.30. Desain Interface Halaman Home Administrator Keterangan gambar:
1. Pilihan menu, yaitu master, reservasi, transaksi, dan report. Master memiliki sub-menu karyawan, bagian karyawan, username, member, jenis sub-menu, sub-menu, photo, paket promosi, paket pesta, hiburan, meja , dan guest book. Reservasi memiliki sub-menu reservasi tempat dan reservasi pesta. Transaksi memilki sub-menu penjualan. Sedangkan report memiliki sub-menu report reservasi tempat, report reservasi pesta, report penjualan, dan report keaktifan member.
4.5.2.3. Desain Interface Menu Web Site Administrator a. Desain Interface Halaman Karyawan Web Administrator
Search:
Data Pencarian : Tipe Pencarian:
Paging Ke Halaman Utama Batal
Cari
Tambah Data Hapus
1. Data Karyawan yang ditampilkan
Judul Halaman Data Karyawan Tanggal Sistem
Gambar 4.31. Desain Interface Halaman Karyawan Web Administrator
Keterangan gambar:
1. Data karyawan yang ditampilkan meliputi kode karyawan, nama karyawan, alamat, telepon, dan bagian. Ada dua kolom tambahan yang ditampilkan, yaitu kolom untuk edit dan hapus data karyawan.
Desain interface bagian karyawan, username, jenis menu, menu, member, paket pesta, paket promosi, photo, hiburan, meja, guest book, reservasi tempat, reservasi pesta, penjualan serupa dengan desain interface halaman karyawan pada Gambar 4.31. Yang membedakan keduanya adalah desain pada bagian yang diberi warna-warna tertentu.
b. Desain Interface Halaman Bagian Karyawan Web Administrator
¾ Kotak berwarna biru berisi tulisan “Daftar Bagian Karyawan Mango Terrace Resto”.
¾ Kotak berwarna merah muda berisi data bagian karyawan yang ditampilkan, meliputi no bagian, nama bagian, dan kolom edit untuk menghubungkan ke halaman edit bagian karyawan.
¾ Pada halaman ini, tidak ada fasilitas pencarian data.
c. Desain Interface Halaman Username Web Administrator
¾ Kotak berwarna biru berisi tulisan “Daftar Username Mango Terrace Resto”.
¾ Kotak berwarna merah muda berisi data username yang ditampilkan, meliputi id member, username, password, kolom edit, dan kolom hapus.
d. Desain Interface Halaman Jenis Menu Web Administrator
¾ Kotak berwarna biru berisi tulisan “Daftar Jenis Menu Mango Terrace Resto”.
¾ Kotak berwarna merah muda berisi data jenis menu yang ditampilkan, meliputi no jenis menu, nama jenis menu, dan kolom edit untuk menghubungkan ke halaman edit jenis menu.
¾ Pada halaman ini, tidak ada fasilitas pencarian data.
e. Desain Interface Halaman Menu Web Administrator
¾ Kotak berwarna biru berisi tulisan “Daftar Menu Mango Terrace Resto”.
¾ Kotak berwarna merah muda berisi data menu yang ditampilkan, meliputi no menu, nama menu, jenis, menu type, keterangan, description, gambar, harga, tanggal input, kolom edit, kolom hapus.
f. Desain Interface Halaman Member Web Administrator
¾ Kotak berwarna biru berisi tulisan “Daftar Member Mango Terrace Resto”.
¾ Kotak berwarna merah muda berisi data member yang ditampilkan, meliputi id member, nama member, alamat, telepon, HP, tanggal lahir, menu favorit,
¾ Kotak berwarna merah muda berisi data member yang ditampilkan, meliputi id member, nama member, alamat, telepon, HP, tanggal lahir, menu favorit,