PERANCANGAN ULANG WEBSITE PT. COSMAR
EDISI KEDUA TAHUN 2010 – 2011
SKRIPSI APLIKATIF
Disusun Untuk Memenuhi Persyaratan Dalam Memperoleh Gelar Sarjana Strata Satu (S1) Fakultas Ilmu Komunikasi
Disusun Oleh : Riskawati 44408010020
Visual and Art Communication
UNIVERSITAS MERCU BUANA
FAKULTAS ILMU KOMUNIKASI
JAKARTA
2013
vi
KATA PENGANTAR
Alhamdulillaah segala puji syukur kehadirat Allah SWT yang telah memberikan nikmat dan hidayah-Nya kepada penulis, sehingga penulis dapat menyelesaikan penyusunan Skripsi Aplikatif ini dengan baik. Skripsi Aplikatif ini disusun dengan judul “PERANCANGAN ULANG WEBSITE PT. COSMAR
EDISI KEDUA TAHUN 2010 – 2011”.
Skripsi aplikatif ini dibuat sebagai salah satu persyaratan dalam menyelesaikan program Strata Satu (S-1) jurusan Visual and Art Communication di Universitas Mercu Buana.
Di samping itu penulis juga tidak lupa mengucapkan terima kasih yang sebesar - besarnya kepada semua pihak yang telah membantu serta memberikan dukungan kepada penulis, terutama kepada :
1. Bapak Agus Nursidhi, S.Pd. selaku pembimbing I Skripsi Aplikatif yang sudah memberikan arahan, masukan, ide, sehingga tercipta karya ini dengan sempurna.
2. Ibu Ety Sujanti, S.Sos. selaku pembimbing II Skripsi Aplikatif yang sudah banyak memberi ilmu banyak tentang penulisan dan ilmu komunikasi. 3. Ibu Dr. Agustina Zubair, M.Si. selaku Dekan Fakultas Ilmu Komunikasi
Universitas Mercu Buana, Jakarta.
4. Bapak A. Rahman, Drs., M.Si. selaku wakil Dekan Fakultas Ilmu Komunikasi Universitas Mercu Buana, Jakarta.
vii
5. Bapak Dr. Ahmad Mulyana, M.Si. selaku Ketua Jurusan Visual and Art Communication, Universitas Mercu Buana, Jakarta.
6. Ibu Bayyinah Nurulhaq, S.Sn. selaku pembimbing kelas Seminar Visual Project, yang telah membimbing dan membuka jalan dengan tema tersebut sehingga dapat mencapai hasil saat ini.
7. Ibu Juanita Aditiawan, M.BA. selaku pemilik perusahaan PT. Cosmar yang telah menerima kehadiran saya dengan lapang dada.
8. Ibu Lilis, selaku pembimbing saya di PT. Cosmar, sehingga saya mendapatkan informasi yang lengkap tentang website PT. Cosmar.
9. Ibu Ira Purwitasari, M.Ikom. selaku dosen yang ikut memberi masukan terhadap skripsi ini.
10. Bapak Cahyoko Triharsatmo, S.Ds. selaku dosen yang memberi ilmu tentang design website pada penulis.
11. Kedua Orang Tua, Bapak Sunarso dan Ibu Kuswati dan segenap keluarga besar penulis yang telah memberi semangat, dukungan, serta perhatiannya terhadap penulis baik dalam bentuk moril ataupun materil.
12. Seluruh Dosen pengajar Visual and Art Communication dari semester satu hingga semester akhir yang telah memberikan ilmu yang sangat berharga bagi
penulis.
13. Seluruh Staff TU UMB Fikom, terutama Mbak Lila yang turut membantu dalam surat – surat keperluan penulis hingga akhir masa studi.
14. Sebuah nama yang selalu setia memberi semangat, kasih sayang dan perhatiannya pada penulis untuk menyelesaikan Skripsi Aplikatif ini, serta
viii
terima kasih telah mendampingi penulis dalam berbagai situasi dan kondisi apapun. Terima kasih Yudisthira Baruno Guntoro.
15. Abid dan Koi yang telah setia membantu menyisihkan waktu, ilmu, inspirasi dan tempat untuk kelancaran skripsi ini. Shushu, Nyunyun, Woro, Ibnu, Yoekha yang setia memberi semangat dan berbagi ide untuk skripsi ini. Hendri yang membantu menemani penulis di perpustakaan. Ayu dan Koyo dengan billboard uniknya untuk penulis di akhir masa skripsi ini.
16. Seluruh teman – teman seperjuangan Komvis Squad 2008 yang tidak bisa disebut satu – persatu namanya yang ikut membantu kelancaran penulis untuk melengkapi Skripsi Aplikatif ini, untuk para senior dan adik-adik yang juga banyak membantu memberikan banyak inspirasi, pengarahan dan perhatiannya terhadap project ini. Terima kasih.
Di dalam penyusunan Skripsi Aplikatif ini, penulis menyadari masih banyak terdapat kekurangan - kekurangan, untuk itu segala kritik dan saran yang bersifat membangun sangat penulis harapkan demi kesempurnaan Skripsi Aplikatif ini. Demikian kata pengantar penulis, dengan harapan, Skripsi Aplikatif ini berguna untuk semua orang yang membutuhkannya.
Wassallam,
ix
DAFTAR ISI
LEMBAR PERSETUJUAN SKRIPSI APLIKATIF ... ii
TANDA LULUS SIDANG SKRIPSI APLIKATIF ... iii
PENGESAHAN DAN PERBAIKAN SKRIPSI APLIKATIF ... iv
ABSTRAKSI ... v
KATA PENGANTAR ... vi
DAFTAR ISI ... ix
DAFTAR GAMBAR ... xiii
DAFTAR BAGAN ... xv DAFTAR TABEL ... xv BAB I PENDAHULUAN 1.1 Latar Belakang ... 1 1.2 Rumusan Masalah ... 6 1.3 Tujuan Perancangan ... 6 1.4 Fokus Penelitian ... 6 1.5 Manfaat Penelitian ... 7
BAB II KAJIAN TEORI 2.1 Ilmu Komunikasi ... 9
2.2 Komunikasi Visual ... 11
2.2.1 Komponen Komunikasi Visual ... 12
x b. Bentuk (Shape) ... 13 c. Warna ... 14 d. Tekstur ... 15 e. Ukuran ... 15 f. Huruf/Tipografi ... 15 g. Ruang (Space) ... 16
2.2.2 Komunikasi Visual Dalam Pemaknaan ... 16
2.3 Media Baru (New Media) ... 18
2.4 Website ... 21
1) Website Statis ... 21
2) Website Dinamis ... 21
2.4.1 Keunggulan Website ... 22
2.4.2 Desain Web ... 23
2.4.3 Desain Website yang Baik ... 24
a. Penggunaan Warna yang Tepat ... 26
b. Teks yang Mudah Dibaca ... 26
c. Desain Visual yang Harmonis ... 27
d. Layout yang Simpel ... 28
e. Alur yang Mudah Dimengerti ... 29
f. Menu Navigasi yang Jelas ... 30
2.5 Website Sebagai Media Promosi ... 32
2.5.1 Strategi Pemasaran ... 34
2.6 Gaya Pesan ... 35
xi
2.7.1 PT. Cosmar ... 38
2.7.2 Desain Website PT. Cosmar Edisi Kedua ... 43
BAB III STRATEGI PERANCANGAN DAN KONSEP VISUAL 3.1 Tujuan Komunikasi ... 50 3.1.1 Strategi Komunikasi ... 50 3.1.2 Positioning ... 52 3.1.3 Audience ... 53 3.1.4 Pesan Utama ... 54 3.1.5 Materi Pesan ... 54 3.1.6 Pendekatan Bahasa ... 55 3.2 Strategi Kreatif ... 55 3.2.1 Pendekatan Kreatif ... 55 3.2.2 Konsep Visual ... 56 3.3 Strategi Media ... 58 3.3.1 Pemilihan Media ... 59
1) Media Lini Atas ... 61
2) Media Lini Bawah ... 61
3.3.2 Penyebaran Media ... 62
3.4 Strategi Perancangan ... 63
3.4.1 Media Utama ... 63
3.4.2 Media Pendukung ... 68
3.5 Anggaran Biaya ... 70
xii
3.5.2 Anggaran Biaya Media Pendukung ... 71
BAB IV TEKNIS PRODUKSI MEDIA 4.1 Pra Produksi ... 74 4.1.1 Hasil Wawancara ... 74 4.1.2 Hasil Observasi ... 77 4.1.3 Referensi ... 81 4.1.4 Konsep ... 81 4.1.5 Site Plan ... 83 4.16 Storyboard ... 85 4.2 Produksi ... 90 4.2.1 Tahapan Produksi ... 90 4.3 Pasca Produksi ... 97
4.3.1 Proses Teknis Produksi Media Utama Website ... 98
4.3.2 Proses Teknis Produksi Media Pendukung ... 100
BAB V KESIMPULAN DAN SARAN 5.1 Kesimpulan ... 110
5.2 Saran ... 111
DAFTAR PUSTAKA LAMPIRAN
xiii
DAFTAR GAMBAR
Gambar 2.1 Macam – Macam Garis ... 13
Gambar 2.2 Jenis Warna ... 14
Gambar 2.3 Lingkaran Warna ... 14
Gambar 2.4 Anatomi Huruf ... 16
Gambar 2.5 Good Website ... 25
Gambar 2.6 Tampilan Website Personal ... 25
Gambar 2.7 Tampilan Website Sesuai Target ... 26
Gambar 2.8 Penggunaan Warna yang Tepat ... 26
Gambar 2.9 Desain Visual yang Harmonis ... 27
Gambar 2.10 Layout yang Simpel ... 28
Gambar 2.11 Alur yang Mudah ... 29
Gambar 2.12 Menu Navigasi yang Jelas ... 30
Gambar 2.13 Peta Lokasi PT. Cosmar ... 40
Gambar 2.14 Logo PT. Cosmar ... 41
Gambar 2.15 Halaman Opening ... 44
Gambar 2.16 Halaman Welcome ... 45
Gambar 2.17 Halaman Products ... 46
Gambar 2.18 Halaman Services ... 47
Gambar 2.19 Halaman People ... 47
Gambar 2.20 Halaman Contact ... 48
Gambar 3.1 Warna ... 67
Gambar 4.1 Storyboard Layout Home ... 84
xiv
Gambar 4.3 Storyboard Layout Services ... 86
Gambar 4.4 Storyboard Layout Products ... 87
Gambar 4.5 Storyboard Layout News ... 88
Gambar 4.6 Storyboard Layout Contact Us ... 89
Gambar 4.7 Design Banner Halaman ... 90
Gambar 4.8 Layout Home ... 91
Gambar 4.9 Layout Company ... 92
Gambar 4.10 Layout Services ... 93
Gambar 4.11 Layout Products ... 95
Gambar 4.12 Layout News ... 96
Gambar 4.13 Layout Contact Us ... 97
Gambar 4.14 Iklan Koran ... 101
Gambar 4.15 Penerapan Iklan Koran ... 101
Gambar 4.16 Iklan Majalah ... 102
Gambar 4.17 Penerapan Iklan Majalah ... 102
Gambar 4.18 Iklan Billboard ... 103
Gambar 4.19 Flyer ... 103
Gambar 4.20 Kartu Nama ... 104
Gambar 4.21 Pulpen ... 105
Gambar 4.22 Mug ... 105
Gambar 4.23 Amplop ... 106
Gambar 4.24 Banner Pameran ... 107
Gambar 4.25 ID Card ... 108
xv
DAFTAR BAGAN
Bagan 2.1 Formula Lasswell ... 10
Bagan 2.2 Struktur Organisasi ... 42
Bagan 2.3 Sitemap Website PT. Cosmar Edisi Kedua ... 44
Bagan 3.1 Pemilihan Media Utama dan Pendukung ... 60
Bagan 4.1 Proses Desain Website PT. Cosmar Edisi Kedua ... 75
Bagan 4.2 Site Map Re-Design Website PT. Cosmar ... 83