Senin, 10 Agustus 2020

SEMESTER 1 - B. DESAIN atau PERANCANGAN ALUR MULTIMEDIA INTERAKTIF BERBASIS WEB

 



Modul C3
Semester : I (Ganjil)
Mata Pelajaran : Desain Media Interaktif
Kelas : XII
Tingkat : SMK

Kompetensi Dasar:
  1. 3.2 Memahami (desain/perancangan alur) untuk multimedia interaktif berbasis halaman web dan media interaktif
  2. 4.2 Membuat (desain/perancangan alur) untuk multimedia interaktif berbasis halaman web dan multimedia interaktif

Memahami Desain/Perancangan Alur Multimedia Interaktif

Apa itu Desain?

Menurut kamus Bahasa Indonesia yang tertuang dalam KBBI, desain adalah a) kerangka bentuk; rancangan, b) motif; pola; corak.

Kata atau istilah desain sendiri berasa dari serapan beberapa bahasa, diantaranya bahasa Itali yaitu "designo" yang berarti gambar dan bermakna. Dalam bahasa Latin yaitu "designare" yang berarti rencana, skema, proyek.

Pengertian multimedia menurut para ahli:
  1. Dudy Wiyancoko : desain adalah semua hal yang berhubungan dengan pembuatan konsep, analisis data, project planning, cost calculation, prototying, drawaing/rendering, frame testing dan riding
  2. Andya Primanda : desain adalah sebagai upaya untuk menemukan titik tengah dari segala macam masukan yang sering kali berseberangan
  3. Dedi Nurhadiat : desain sebagai perencanaan untuk mewujudkan suatu gagasan
  4. Soekarno dan Lanawati Basuki : desain adalah suatu pola rancangan yang menjadi dasar pembuatan benda
  5. JB Reswick : desain adalah kegiatan kreatif yang melibatkan penciptaan sesuatu yang baru dan berguna yang belum ada sebelumnya
  6. Bruce Nussbaum : desain adalah wahana pembantu untuk melaksanakan inovasi pada berbagai kegiatan industri dan bisnis.
Dan masih banyak lagi pendapat-pendapat para ahli lainnya. 

Unsur-unsur dalam Desain

Unsur desain itu sendiri adalah satuan terkecil yang tersusun menjadi satu kesatuan sehingga menjadi sebuah bentuk.

Beberapa unsur-unsur dalam desain :
  1. Titik
  2. Garis
  3. Bidang
  4. Ruang
  5. Gelap-terang

Percabangan Ilmu Desain

Ilmu desain memiliki beberapa cabang, sehingga dalam penggunaannya lebih jelas dan terarah.

Sebagai contoh : seorang perancang bangunan rumah dengan perancang mesin akan berbeda walaupun sama-sama mempelajari ilmu desain. Hal itu dilihat dari out put atau yang dihasilkan oleh seorang perancang.

Beberapa ilmu yang mempelajari tentang desain adalah :
  1. Desain grafis atau DKV (desain kominikasi visual) : konsentrasi pada cabang ini adalah menyuguhkan tampilan yang menarik dalam pandangan mata untuk disuguh ke masyarakat.
  2. Desain produk : konsentrasi pada cabang ini adalah menghasilkan sebuah produk/benda pakai supaya diterima oleh pasar
  3. Desain interior : konsentrasi pada cabang ini adalah membuat suatu benda-benda yang ada di dalam rumah atau ruangan sehingga benda tersebut dalam pemanfaatannya lebih efesien, tentunya setelah desain rumah/gedung itu selesai dikerjakan
  4. Desain arsitektur : sesuai dengan namanya pada cabang ini mempunyai konsentrasi pada perancangan rumah, gedung, dan lain sebagainya.

Tahapan-tahapan Teori Desain

Sebelum melakukan pembuatan sebuah produk, seorang perancang harus memperhatikan beberapa tahapan, agar produk yang dihasilkan sesuai dengan yang dibutuhkan oleh pengguna.

Tahapan-tahapan tersebut diantaranya :
  1. Membuat konsep : merupakan buah pemikirian kreatif dari seorang perancang untuk mencapai tujuan
  2. Menentukan isi
  3. Menentukan struktur/alur seperti flowchart (lihat contoh flowchart) dan storyboard
  4. Membuat penjelasan dari isi yang terdapat pada aplikasi yang dibuat
  5. Membuat grafik
  6. Melakukan testing pada aplikasi yang telah dibuat

Prinsip-prinsip Desain Multimedia Interaktif

Seorang pengguna atau yang sering disebut end-user akan merasa senang dan nyaman apa objek ataupun produk tersebut menerapkan kaedah atau prinsip-prinsip desain.

Penerapan prinsip-prinsip desain sangat mempengaruhi visual seseorang sehingga muncul rasa penasaran dan tidak merasa bosan untuk melihatnya.

Beberapa prinsip-prinsip desain diantaranya :
  1. Keseimbangan (balance)
  2. Penekanan (emphasis)
  3. Keselarasan (harmony)
  4. Kesebandingan (proporsi)
  5. Irama (ritme)
  6. dan Kesatuan (unity)


Keseimbangan



Penekanan



Irama



Kesatuan



Kesebandingan



Keselarasan



Praktik/Tugas

  1. Carilah bentuk contoh alur diagram atau flowchart desain media interaktif
  2. Buatlah tampilan awal desain media interaktif (bisa menggunakan CorelDraw, Photosop, maupun lainnya)

SEMESTER 1 - A. PRINSIP DASAR PEMBUATAN ANIMASI 2D

 SEMESTER 1 - A. PRINSIP DASAR PEMBUATAN ANIMASI 2D




Modul C3
Semester : I (Ganjil)
Mata Pelajaran : Animasi 2D & 3D
Kelas : XI
Tingkat : SMK

Kompetensi Dasar:
  1. 3.1 Memahami prinsip dasar pembuatan animasi 2D (vektor)
  2. 4.1 Menyampaikan prinsip dasar pembuatan animasi 2D (vektor)

PRINSIP DASAR PEMBUATAN ANIMASI 2D

Apa itu Animasi?

Menurut Kamus Besar Bahasa Indonesia (KBBI), animasi adalah acara televisi yang berbentuk rangkaian lukisan atau gambar yang digerakkan secara mekanik elektronis sehingga tampak di layar menjadi bergerak.

Sedangkan menurut para ahli, seperti di bawah ini:
  1. Agus Suheri (2006:2) : bahwa animasi adalah sekumpulan gambar yang telah diolah sedemikian rupa sehingga menghasilkan gerakan
  2. Hidayatullah dkk. (2011:63) : menyatakan bahwa animasi merupakan sekumpulan gambar yang disusun secara berurutan
  3. Munir (2013:340) : animasi merupakan gambar tetap (still image) yang disusun secara berurutan dan direkam dengan menggunakan kamera.
Jika kita lihat dan merujuk pendapat dari beberapa ahli dan kamu bahasa Indonesia, kita dapat menyimpulkan bahwa gambar benda apa pun seperti hewan, manusia, tumbuhan, air, udara dan lain sebagainya dapat kita gerakkan. 

Contoh lainnya seperti kita membuat perputaran sebuah planet, kejadian/bencana alam, ataupun imajinasi manusia itu sendiri dapat diwujudkan dalam bentuk animasi untuk mendapatkan sebauh bentuk ataupun kepastian dari sebuah ide.

Kecepatan dari sebuah gambar yang telah disusun tergantung pada rentang waktu yang ditetapkan oleh si pembuat animasi yang dimaksud.

Artinya pemakaian rentang waktu yang banyak akan menghasilkan gerakan yang lambat, begitupun sebaliknya, jika rentang waktu yang ditetapkan sedikit maka pergerakan dari sebuah gambar akan semakin cepat.

Sumber bahan gambar pada animasi dalam bentuk gambar berjenis vektor dan bitmap.

Unsur gambar vektor tersusun atas garis dan kurva. Gambar jenis ini tidak tergantung pada resolusi, artinya gambar tidak mudah pecah saat diperbesar dan tetap real.

 
Gambar jenis vektor

Sedangkan gambar bitmap sangat terbatas karena mempunyai ukuran yang tetap dan bergantung pada sebuah resolusi yang dalam hal ini adalah pixel yang biasa disebut dengan bit. Artinya gambar dengan jenis ini akan pecah apabila gambar diperbesar.

 
Gambar jenis bitmap



12 Prinsip Dalam Membuat Animasi 2D

Pada tahun 1930, Frank Thomas dan Ollie Jhonston animator Walt Disney Studios untuk pertama kalinya memperkenalkan 12 prinsip dasar animasi.

Ke 12 prinsip animasi pada dasarnya mengambil dari sebuah teori ilmu fisika yang diterapkan ke dalam animasi.

Penggunaan ke 12 prinsip animasi adalah untuk menghidupkan karakter gambar animasi, sehingga seolah-olah gambar tersebut hidup.

Pada saat ini produsen film animasi bukan hanya di luar negeri, dalam negeri sendiri telah bermunculan dan itu sangat membanggakan buat kalian yang suka dengan animasi

Ke 12 prinsip dalam pembuatan animasi 2D adalah sebagai berikut :
  1. Timing (waktu)
  2. Ease In and Ease Out
  3. Arcs
  4. Follow Throught and Overlapping Action
  5. Secondary Action
  6. Squash and Stretch
  7. Exaggeration
  8. Straight Ahead and Pose to Pose
  9. Anticipation
  10. Stagging
  11. Personality
  12. Appeal
Sebelum kalian membuat karakter di komputer alangkah baiknya buatlah sket terlebih dahulu pada selembar kertas sebagai langkah awal untuk belajar.

Dalam menggambar atau membuat sket bisa dengan melihat objek seperti tumbuhan, binatang, manusia, bebatuan atau apapun. Ambillah objek yang menurut kalian mudah.


Praktik/Tugas

  1. Carilah penjelasan dari ke 12 prinsip animasi 2D tersebut
  2. Jelaskan/berikan gambaran di depan teman-temanmu dari masing-masing prinsip tersebut.

SEMESTER 1 - B. TEKNIK PEMBUATAN GAMBAR OBJEK & TEKNIK ANIMASI TWEENING 2D

 

SEMESTER 1 - B. TEKNIK PEMBUATAN GAMBAR OBJEK & TEKNIK ANIMASI TWEENING 2D




Modul C3
Semester : I (Ganjil)
Mata Pelajaran : Animasi 2D & 3D
Kelas : XI
Tingkat : SMK

Kompetensi Dasar:
  1. 3.2 Menerapkan teknik pembuatan gambar objek sederhana menggunakan aplikasi animasi 2D
  2. 4.2 Membuat gambar objek sederhana menggunakan aplikasi animasi 2D
  3. 3.3 Menerapkan teknik animasi tweening 2D
  4. 4.3 Membuat animasi 2D menggunakan teknik tweening

TEKNIK ANIMASI TWEENING 2D

Sebelum masuk pada pembahasan materi , kita ketahui terlebih dahulu pada materi yang akan dibahas ada 2 (dua) hal, yaitu tentang teknik membuat gambar objek dan penerapan teknik animasi tweening.

Itulah yang harus dicapai oleh siswa pada materi ini.


Mengenal Objek

Apa itu Objek?

Kata objek sendiri yang tertuang dalam Kamus Besar Bahasa Indonesia (KKBI) tergantung pada spesifikasinya. 

Sebagai contoh objek alam, objek wisata, objek budaya, dan lain sebagainya. Oleh karena itu pada pembahasan ini kata objek yang digunakan adalah objek material.

Objek material dalam KKBI adalah benda atau hal yang menjadi objek atau bidang ilmu.

Dalam pembuatan animasi pada pembahasan materi sebelumnya dapat berupa suara, teks dan gambar yang bisa digunakan untuk mengontrol movie.

Dalam pembuatan objek, kita bisa membuatnya langsung menggunakan Adobe Flash yang sekarang telah berganti nama menjadi Adobe Animate maupun apalikasi lainnya seperti Adobe Ilustrator, CorelDraw dan lain sebagainya.

Sebagai contoh disini adalah membuat orang sedang berjalan. Tentu kita semua tahu yang terdapat pada tubuh manusia (yang terlihat) tentuya merupakan bagian yang penting seperti kepala, tangan, badan dan kaki.


Bagian-bagian tubuh tersebut harus dibuat secara terpisah. Tangan kanan dan tangan kiri harus dibuat secara terpisah begitu pula dengan kaki.


Pada masing-masing bagian tubuh yang telah dibuat bisa diletakkan pada masing-masing layer dan disusun menjadi satu kesatuan sehingga membentuk tubuh yang utuh.

Dalam membuat objek tersebut dapat memanfaatkan fungsi Brush Tool (atau tekan huruf B di keyboard).
Untuk lebih jelasnya pembuatan objek sederhana baik di Adobe Flash maupun di CorelDraw nanti akan admin buatkan tutorialnya.

Membuat Animasi Tweening

Apa Itu Tweening?

Membuat pergerakan animasi dengan memberikan perubahan posisi maupun bentuk dengan menentukan kunci frame (keyframe) awal dan akhir sehingga membentuk frame-frame yang baru.

Fungsi Tweening adalah menggerakkan objek dari satu titik ke titik lainnya.

Dalam menggerakkan benda dapt menggunakan fasilitas Create Motion Tween, Create Shape Tween atau Create Classic Tween.

Pada dasarnya penggunaan Tween dapat menghemat waktu bagi seorang animator, karena tidak perlu membuat perubahan objek secara rinci. Dengan menggunakan Tween seorang animator cukup dengan memberi kunci gambar pada frame awal dan frame akhir. Seperti contoh di bawah ini.

Seperti pada contoh gambar di bawah ini, menggambarkan perubahan objek dan posisi objek setelah menggunakan Create Shape Tweening.



Pada contoh gambar di atas menunjukkan pergerakan sekaligus perubahan pada sebuah objek. Kunci pergerakan objek tersebut terdapat pada frame 1 dan frame 30.

Diantara frame 1 dan frame 30 merupakan gambaran perubahan objek pertama ke objek berikutnya

Perhatikan dengan seksama pada gambar di bawah ini.


Layer

Dalam pergerakan animasi merupakan sekumpulan frame-frame yang terdapat pada layer. Setiap frame digunakan untuk menempatkan sebuah objek.

Untuk melakukan perubahan atau pergerakan setiap objek dapat menggunakan perintah Insert Frame, Insert Keyframe atau pun Insert Blank Keyframe




Praktik/Tugas

  1. Buatlah gambar objek sederhana sebagai gambar kunci
  2. Susunlah masing-masing gambar tadi dan jalankan.