BAB IV
A
IMPLEMENTASI KARYA
AY
Pada bab ini penulis membahas tentang proses implementasi karya Desain Website Keyna Galeri dari proses perancangan yang dilakukan sebelumnya.
Implementasi karya ini meliputi 5 tahapan yaitu: Proses Desain Halaman Menu
AB
Utama, Proses Desain Halaman Administrator Site, Proses Desain Halaman
R
Galeri Karya, Proses Penciptaan Sistem Website dan Finishing.
4.1 Proses Desain Halaman Menu Utama
SU
Proses desain halaman Website merupakan tahapan penciptaan karya yang pertama. Di sini dilakukan implementasi atau penciptaan karya dari rancangan yang telah dibuat sebelumnya. Proses desain ini meliputi beberapa hal di
M
antaranya:
O
4.1.1 Desain Per Bagian Halaman Menu Utama Penerapan desain halaman menu utama mengacu pada navigasi website
IK
yang telah ditentukan dari bab sebelumnya. Dalam halaman menu utama terdapat
ST
beberapa bagian di antaranya: 1.
Bagian Header Dalam bagian header ini ditempatkan logo keyna galeri, tulisan keyna galeri dan alamatnya serta background coklat dengan tekstur bunga. Dipilihnya tekstur bunga sebagai background adalah untuk pencitraan keyna galeri
51
52
sebagai galeri yang menghasilkan karya seni pahat dan batik dengan corak
AY
A
bunga.
Gambar 4.1 Header Halaman Menu Utama
otomatis selama website itu dibuka.
AB
Tanggal dan penunjuk waktu pada gambar header di atas akan ter-update
Bagian Isi atau Tengah a.
Menu Statis
SU
2.
R
Penggunaan warna dalam header, yaitu: #af9274
Dalam bagian menu statis digunakan tabel yang terdiri dari 1 colomn dan 1 rows. Tabel tersebut berisi tentang Menu Utama, Profil Keyna, Album
M
Karya, Agenda, Download dan Kontak seperti yang terlihat pada gambar
ST
IK
O
4.2.
Gambar 4.2 Menu Statis Halaman Menu Utama
Penggunaan warna dalam menu statis, yaitu: #cccccc Menu Statis ini berisikan navigasi primer.
b.
Sub Menu Dalam sub menu ini digunakan tabel yang terdiri dari 1 colomn serta beberapa rows yang disesuaikan dengan berapa banyak menu yang ingin ditampilkan. Tabel tersebut berisi tentang Berita Keyna, Peraturan,
53
Pariwisata, Seni & Budaya, Pendidikan, Olahraga, Lain-lain dan Artikel
SU
R
AB
AY
A
seperti yang terlihat pada gambar 4.3.
M
Gambar 4.3 Sub Menu Halaman Menu Utama
O
Penggunaan warna dalam sub menu, yaitu: #a60326 Sub menu berisikan katagori dari berita yang ada di Keyna Galeri yang
ST
IK
di-posting-kan oleh admin website.
c.
Isi (Slideshow dan Accordion Tabs) Dalam bagian isi digunakan tabel yang terdiri dari 1 colomn serta beberapa rows yang disesuaikan dengan banyaknya katagori berita yang ingin ditampilkan. Tabel tersebut berisi tentang Berita Utama, Isi Berita Keyna Galeri dan Direktori Keyna Galeri seperti yang terlihat pada gambar 4.4.
ST
IK
O
M
SU
R
AB
AY
A
54
Gambar 4.4 Isi Halaman Menu Utama (Slideshow dan Accordion Tabs) Penggunaan warna dalam isi, yaitu: #af9274 Isi berisikan berita terkini dan katagori berita serta berapa kali berita itu dibaca. Di slideshow berita akan memberikan detail berita sesuai judul yang dipilih.
55
d.
Menu kanan Dalam bagian menu kanan digunakan tabel yang terdiri dari 1 colomn
A
dan 12 rows. Tabel tersebut berisi tentang Pencarian, Social Media,
ST
IK
O
M
SU
R
AB
AY
Agenda, Bank Data dan Polling seperti yang terlihat pada gambar 4.5.
Gambar 4.5 Menu Kanan Halaman Menu Utama Penggunaan warna dalam menu kanan, yaitu: #af9274
56
Menu kanan digunakan untuk memasang komponen-komponen yang mendukung website agar terkesan lebih dinamis. Seperti search button,
e.
A
social button, yahoo messenger, agenda, download dan polling. Footer
AY
Dalam bagian footer berisikan teks biasa yang berisikan copyright dari website ini dengan background tribal seperti yang terlihat pada gambar
SU
R
AB
4.6.
Gambar 4.6 Footer Halaman Menu Utama
M
Penggunaan warna dalam footer, yaitu: #af9274
O
4.1.2 Desain Utuh Halaman Menu Utama Dalam
halaman
menu
utama
tidak
banyak
terdapat
perbedaan
IK
pengaplikasian desain dengan halaman utama dan statis. Halaman-halaman menu
ST
lebih ditekankan sebagai halaman penjelasan dari setiap menu yang ada di website seperti yang terlihat pada gambar 4.7.
M
SU
R
AB
AY
A
57
Gambar 4.7 Tampilan Halaman Menu Utama
O
4.2 Proses Desain Halaman Administrator Site
IK
Proses desain halaman administrator site dilakukan setelah proses desain
halaman menu utama website selesai. Proses desain ini meliputi beberapa hal di
ST
antaranya:
4.2.1 Desain Halaman Login Admin Dalam bagian halaman login ini ditempatkan logo keyna galeri, tulisan keyna galeri dan alamatnya situsnya seperti yang terlihat pada gambar 4.8.
AY
A
58
Gambar 4.8 Tampilan Halaman Login Admin
AB
Di bagian tengah terdapat table yang terdiri dari 2 colomn dan 3 rows, gunanya untuk memasukkan username dan password.
R
4.2.2 Desain Halaman Admin Panel
Pembuatan halaman admin panel ini terdiri atas 2 bagian, yaitu bagian menu
SU
kiri dan bagian menu tengah. Pada bagian menu kiri diwakili oleh icon pada
ST
IK
O
M
menu tengah seperti yang terlihat pada gambar 4.9.
Gambar 4.9 Tampilan Halaman Admin Panel
59
Halaman ini merupakan halaman utama bagi admin side. Fungsinya untuk
A
meng-update berita dan karya yang dibuat oleh Keyna Galeri.
4.3 Proses Desain Halaman Galeri Karya
AY
Proses desain halaman galeri karya dilakukan setelah proses desain halaman administrator site selesai. Proses desain ini meliputi beberapa hal di antaranya:
AB
4.3.1 Desain Halaman Galeri Karya
Pada halaman ini karya yang ditampilkan sesuai dengan yang ada di Keyna Galeri. Pada gambar di bawah dapat dilihat tiap karya ditampikan
R
memanjang sebanyak 5 karya. Selebihnya secara otomatis akan berada d
ST
IK
O
M
SU
ibawah karya yang telah ada sebelumnya.
Gambar 4.10 Tampilan Halaman Galeri Karya Halaman di atas dapat dikelompokkan berdasarkan jenis karyanya. Dengan
hanya membuat album galeri di admin site.
60
4.3.2 Desain Halaman Keterangan Karya Pada halaman ini karya akan ditampilkan secara individu. Pada halaman ini
A
akan ditampilkan karya dengan ukuran lebih besar beserta informasi
SU
R
AB
AY
mengenai karya tersebut.
Gambar 4.11 Tampilan Halaman Keterangan Karya
Finishing
M
4.4
O
Ini adalah fase terakhir dalam sebuah rancang bangun website, pada tahapan ini adalah tahap publikasi atau extract file ke dalam sebuah winrar yang berformat
IK
rar. Hal ini bertujuan agar animasi atau aplikasi interaktif dapat digunakan di
ST
media komputer atau laptop, tanpa kendala perbedaan sistem operasi.
4.5 Publikasi Karya Pada publikasi karya ini berisi media publikasi seperti poster, cover CD dan
sampul CD yang berisikan konsep juga sketsa dari media publikasi.
61
Poster Publikasi
R
AB
AY
A
1.
SU
Gambar 4.12 Poster Publikasi Keyna Galeri Pada gambar 4.12 adalah poster website sebagai media publikasi, dengan format cetak A1. Dengan tampilan yang disesuaikan dengan tampilan website
Cover CD
ST
IK
O
2.
M
Keyna Galeri.
Gambar 4.13 Cover CD
62
Pada gambar 4.13 merupakan desain cover CD dengan penataan yang seimbang dan sederhana. Sampul CD
Gambar 4.14 Sampul CD
O
M
SU
R
AB
AY
A
3.
IK
Pada gambar 4.14 merupakan sampul untuk melindungi CD dengan
ST
komposisi yang menyesuaikan dengan poster sehingga informasi dari poster juga dapat tersampaikan pada sampul CD ini.
