BAB 4 RANCANGAN SISTEM YANG DIUSULKAN
4.
Perancangan Sistem
4.1
Tahap 4: Crafting the Customer Interface Dalam aplikasi e-marketing, perancangan layer (user interface) merupakan
bagian yang paling penting. Perancangan yang baik diperlukan untuk menarik minat pelanggan terutama karena interaksinya dilakukan secara online
dengan interaksi
screen-to-face. Aftress Gallery dalam melakukan perancangan situs web berpedoman pada 7 C’s framework. 1. Context Pada website Aftress ini terdapat dua unsur context yaitu fungsional dan estetika. o Function Sebuah perancangan situs web yang baik harus dapat menyajikan informasi yang dibutuhkan dan dapat memberikan kemudahan dalam penggunaaan navigasi pada tiap-tiap halamannya. Fungsi yang terdapat dalam situs web ini adalah:
Section breakdown Pada bagian atas setiap halaman situs terdapat menu Halaman Depan, Profil, Pemesanan, Hubungi Kami. Sedangkan pada bagian kiri dari setiap halaman situs menampilkan Produk berdasarkan kategorinya, Info Terbaru dan Total Pengunjung,dan koneksi ke
95 Google . Kolom bagian kanan menampilkan fungsi Search untuk pencarian produk, Keranjang Belanja untuk menampilkan total item yang dipesan, Kata Pelanggan, Pooling, dan Beritahu Kami. Di bagian bawah terdapat tahun pembuatan website.
Linking structure Fungsi ini menjelaskan bagaimana bagian dari setiap situs web dihubungkan. Jika user masuk ke suatu halaman situs, maka fungsi ini memungkinkan agar user dapat kembali dengan mudah ke halaman sebelumnya.
Navigation Tools Navigation Tools yang ada dalam situs Aftrees Gallery adalah fitur searching untuk mempermudah dalam pencarian produk.
o Aesthetics (Estetika) Situs web ini menggunakan warna coklat dan orange sebagai warna dominan. Jenis huruf yang dipakai adalah Arial, Helvetica, Sans serif dan untuk logo memakai font Vivaldi untuk memberikan kesan seni dalam situs Aftress Gallery. 2. Content Content menfokuskan pada empat unsur, yaitu: •
Offering Mix Offering Mix pada Aftress Gallery berfokus pada kategori produk yang terbagi atas batik pria, wanita, kain batik, kebaya, asesoris. Selain itu pengunjung website juga dapat melihat deskripsi item pada halaman produk untuk memberikan gambaran jelas pada konsumen.
96 •
Appeal Mix Appeal Mix menfokuskan pada promosi-promosi yang dikeluarkan melalui situs seperti produk terlaris maupun produk terbaru. Namun Aftrees Gallery belum menerapakan hal tersebut.
•
Multimedia Mix Unsur Multimedia Mix pada website ini adalah gambar dan teks untuk membuat tampilan lebih menarik dan menambah nilai estetika.
•
Content type Content pada website ini termasuk informasi aktual mengenai produk batik, berita,dan kegiatan yang dilakukan Aftrees Gallery. Informasi akan selalu diupdate sesuai kebutuhan sehingga pengunjung dapat selalu mendapatkan informasi yang up-to-date.
3. Community Melalui Testimonial( Kata Pelanggan), pengunjung dapat berbagi pengalaman mengenai produk maupun layanan yang didapatkan dari Aftrees Gallery. Dengan cara ini pengunjung merasa senang karena pendapatnya dapat dilihat oleh orang lain. 4. Customization Customization pada situs web ini terlihat pada adanya fungsi search yang menampilkan hasil pencarian sesuai masukkan dari pengunjung. 5. Communication Communication pada website ini terlihat dengan adanya komunikasi antara perusahaan dengan pelaggan yaitu melalui:
97 o Menu Hubungi Kami yang mencakup telepon, faksimile, dan e-mail. o Hasil Pooling untuk menampilkan voting pengunjung Aftrees Gallery. 6. Connection Connection pada website ini hanya terhubung dengan Google. 7. Commerce Dimensi dari sisi commerce berupa adanya pemesanan produk yang dapat dilakukan dengan mengklik produk yang ingin dipesan untuk ke dalam Keranjang Belanja untuk ditampung dan dijumlah. 4.2
Rancangan Layar
4.2.1
Rancangan Layar User
¾ Halaman Depan •
Halaman ini mencakup elemen context dan content
•
Halaman ini merupakan interface yang pertama kali dilihat oleh pengunjung yang mengunjungi website Aftrees Gallery. Pada halaman ini terdapat penawaran untuk setiap pengunjung yang mengakses website Aftrees Gallery untuk menjadi member. Pengunjung yang ingin menjadi member bisa mengklik kata”klik di sini”, maka akan langsung terhubung dengan halaman baru untuk mengisi data pribadinya.
98
Gambar 4.1 Rancangan Layar Halaman Depan
¾ Halaman Daftar Pelanggan •
Halaman ini mencakup context dan content
•
Halaman ini merupakan halaman bagi pengunjung untuk mendaftarkan diri untuk menjadi member dari website Aftrees Gallery.
99
Gambar 4.2 Rancangan Layar Pendaftaran Pelanggan
¾ Halaman Pendaftaran untuk Pesanan •
Halaman ini mencakup context, dan content.
•
Halaman merupakan halaman pendaftaran bagi pengunjung yang ingin melakukan pemesanan secara online. Bagi mereka yang belum menjadi member harus mendaftarkan diri terlebih dahulu dengan mengisi datadata pribadi mereka. Tapi bagi mereka yang sudah menjadi member hanya perlu Login dengan memasukkan username dan password mereka.
100
Gambar 4.3 Rancangan Layar Pendaftaran Untuk Pemesanan
¾ Halaman Keranjang Belanja •
Halaman ini mencakup content, context, dan commerce.
•
Halaman ini berisi daftar belanjaan member. Pada halaman ini ditampilkan secara detil produk yang ingin dibelanjakan seperti gambar, nama, jumlah, keterangan. Selain itu ada fungsi hapus jika ingin membatalkan belanjaan.
101
Gambar 4.4 Rancangan Layar Keranjang Belanja ¾ Halaman Profil •
Halaman ini mencakup elemen context, dan content.
•
Halaman ini merupakan halaman yang berisi tentang gambaran umum tentang usaha yang dijalankan oleh perusahaan Aftrees Gallery.
102
Gambar 4.5 Rancangan Layar Profil ¾ Halaman Pemesanan •
Halaman ini mencakup elemen context dan content
•
Halaman ini berisi informasi mengenai cara-cara pemesanan yang bisa dilakukan baik menghubungi langsung pihak Aftrees Gallery maupun dengan cara online, juga syarat dan ketentuan dari pemesanan secara online.
103
Gambar 4.6 Rancangan Layar Pemesanan ¾ Halaman Hubungi Kami •
Halaman ini mencakup elemen context, content dan communication
•
Halaman ini berisi informasi mengenai Aftrees Gallery, yang mencakup alamat kantor pusat, galeri, showroom; nomor telepon yang bisa dihubungi, faksimile dan e-mail. Informasi yang ditampilkan merupakan bentuk komunikasi perusahaan dengan pelanggannya.
104
Gambar 4.7 Rancangan Layar Hubungi Kami ¾ Halaman Produk •
Halamam ini mencakup elemen content, context, dan commerce.
•
Halaman ini akan tampil jika pengunjung memilih salah satu kategori produk. Halaman ini berisi informasi secara detail mengenai produk yang dipilih oleh pengunjung.
105
Gambar 4.8 Rancangan Layar Produk
106 ¾ Halaman Hasil Pencarian •
Halaman ini mencakup content, context, dan customization.
•
Halaman ini merupakan halaman hasil pencarian produk berdasarkan kategori bahan.
Gambar 4.9 Rancangan Layar Hasil Pencarian
¾ Halaman Info •
Halamam ini mencakup elemen content dan context.
107 •
Halaman ini berisi informasi-informasi terbaru dari Aftrees Gallery seperti tips- terbaru, acara pameran yang diadakan, dan lain sebagainya.
Gambar 4.10 Rancangan Layar Info ¾ Halaman Kata Pelanggan •
Halaman ini mencakup elemen context dan communication.
•
Halaman ini berisi tanggapan pengunjung terhadap produk dan layanan yang diterima dari Aftrees Gallery. Melalui fasilitas ini pendapat dari pelanggan yang telah menggunakan produk Aftrees Gallery dapat
108 ditampung, walaupun interaksinya tidak secara langsung tapi pelanggan merasa dihargai karena tanggapan mereka didengar.
Gambar 4.11 Rancangan Layar Kata Pelanggan ¾ Halaman Hasil Pooling •
Halaman ini mencakup halaman context dan communication.
•
Halaman ini adalah tampilan dari hasil voting pengunjung yang telah diakumulasi dengan total hasil voting sebelumnya.
109
Gambar 4.12 Rancangan Layar Pooling
¾ Halaman Beritahu Teman •
Halaman ini mencakup elemen context dan communication
•
Halaman ini adalah halaman untuk meferensikan website Aftrees Gallery kepada orang lain.
110
Gambar 4.13 Rancangan Layar Beritahu Teman 4.2.2
Rancangan Layar Admin
¾ Halaman Login Admin •
Halaman ini mencakup halaman context.
•
Halaman Login merupakan halaman login bagi Administrator.
111
Gambar 4.14 Rancangan Layar Login Admin ¾ Halaman Home Admin •
Halaman ini mencakup elemen context dan content.
•
Halaman ini berisi semua management site yang dapat dikontrol oleh admin.
Gambar 4.15 Rancangan Layar Home Admin ¾ Halaman Kata Pelanggan Admin Æ Halaman ini memungkinkan Admin harus melakukan
approval
bagi
testimoni yang akan ditampilkan. Admin juga dapat melakukan fungsi hapus terhadap testimoni pelanggan.
112
Gambar 4.16 Rancangan Layar Kata Pelanggan Admin
¾ Halaman Produk Admin •
Halaman ini berisi database produk yang dimiliki Aftrees Gallery
•
Pada halaman ini, Admin dapat melakukan fungsi tambah, ubah, dan hapus pada produk. Melalui fasilitas ini, admin dapat terus mengupdate data-data produk sehingga memberikan informasi terkini kepada pelanggannya.
