51

BAB IV

IMPLEMENTASI KARYA

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

Utama, Proses Desain Halaman Administrator Site, Proses Desain Halaman

Galeri Karya, Proses Penciptaan Sistem Website dan Finishing.

4.1 Proses Desain Halaman Menu Utama

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

antaranya:

4.1.1 Desain Per Bagian Halaman Menu Utama

Penerapan desain halaman menu utama mengacu pada navigasi website

yang telah ditentukan dari bab sebelumnya. Dalam halaman menu utama terdapat

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

STIKOM S

URABAYA

52

sebagai galeri yang menghasilkan karya seni pahat dan batik dengan corak

bunga.

Gambar 4.1 Header Halaman Menu Utama

Tanggal dan penunjuk waktu pada gambar header di atas akan ter-update

otomatis selama website itu dibuka.

Penggunaan warna dalam header, yaitu: #af9274

2. Bagian Isi atau Tengah

a. Menu Statis

Dalam bagian menu statis digunakan tabel yang terdiri dari 1 colomn dan

1 rows. Tabel tersebut berisi tentang Menu Utama, Profil Keyna, Album

Karya, Agenda, Download dan Kontak seperti yang terlihat pada gambar

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,

STIKOM S

URABAYA

53

Pariwisata, Seni & Budaya, Pendidikan, Olahraga, Lain-lain dan Artikel

seperti yang terlihat pada gambar 4.3.

Gambar 4.3 Sub Menu Halaman Menu Utama

Penggunaan warna dalam sub menu, yaitu: #a60326

Sub menu berisikan katagori dari berita yang ada di Keyna Galeri yang

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.

STIKOM S

URABAYA

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.

STIKOM S

URABAYA

55

d. Menu kanan

Dalam bagian menu kanan digunakan tabel yang terdiri dari 1 colomn

dan 12 rows. Tabel tersebut berisi tentang Pencarian, Social Media,

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 STIKOM S

URABAYA

56

Menu kanan digunakan untuk memasang komponen-komponen yang

mendukung website agar terkesan lebih dinamis. Seperti search button,

social button, yahoo messenger, agenda, download dan polling.

e. Footer

Dalam bagian footer berisikan teks biasa yang berisikan copyright dari

website ini dengan background tribal seperti yang terlihat pada gambar

4.6.

Gambar 4.6 Footer Halaman Menu Utama

Penggunaan warna dalam footer, yaitu: #af9274

4.1.2 Desain Utuh Halaman Menu Utama

Dalam halaman menu utama tidak banyak terdapat perbedaan

pengaplikasian desain dengan halaman utama dan statis. Halaman-halaman menu

lebih ditekankan sebagai halaman penjelasan dari setiap menu yang ada di website

seperti yang terlihat pada gambar 4.7.

STIKOM S

URABAYA

57

Gambar 4.7 Tampilan Halaman Menu Utama

4.2 Proses Desain Halaman Administrator Site

Proses desain halaman administrator site dilakukan setelah proses desain

halaman menu utama website selesai. Proses desain ini meliputi beberapa hal di

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.

STIKOM S

URABAYA

58

Gambar 4.8 Tampilan Halaman Login Admin

Di bagian tengah terdapat table yang terdiri dari 2 colomn dan 3 rows,

gunanya untuk memasukkan username dan password.

4.2.2 Desain Halaman Admin Panel

Pembuatan halaman admin panel ini terdiri atas 2 bagian, yaitu bagian menu

kiri dan bagian menu tengah. Pada bagian menu kiri diwakili oleh icon pada

menu tengah seperti yang terlihat pada gambar 4.9.

Gambar 4.9 Tampilan Halaman Admin Panel

STIKOM S

URABAYA

59

Halaman ini merupakan halaman utama bagi admin side. Fungsinya untuk

meng-update berita dan karya yang dibuat oleh Keyna Galeri.

4.3 Proses Desain Halaman Galeri Karya

Proses desain halaman galeri karya dilakukan setelah proses desain halaman

administrator site selesai. Proses desain ini meliputi beberapa hal di antaranya:

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

memanjang sebanyak 5 karya. Selebihnya secara otomatis akan berada d

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.

STIKOM S

URABAYA

60

4.3.2 Desain Halaman Keterangan Karya

Pada halaman ini karya akan ditampilkan secara individu. Pada halaman ini

akan ditampilkan karya dengan ukuran lebih besar beserta informasi

mengenai karya tersebut.

Gambar 4.11 Tampilan Halaman Keterangan Karya

4.4 Finishing

Ini adalah fase terakhir dalam sebuah rancang bangun website, pada tahapan

ini adalah tahap publikasi atau extract file ke dalam sebuah winrar yang berformat

rar. Hal ini bertujuan agar animasi atau aplikasi interaktif dapat digunakan di

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.

STIKOM S

URABAYA

61

1. Poster Publikasi

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

Keyna Galeri.

2. Cover CD

Gambar 4.13 Cover CD

STIKOM S

URABAYA

62

Pada gambar 4.13 merupakan desain cover CD dengan penataan yang

seimbang dan sederhana.

3. Sampul CD

Gambar 4.14 Sampul CD

Pada gambar 4.14 merupakan sampul untuk melindungi CD dengan

komposisi yang menyesuaikan dengan poster sehingga informasi dari poster juga

dapat tersampaikan pada sampul CD ini.

STIK

OM SURABAYA