Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/2224/1/HALAMAN AWAL.pdf ·...
Transcript of Lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/2224/1/HALAMAN AWAL.pdf ·...
Team project ©2017 Dony Pratidana S. Hum | Bima Agus Setyawan S. IIP
Hak cipta dan penggunaan kembali:
Lisensi ini mengizinkan setiap orang untuk menggubah, memperbaiki, dan membuat ciptaan turunan bukan untuk kepentingan komersial, selama anda mencantumkan nama penulis dan melisensikan ciptaan turunan dengan syarat yang serupa dengan ciptaan asli.
Copyright and reuse:
This license lets you remix, tweak, and build upon work non-commercially, as long as you credit the origin creator and license it on your new creations under the identical terms.
i
PERANCANGAN WEBSITE
LITTLE TEACUP
Laporan Tugas Akhir
Ditulis sebagai syarat untuk memperoleh gelar Sarjana Seni (S.Sn)
Nama : Andrian
NIM : 10120210189
Program Studi : Desain Komunikasi Visual
Fakultas : Seni & Desain
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2014
Perancangan Website ..., Andrian, FSD UMN, 2014
i
HALAMAN PENGESAHAN TUGAS AKHIR
PERANCANGAN WEBSITE LITTLE TEACUP
Oleh
Nama : Andrian
NIM : 10120210189
Program Studi : Desain Komunikasi Visual
Fakultas : Seni & Desain
Tangerang, 28 Agustus 2014
Ketua Program Studi
Desi Dwi Kristanto, M.Ds.
Penguji
Ferdy Tanumihardjo, S.Sn., M.Ds.
Ketua Sidang
Erwin Alfian, S.Sn., M.Ds.
Pembimbing
Mohammad Rizaldi, S.T., M.Ds.
Perancangan Website ..., Andrian, FSD UMN, 2014
ii
LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT
Saya yang bertanda tangan di bawah ini:
Nama : Andrian
NIM : 10120210189
Program Sudi : Desain Komunikasi Visual
Fakultas : Seni & Desain
Universitas Multimedia Nusantara
Judul Tugas Akhir/Skripsi:
PERANCANGAN WEBSITE LITTLE TEACUP
dengan ini menyatakan bahwa, laporan dan karya tugas akhir ini adalah asli dan
belum pernah diajukan untuk mendapatkan gelar sarjana, baik di Universitas
Multimedia Nusantara maupun di perguruan tinggi lainnya.
Karya tulis ini bukan saduran/terjemahan, murni gagasan, rumusan dan
pelaksanan penelitian/implementasi saya sendiri, tanpa bantuan pihak lain, kecuali
arahan pembimbing akademik dan nara sumber.
Demikian surat Pernyataan Originalitas ini saya buat dengan sebenarnya, apabila
di kemudian hari terdapat penyimpangan serta ketidakbenaran dalam pernyataan
ini, maka saya bersedia menerima sanksi akademik berupa pencabutan
Perancangan Website ..., Andrian, FSD UMN, 2014
ii
gelar (S.Sn.) yang telah diperoleh, serta sanksi lainnya sesuai dengan
norma yang berlaku di Universitas Multimedia Nusantara.
Tangerang, 28 Agustus 2014
Andrian
Perancangan Website ..., Andrian, FSD UMN, 2014
iii
KATA PENGANTAR
Penulis sangat bersyukur karena dapat membuat sebuah Tugas Akhir dari
perkuliahan di Universitas Multimedia Nusantara yang bertemakan tentang
perancangan website Little Teacup. Penulis sangat tertarik dengan tema ini
karena penulis mengenal pemiliknya dan keunikan dari bisnis fotografi yang
dijalankannya tersebut. Little Teacup memiliki keunikan utama yaitu melalui
produknya yang bernama Baby’s Moonshine.
Keunikan yang dimiliki oleh Little Teacup patut dipromosikan dan
diketahui oleh orang-orang, terutama target dari Little Teacup. Penulis
berharap Tugas Akhir ini dapat dilihat oleh para peminat dan calon pengguna
dari jasa fotografi bayi dan kehamilan tersebut agar orang-orang diluar sana
yang belum mengetahui dapat mengenal dan mencoba menikmati jasa
fotografi yang cukup unik ini.
Penulis banyak belajar dan mengenal selama pembuatan Tugas Akhir ini
mengenai teknik-teknik pembuatan website dan mengenal lebih lanjut
mengenai makna dari media. Selain itu penulis juga dapat semakin mengenal
dan mengeksplorasi mengenai bidang fotografi dari pemilik Little Teacup.
Tidak lupa juga penulis mengucapkan banyak terima kasih kepada Bapak Desi
Dwi Kristanto, S.Ds., M.Ds. selaku Ketua Program Studi Desain Komunikasi
Visual Universitas Multimedia Nusantara, Bapak Mohammad Rizaldi, S.T.,
M.Ds. selaku Dosen Pembimbing, Agnes Larasati selaku pemilik dari Little
Teacup dan narasumber utama bagi penulis, Alm. Ayah, Ibu, dan Kakak
Perancangan Website ..., Andrian, FSD UMN, 2014
iv
kandung saya yang turut serta membantu saya dalam menyelesaikan Tugas
Akhir ini.
Tangerang, 28 Agustus 2014
Andrian
Perancangan Website ..., Andrian, FSD UMN, 2014
v
ABSTRAKSI
Semakin berkembangnya bisnis jasa fotografi saat ini memberikan peluang yang
cukup besar untuk dijadikan sumber mata pencaharian utama. Hal ini didukung
pula oleh berkembangnya kualitas dari para pendiri jasa fotografi di Indonesia dan
banyak juga yang sudah diakui di dunia internasional. Sebuah perusahaan jasa
fotografi bayi yang bernama Little Teacup akhirnya berdiri pada tahun 2009.
Karena baru adanya strategi dan media promosi yang dijalankan melalui media
sosial facebook dan Instagram saja sebelumnya, maka Little Teacup
membutuhkan website agar dapat diperkenalkan dan menarik para calon target
pasarnya yang berdomisili di Jakarta. Di tahun 2014 ini ia merencanakan untuk
menjalankan strategi promosi melalui website guna meningkatkan penjualan dan
semakin memperkenalkan bisnisnya kepada pasar.
Kata kunci : Jasa, Fotografi, Media, Website
Perancangan Website ..., Andrian, FSD UMN, 2014
vi
ABSTRACT
The continued development of photographic services business currently providing
opportunities to be a major source of livelihood. This is also supported by the
development of the quality of the founder of photography services in Indonesia
and many are already recognized internationally. A baby photography services
company named Little Teacup finally established in 2009.
Due to the presence of new media strategies and promotions that just run through
social media Facebook and Instagram before, then Little Teacup need a website
in order to introduce and attract to its target audience based in Jakarta. In 2014
they plan to run through website promotion strategies to increase sales and
further introduce the business to the market.
Keywords : Service, Photography, Media, Website
Perancangan Website ..., Andrian, FSD UMN, 2014
vii
DAFTAR ISI
HALAMAN PENGESAHAN TUGAS AKHIR................................................... I
LEMBAR .............................................................................................................. II
KATA PENGANTAR ......................................................................................... III
ABSTRAKSI .......................................................................................................... V
ABSTRACT .......................................................................................................... VI
DAFTAR ISI ...................................................................................................... VII
DAFTAR GAMBAR ............................................................................................. X
DAFTAR TABEL.............................................................................................. XII
DAFTAR LAMPIRAN .................................................................................... XIII
BAB I PENDAHULUAN ...................................................................................... 1
1.1. Latar Belakang........................................................................................... 1
1.2. Rumusan Masalah ..................................................................................... 3
1.3. Batasan Masalah ........................................................................................ 3
1.4. Tujuan Tugas Akhir ................................................................................... 4
1.5. Manfaat Tugas Akhir ................................................................................. 5
1.6. Metode Pengumpulan Data ....................................................................... 5
1.7. Metode Perancangan ................................................................................. 7
1.8. Skematika Perancangan ............................................................................. 8
BAB II TINJAUAN PUSTAKA ........................................................................... 9
2.1. Promosi ...................................................................................................... 9
2.2. Media ....................................................................................................... 13
2.3. Audiens .................................................................................................... 18
Perancangan Website ..., Andrian, FSD UMN, 2014
viii
2.4. Website .................................................................................................... 20
2.5. Desain Web ............................................................................................. 26
2.5.1. Anatomi Halaman Web ............................................................. 28
2.5.2. Grid ........................................................................................... 29
2.5.3. Keseimbangan ........................................................................... 30
2.6. Fotografi .................................................................................................. 30
BAB III METODOLOGI ................................................................................... 33
3.1. Gambaran Umum .................................................................................... 33
3.1.1. Wawancara Kepada Narasumber ........................................................... 34
3.1.2. Wawancara Kepada Target..................................................................... 40
3.2. Mind Mapping ........................................................................................ 41
3.3. Studi Visual ............................................................................................ 42
3.4. Konsep Kreatif........................................................................................ 45
BAB IV PERANCANGAN ................................................................................. 46
4.1. Pengembangan Konsep .......................................................................... 46
4.1.1. Brainstorming ......................................................................................... 46
4.1.2. Sketsa Perancangan ................................................................................ 47
4.1.3. Artefak Visual Little Teacup .................................................................. 47
4.1.4. Tipografi ................................................................................................. 49
4.2. Strategi Perancangan Website................................................................. 49
4.2.1. Konsep Sitemap ...................................................................................... 49
4.2.2. Grid Web ................................................................................................ 51
4.2.3. Plot Website ............................................................................................ 53
4.3. Konsep Visual ........................................................................................ 54
4.3.1. Ilustrasi ................................................................................................... 54
4.3.2. Button, Latar, dan Layout ....................................................................... 56
4.3.3. Warna ..................................................................................................... 58
4.4. Aplikasi Kreatif ...................................................................................... 59
Perancangan Website ..., Andrian, FSD UMN, 2014
ix
4.4.1. Website Little Teacup............................................................................. 59
4.4.2. Media Plan .............................................................................................. 65
4.4.3. Budgeting Keperluan Project ................................................................. 65
BAB V PENUTUP ............................................................................................... 67
5.1. Kesimpulan ............................................................................................. 67
5.2. Saran ....................................................................................................... 67
DAFTAR PUSTAKA .......................................................................................... 69
Perancangan Website ..., Andrian, FSD UMN, 2014
x
DAFTAR GAMBAR
Gambar 2.1. Promosi Your Studio………………………………………………...9
Gambar 2.2. Event Pemasaran Pitter Patter Potraits……………………………..11
Gambar 2.3. Presentasi dan POP Berbagai Macam Produk……………………...12
Gambar 2.4. Website Weddingku dan Spanduk Online King Foto……………...15
Gambar 2.5. Profil Media Sosial Milik Axioo di Facebook……………………..16
Gambar 2.6. Brosur Jennifer Hejna Wedding Photography……………………..16
Gambar 2.7. Spanduk Dalam Ruangan Aberdeen Photo………………………...17
Gambar 2.8. Media Promosi Shannon Confair Photography……………………19
Gambar 2.9. Hierarki Pada Wix.com…………………………………………….21
Gambar 2.10. Pengelompokan Navigasi Pada Amore…………………………...22
Gambar 2.11. Pengelompokan Visual……………………………………………22
Gambar 2.12. Elemen Navigasi………………………………………………….25
Gambar 2.13. Anatomi Halaman Web…………………………………………...28
Gambar 2.14. Grid………………………………………………………………..29
Gambar 2.15. Perspektif Pada Foto………………………………………………31
Gambar 2.16. Perbedaan Lensa Sudut Lebar Dan Jarak Jauh……………………32
Gambar 3.1. Facebook Little Teacup…………………………………………….35
Gambar 3.2. Instagram Little Teacup……………………………………………36
Gambar 3.3. Mind Mapping……………………………………………………...42
Gambar 3.4. Header WD Photoworks……………………………………………43
Gambar 3.5. Konten WD Photoworks…………………………………………...44
Gambar 3.6. Footer WD Photoworks……………………………………………44
Perancangan Website ..., Andrian, FSD UMN, 2014
xi
Gambar 4.1. Brainstorming………………………………………………………46
Gambar 4.2. Sketsa Website Little Teacup………………………………………47
Gambar 4.3. Logotype Little Teacup…………………………………………….48
Gambar 4.4. Logogram Little Teacup……………………………………………48
Gambar 4.5. Daftar Harga Little Teacup………………………………………...48
Gambar 4.6. Font Arial…………………………………………………………..49
Gambar 4.7. Site Map Little Teacup……………………………………………..49
Gambar 4.8. Grid Home………………………………………………………….51
Gambar 4.9. Grid Portfolio………………………………………………………51
Gambar 4.10. Grid Inside Portfolio………………………………………………52
Gambar 4.11. Grid Package……………………………………………………...53
Gambar 4.12. Referensi Efek Jahitan dan Kain…………………………………54
Gambar 4.13. Contoh Ilustrasi Handmade………………………………………55
Gambar 4.14. Contoh Ilustrasi Berupa Foto…………………………………….55
Gambar 4.15. Informasi Button, Latar, dan Layout…………………………….56
Gambar 4.16. Warna Utama…………………………………………………….58
Gambar 4.17. Final Halaman Utama Website Little Teacup……………………59
Gambar 4.18. Final Halaman Portfolio Website Little Teacup…………………60
Gambar 4.19. Final Halaman Dalam Portfolio Website Little Teacup…………61
Gambar 4.20. Final Halaman About Website Little Teacup……………………62
Gambar 4.21. Final Halaman Package Website Little Teacup…………………63
Gambar 4.22. Final Halaman Contact Us Website Little Teacup………………64
Perancangan Website ..., Andrian, FSD UMN, 2014
xii
DAFTAR TABEL
Tabel 3.1 Hasil Pertanyaan Wawancara Pertama……………..…..…….…….…40
Tabel 3.2 Hasil Pertanyaan Wawancara Kedua……………..…..…...….…….…41
Tabel 4.1 Media Plan……………..…..…………………………….…...…….…65
Tabel 4.2 Budgeting Keperluan Project……………………....…..….……….…66
Perancangan Website ..., Andrian, FSD UMN, 2014
xiii
DAFTAR LAMPIRAN
LAMPIRAN A: JADWAL BIMBINGAN ........................................................ 71
LAMPIRAN B: SKETSA ................................................................................... 72
Perancangan Website ..., Andrian, FSD UMN, 2014