Desain Komunikasi Visual SMK/MAK Kelas 12 PDF

 DESAIN KOMUNIKASI VISUAL SMK/MAK KELAS XII U E SI...

 DESAIN KOMUNIKASI VISUAL SMK/MAK KELAS XII U E SI FASE ED L A F K P M IA D Titien Agustina Yatie G A E Andriyani M Fiani Aji Pangastuti S A R Diterbitkan oleh Penerbit PT Gramedia Edukasi Nusantara, Jakarta, 2023 DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 1 11/7/2023 11:17:38 AM  DESAIN KOMUNIKASI VISUAL SMK/MAK Kelas XII ID : 56.23.5.0028 ISBN : 978-623-8368-02-0 © Penerbit PT Gramedia Edukasi Nusantara, Jalan Palmerah Barat 33—37, Jakarta 10270 © Hak Cipta Dilindungi oleh Undang-Undang Penulis : Titien Agustina Yatie, Andriyani, dan Fiani Aji Pangastuti Editor : Eko Setiawan dan Winasti Rahma Diani Penelaah : Rustamaji Desainer : Nur Rohmah U E Ilustrator/Foto : Ahmad Taufiqul Majid Diterbitkan pertama kali oleh Penerbit PT Gramedia Edukasi Nusantara, anggota Ikapi, SI Jakarta, 2023. Cetakan pertama, 2023 ED L A Isi buku ini menggunakan huruf Adobe Garamond Pro 11/14pt., Robert Slimbach K xviii, 238 hlm.: 17,6 x 25 cm P Dilarang mengutip atau memperbanyak sebagian atau seluruh isi buku ini dalam bentuk apa pun (seperti cetakan, fotokopi, mikrofilm, VCD, CD-ROM, dan rekaman suara) tanpa izin tertulis dari pemegang hak cipta/Penerbit. M Sanksi Pelanggaran Pasal 113 Undang-undang Nomor 28 Tahun 2014 tentang Hak Cipta IA (1) Setiap Orang yang dengan tanpa hak melakukan pelanggaran hak ekonomi sebagaimana dimaksud dalam Pasal 9 ayat (1) huruf i untuk Penggunaan Secara Komersial dipidana dengan pidana penjara paling lama D 1 (satu) tahun dan/atau pidana denda paling banyak Rp100.000.000,00 (seratus juta rupiah). (2) Setiap Orang yang dengan tanpa hak dan/atau tanpa izin Pencipta atau pemegang Hak Cipta melakukan G A pelanggaran hak ekonomi Pencipta sebagaimana dimaksud dalam Pasal 9 ayat (1) huruf c, huruf d, huruf f, E dan/atau huruf h untuk Penggunaan Secara Komersial dipidana dengan pidana penjara paling lama 3 (tiga) tahun dan/atau pidana denda paling banyak Rp500.000.000,00 (lima ratus juta rupiah). M (3) Setiap Orang yang dengan tanpa hak dan/atau tanpa izin Pencipta atau pemegang Hak Cipta melakukan pelanggaran hak ekonomi Pencipta sebagaimana dimaksud dalam Pasal 9 ayat (1) huruf a, huruf b, huruf e, S dan/atau huruf g untuk Penggunaan Secara Komersial dipidana dengan pidana penjara paling lama 4 (empat) A tahun dan/atau pidana denda paling banyak Rp1.000.000.000,00 (satu miliar rupiah). R (4) Setiap Orang yang memenuhi unsur sebagaimana dimaksud pada ayat (3) yang dilakukan dalam bentuk pembajakan, dipidana dengan pidana penjara paling lama 10 (sepuluh) tahun dan/atau pidana denda paling banyak Rp4.000.000.000,00 (empat miliar rupiah). Produk Dalam Negeri (PDN) Nilai TKDN: 79,04% Dicetak oleh Percetakan PT Gramedia, Jakarta Produk Sudah Bersertifikat TKDN 982/SJ-IND.8/TKDN/1/2023 Isi di luar tanggung jawab Percetakan DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 2 11/7/2023 11:17:38 AM  DAFTAR ISI DAFTAR ISI.............................................................................................iii DAFTAR GAMBAR................................................................................... ix PRAKATA............................................................................................. xiv ELEMEN DAN CAPAIAN PEMBELAJARAN.............................................. xv CARA MENGGUNAKAN BUKU............................................................. xvii BAB I PROSES PRODUKSI DESAIN KEMASAN........................................... 1 A. PENGERTIAN DESAIN GRAFIS......................................................................3 U E 1. Keseimbangan (Balance)...............................................................................4 2. Ritme (Rhytme).............................................................................................5 SI 3. Tekanan (Emphasis).......................................................................................5 ED L A 4. Kesatuan (Unity)...........................................................................................5 B. SOFTWARE APLIKASI DESAIN GRAFIS.........................................................6 K 1. Corel Draw...................................................................................................6 P 2. Adobe Ilustrator............................................................................................6 3. Rekomendasi Aplikasi yang Lain...................................................................7 C. PENGANTAR DESAIN KEMASAN.................................................................7 M 1. Pengertian.....................................................................................................7 2. Manfaat........................................................................................................8 IA 3. Arti Penting Kemasan bagi Produsen............................................................8 4. Unsur Desain Kemasan.................................................................................9 D D. PROSES PRODUKSI DESAIN KEMASAN “VECHIF - VEGETABLE CHIPS G A E WITH HONEY FLAVOR”..................................................................................9 M 1. Emphaty (Mendengarkan Permintaan Client)................................................9 2. Define (Menyelesaikan Masalah dan Mengumpulkan Ide)...........................10 S A 3. Ideate (Menentukan Ide).............................................................................11 4. Prototype (Membuat Desain).......................................................................13 R 5. Test (Memastikan Desain kepada Client).....................................................16 Rangkuman................................................................................................................18 Refleksi........................................................................................................................18 Proyek Kolaborasi........................................................................................................19 Tugas Mandiri.............................................................................................................19 Tugas Kelompok.........................................................................................................20 Asesmen Formatif........................................................................................................20 Daftar Isi iii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 3 11/7/2023 11:17:39 AM  BAB II PROSES PRODUKSI DESAIN USER INTERFACE (UI)...................... 25 A. USER INTERFACE (UI)...................................................................................27 B. SOFTWARE APLIKASI.....................................................................................31 1. Figma.........................................................................................................31 2. Adobe XD..................................................................................................31 3. Sketch.........................................................................................................32 4. Adobe Illustrator.........................................................................................32 5. MockFlow..................................................................................................33 6. Flow Mapp.................................................................................................33 C. PROSES PRODUKSI USER INTERFACE (UI)...............................................33 U E 1. Membuat Akun Baru..................................................................................34 SI 2. Mengenal Frame.........................................................................................36 3. Membuat Frame Baru.................................................................................36 ED L A 4. Pengaturan Warna Frame............................................................................38 K 5. Memasukkan Ikon Teks..............................................................................40 6. Kemudian, tambahkan bentuk kotak untuk membuat tampilan yang lain P menggunakan ikon di bawah ini.................................................................41 7. Memasukkan Gambar pada Bidang Kotak..................................................42 8. Memasukkan Gambar pada Kotak..............................................................43 M 9. Menambahkan Elemen Desain Lain dengan..............................................44 IA 10. Mengubah Warna Dasar Frame...................................................................44 11. Pindah Halaman pada Prototype..................................................................45 D D. MEMBUAT USER FLOW SESUAI DENGAN PERMINTAAN CLIENT MENGGUNAKAN PRINSIP DESIGN THINKING......................................46 G A E 1. Tahap Empati.............................................................................................46 M 2. Tahap Define...............................................................................................47 3. Tahap Ideate................................................................................................47 S A 4. Tahap Prototipe..........................................................................................51 R 5. Tahap Test...................................................................................................51 Rangkuman.................................................................................................................52 Refleksi........................................................................................................................52 Tipe Soal Akm............................................................................................................52 Proyek Kolaborasi........................................................................................................53 Tugas Mandiri.............................................................................................................53 Tugas Kelompok.........................................................................................................53 Asesmen Formatif........................................................................................................54 Fase F Desain Komunikasi Visual SMK/MAK Kelas XII iv DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 4 11/7/2023 11:17:39 AM  BAB III PROJEK DESAIN KARAKTER....................................................... 57 A. DESAIN KARAKTER.......................................................................................60 1. Tipe menggambar desain karakter...............................................................60 B. DESAIN PERENCANAAN PROYEK...............................................................64 1. Menetukan Konsep dalam Membuat Desain Karakter...............................64 2. Konsep dalam Membuat Desain Karakter...................................................64 3. Desain Bentuk Tubuh Karakter...................................................................67 4. Membuat Ekspresi Wajah Karakter.............................................................67 5. Buat Pose yang Beragam.............................................................................67 6. Gaya Busana dan Aksesoris Karakter...........................................................67 U E C. PENDEKATAN YANG BISA DILAKUKAN DALAM MEMBUAT DESAIN KARAKTER......................................................................................................68 SI 1. Pendekatan dalam Pembuatan Karakter......................................................68 ED L A D. MENGENAL ANATOMI WAJAH MANUSIA SEBAGAI DASAR PEMBUATAN KARAKTER.......................................................................................................74 K E. MEMBUAT DESAIN KARAKTER UNTUK KARTUN..................................75 P 1. Tahap-Tahap dalam Membuat Desain Karakter..........................................75 Rangkuman................................................................................................................83 Refleksi........................................................................................................................83 M Proyek Kolaborasi........................................................................................................84 Tugas Mandiri.............................................................................................................84 IA Tugas Kelompok.........................................................................................................85 Asesmen Formatif........................................................................................................85 D G A E BAB IV PROJEK PEMBUATAN DESAIN PAPER BAG (TAS DARI KERTAS)..89 M A. PAPER BAG.......................................................................................................91 1. Fungsi Utama dari Paper Bag.....................................................................92 S A 2. Penerapan Design Thinking dalam Pembuatan Produk Paper Bag................93 TAHAPAN DALAM PEMBUATAN DESAIN PAPER BAG............................95 R B. 1. Penentuan Software....................................................................................95 2. Perancangan Logo.......................................................................................95 3. Membuat Sketsa........................................................................................95 4. Perancangan Template Desain Paper Bag.....................................................96 5. Membuat Desain Paper Bag........................................................................97 6. Pelipatan Paper Bag...................................................................................101 Daftar Isi v DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 5 11/7/2023 11:17:39 AM  Rangkuman...............................................................................................................101 Refleksi......................................................................................................................102 Proyek Kolaborasi......................................................................................................102 Tugas Mandiri...........................................................................................................102 Tugas Kelompok.......................................................................................................103 Asesmen Formatif......................................................................................................104 Asesmen Sumatif Semester Ganjil..............................................................................107 BAB V PROJEK MEMBUAT MOCKUP PACKAGING KEMASAN MINUMAN. 117 A. KONSEP KEMASAN PRODUK.....................................................................119 U E 1. Hal-Hal yang Perlu Diperhatikan dalam Memproduksi Produk...............120 SI 2. Manfaat-Manfaat yang Didapat dari Penggunaan Mockup dalam Pengembangan Produk......................................................................................................121 ED L A 3. Anatomi Mockup.......................................................................................122 B. PROYEK 1 MEMBUAT MOCKUP DESAIN KEMASAN MINUMAN.......124 K 1. Pengenalan Software Blender secara Singkat..............................................124 P 2. Membuat Mockup Kemasan Produk Minuman.........................................126 C. PROYEK 2 MEMBUAT MOCKUP KEMASAN KOTAK MAKAN...............130 Rangkuman...............................................................................................................137 M Refleksi......................................................................................................................137 Proyek Kolaborasi......................................................................................................138 IA Tugas Kelompok.......................................................................................................138 Tugas Mandiri...........................................................................................................139 D Asesmen Formatif......................................................................................................140 G A E M BAB VI BAGAIMANA CARA MEMBUAT FOTO PRODUK YANG MENARIK?143 A. APA ITU FOTOGRAFI PRODUK?................................................................145 S A 1. Pengertian Fotografi Produk.....................................................................146 R B. TATA CAHAYA DALAM PENGAMBILAN FOTO PRODUK.....................147 1. Prinsip Dasar Tata Cahaya........................................................................147 2. Sumber Cahaya.........................................................................................148 C. KOMPOSISI DAN SUDUT PENGAMBILAN GAMBAR...........................148 1. Komposisi.................................................................................................148 D. TEKNIK FOTO PRODUK.............................................................................152 E. KARYA SENI FOTOGRAFI DIGITAL...........................................................154 Fase F Desain Komunikasi Visual SMK/MAK Kelas XII vi DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 6 11/7/2023 11:17:39 AM  1. Apa Itu Adobe Lightroom?.......................................................................154 2. Fungsi Adobe Lightroom..........................................................................155 3. Kelebihan Adobe Lightroom.....................................................................155 4. Cara Mengunduh dan Install Adobe Lightroom........................................156 5. Cara Daftar Akun Adobe Lightroom........................................................157 6. Cara Menggunakan Adobe Lightroom......................................................158 7. Cara Edit Foto di Adobe Lightroom.........................................................164 8. Tips Saat Melakukan Foto Produk............................................................168 F. EVALUASI DAN PRESENTASI KARYA FOTO............................................168 Rangkuman..............................................................................................................171 U E Refleksi.....................................................................................................................171 SI Tipe Soal Akm..........................................................................................................172 Proyek Kolaborasi.....................................................................................................173 ED L A Ruang Mandiri.........................................................................................................173 Ruang Kelompok......................................................................................................173 K Asesmen Formatif.....................................................................................................174 P BAB VII VIDEO IKLAN LAYANAN MASYARAKAT....................................177 A. KONSEP DAN KEGUNAAN VIDEOGRAFI DALAM DESAIN KOMUNIKASI M VISUAL............................................................................................................179 B. IKLAN VIDEO DALAM DESAIN KOMUNIKASI VISUAL........................180 IA C. IKLAN LAYANAN MASYARAKAT...............................................................181 D. ALUR PROSES PEMBUATAN VIDEO DALAM DESAIN KOMUNIKASI D VISUAL............................................................................................................182 G A E E. JENIS PERGERAKAN KAMERA PADA PENGAMBILAN GAMBAR PRODUKSI.....................................................................................................183 M F. SUDUT PENGAMBILAN GAMBAR (CAMERA ANGLE)...........................184 S A 1. Bird Eye View...........................................................................................185 G. TIM PRODUKSI DAN KREATIF DALAM PRODUKSI VIDEO...............187 R 1. Tim Teknis...............................................................................................188 2. Tim Kreatif...............................................................................................188 H. MEMBUAT NASKAH VIDEO IKLAN LAYANAN MASYARAKAT............188 1. Ide/Gagasan..............................................................................................188 2. Genre Iklan Layanan Masyarakat..............................................................189 3. Tentukan Target Penonton untuk Video Yang Dibuat...............................190 4. Membuat Sinopsis Video..........................................................................191 Daftar Isi vii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 7 11/7/2023 11:17:39 AM  5. Treatment..................................................................................................192 6. Naskah Video Iklan Layanan Masyarakat..................................................193 I. EDITING VIDEO...........................................................................................195 Rangkuman..............................................................................................................203 Refleksi.....................................................................................................................203 Tipe Soal Akm.........................................................................................................204 Proyek Kolaborasi.....................................................................................................205 Tugas Mandiri..........................................................................................................205 Tugas Kelompok......................................................................................................205 Asesmen Formatif.....................................................................................................206 U E Asesmen Sumatif Semester Genap.............................................................................210 SI GLOSARIUM.........................................................................................221 ED L A DAFTAR PUSTAKA............................................................................... 223 DAFTAR KREDIT GAMBAR................................................................... 225 K INDEKS................................................................................................ 228 P PROFIL PELAKU PERBUKUAN............................................................. 230 M IA D G A E M S A R Fase F Desain Komunikasi Visual SMK/MAK Kelas XII viii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 8 11/7/2023 11:17:39 AM  DAFTAR GAMBAR Gambar 1.1 Contoh Desain Kemasan...................................................................... 1 Gambar 1.2 Macam Keseimbangan.......................................................................... 4 Gambar 1.3 Macam Ritme....................................................................................... 5 Gambar 1.4 Corel Draw........................................................................................... 6 Gambar 1.5 Adobe Illustrator................................................................................... 6 Gambar 1.6 Sketsa Desain Kemasan....................................................................... 12 Gambar 1.7 Sketsa Layout Desain Kemasan........................................................... 12 Gambar 1.8 Proses Digital Ilustrasi Desain Kemasan “VETCHIF”........................ 13 U E Gambar 1.9 Desain Bagian Belakang Kemasan “VETCHIF”................................. 14 SI Gambar 1.10 Desain Layout Kemasan “VETCHIF”................................................ 14 Gambar 1.11. Desain Mockup Bagian Depan Kemasan............................................. 15 ED L A Gambar 1.12 Desain Mockup Bagian Belakang Kemasan........................................ 15 K Gambar 1.13 Revisi desain mockup “VETCHIF”.................................................... 16 Gambar 2.1 User Interface Android Play Store....................................................... 25 P Gambar 2.2 Logo Figma........................................................................................ 31 Gambar 2.3 Logo Adobe XD................................................................................. 31 Gambar 2.4 Logo Sketch........................................................................................ 32 M Gambar 2.5 Logo Adobe Illustrator........................................................................ 32 IA Gambar 2.6 Logo MockFlow................................................................................. 33 Gambar 2.7 Logo FlowMapp................................................................................. 33 D Gambar 2.8 Halaman Utama Figma...................................................................... 34 Gambar 2.9 Halaman Registrasi atau Sign Up........................................................ 35 G A E Gambar 2.10. Halaman Pricing................................................................................. 35 M Gambar 2.11 Halaman Setelah Registrasi Akun....................................................... 36 Gambar 2.12 Langkah Pembuatan Frame................................................................. 37 S A Gambar 2.13 Pilihan Kanvas.................................................................................... 37 R Gambar 2.14 Pilihan Kanvas dengan Pengaturan Sesuai Kebutuhan Sendiri............ 38 Gambar 2.15 Menyeleksi Frame............................................................................... 39 Gambar 2.16 Memberi Warna Frame....................................................................... 39 Gambar 2.17 Frame yang Sudah Diberi Warna........................................................ 40 Gambar 2.18 Ikon Teks............................................................................................ 40 Gambar 2.19 Tambahan Ikon Teks.......................................................................... 41 Gambar 2.20 Ikon Kotak......................................................................................... 41 Daftar Gambar ix DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 9 11/7/2023 11:17:39 AM  Gambar 2.21 Membuat Kotak dan Mengubah Sudut............................................... 41 Gambar 2.22 Copy-Paste Gambar............................................................................. 42 Gambar 2.23 Masking Gambar................................................................................ 43 Gambar 2.24 Hasil Masking Gambar....................................................................... 43 Gambar 2.25 Hasil User Interface di Halaman Utama Aplikasi Menggunakan Figma 44 Gambar 2.27 Mengubah Gradasi Warna Frame........................................................ 45 Gambar 2.28 Pindah Halaman................................................................................. 45 Gambar 2.29 Navigasi Prototipe.............................................................................. 46 Gambar 2.30 Flow Chart Desain user Interface......................................................... 47 Gambar 2.31 Halaman Login dan Register................................................................ 48 U E Gambar 2.32 Halaman Register Nomor Handphone................................................ 48 SI Gambar 2.33 Halaman Verifikasi............................................................................. 49 Gambar 2.34 Halaman Verifikasi Gagal................................................................... 49 ED L A Gambar 2.35 Halaman Verifikasi Berhasil................................................................ 50 Gambar 2.36 Menyatukan Semua Sketsa................................................................. 50 K Gambar 2.37 Hasil Desain UI dari Sketsa................................................................ 51 P Gambar 3.1 Contoh Desain Karakter..................................................................... 57 Gambar 3.2 Karakter The Screwball....................................................................... 61 Gambar 3.3 The Cute Character............................................................................. 62 M Gambar 3.4 The Heavy Character........................................................................... 62 IA Gambar 3.5 Goofy Character.................................................................................. 63 Gambar 3.6 Karakter Robot.................................................................................. 64 D Gambar 3.7 Tahapan Menggambar Bagian Kepala................................................. 66 Gambar 3.8 Tahapan Menggambar Bentuk Karakter............................................. 66 G A E Gambar 3.9 Karakter Doraemon (Kiri) dan Nobita (Kanan).................................. 70 M Gambar 3.10 Siluet Karakter-Karakter yang Ikonik................................................. 70 Gambar 3.11 Siluet Karakter Batman...................................................................... 71 S A Gambar 3.12 Karakter dengan Komposisi Warna Gambar...................................... 71 R Gambar 3.13 Karakter-Karakter Ikonik dengan Komposisi Warna.......................... 71 Gambar 3.14 Tabiat Karakter Terlihat dari Cara Berdiri........................................... 72 Gambar 3.15 Keunikan Bentuk Karakter................................................................. 73 Gambar 3.16 Desain Simple.................................................................................... 73 Gambar 3.17 Karakter yang Terkesan Tidak Simple................................................. 73 Gambar 3.18 Anatomi Wajah Manusia...............................................................74 Gambar 3.19 Gambar Sketsa pada Kertas.............................................................. 75 Fase F Desain Komunikasi Visual SMK/MAK Kelas XII x DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 10 11/7/2023 11:17:39 AM  Gambar 3.20 Hasil Tracing............................................................................... 76 Gambar 3.21 Tracing Menggunakan Pen Tool........................................................... 76 Gambar 3.22 Tracing di Bagian Tungkai................................................................... 77 Gambar 3.23 Tracing Bagian Paha............................................................................ 77 Gambar 3.24 Tracing Bagian Pakaian....................................................................... 78 Gambar 3.25 Tampilan Outline (Garis).................................................................... 78 Gambar 3.26 Pewarnaan dalam Tubuh..................................................................... 79 Gambar 3.27 Kode Pewarnaan untuk Kulit.............................................................. 79 Gambar 3.28 Pewarnaan pada Rambut.................................................................... 80 Gambar 3.29 Pewarnaan pada Badan....................................................................... 80 U E Gambar 3.30 Pewarnaan pada Rambut.................................................................... 81 SI Gambar 3.31 Membuat Bayangan pada Tubuh........................................................ 81 Gambar 3.32 Karakter............................................................................................. 82 ED L A Gambar 3.33 Karakter dengan Ekpresi.................................................................... 82 Gambar 4.1 Ilustrasi Paper Bag............................................................................... 89 K Gambar 4.2 Paper Bag dengan Desain Menarik...................................................... 92 P Gambar 4.3 Hasil Scan Logo.................................................................................. 95 Gambar 4.4 Proses Pembuatan Logo Bagian Finishing............................................ 96 Gambar 4.5 Template Desain Paper Bag.................................................................. 96 M Gambar 4.6 Proses Pembuatan Kerangka dan Pewarnaan Kemasan........................ 97 IA Gambar 4.7 Proses Setting Logo............................................................................. 97 Gambar 4.8 Proses Penambahan Sample Foto........................................................ 98 D Gambar 4.9 Proses Penambahan Keterangan.......................................................... 98 Gambar 4.10 Bahan untuk Pembuatan Pattern......................................................... 99 G A E Gambar 4.11 Proses Akhir Perancangan................................................................... 99 M Gambar 4.12 Desain Paper Bag Wedang Uwuh Seger dan Sehat............................. 100 Gambar 4.13 Desain Paper Bag.............................................................................. 100 S A Gambar 5.2 Mockup Kemasan.............................................................................. 122 R Gambar 5.3 Tampilan Awal Blender..................................................................... 125 Gambar 5.4 Template Desain Kemasan Minuman............................................... 125 Gambar 5.5 Contoh Desain Kemasan Minuman Sari Tebu.................................. 125 Gambar 5.6 Pembuatan Kotak pada Blender........................................................ 126 Gambar 5.7 UV Editing....................................................................................... 127 Gambar 5.8 Tools Warna..................................................................................... 127 Gambar 5.9 Color Base........................................................................................ 127 Daftar Gambar xi DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 11 11/7/2023 11:17:39 AM  Gambar 5.10 Sisi Obyek pada Blender................................................................... 128 Gambar 5.11 Sisi Atas Obyek................................................................................. 128 Gambar 5.12 Project from View............................................................................... 129 Gambar 5.13 Tampilan Obyek............................................................................... 129 Gambar 5.14 Tampilan Obyek............................................................................... 130 Gambar 5.15 Template Kotak Makanan.................................................................. 131 Gambar 5.16 Desain Kotak Makanan.................................................................... 131 Gambar 5.17 Edit Mode pada Aplikasi.................................................................. 132 Gambar 5.18 Edit Mode......................................................................................... 132 Gambar 5.19 UV Editing....................................................................................... 133 U E Gambar 5.20 Material Properties............................................................................ 133 SI Gambar 5.21 Base Color......................................................................................... 134 Gambar 5.22 Sisi Obyek........................................................................................ 134 ED L A Gambar 5.23 Desain Packaging............................................................................... 135 Gambar 5.24 Finishing Prototipe............................................................................ 136 K Gambar 5.25 Prototipe Kotak Makanan................................................................. 136 P Gambar 6.1 Foto Produk..................................................................................... 143 Gambar 6.2 Kriteria Foto Produk yang Bagus...................................................... 146 Gambar 6.3 Peralatan Foto................................................................................... 147 M Gambar 6.4 Three Points Lighting......................................................................... 147 IA Gambar 6.5 Contoh Foto Menggunakan Rule of Third......................................... 149 Gambar 6.6 Foto Landscape................................................................................. 149 D Gambar 6.7 Foto Framing.................................................................................... 150 Gambar 6.8 Foto Repetition.................................................................................. 150 G A E Gambar 6.9 Foto Golden Ratio............................................................................. 151 M Gambar 6.10 Foto Reflection................................................................................... 152 Gambar 6.11 Properti Foto Produk........................................................................ 153 S A Gambar 6.12 Alur Editing foto............................................................................... 154 R Gambar 6.13 Tampilan Android............................................................................ 156 Gambar 6.14 Tampilan Install Adobe Lightroom................................................... 156 Gambar 6.15 Tampilan Awal Adobe Lightroom..................................................... 157 Gambar 6.16 Tampilan Adobe Lightroom pada Android....................................... 158 Gambar 6.17 Tampilan Fitur Adobe Lightroom..................................................... 158 Gambar 6.18 Tampilan kerja Adobe Lightroom..................................................... 159 Gambar 6.19 Tampilan Kerja Adobe Lightroom.................................................... 159 Fase F Desain Komunikasi Visual SMK/MAK Kelas XII xii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 12 11/7/2023 11:17:39 AM  Gambar 6.20 Tampilan Kerja Adobe Lightroom.................................................... 160 Gambar 6.21 Tampilan Kerja Adobe Lightroom.................................................... 162 Gambar 6.22 Tool Edit Foto Adobe Lightroom...................................................... 162 Gambar 6.23 Tampilan Kerja Adobe Lightroom.................................................... 164 Gambar 6.24 Tampilan Kerja Adobe Lightroom.................................................... 164 Gambar 6.25 Tampilan Kerja Adobe Lightroom.................................................... 164 Gambar 6.26 Tampilan Kerja AL........................................................................... 165 Gambar 6.27 Tampilan kerja AL............................................................................ 165 Gambar 6.28 Tampilan Kerja AL........................................................................... 166 Gambar 6.29 Tampilan Kerja AL........................................................................... 166 U E Gambar 6.30 Tampilan Kerja................................................................................ 166 SI Gambar 6.31 Tampilan Kerja AL........................................................................... 167 Gambar 6.32 Tampilan kerja AL............................................................................ 167 ED L A Gambar 6.33 Tampilan Kerja AL........................................................................... 167 Gambar 6.34 Tampilan kerja AL............................................................................ 167 K Gambar 6.35 Karya Praktik Foto Produk............................................................... 169 P Gambar 6.36 Contoh Foto Produk........................................................................ 172 Gambar 7.1 Contoh Iklan Layanan Masyarakat................................................... 177 Gambar 7.2 Iklan Layanan Masyarakat tentang Vaksin Covid-19......................... 182 M Gambar 7.3 Sudut Pengambilan Gambar............................................................. 184 IA Gambar 7.4 Contoh Bird Eye View....................................................................... 185 Gambar 7.5 Contoh High Level............................................................................ 185 D Gambar 7.6 Contoh Eye Level.............................................................................. 186 Gambar 7.7 Contoh Low Angle............................................................................ 186 G A E Gambar 7.8 Frog Eye View.................................................................................... 187 M Gambar 7.9 Tim Produksi dan Kreatif................................................................. 187 Gambar 7.10 Tampilan Lembar Kerja Adobe Premiere Pro.................................... 196 S A Gambar 7.11 Tampilan Awal Adobe Premiere Pro.................................................. 197 R Gambar 7.12 Tampilan New Sequence.................................................................... 198 Gambar 7.13 Tampilan Proses Penyuntingan......................................................... 199 Gambar 7.14 Tampilan Proses Rendering................................................................ 200 Daftar Gambar xiii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 13 11/7/2023 11:17:39 AM  PRAKATA Puji syukur kami panjatkan kepada Tuhan yang Maha Esa atas segala berkat dan rahmat-Nya sehingga buku yang berjudul Desain Komunikasi Visual ini dapat hadir sebagai penunjang dalam pembelajaran pada jenjang Sekolah Menengah Kejuruan Kompetensi Keahlian Desain Komunikasi Visual Program Keahlian Seni Kreatif. Buku ini disusun berdasarkan pada Fase F Kurikulum Merdeka. Buku ini berisi materi pembelajaran yang membekali peserta didik dengan pengetahuan dan keterampilan pada bidang Desain Komunikasi Visual. Buku ini juga mendorong peserta didik untuk memiliki sikap sosial dan spiritual melalui proyek kolaborasi maupun mandiri. Selain itu, setiap proyek yang ada di buku ini juga ditujukan untuk mengasah U E peserta didik berpikir kritis dan kreatif. SI Buku ini mencakup tujuh materi: (1) proses produksi desain kemasan; (2) proses produksi desain User Interface (UI); (3) proyek desain karakter; (4) proyek pembuatan ED L A desain paper bag; (5) proyek membuat mockup packaging kemasan minuman; (6) bagaimana K cara membuat produk yang menarik; (7) video iklan layanan masyarakat. Kami menyadari buku ini masih jauh dari kesempurnaan. Oleh karena itu, usaha P perbaikan dan penyempurnaan terus kami lakukan sehingga kritik, saran dan masukan untuk perbaikan dan penyempurnaan sangat penting bagi kami. Harapan kami, buku ini dapat memberikan kontribusi yang baik bagi kemajuan pendidikan dalam rangka M mempersiapkan generasi emas bangsa yang tangguh, mandiri, dan kreatif di masa depan dalam bidang Desain Komunikasi Visual. IA Penyusun D G A E M S A R Fase F Desain Komunikasi Visual SMK/MAK Kelas XII xiv DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 14 11/7/2023 11:17:39 AM  ELEMEN DAN CAPAIAN PEMBELAJARAN Elemen Capaian Pembelajaran Prinsip Dasar Desain Pada fase F, peserta didik mampu mengaplikasikan prinsip-prinsip dan Komunikasi dalam merancang visual, di antaranya: unity (kesatuan), balance (keseimbangan), composition (komposisi), proportion (proporsi), rhythm (irama), emphasis (penekanan), simplicity (kesederhanaan), U E clarity (kejelasan), space (ruang). Peserta didik mampu memahami dan menerapkan peran komunikator, komunikan dan media komunikasi SI dalam perancangan komunikasi visual, melakukan pembiasaan kerja sesuai Prosedur Opersional Standar (POS). ED L A Perangkat Lunak Pada fase F, peserta didik mampu mengoperasikan perangkat lunak Desain yang dibutuhkan dalam lingkup Desain Komunikasi Visual, melakukan K pembiasaan kerja sesuai SOP. Perangkat lunak yang digunakan disesuaikan dengan sub konsentrasi keahlian (peminatan) dalam P lingkup Desain Komunikasi Visual: Print Design/Image Editing/Digital Imaging/Vektor/Video Editing/Motion Graphic/Desktop Publishing/ Web & App Design/UI-UX Design/3D Software/dan lainnya yang terkait. M Menerapkan Design Pada fase F, peserta didik mampu menerima, membaca, memahami, Brief dan melaksanakan perintah melalui panduan tertulis (brief) untuk IA merancang visual secara tepat dalam suatu proyek desain yang diberikan oleh pemberi tugas. Panduan/acuan tersebut meliputi: latar D belakang proyek, tujuan/obyektif yang ingin dicapai, ruang lingkup pekerjaan, khalayak sasaran yang dituju, media yang digunakan, G A E strategi kreatif dan konsep perancangan, tenggat waktu penyelesaian pekerjaan, para pihak yang terlibat dan peranannya dalam pekerjaan. M Peserta didik mampu melakukan pembiasaan sesuai POS, mampu berkolaborasi dan komunikasi dengan tim maupun pihak terkait. S A R Elemen dan Capaian Pembelajaran xv DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 15 11/7/2023 11:17:40 AM  Karya Desain Pada fase F, peserta didik mampu dalam merancang visual secara sistematis mulai dari pemahaman terhadap permasalahan, diskusi pencarian ide (brainstorming), pengembangan alternatif, hingga menjadi karya akhir. Proses tersebut dapat menggunakan metode design thinking maupun metode lainnya. Peserta didik mampu melakukan pembiasaan sesuai POS, mampu berkolaborasi dan komunikasi dengan tim maupun pihak terkait. Karya desain yang dihasilkan disesuaikan dengan sub konsentrasi keahlian (peminatan) dalam lingkup Desain Komunikasi Visual: Print Design/Videografi/Fotografi/Tipografi/Typeface Design/Story Boarding/ Ilustrasi/ Sequential Art/Motion Graphic/Web & App Design/UI-UX Design/ Concept Art/Motion Graphic Design/ Environmental Graphic U E Design/dan lainnya yang terkait. Proses Produksi Pada fase F, peserta didik mampu menerapkan dan mengelola proses SI Desain produksi desain dimulai dari pra produksi, produksi dan pasca produksi sesuai dengan konsentrasi keahlian dalam lingkup Desain ED L A Komunikasi Visual. K Peserta didik mampu melakukan pembiasaan sesuai POS, mampu berkolaborasi dan komunikasi dengan tim maupun pihak terkait. P Proses produksi desain disesuaikan dengan sub konsentrasi keahlian (peminatan) dalam lingkup Desain Komunikasi Visual: Print Design/ Videografi/Fotografi/Tipografi/Typeface Design/Story Boarding/Ilustrasi/ Sequential Art/Motion Graphic/Web & App Design/UI-UX Design/ M Concept Art/Motion Graphic Design/Environmental Graphic Design/ dan lainnya yang terkait. IA D G A E M S A R Fase F Desain Komunikasi Visual SMK/MAK Kelas XII xvi DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 16 11/7/2023 11:17:40 AM  CARA MENGGUNAKAN BUKU Judul Bab Kata Kunci Bagian ini berisi judul dan mate- Pada bagian ini, disajikan kata- ri yang akan dibahas atau kalian KATA KUNCI kata penting yang menjadi inti 1 pelajari bersama dengan teman di kelas. pembahasan materi dalam tiap bab. Apersepsi Pertanyaan Pemantik Apersepsi berisi informasi awal Pertanyaan pemantik ini digu- tentang materi yang akan dipel- U E nakan untuk menciptakan se- ajari dan pertanyaan yang me- PERTANYAAN mangat belajar kalian terhadap nyangkut kesiapan peserta didik PEMANTIK SI materi yang akan kalian pelajari. untuk mengikuti pembelajaran. Pertanyaan ini akan menuntun pemahaman materi kalian dan Materi ED L A mengembangkannya menjadi lebih baik. Kedalaman dan kelu- Pada bagian ini, kalian dapat bel- K asan materi akan dikembangkan ajar bersama dengan guru atau melalui pertanyaan pemantik ini. teman tentang materi yang dija- MATERI P barkan dari capaian pembelajar- Elemen dan Capaian Pembelajaran an. Materi ini dipaparkan secara jelas dan mudah kalian pelajari Bagian ini berisi elemen atau sehingga kompetensi kalian ma- ELEMEN & materi pokok yang dijabarkan CAPAIAN kin meningkat. M PEMBELAJARAN menjadi capaian pembelajaran yang harus kalian kuasai seba- Rangkuman IA gai kompetensi. Rangkuman ini berisi po- Tujuan Pembelajaran kok-pokok materi yang sudah dipelajari dan wajib dikuasai pe- D Tujuan pembelajaran berisi kom- serta didik. Isi rangkuman lebih petensi yang akan kalian capai singkat dan sederhana tetapi G A E setelah mengikuti pembelajaran tidak mengurangi jumlah materi bab tertentu. yang harus kalian pelajari menja- M di kompetensi yang makin baik. Peta Konsep S A Soal Tipe AKM Peta konsep berisi bagan ten- R tang konsep-konsep inti dari Pada bagian ini, kalian akan me- materi yang disajikan dalam bab. SOAL TIPE ngerjakan beberapa soal dari be- Peta konsep ini dapat memberi- berapa teks yang tersedia seba- kan gambaran materi yang akan AKM gai batang soal. Soal-soal dibuat kalian pelajari dan kuasai. dalam berbagai bentuk dan ber- kaitan dengan beberapa ruang lingkup materi. Dengan soal ini, kalian akan terbiasa mengerja- kan soal dalam berbagai bentuk. Cara Menggunakan Buku xvii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 17 11/7/2023 11:17:40 AM  Proyek Kolaborasi Asesmen Sumatif Pada bagian ini, kalian harus Asesmen sumatif berisi berba- mengejakan tugas kelompok gai soal baik pilihan ganda ma- tentang materi yang sudah di- upun uraian untuk mengukur pelajari. kemampuan peserta didik da- lam mempelajari materi sesuai dengan capaian pembelajaran. 3UR¿O3HODMDU3DQFDVLOD Pada bagian ini, kalian mengerja- Glosarium kan tugas yang berkaitan dengan materi dan dihubungkan dengan Glosarium berisi kata-kata atau elemen dalam Proyek Penguatan istilah-istilah penting dalam Profil Pelajar Pancasila. materi. Agar peserta didik lebih GLOSARIUM memahami maknanya, glosari- U E um ini menyertakan pula makna Tugas Mandiri atau penjelasan yang diperlu- SI kan. Bagian ini berisi soal atau tugas yang harus dikerjakan sendiri. Daftar Kredit Gambar ED L A Kalian mengerjakan soal uraian dengan menggunakan kalimat Pada bagian ini, kalian dapat K sendiri setelah mempelajari ma- dengan mudah menemukan teri. gambar melalui daftar yang di- P sampaikan. Tugas Kelompok Setelah mempelajari materi, Daftar Pustaka pada bagian ini kalian mengerja- M Daftar pustaka merupakan daf- kan soal- soal yang harus didis- tar berisi sumber rujukan penu- kusikan dan hasilnya dipresenta- IA lisan buku yang di dalamnya ter- sikan di depan peserta didik lain. dapat antara lain nama penulis, tahun terbit, judul buku, kota D Asesmen Formatif terbit, nama penerbit. Daftar ini bisa berasal dari buku, jurnal, G A E Asesmen formatif digunakan media digital, dan media massa untuk mengetahui capaian pe- cetak. M serta didik dalam mempelajari materi dalam bab. Soal dalam Indeks asesmen formatif dibuat ber- Indeks berisi daftar kata-kata S A variasi sehingga peserta didik kunci dan istilah penting beserta terbiasa menghadapai berbagai referensi halaman tempat kata- R jenis soal. kata dan istilah tersebut muncul. 5HÀHNVL Refleksi ini berisi pernyataan 3UR¿O3HODNX3HUEXNXDQ dan kesan peserta didik setelah mempelajari materi dalam bab. Pada bagian ini kalian dapat Refleksi bisa juga memerlukan mengetahui profil penulis buku, jawaban atas pertanyaan yang penelaah, editor, illustrator dan diajukan dan rencana tindak lan- pelaku perbukuan lainnya. jutnya dalam bentuk tabel. Fase F Desain Komunikasi Visual SMK/MAK Kelas XII xviii DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 18 11/7/2023 11:17:40 AM  BAB I PROSES PRODUKSI DESAIN KEMASAN U E SI ED L A K P M Gambar 1.1 Contoh Desain Kemasan IA Sumber: macrovector/Freepik D Menjual suatu produk baik makanan, minuman, barang elektronik, G A E atau bahkan buku, sudah memiliki tantangan sendiri jika ingin bersaing dan M membuat produk tersebut laku terjual. Selain kualitas produk yang dijual, desain kemasan produk juga merupakan hal penting yang harus diperhatikan. Kemasan yang menarik tentunya akan memikat konsumen untuk membeli suatu produk. S A Sayangnya, produsen yang menjual produk sering kali tidak bisa mengkreasikan R desain kemasan produknya. Sehingga, produsen mengalami kesulitan untuk bersaing dan memsarkan produknya. Oleh karenanya, produsen akan mencari seseorang yang memiliki kompetensi untuk menciptakan sebuah produk kemasan sesuai dengan produk yang dijual. Kalian sebagai seorang konsumen, ketika membeli suatu produk tentu akan memperhatikan desain kemasannya. Mari cari bersama perbedaan kemasan produk biasa dengan kemasan produk yang memiliki desain yang bagus. DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 1 11/7/2023 11:17:41 AM  1. Sebagai konsumen, apa yang dilihat pertama kali dari sebuah kemasan PERTANYAAN PEMANTIK produk? 2. Apa saja yang seharusnya ada di dalam sebuah produk kemasan? 3. Apa yang kamu rasakan jika menemukan suatu produk yang kamu cari, tetapi produk itu hanya dikemas menggunakan plastik transparan biasa? Elemen Capaian Pembelajaran ELEMEN & CAPAIAN Proses Produksi Peserta didik mampu menerapkan dan PEMBELAJARAN Desain mengelola proses produksi desain dimu- U E lai dari pra produksi, produksi dan pasca produksi sesuai dengan konsentrasi ke- SI ahlian dalam lingkup Desain Komunikasi Visual. Peserta didik mampu melakukan ED L A pembiasaan sesuai POS, mampu berkola- borasi dan komunikasi dengan tim mau- K pun pihak terkait. Proses produksi desain disesuaikan dengan sub konsentrasi keah- P lian (peminatan) dalam lingkup Desain Komunikasi Visual: Sequential Art/Mo- tion Graphic/Web & App Design/UI-UX Design/Concept Art/Motion Graphic De- M sign/Environmental. IA D TUJUAN PEMBELAJARAN G A E 1. Melalui pembelajaran ini siswa mampu memahami dasar desain grafis M 2. Melalui pembelajaran ini siswa mampu memahami konsep pembuatan desain kemasan S A 3. Melalui pembelajaran ini siswa mampu menerjemahkan kebutuhan R produsen produk untuk membuat desain kemasan sesuai permintaan Fase F Desain Komunikasi Visual SMK/MAK Kelas XII 2 DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 2 11/7/2023 11:17:41 AM  Pengertian Desain Grafis Software aplikasi PETA KONSEP Proses Produksi Desain Kemasan Pengantar Desain Kemasan Proses Produksi Desain Kemasan Vechif U E (Vegetable Chips with Honey Flavor) SI Proses Produksi Desain Kemasaan, Software aplikasi desain grafis, Pengantar KATA KUNCI ED L A Desain kemasan K A. PENGERTIAN DESAIN GRAFIS P Strategi pemasaran, proses penjualan dan hal lain perlu diperhatikan dalam meningkatkan nilai jual suatu produk. Strategi pemasaran produk dapat dilakukan dalam berbagai cara, yaitu dari mulut ke mulut, melalui pengumuman, menggunakan diskon, M dan juga menggunakan desain produk yang menarik. Salah satu caranya adalah dengan menggunakan desain kemasan produk yang menarik. Hal itu yang memungkinkan IA pembeli akan mengetahui produknya melalui foto yang ditampilkan dalam kemasan, nama produk, dan juga dominasi warna yang digunakan, sehingga akan mengingat bagaimana D keseluruhan kemasan produk tersebut. Salah satu tujuan menggunakan desain kemasan yang menarik adalah dapat mengomunikasikan produk antara penjual dan juga pembeli G A E secara tidak langsung. M Proses komunikasi antara penjual dan pembeli melalui desain produk kemasan yang menarik dihasilkan atau diciptakan oleh seorang desainer. Desainer dapat menjadi S A jembatan antara keduanya melalui bahasa gambar. Seorang desainer dituntut kreatif untuk menerjemahkan ide-ide dalam bentuk visual, sehingga dapat menuntun orang lain untuk R membayangkan dan mendapat gambaran secara fisik terutama pada barang yang dijualnya. Kemudian, bagaimana cara membuat desain kemasan menjadi menarik di mata pembeli? Pertama, kita perlu bahas dulu apa itu desain grafis dalam desain komunikasi visual. Desain grafis merupakan bentuk komunikasi yang dilakukan secara visual. Desain grafis akan memanfaatkan bentuk visual atau gambar tertentu yang dipadukan sebagai media dalam penyampaian pesan seefektif mungkin. BAB I Proses Produksi Desain Kemasan 3 DESAIN KOMUNIKASI VISUAL SMK XII_RM_i_xviii_T_001_238 R2.indd 3 11/7/2023 11:17:41 AM  Bentuk-bentuk visual yang dapat digunakan adalah sebagai berikut. 1. Garis (line) : tanda yang menghubungkan dua titik. 2. Bentuk (shape) : apapun yang mempunyai dimensi tinggi dan lebar. 3. Tekstur (texture) : permukaan dari suatu objek. Tekstur menambah kekayaan dimensi dan mengusulkan suasana yang berbeda. 4. Ruang (space) : jarak atau area antara sekeliling benda-benda. Ruang akan memberikan jeda pada atau istirahat pada mata. 5. Ukuran (size) : besar atau kecil suatu objek yang menarik perhatian dan dicocokkan dengan layout. 6. Nilai (value) : gelap terangnya suatu daerah. Value merefleksikan suasana hati dan U E kedalaman dari ilusi. SI 7. Warna (color) : indikator yang menyampaikan suasana hari dan menekankan hal yang penting sesuai dengan psikologis warna. ED L A Prinsip-prinsip desain akan menjadi dasar dalam membuat desain. Tujuan dari prinsip desain untuk mempengaruhi dan memberikan kenyamanan kepada orang lain K saat melihat desain. Empat prinsip desain adalah sebagai berikut. P 1. Keseimbangan (