• Tidak ada hasil yang ditemukan

Implementasi User Interface

BAB IV IMPLEMENTASI SISTEM

4.2 Implementasi User Interface

1. Halamanindex

Gambar 4. 9 Halamanindex

Halaman di atas merupakan halaman index, yaitu halaman awal dari situs web Percetakan Anyar Purwokerto. Halaman index memiliki menu halaman utama, profile, produk, denah lokasi, hubungi kami,

form login untuk user, berita dan informasi, buku tamu, kritik saran, serta fasilitaspolling.

2. Halamanprofile

Gambar 4. 10 Halaman profile

Halaman profile adalah halaman yang berisi keterangan mengenai Percetakan Anyar Purwokerto.

3. Halaman produk

Gambar 4. 11 Halaman produk

Halaman produk berisi informasi mengenai produk apa yang dapat diproduksi oleh Percetakan Anyar Purwokerto.

4. Halaman denah lokasi

Gambar 4. 12 Denah lokasi

Halaman denah lokasi berisi image jpeg yang berupa denah untuk menuju ke Percetakan Anyar Purwokerto. Denah ini akan terbuka di halaman terpisah.

5. Halaman hubungi kami

Gambar 4. 13 Halaman hubungi kami

Halaman hubungi kami berisi informasi alamat serta form pengiriman email melalui tag HTML, jadi user bisa mengirimkan email kepada Percetakan Anyar Purwokerto cukup dengan mengisiformtersebut.

6. Halaman berita dan informasi

Gambar 4. 14 Halaman berita dan informasi

Halaman ini berisi mengenai berita yang diupload sebelumnya oleh

administrator. Halaman ini akan menampilkan 5 yang paling terakhir yang diupload oleh administrator, dan berita yang lama dapat dilihat menggunakan paging kapasitas 5 berita per page.

7. Halaman buku tamu

Gambar 4. 15 Halaman buku tamu

Halaman buku tamu memperbolehkan pengunjung untuk mengisi kesan/komentar terhadap situs web Percetakan Anyar Purwokerto. Setiap pengguna hanya dapat memasukkan 1x kesan dan pesan, kecuali browser ditutup dan dibuka kembali untuk mereset sesi yang ada.

8. Halaman kritik saran

Gambar 4. 16 Halaman kritik saran

Halaman kritik saran ini hampir sama dengan halaman buku tamu,

user dapat menginputkan kritik dan sarannya melalui form yang ada serta melihat-lihat kritik dan saran yang sudah masuk didatabase.

9. Halaman pelanggan

Gambar 4. 17 Halamanuser

Halaman pelanggan dapat diakses oleh pengguna yang memiliki

usernamedanpasswordserta melakukan loginmelaluibox login yang ada di sebelah kanan di setiap halaman. Menu yang berbeda dari pengguna biasa adalah adanya fasilitas pemesanan online, serta pengguna tidak perlu repot-repot mengisikan nama atau email ketika akan mengisi buku tamu dan kritik saran.

10. Halaman pemesananonline

Gambar 4. 18 Halaman pemesananonline

Halaman pemesanan online dapat membantu user yang ingin melakukan pemesanan secara online. User juga diberikan fasilitas untuk mengupload file sehingga pesanan yang masuk di database

dapat dikerjakan sesegera mungkin dengan bantuan file yang di upload.

11. Halamanlogincmsadministrator

Gambar 4. 19 Halamanlogin administrator

Form tersebut adalah form untuk login sebagai administrator situs web.

12. Halaman cmsadministrator

Gambar 4. 20 Halaman cmsadministrator

Halaman cms administrator memiliki menu untuk mengubah dan melihat data yang ada di database. Menu tersebut terletak di sebelah

kiri, dan content akan muncul di sebelah kanan ketika menu tersebut di klik.

13. Halaman lihat produk

Gambar 4. 21 Halaman lihat produk

Gambar di atas adalah halaman untuk melihat daftar produk yang ada didatabase. Daftar produk ditampilkan dalam bentuk tabel.

14. Halamaninputproduk

Gambar 4. 22 Halamaninputproduk

Gambar di atas adalah halaman untuk menginputkan data produk baru. 15. Halaman kelola produk

Gambar 4. 23 Halaman kelola produk

Gambar di atas adalah halaman mengelola data produk yang ada di

16. Halaman lihat kritik saran

Gambar 4. 24 Halaman lihat kritik saran

Gambar di atas adalah halaman untuk melihat daftar kritik saran yang ada di database. Halaman untuk melihat data kritik saran, data buku tamu, data pemesanan, data berita, serta data user hampir mirip satu sama lain. Data disajikan dalam bentuk tabel.

17. Halaman kelola kritik saran

Gambar 4. 25 Halaman kelola kritik saran

Pada halaman kelola kritik saran, dapat dilakukan pencarian berdasarkan kata kunci dan deletion data olehadministrator.

18. Halaman kelola data pemesanan

Gambar 4. 26 Halaman kelola data pemesanan

Pada pengelolaan data pemesanan, administrator dapat mengedit pesanan serta mendelete data pesanan ataupun mendownload file attachment yang sudah diupload sebelumnya olehuser.

19. Halamaninputberita

Pada halaman input berita, administrator dapat menginputkan berita atau informasi apa saja yang berhubungan dengan Percetakan Anyar Purwokerto. Berita itu nantinya dapat di lihat dihalaman berita dan informasi. Administrator juga bisa menyertakan gambar dalam setiap berita yang diinputkan.

20. Halaman pengelolaan data berita

Gambar 4. 28 Halaman pengelolaan berita

Pada halaman pengelolaan berita, administrator dapat melihat berita yg ada di database serta memilih akan menghapus atau mengedit berita yang ada. Halaman kelola data buku tamu, kelola data kritik saran, serta kelola datauserhampir sama tampilannya dengan halaman kelola berita di atas.

21. Halamaneditberita

Gambar 4. 29 Halamaneditberita

Pada halamaneditberita,administratorhanya dapat merubah judul, isi serta gambar dari berita yang dimaksud. Waktu dan tanggal juga akan dirubah menyesuaikan kapan data tersebut diedit. Apabila ketika memasukkan berita ada kesalahan dalam menentukan gambar,

administratordapat melakukan replace gambar disini sehingga gambar yang lama di hapus dan diganti dengan gambar baru.

22. Halaman lihatpolling

Gambar 4. 30 Halaman lihatpolling

Di halaman lihat polling, Administrator dapat melihat pertanyaan

polling apa yang sedang polling ditampilkan dan juga hasilnya ditampilkan dengan grafik.

23. Halaman kelolapolling

Gambar 4. 31 Halaman kelolapolling

Halaman kelola polling dapat digunakan oleh administrator untuk mengelola polling yang sudah ada. Dengan memasukkan data pertanyaan dan jawaban yang baru, maka polling di situs web juga akan berubah.

Dokumen terkait