PERANCANGAN WEBSITE TENTANG BAHAYA
MINYAK GORENG CURAH BAGI UMKM
Laporan Tugas Akhir
Ditulis sebagai syarat untuk memperoleh gelar Sarjana Desain (S.Ds.)
Nama : Michael Ervan Stefanus NIM : 00000013149
Program Studi : Desain Komunikasi Visual Fakultas : Seni dan Desain
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
ii
LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT
Saya yang bertanda tangan di bawah ini:
Nama : Michael Ervan Stefanus NIM : 00000013149
Program Studi : Desain Komunikasi Visual Fakultas : Seni dan Desain
Universitas Multimedia Nusantara Judul Tugas Akhir :
PERANCANGAN WEBSITE TENTANG BAHAYA MINYAK GORENG CURAH BAGI UMKM
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 pelaksanaan penelitian/implementasi saya sendiri, tanpa bantuan pihak lain, kecuali arahan pembimbing akademik dan narasumber.
Demikian surat Pernyataan Orisinalitas ini saya buat dengan sebenarnya, apabila di kemudian hari terdapat penyimpangan serta ketidakbenaran dalam pernyataan ini, maka saya bersedia menerima sanksi akademik berupa pencabutan gelar (S.Ds.) yang telah diperoleh, serta sanksi lainnya sesuai dengan norma yang berlaku di Universitas Multimedia Nusantara.
Tangerang, 5 Januari 2021
iii
HALAMAN PENGESAHAN TUGAS AKHIR
PERANCANGAN WEBSITE TENTANG BAHAYA
MINYAK GORENG CURAH BAGI UMKM
Oleh
Nama : Michael Ervan Stefanus NIM : 00000013149
Program Studi : Desain Komunikasi Visual Fakultas : Seni dan Desain
Tangerang, 20 Januari 2021
.
Pembimbing I
Fonita Theresia Yoliando, S.Ds, M.A.
Pembimbing II
Nadia Mahatmi, M.Ds.
Ketua Program Studi
Mohammad Rizaldi, S.T., M.Ds. Penguji
Mohammad Rizaldi, S.T., M.Ds.
Ketua Sidang
iv
KATA PENGANTAR
Puji dan syukur kami panjatkan kepada Tuhan yang Maha Esa atas perlindungan dan berkat yang luar biasa karena penulis dapat menyelesaikan karya dan laporan tugas akhir ini. Penulis memilih topik bahaya menggunakan minyak curah tersebut karena masih banyak orang khususnya pedagang yang menjual dan menggunakan minyak curah tersebut untuk berjualan kepada masyarakat, padahal minyak tersebut sudah tidak layak digunakan lagi.
Topik minyak curah tersebut sangat penting untuk diamati dan dibaca karena masih banyaknya orang yang tidak tahu mengenai bahaya dari minyak curah tersebut dan masih banyak orang yang berjualan minyak curah tersebut yang tidak tahu bahwa sudah ada regulasi dari pemerintah bahwa penggunaan minyak curah sudah harus berakhir hingga akhir bulan Desember 2020.
Dalam melakukan penelitian dan perancangan mengenai minyak curah tersebut, penulis mempelajari bahwa pentingnya untuk memberikan solusi yang tepat dari suatu masalah tersebut dan memberikan isi konten informasi yang dibutuhkan dari para penggunanya.
Penulis juga mengucap syukur dan berterima kasih kepada orang – orang yang sudah membantu dalam proses penyusunan laporan tugas akhir dan dalam melakukan perancangan media Informasi berupa website dan mobile web, yaitu:
1. Mohammad Rizaldi, S.T., M.Ds. sebagai Ketua Program Studi Desain Komunikasi Visual.
v
2. Fonita Theresia Yoliando, S.Ds., M.A. dan Nadia Mahatmi, M.Ds. sebagai Dosen Pembimbing dalam melakukan penulisan pada laporan tugas akhir.
3. Daniel Kawalo sebagai narasumber dari Founder Barang Baku untuk melakukan riset terhadap ui/ux
4. Ari Muladi sebagai narasumber dari karyawan swasta di perusahaan PT. Wahana Citra Nabati untuk melakukan riset tentang minyak goreng curah
5. Orang tua dan saudara yang memberikan dukungan dan doa bagi penulis dalam proses pengerjaan tugas akhir baik pada laporan dan karya.
Tangerang, 7 Januari 2021
vi
ABSTRAKSI
Penulis memilih topik bahaya menggunakan minyak curah tersebut karena masih banyak orang khususnya pedagang yang menjual dan menggunakan minyak curah tersebut untuk berjualan kepada masyarakat, padahal minyak tersebut sudah tidak layak digunakan lagi. Rumusan masalah yang penulis lakukan yaitu bagaimana perancangan website tentang bahaya minyak goreng curah bagi umkm di Jabodetabek. Metode yang penulis lakukan dimulai dari memberikan kuesioner, melakukan wawancara, observasi dan studi referensi agar membantu penulis untuk melakukan perancangan mengenai website dan mobile web tentang minyak curah.
vii
ABSTRACT
The author choose the topic of the risk to use bulk cooking oil because there are people including merchant that still sell and use bulk cooking oil to the people. The bulk cooking oil is not usable anymore. The problem of formula that author choose that how to designing website about bulk cooking oil for micro, small and medium enterprises in Jabodetabek. The method that author choose is from give questionnaire, do interview, observation and reference research to help the author to designing about website and mobile web about bulk cooking oil.
viii
DAFTAR ISI
LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT ... II
HALAMAN PENGESAHAN TUGAS AKHIR/SKRIPSI* ... III
KATA PENGANTAR ... IV
ABSTRAKSI ... VI
ABSTRACT ... VII
DAFTAR ISI ... VIII
DAFTAR GAMBAR ... XII
DAFTAR TABEL... XVI
DAFTAR LAMPIRAN ... XVII
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 ... 4
BAB II TINJAUAN PUSTAKA ... 6
2.1. Desain Komunikasi Visual ... 6
2.1.1. Elemen-Elemen Desain Komunikasi Visual ... 6
ix 2.1.2.1. Keseimbangan……….9 2.1.2.2. Irama………..11 2.1.2.3. Penekanan……….…….12 2.1.2.4. Kesatuan……….13 2.1.2. Warna……….13 2.2. Media Informasi ... 15
2.2.1. Fungsi Media Informasi ... 15
2.2.2. Jenis - Jenis Media Informasi……….16
2.2.2.1. Media Cetak……….…….17
2.2.2.2. Media Elektronik………...20
2.2.2.3. Media Online……….22
2.3. Minyak Curah……….23
BAB III METODOLOGI ... 24
x
3.1.1. Observasi………24
3.1.2. Wawancara……….28
3.1.2.1. Wawancara Kepada Ari Muladi (Pakar Minyak Goreng)………..29
3.1.2.2. Wawancara Kepada Daniel Kawalo (Founder Barang Baku)………..33 3.1.3. Kuesioner………...38 3.1.4. Studi Referensi………...45 3.2. Metodologi Perancangan...49 3.2.1. Empathize……….…50 3.2.2. Define………...52 3.2.3. Ideate………56 3.2.4. Flowchart…...………..57 3.2.5. Information Architecture………..59 3.2.6. Wireframe……….62 3.2.7. Desain Awal……….65
BAB IV STRATEGI DAN ANALISIS PERANCANGAN ... 71
xi
4.1.1. Hasil Alpha Test………...73
4.1.1.1. User Experience………....74
4.1.1.2. User Interface………76
4.1.2. Hasil Perbaikan Alpha Test………77
4.1.2.1. Logo………...………...78
4.1.2.2. Landing Page………...……….80
4.1.2.3. Halaman Informasi………82
4.1.2.4. Halaman Regulasi……….84
4.1.2.5. Halaman Minyak Curah, Minyak Kemasan dan Minyak Kemasan Sederhana………...86 4.1.2.6. Halaman Produksi……….89 4.1.2.7. Halaman Kandungan……….90 4.1.2.8. Halaman Bahaya………...92 4.1.2.9. Halaman Artikel………....93 4.1.2.10. Halaman Kontak………..94 4.1.2.11. Icon………...95 4.1.2.12. Mobile Web……….97
4.2. Analisis Beta Test ... 98
BAB V PENUTUP ... 102
5.1. Kesimpulan ... 102
5.2. Saran ... 102
xii
DAFTAR GAMBAR
Gambar 2.1. Mushroom Array Burg Rabenstein ... 6
Gambar 2.2. Tipografi dalam DKV……….7
Gambar 2.3 Promotional Campaign Maddie Nike Finish Time………..8
Gambar 2.4. Layout Website………....9
Gambar 2.5. Keseimbangan Formal………...10
Gambar 2.6. Keseimbangan Informal………11
Gambar 2.7. Irama……….…….12
Gambar 2.8. Penekanan………..12
Gambar 2.9. Kesatuan………13
Gambar 2.10. Warna Primer………..14
Gambar 2.11. Warna Sekunder……….…….14
Gambar 2.12. Warna Tersier……….…….15
Gambar 2.13. Koran………...17
Gambar 2.14. Majalah………18
Gambar 2.15. Tabloid………19
Gambar 2.16. Buletin……….19
Gambar 2.17. Buku Teks………...20
Gambar 2.18. Televisi………....21
Gambar 2.19. Radio………...21
Gambar 2.20. Website………....……21
Gambar 3.1. Tempat Agen Minyak Curah Berjualan………25
xiii
Gambar 3.3. Tempat Proses Penyaringan Minyak Curah………..26
Gambar 3.4. Alat Saringan Untuk Minyak Curah………..27
Gambar 3.5. Gelas Takaran Minyak Curah………...27
Gambar 3.6. Minyak Goreng Curah………...28
Gambar 3.7. Ari Muladi……….29
Gambar 3.8. Bagan Tahapan Produksi Minyak Goreng Curah dan Kemasan…...30
Gambar 3.9. Daniel Kawalo………...33
Gambar 3.10. Diagram Mengenai Usia Responden………...39
Gambar 3.11. Diagram mengenai Domisili Responden……….39
Gambar 3.12. Diagram Pengeluaran per Bulan……….40
Gambar 3.13. Diagram Pengguna Minyak Goreng Curah……….40
Gambar 3.14. Diagram Jumlah Pembelian Minyak Goreng Curah Dalam Seminggu………41
Gambar 3.15. Diagram Harga Minyak Goreng Curah………...42
Gambar 3.16. Diagram Batang Alasan Membeli Minyak Goreng Curah………..42
Gambar 3.17. Diagram Batang Bahaya Minyak Goreng Curah………43
Gambar 3.18. Diagram Pengetahuan Mengenai Surat Menteri Perdagangan……44
Gambar 3.19. Diagram Batang Media Informasi………...44
Gambar 3.20. Website IdEA………...46
Gambar 3.21. Website Kata Data………...48
Gambar 3.22. Mind Map………53
Gambar 3.23. Moodboard………..56
xiv
Gambar 3.25. Flowchart Kedua……….58
Gambar 3.26. Information Architecture Pertama………...60
Gambar 3.27. Information Architecture Kedua……….61
Gambar 3.28. Wireframe Pada Kertas………….………...63
Gambar 3.29. Wireframe Pada Digital Grid……….……….63
Gambar 3.30. Wireframe Digital Semua Halaman………64
Gambar 3.31. Landing Page………..65
Gambar 3.32. Halaman Beranda………66
Gambar 3.33. Halaman Informasi………..67
Gambar 3.34. Halaman Isi Konten……….68
Gambar 3.35. Halaman Artikel………..69
Gambar 3.36. Halaman Galeri………...70
Gambar 4.1. Landing Page………...……….72
Gambar 4.2. Prototype Pada Alpha Test………....73
Gambar 4.3. Diagram Pada Alur Kerja Website………74
Gambar 4.4. Diagram Pada Susunan Layout Prototype……….75
Gambar 4.5. Jawaban Pada Fitur Website Yang Membingungkan……….……...75
Gambar 4.6. Diagram Tombol Prototype………..76
Gambar 4.7. Feedback Pada Prototype………..76
Gambar 4.8. Desain Logo Pada Kertas………..78
Gambar 4.9. Desain Logo Pada Digital……….79
Gambar 4.10. Desain Landing Page Prototype Day………..80
xv
Gambar 4.12. Desain Halaman Informasi Protoype Day...………...83
Gambar 4.13. Desain Halaman Informasi Beta Test………..83
Gambar 4.14. Desain Halaman Regulasi………...85
Gambar 4.15. Desain Semua Halaman Konten Alpha Test………...…87
Gambar 4.16. Desain Halaman Konten Minyak Curah, Kemasan, Kemasan Sederhana Beta Test………...88
Gambar 4.17. Desain Halaman Produksi………...89
Gambar 4.18. Desain Halaman Kandungan………...91
Gambar 4.19. Desain Halaman Bahaya……….92
Gambar 4.20. Desain Halaman Artikel………..93
Gambar 4.21. Desain Halaman Kontak………..94
Gambar 4.22. Desain Icon Awal………95
Gambar 4.23. Desain Icon Akhir………...96
Gambar 4.24. Mobile Web……….97
Gambar 4.25. Mock Up Mobile Web……….97
Gambar 4.26. Dokumentasi Beta Test………...98
Gambar 4.27. Diagram Usia Beta Test………..98
Gambar 4.28. Tingkat Kemudahan Website………..99
Gambar 4.29. Tingkat Kemudahan Mobile Web………99
Gambar 4.30. Diagram Tingkat Kontras………..100
xvi
DAFTAR TABEL
Tabel 3.1. Tabel Perbandingan Minyak Goreng Curah dan Kemasan ... ..31 Tabel 3.2. Tabel Studi Referensi Website ... 50
xvii
DAFTAR LAMPIRAN
LAMPIRAN A: KUESIONER PENGGUNAAN MINYAK CURAH ... …XVII
LAMPIRAN B: WAWANCARA DENGAN ARI MULADI………....XXI
LAMPIRAN C: WAWANCARA DENGAN DANIEL KAWALO……....XXV LAMPIRAN D: KUESIONER PROTOTYPE DAY...XXIX LAMPIRAN E: KUESIONER BETA TEST...XXXI LAMPIRAN F: WEBSITE MINYAK CURAH...XXXIX LAMPIRAN G: MOBILE WEB...XLIII LAMPIRAN H: POSTER...LI LAMPIRAN I: FORM BIMBINGAN DOSEN PEMBIMBING...LIII
