BAB 3 ANALISIS DAN PERANCANGAN SISTEM
3.2 Perancangan Sistem
3.2.4 Perancangan Antar Muka
3.2.4.4 Perancangan Antar Muka Marketing
Perancangan Antarmuka Marketing merupakan tampilan yang ditujukan bagi user yang telah melakukan login level marketing. Perancangan antarmuka untuk level marketing dapat dilihat pada gambar 3.40 sampai 3.47.
T04
Kode Tampilan : T04
Nama Tampilan : Halaman Beranda Marketing Ukuran : 1024 x 768
Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da aka tetap pada halaman T04
· Klik Reko e dasi Produk untuk menuju ke halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16 Logo Selamat datang
Seruni Merdeka Foto © 2016 Selamat Datang Marketing Seruni Merdeka Foto
Username
Beranda Rekomendasi Produk
Produk Promosi
Gambar 3.40 Perancangan Antarmuka Beranda Marketing
T18
Kode Tampilan : T18
Nama Tampilan : Halaman Rekomendasi Produk Ukuran : 1024 x 768
Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk akan tetap di halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik icon tempat sampah akan menampilkan pesan P08
· Klik ta ah siste aka merefresh tabel rekomendasi produk Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Detail aaaaaaaaaaaaaaa Aksi Tambah Rekomendasi Produk {Family} → {Album}
T19
Kode Tampilan : T19
Nama Tampilan : Halaman Produk Ukuran : 1024 x 768 Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk akan tetap di halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik Ta ah u tuk menuju ke halaman T20
· Klik icon pensil untuk menuju ke halaman T21
· Klik icon tempat sampah akan menampilkan pesan P08
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Show entries
No Nama Produk Jenis Harga Aksi 1 Family 1 Paket Photo Studio 1.104.000
Tambah
Gambar 3.42 Perancangan Antarmuka Produk
T20
Kode Tampilan : T20
Nama Tampilan : Halaman Tambah Produk Ukuran : 1024 x 768
Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk akan tetap di halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik Batal u tuk e uju ke halaman T19
· Klik “i pa u tuk menyimpan data dan menampilkan pesan P09
· Jika ada form yang tidak diisi akan menampilkan pesan P07
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Nama Jenis Harga Batal Simpan
T21
Kode Tampilan : T21
Nama Tampilan : Halaman Ubah Produk Ukuran : 1024 x 768 Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk untuk menuju ke halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik Batal u tuk e uju ke halaman T19
· Klik U ah u tuk menyimpan data dan menampilkan pesan P10
· Jika ada form yang tidak diisi akan menampilkan pesan P07
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Nama Jenis Harga Batal Ubah
Gambar 3.44 Perancangan Antarmuka Ubah Produk
T22
Kode Tampilan : T22
Nama Tampilan : Halaman Promosi Ukuran : 1024 x 768 Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk untuk menuju ke halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi aka tetap di halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik Ta ah u tuk menuju ke halaman T23
· Klik icon pensil untuk menuju ke halaman T24
· Klik icon tempat sampah akan menampilkan pesan P08
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Show entries
No Promosi Detail Harga Aksi
1 Digital 5R isi 5 Diskon 50% untuk pembelian ke 2 60.000
Tambah
T23
Kode Tampilan : T23
Nama Tampilan : Halaman Tambah Promosi Ukuran : 1024 x 768
Font : Calibri Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk menuju ke halaman T04
· Klik Reko e dasi Produk untuk menuju ke halaman T18
· Klik Produk u tuk e uju ke halaman T19
· Klik Pro osi u tuk menuju ke halaman T22
· Klik User a e u tuk menuju ke halaman T16
· Klik Batal u tuk e uju ke halaman T22
· Klik “i pa u tuk menyimpan data dan menampilkan pesan P09
· Jika ada form yang tidak diisi akan menampilkan pesan P07
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Promosi Detail Harga Batal Simpan
Gambar 3.46 Perancangan Antarmuka Tambah Promosi
T24
Kode Tampilan : T24
Nama Tampilan : Halaman Ubah Promosi
Ukuran : 1024 x 768
Font : Calibri
Ukuran Font : 12pt
Warna Background : Hitam, putih, merah
Keterangan Navigasi
· Klik Bera da u tuk
menuju ke halaman T04
· Klik Reko e dasi Produk
untuk menuju ke halaman T18
· Klik Produk u tuk e uju
ke halaman T19
· Klik Pro osi u tuk
menuju ke halaman T22
· Klik User a e u tuk
menuju ke halaman T16
· Klik Batal u tuk e uju
ke halaman T22
· Klik U ah u tuk
menyimpan data dan
menampilkan pesan P10
· Jika ada form yang tidak diisi akan menampilkan pesan P07
Logo Selamat datang
Seruni Merdeka Foto © 2016
Username Beranda Rekomendasi Produk Produk Promosi Promosi Detail Harga Batal Ubah
Gambar 3.47 Perancangan Antarmuka Ubah Promosi