Praktikum Multimedia 2015
-
Upload
satria-surya-wijaya -
Category
Documents
-
view
218 -
download
0
Transcript of Praktikum Multimedia 2015
-
8/18/2019 Praktikum Multimedia 2015
1/46
1
MODUL PRAKTIKUM
MULTIMEDIA
Disusun Oleh:
Tim Dosen Multimedia
JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS PALANGKA RAYA
2015
-
8/18/2019 Praktikum Multimedia 2015
2/46
2
TATA TERTIB DAN TATA LAKSANA
PRAKTIKUM MULTIMEDIA
JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK UNPAR
TATA TERTIB
1. Praktikan WAJIB mengikuti semua modul praktikum.2. Praktikan hanya boleh tidak mengikuti praktikum 1 (satu) kali DENGAN
ATAU TANPA surat izin dari jumlah pertemuan praktikum.3. Praktikan yang berhalangan mengikuti praktikum, diwajibkan melaporkan ke
dosen praktikum untuk menentukan jadwal praktikum sebagai pengganti jadwalyang berhalangan.
4. Praktikan yang lebih dari 1 (satu) kali tidak mengikuti praktikum, tidak
diperbolehkan untuk mengikuti praktikum untuk modul-modul praktikumselanjutnya dan NILAI AKHIR PRAKTIKUM adalah NOL.
5. Praktikan wajib hadir 15 menit sebelum praktikum dimulai.6. Tidak diperbolehkan saling bekerja sama.7. Dilarang menggunakan kaos oblong dan sandal jepit selama praktikum. Bagi
yang melanggar poin ini, tidak diperbolehkan mengikuti praktikum.
TATA LAKSANA
1. Sebelum praktikum dimulai, setiap praktikan wajib mengumpulkan LAPORANRENCANA PRAKTIKUM dan LAPORAN HASIL PRAKTIKUM modulsebelumnya.
2.
Jika praktikan tidak melaksanakan tata laksana poin 1, maka TIDAKDIPERBOLEHKAN MENGIKUTI PRAKTIKUM.
3. Setiap modul praktikum, akan dilakukan Pre-test .4. Format laporan meliputi:
Laporan Rencana Praktikum :
Halaman Depan Tujuan Praktikum dari modul yang akan dilaksanakan
Hal-hal yang akan dilakukan selama praktikum.
Laporan Hasil Praktikum :
Halaman Depan
Bab I. Tujuan dan Landasan Teori Bab II. Langkah Kerja
Bab III. Pembahasan
Bab IV. Kesimpulan Bab V. Daftar Pustaka
Bab VI. Lampiran (disertai laporan rencana praktikum)
5. Format Penulisan
Spasi : 1,5
-
8/18/2019 Praktikum Multimedia 2015
3/46
3
Font : Times New Roman Font Size : 12
Margins : Top 3, Left 4, Right 3, Bottom 4
Kertas : A4
6. Penilaian Laporan Hasil Praktikum : Bab I. Tujuan dan Landasan Teori Nilai 20
Bab II. Langkah Kerja Nilai 10
Bab III. Pembahasan Nilai 40
Bab IV. Kesimpulan Nilai 15
Bab V. Daftar Pustaka Nilai 5 Bab VI. Lampiran Nilai 10
Total 100
7. Praktikan yang mengabaikan format penulisan poin 5, nilai akan dikurangi 5
setiap kesalahan.
8. Penilaian Akhir Praktikum :
Pre-Test : 10%
Praktikum : 35% Laporan Praktikum : 35% Responsi : 20%
Total 100%
9. Penilaian Akhir Mata Kuliah:
Kuliah, meliputi:
Tugas : 10%UTS : 15%Praktikum : 25%
UAS : 50%
Total 100%
-
8/18/2019 Praktikum Multimedia 2015
4/46
4
Praktikum Multimedia Modul I
Pemodelan spiline untuk membuat objek 3d open suse.
I.
Tujuan1. Mahasiswa/i dapat membuat objek 3d yang lebih kompleks dengan
teknik spline modeling .
2. Mahasiswa/i dapat mengaplikasikan flow work pengerjan 3d didalam
software 3dsmax.
II. Landasan Teori
1. Spline modeling
Pemodelan mengunakan objek 2d splines dibentuk dengan
mengunakan tool pemodelan spline seperti Attach, Refine, Weld, Fuse
dll dan mengunakan modifier bevel atau extrude untuk menghasilkan
bentuk 3d yang diinginkan.
2.
Sifat Vertex
Sub-object sebuah objek spline terdiri dari 3 bagian, vertex,
segment dan spline. Vertex memiliki 4 sifat yaitu; Corner, Bezier, Bezier
Corner dan Smooth. Sifat vertex dapat mempengaruhi bentuk objek
spline sehingga dapat memudahkan dalam proses pembentukan objek
3d.
3. Flow work 3d
Langkah kerja didalam software 3d adalah sebagai berikut:
Modeling, Material Design, Lighting/Camera, Animation dan
Rendering .
III. Praktikum1. Modeling
Persiapkan gambar image logo open SUSE, gunakan gambar
dengan resolusi cukup besar untuk mempermudah proses tracing.
-
8/18/2019 Praktikum Multimedia 2015
5/46
5
Buka 3dsmax dan import gambar logo open SUSE pada viewport
front agar logo yang dibuat berada pada posisi berdiri.
Cek opsi Match Bitmap dan Lock Zoom/Pan agar image yang di
import dikunci pada proses Zoom dan Pan.
Perbesar tampilan Front viewport untuk memulai proses
pemodelan, sebelum memulai pemodelan perhatikan bahwa logo tersebut
memiliki 3 objek yaitu; objek bunglon, objek text open dan objek text
SUSE. Untuk dua objek text pemodelan dapat mengunakan objek splines
Text yang sudah disediakan oleh 3dsmax. sedangkan objek bunglon
harus mengunakan teknik pemodelan spline modeling dengan
mengunakan objek dasar line.
Buat line dasar disekitar gambar bunglon, bagian yang melengkung
dapat diedit nanti.
-
8/18/2019 Praktikum Multimedia 2015
6/46
6
Perhalus bagian yang melengkung dengan merubah sifat vertex menjadi
bezier, bezier corner atau smooth untuk mendapat bentuk lengkung yang
diinginkan. untuk membuat bagian melengkung dapat juga mengunakan
tool fillet dan bila vertex yang dibuat pada line dasar dirasakan kurang
dapat ditambah dengan insert atau refine.
-
8/18/2019 Praktikum Multimedia 2015
7/46
7
Background dapat dimatikan sementara untuk melihat hasil pemodelan
yang sudah dilakukan.
Selesaikan pemodelan pada bagian yang lainnya. hasil akhirnya dapat
dilihat seperti pada gambar dibawah ini.
Tubuh bunglon sudah berhasil dibuat, saatnya memberikan mata pada
bunglon ini dengan mengunakan Splines Circle dan Ellipse.
-
8/18/2019 Praktikum Multimedia 2015
8/46
8
Warna yang berbeda pada objek splines berarti objek splines belum
menjadi satu objek, satukan semua objek spline dengan mengunakan
Attach.
Untuk mendapatkan bentuk 3d terapkan modifier Bevel pada objekspline yang sudah kita buat sebelumnya, setting parameter Bevel
menyesuaikan.
-
8/18/2019 Praktikum Multimedia 2015
9/46
9
Tambahkan objek text open dan SUSE berikan modifier Bevel dengan
setting parameter yang menyesuaikan.
2.
Material Design
Material pada logo SUSE ada dua macam, Hijau muda dan Hijau
tua. Buka material editor 3dsmax buat lah 2 slot material dengan nama
Hijau Muda dan Hijau Tua. Gunakan material type Standard, ubah warna
Difuse sesuai warna contoh logo SUSE.
-
8/18/2019 Praktikum Multimedia 2015
10/46
10
Atur parameter Specular Level dan Glossiness untuk mendapat efek
mengkilap pada material. lalu terapkan material pada objek 3d.
3.
Lighting
Terapkan pencahayaan dengan mengunakan 2 omni dengan warna
cahaya yang berbeda sesuai keinginan mahasiswa. Pencahayaan dapat
menampilkan objek 3d dengan baik tidak gelap dan tidak terlalu terang.
-
8/18/2019 Praktikum Multimedia 2015
11/46
11
4. Animation
Buatlah animasi yang berbeda pada 3 objek 3d (Bunglon, open dan
SUSE). Animasi tiap objek dibebaskan sesuai keinginan mahasiswa.
kreatifitas dan kompleksitas animasi menjadi nilai tambah. letakan juga
camera untuk rendering menjadi format movie nantinya. Camera boleh
dianimasikan.
5.
RenderingBuatlah movie dengan format PAL durasi 10 detik dengan resolusi
720x486.
-
8/18/2019 Praktikum Multimedia 2015
12/46
12
Pratikum Multimedia Modul II
3d Animasi - Spline Modeling & Controller Animation
I.
Tujuan Pratikum1. Mahasiswa/i dapat membuat objek 3d yang lebih kompleks dengan teknik
spline modeling .
2.
Mahasiswa/i dapat membuat animasi dengan metode controller .
II. Landasan TeoriPada bagian modeling akan digunakan teknik spli ne model ing dimana
modeling tidak hanya mengunakan objek dasar tetapi objek dasar yang
dibentuk kembali sehingga menjadi objek yang seutuhnya berbeda, sedangkan
untuk proses pembuatan animasi akan mengunakan metode contr oler pathconstraint .
Logo Warner Bros yang akan dimodeling dan dianimasi
III. Pratikum
1. Modeling
Proses modeling diawali dengan meng-import sebuah file gambar dengan
logo yang diinginkan, pada praktikum ini mengunakan logo WarnerBros.
-
8/18/2019 Praktikum Multimedia 2015
13/46
13
a. Pada Front viewport import file gambar WarnerBros dengan
mengunakan shortcut keyboar alt+b, pilih file gambar, ceklist Match
Bitmap dan Lock Zoom/Pan.
b. Tracing bentuk dasar dengan mengunakan Line.
c. Lakukan editing pada beberapa vertex sehingga bentuknya
melengkung pada kedua sisi-nya. Untuk menghilangkan sementara
gambar background, klik kanan pada title viewport dan matikan ceklist
Show Background, untuk menampilkan background kembali aktifkan
ceklist Show Background.
-
8/18/2019 Praktikum Multimedia 2015
14/46
14
d. Buat ketebalan kearah dalam dengan mengunakan Outline tool.
e.
Objek pertama sudah selesai, lanjutkan dengan membuat objek W dan
B nya.
-
8/18/2019 Praktikum Multimedia 2015
15/46
15
f. Gabung semua objek spline dengan mengunakan Attach, sehingga
menjadi satu objek yang utuh.
g.
Berikan modifier Bevel untuk memberikan efek 3d, parameter bevel
bebas.
-
8/18/2019 Praktikum Multimedia 2015
16/46
16
2. Texturing
a.
Logo ini hanya mengunakan warna saja tanpa material. Rubah warnaobjek dengan warna hitam.
a. Karena objek 3d berubah warna menjadi hitam, sedangkan background
rendering juga berwarna hitam secara depault, maka warna background
di ganti dengan warna lain, ganti warna background evironment
dengan putih. Tekan 8 pada keyboard untuk membuka environment &
effect window. Ganti warna background menjadi putih.
-
8/18/2019 Praktikum Multimedia 2015
17/46
17
3.
Animation
Animasi dibuat dengan metode controler path constraint , dimana
teknik ini yang dianimasikan adalah camera bukan objek 3d-nya. Metode
ini memerlukan jalur tempat camera nanti berjalan, biasanya digunakan
objek spline sebagai track untuk camera berjalan. Untuk logo Warner
Bros ini akan dibuat animasi camera yang berputar mengelilingi objek
logo.
a. Buat Camera tipe Target pada TOP viewport , arahkan target camera
ditengah-tengah logo.
-
8/18/2019 Praktikum Multimedia 2015
18/46
18
b. Ubah view perspective menjadi view camera dengan menekan C pada
keyboard pada persfektif viewport . Atur posisi logo pas ditengah view
camera dengan mengunakan navigation tools.c.
Buat circle pada top viewport ditengah objek logo, buat diameter
circle mencapai camera.
d. Pilih camera lalu pindah ke tab Motion , Pilih Posit ion: Positi on XYZ ,
lalu klik tombol kecil bertanda (?) Assign Controler .
-
8/18/2019 Praktikum Multimedia 2015
19/46
19
e. Muncul window baru bernama Assign Positi on Controler , dari window
list ini browsing Path Constraint , lalu pilih OK.
f. Pada tab motion akan muncul tool path constraint pada bagian bawah,
lakukan scrolling ke bawah.
g. Aktifkan Add Path lalu pilih objek circle pada viewport . Dengan
metode controller, keyframing animasi otomatis dibuat oleh computer.
h. Play animasi.
i.
Coba buat variasi view dengan men-drag posisi circle ke atas (sumbu
z) dan men-drag posisi target camera kearah bawah, sehingga objek
terlihat lebih persfektif.
4. Rendering b.
Masuk ke render scene dialog pada toolbar atau shortcut f10.
c. Cek Active Time Segment
d.
Gunakan resolusi 640x480
e. Save animasi dengan format avi dengan kompresi cinepack codec by
radius.
f. Pilih camera view dan render animasi.
-
8/18/2019 Praktikum Multimedia 2015
20/46
20
Praktikum Multimedia Modul III
Video Editing – Stop Motion
A. Tujuan Praktikum
Pada tujuan praktikum multimedia tentang dasar-dasar video editing ini
bertujuan :
1. Mahasiswa dapat mengenal area kerja Video Editing, khususnya
Adobe Premeire.
2. Mahasiswa dapat membuat slide tampilan transisi yang menarik
dengan effect video transitions.
3. Mahasiswa dapat menerapkan penggunaan title dan audio dengan
menggunkan title premiere dan effects audio transitions.
4.
Mahasiswa dapat menerapkan tool dan icon pada clip workspace yang
terdapat pada Adobe Premiere.
B. Landasan Teori
Adobe premiere adalah salah satu software yang bisa gunakan
untuk menggabungkan beberapa video, gambar, suara yang nantinya
menjadi video baru. Dalam adobe premiere juga tersedia banyak fitur yang
bisa gunakan untuk mendukung dalam penyuntingan video yang dibuat.
Adebe Premeire adalah salah satu software yang popular dan di gunakan
secara luas dalam pengeditan video.
Pada dasarnya terdapat dua jenis video dalam layar komputer, yaitu:
video
analog dan video digital.
• Video Analog merupakan produk dari industri pertelevisian dan oleh
sebab itu dijadikan sebagai standar televisi Contohnya adalah: NTSC,
PAL, dan SECAM.
• Video Digital adalah produk dari industri komputer dan oleh sebab itu
dijadikan standar data digital. Contohnya adalah: AVI, MPEG, SWF,
3GP, FLV, MOV dsb.
Jalankan program Adobe Premiere Pro CS 3 (Klik Star → Program
→ Adobe Premiere), Aplikasi akan menanyakan kepada anda apakah akan
-
8/18/2019 Praktikum Multimedia 2015
21/46
21
membuka file yang telah ada atau membuat file baru untuk praktikum ini
tentu saja dengan membuat file baru.
(Jendela opsi memulai area kerja premiere)
(Setting custum project)
-
8/18/2019 Praktikum Multimedia 2015
22/46
22
Dan selanjutnya muncul windows dengan nama New Project klik pada tab
Custom Setting.
(Jendela custom setting project)
Pada frame general, anda akan membuat file video lebih baik praktikum
memilih :
- Editing mode video for windows,
- Time base 25 frame/second,
Pada frame video kita isikan :
- Frame size 720h : 576v (dengan perbandingan default 4:3)
- Frame rate : 25 fps timecode
- Pixel aspect ratio : D1/DV PAL (1.067) (Standar video di indonesia)
Pada Frame audio kita isikan :
- Sample rate 44100 Hz (standar audio quality)
- Display format audio sample
Dan apabila diperlukan praktikan dapat menyimpan settingan ini anda
tekan tombol save preset, isikan nama dan decristion yang anda inginkan,
misal : “Setting Video Praktikum” dan secara otomatis settingan tersebut kan
terlihat pada tab Load Preset , maksud dan tujuannya menyimpan setting ini
adalah dapat digunakan lagi di praktikum selanjutnya. Berikutnya simpan File
-
8/18/2019 Praktikum Multimedia 2015
23/46
23
Project (Contoh : Modul III) di drive komputer yang dirasa memiliki space
cukup besar untuk menentukan lokasi file project anda.
(Jendela kerja adobe premeire pro SC 3)
Project windows (jendela workspace) terdiri dari 3 windows utama :
1.
Project windows, merupakan tempat menyimpan file project.
2. Monitor windows, merupakan tempat melihat video yang anda edit pada
timeline.
3.
Timeline windows, tempat anda melakukan proses editing.
Pada praktikum ini kali ini anda akan di berikan latihan dalam
membuat video slow motion dimana terdapat gambar-gambar seorang
yang menunggangi kuda akan di buat menjadi sebuah seolah-olah gambar
bergerak. Video ini menerapkan video transtations berupa cross dossolve
dan audio transtations crossfade, volume dan lainnya. Di tambahkan juga
subtitle untuk memperjelas tujuan video.
C. Persiapan
Format video dan import data :
1.
Jalankan adobe premiere pro, pilih preset Video PAL yang telah dibuat
sebelumnya (kalau belum buat dulu, materi landasan teori).
-
8/18/2019 Praktikum Multimedia 2015
24/46
24
Selanjutnya tentukan lokasi folder dan file project dari video yang
telah di siapkan.
2.
Import data (footage) file, klik menu File – Import (Ctrl + I)
Materi praktikum :
1.
Gunakan file foto / gambar untuk membuat slide minimal 16 gambar
tentukan juga audio yang di perlukan untuk membuat video ber’audio ini.
2. Gunakan sampel gambar dan audio yang ada di komputer )sebagai bahan
praktikum) untuk di gunakan sebagai suara latar video yang akan di buat.
Praktikum
1.
Import file
Masukan materi yang digunakan untuk editing video ke dalam file project.
(Import gambar, audio ke dalam file project)
2. Import file project ke dalam timeline
Tahap simpelnya disini gunakan teknik Drag dan Drop file ke dalam
timeline editor, masukan gambar pada channel video 1 dan audio di
channel audio 1, selanjutnya gambar yang sudah anda pindahkan pada
timeline klik kanan dan pilih scale to frame size. Lihat monitor preview,
anda sudah dapat mengarahkan redline timeline ke awal video dan tekan
space (play di monitor) untuk melihat rancangan awal video anda.
-
8/18/2019 Praktikum Multimedia 2015
25/46
25
(Susunan video dan audio) seperti di atas
3. Berikan effects video transitions
Supaya video terlihat bagus dan hidup maka tambahkan dengan effects
video transitions (pilih effect – video transitions – dissolve – cross
dissolve) kemudian drag dan drop diantara timeline gambar dari awal
hingga akhir video. Gunakan ragam macam transisi yang di perlukan
dalam video anda, sampel plugins defauld yang sudah tersedia di adobe premiere.
4. Title (makrup) video
Tentu untuk memperjelas video ini di perlukan sebuah informasi
mengenai apa dan dan tentang apa video ini. Berikan kalimat pada video
-
8/18/2019 Praktikum Multimedia 2015
26/46
26
caranya, klik file – new title atau dengan shorcut F9 sehingga nanti akan
tampil di layar sebuah jendela baru di title, atur konfigurasi title video
anda jika sudah selesai tutup saja jendela title kemudian simpan title anda
di folder project video yang anda buat dan berikan nama, setelah itu file
title tersebut akan masuk ke dalam file material project, drag dan drop file
title tersebut dalam timeline pada channel video 3, berikan transisi title
sebagai sentuhan akhir.
5.
Setting timeline audio
Selanjutnya perlu juga ditambahkan audio yang berfungsi untuk
melengkapi editing video sehingga suasannya menjadi hidup. Caranya
-
8/18/2019 Praktikum Multimedia 2015
27/46
27
import – drag ke timeline berikan effect cross fade- Constant Gain dan
Constant power.
6.
Rendering FileKoreksi lagi video anda, putar file project preview dan amati apakah anda
rasa ada komponen yang kurang yang belum anda sisipkan. Jika sudah
tepat maka langsung di render pilih file → Export → Movie lakukan
setting sekali lagi apabila setting render video berganti jika semua sudah
OKE maka SAVE.
-
8/18/2019 Praktikum Multimedia 2015
28/46
28
Praktikum Multimedia Modul IV
Video Editing – Color Key
A.
Tujuan PraktikumPada kegiatan praktikum multimedia tentang dasar - dasar video editing,
bertujuan :
1. Mahasiswa dapat mengenal area kerja video editing, khususnya Adobe
Premiere.
2.
Mahasiswa dapat menerapkan penggunaan video Efeect keying, Color
Key.
3. Mahasiswa dapat menerapkan penggunaan video Efeect Motion.
4.
Mahasiswa dapat menerapkan penggunaaan audio dengan
menggunakan low pass.
5. Mahasiswa dapat menerapkan tool dan icon pada clip video yang
terdapat pada Adobe Premiere.
B. Landasan Teori
Untuk mengganti latar belakang clip digunakan teknik keying,
fungsinya untuk membuat transparansi, kemudian mengisi area transparan
tersebut dengan clip lain. Dalam bahasan ini kita akan mengupas teknik
Color keys. Terkadang dalam skenario terdapat adegan yang tidak
mungkin dilakukan dengan live shoot, misalnya adegan orang terbang di
angkasa. Maka untuk mengatasi kendala ini digunakan teknik keying
untuk efisiensi biaya. Pertama kita harus mengambil gambar talent (misal
orang dengan posisi telungkup seolah-olah sedang terbang) dengan
background berwarna tertentu (teknik Color keys memakai berbagai warna
misalnya warna hijau sebagai background). Kedua kita ambil gambar latar
belakang yang akan dipakai (misalnya gambar seoranng tentara sedang
menembak dengan pistol).
C. Persiapan
Format video dan Import data :
-
8/18/2019 Praktikum Multimedia 2015
29/46
29
1. Panggil premiere pro CS 3 pilih preset VCD PAL, lalu tentuka lokasi
folder dan file project dari video yang telah disiapkan.
2.
Import data file, klik menu file → import (Ctrl + I).
D.
Praktikum
1. Buat Project Video
Setting terlebih dahulu new project adobe premiere sebelum memulai
pengeditan video.
(Set Default Standar PAL)
(Customize Project)
-
8/18/2019 Praktikum Multimedia 2015
30/46
30
2. Import File
Masukan materi yang di gunakan untuk editing video ke dalam file
project.
(Import Video)
(Import video, kedalam file project)
3. Import file project ke dalam timeline
Drag dan drop file gambar (latar 1 dan 2 di channel video 1) dan (video
tentara di channel video 2).
-
8/18/2019 Praktikum Multimedia 2015
31/46
31
4. Tentukan effects video dan setting
Pada praktikum kali ini kita menggunakan efek keying (color key) (Pilih
effects → keying → color key) selanjutnya kita drug ke chanel video 1
maka anak tampil :
(Tampilan saat kita drug video ke timeline)
Selanjutnya kita kan setting pengaturan pada color key :
-
Color key kita berikan warna biru seperti warna yang ada pada
video sehingga kita bisa menghilangkan warna yang sama.
- Color tolerance kita berikan 140 atau bisa di ubah sesuai dengan
kebutuan sampai background warna biru menghilang.
Setelah selesai maka hasilnya akan berubah seperti ini :
- Untuk membuat gambar background tampak bergerak maka di
berikan efek motion Position selanjutnya kita tandai pada masing -
masing titik peruhaban dan perlu di rubah nilainya.
-
8/18/2019 Praktikum Multimedia 2015
32/46
32
(Titik pertama position 360)
(Titik kedua position 357, ulangi untuk titik berikutnya sampai akhir dari timeline
backround )
(Tampilan hasil akhir pada timeline)
-
8/18/2019 Praktikum Multimedia 2015
33/46
33
5. Rendering file
Koreksi lagi video anda, putar file project preview dan amati apakah
anda rasa ada komponen yang kurang yang belum anda sisipkan. Jika
sudah tepat maka langsung di render pilih f ile → Export → Movie
lakukan setting sekali lagi apabila setting render video berganti jika
semua sudah OKE maka SAVE.
-
8/18/2019 Praktikum Multimedia 2015
34/46
34
Praktikum Multimedia Modul V
ANIMASI SEDERHANA FLASH
I. TUJUAN
Setelah menyelesaikan modul ini, mahasiswa diharapkan mampu membuat
animasi sederhana.
II. DASAR TEORI
Flash dimulai sebagai alat bantu animasi web dan masih membekas
sebagai satu yang popular di pasaran. Pada bagian ini beberapa teknik esensial
untuk membuat animasi sederhana menggunakan Flash. Animasinya sendiri
sangat jelas. Hal pertama yang dilakukan adalah menggambar sekumpulan kotak
dan kemudian menambahkan teks pada kotak tersebut dengan sedemikian rupa
sehingga mudah dilihat pembaca.
Berikut ini merupakan beberapa hal yang perlu diketahui dalam membuat
animasi sederhana ini, yaitu:
1. Layer dan Timeline
Segala sesuatu yang diletakkan pada stage berada pada suatu layer dari
timeline. Layer digunakan untuk menentukan elemen mana yan akan muncul pada
foreground dan background , membuat urutan pemisahan visual untuk objek pada
stage.
Ketika satu layer digunakan untuk gambar statik, animasi komputer yang
dibantu oleh komputer memerlukan layer sendiri. Untuk membuat animasi yang
banyak maka diperlukan layer yang banyak pula. Layer terlihat di atas stage pada
window dokumen utama flashpada timeline.
Timeline biasanya actually terletak pada panel tersendiri, yang terletak pada
bagian atas dokumen utama window secara default . Posisi default dari panel dapat
diubah. Pada bagian ini kotak dibuat.
2. Keyframes and Tweening
Langkah awal yang dilakukan untuk melakukan animasi adalah
menambahkan keyframe kedua pada setiap layer. Keyframe merupakan hal yang
mendasar pada semua yang berdasarkan pada teknik animasi timeline Flash.
-
8/18/2019 Praktikum Multimedia 2015
35/46
35
Analogi untuk menggambarkan keyframes adalah dengan berpikir setiap
keyframes pada suatu tempat merupakan infrormasi baru pada layer.
Setelah setidaknya memiliki dua keyframes, maka barulah dapat membuat
sebuah tween. Tween merupakan instruksi ke komputer untuk mengisi seluruh
frame yang ada diantar dia keyframes yang didefinisikan. Komputer akan
menghitung perubahan yang sesuai dengan karakteristik dan secara otomatis
menambahkan elemen yang dianimasikan pada frame yang disisipkan.
3. Menyiapkan Teks untuk Animasi
Teks seringkali menjadi bagian dalam animasi. Untuk melengkapi animasi
sederhananya. Maka akan dibuat teks “Praktikum Multimedia Pada Jurusan
Teknik Informatika”. Animasi teks yang dilakukan adalah pada suatu waktu
bergerak kea rah yang berbeda. Penggunaan kotak yang dibuat adalah untuk
menarik perhatian pengguna dan animasi teks digunakan untuk melengkapi
efeknya. Animasi sederhana seperti ini bertujuan agar tujuan yang dibuat tidak
serampangan.
Ketika memilih font, pastikan memilih yang cocok untuk kebutuhannya.
Perlu dipikirkan karena dengan banyaknya font maka dapat mengganggu. Cobalah
untuk menggunakan font yang seperlunya sehingga ide dapat tersampaikan sekitar
dua atau tiga. Pastikan pula pemilihan font bias dapat diterima karena perbedaan
font sehingga tidak terjadi desain yang tidak konsisten.
Selanjutnya, ketika menggunakan ActionScript untuk mengontrol teks
pada text fields, maka font yang digunakan haruslah font yang terdapat pada
system sehingga dapat ditampilkan dengan benar. Mengurangi jumlah font dapat
menjaga ukuran file.swf tetap kecil.
4.
Strategi Animasi
Animasi yang dibuat sudah ada, tetapi sangat lambat dan membosankan.
Animasi dapat dibuatl ulang lagi dengan menentukan kecepatan munculnya teks.
Dalam hal ini urutan kata yang muncul diatur. Mulai dari awal kata sampai akhir
kata.
-
8/18/2019 Praktikum Multimedia 2015
36/46
36
5. Alpha Effect
Untuk menyelesaikan anumasi tambahkan alpha effect. Penambahan alpha
effect dilakukan pada kata “pada jurusan Teknik Informatika” untuk menampilkan
kata muncul dengan halus.
6. Motion Effects
Disainer yang sukses mengkomunikasikan sesuatu dengan berbagai
macam cara. Tema dapat dikomunikasikan melalui tipe, blok, langkah, warna, dan
pergerakan. Menggabungkan elemen-elemen ini dapat menghasilkan efek yang
kuat.
Desian motion sampai sekarang masih ada dan dilakukan. Desain motiondapat dilakukan dengan menggunakan motion guide dan easing value suatu objek.
7. Mask Effects
Penggunaan mask membuat sebagian dari suatu objek secara sementar
tidak terlihat pada suatu area. Masking membuat pengguna melihat bagian kecil
dari objek.
8. Script
Untuk menjaga movie dari perulangan, maka dibutuhkan menambah suatu
ActionScript method (yang kadang kala dipanggil dengan command atau action).
Penggunaan ActionScript akan banyak digunakan pada pembuatan animasi, tetapi
untuk sekarang yang dilakukan adalah dengan menambahkan stop( ) method
sederhana. Method tersebut ditambahkan pada keyframe terakhir pada timeline.
9. Publikasi Movie
Animasi telah selesai, tetapi hasilnya tersebut belum dapat ditampilkan
diluar lingkungan Flash sampai movie tersebut di publikasi.
Mempublikasi movie merupakan tindakan mengekspor versi komplitdari
file .fla ke tipe file lain.. Fortmat.fla digunakan hanya untuk mengedit dapal
aplikasi Flash. Publikasi flash dapat dijadikan format file.swf, bias juga berupa
halaman HTML.
-
8/18/2019 Praktikum Multimedia 2015
37/46
37
III. LANGKAH KERJA
1.
Buatlah dokumen flash baru untuk membuat animasi kotak dan teks! Aturlah
frame rate menjadi 8 fbs.
2.
Buatlah 6 layer yang nantinya akan diisikan gambar kotak disetiap layernya.
3.
Pembuatan kotak dilakukan dengan memilih menu Insert lalu New symbol
(Crtr + F8) aturlah kotak-kotak tersebuat sehingga tampilannya menjadi
sebagai berikut.
Buatlah folder Kotak untuk menyimpan layer-layer kotak yang sudah dibuat.
Warna pada kotak tersebut didapat dari pemilihan warna Tint.
4. Tambahkan frame pada frame ke 60 dengan menggunakan klik kanan pada
frame lalu memilih Insert Frame dan keyframes kedua pada frames ke 20
untuk setiap layer kotak dengan klik kanan pada frame tersebut lalu memilih
Insert Keyframes. Setelah itu pada setiap layer buatlah motion tween dengan
klik kanan pada frame lalu memilih Create Motion Tween.
-
8/18/2019 Praktikum Multimedia 2015
38/46
38
5. Pada frame pertama setiap layernya ubahlah ukutan kotak tersebut dengan W
dan H adalah 10. Jalankan movie ini dengan menggunakan Ctrl + Enter.
6. Buatlah folder teks pada layer. Kemudian buatlah layer-layer untuk teks
“Praktikum Multimedia Pada Jurusan Teknik Informatika” setiap kata satu
layer. Pembuatan teks dimulai pada frame ke 20. frame sebelumnya kosong.
Berikut ini merupakan gambaran posisi teks untuk animasi.
7. Tambahkan keyframes pada setiap layer di frame 60 dan tambahkan motion
tween sehingga teks pada akhirna menempati kotak yang ada.8.
Aturlah animasi teks agar dapat muncul satu persatu secara berurutan mulai
dari awal kata sampai dengan akhir kata. Jalankan movie ini dengan
menggunakan Ctrl + Enter.
9.
Tambahakan efek alfa pada teks “Pada”. Jalankan movie ini dengan
menggunakan Ctrl + Enter.
-
8/18/2019 Praktikum Multimedia 2015
39/46
39
10. Buatlah motion pada kata multimedia dengan menggunakan ease dan jurusan
dengan menggunakan motion guide. Jalankan movie ini dengan menggunakan
Ctrl + Enter.
11.
Buatlah layer mask pada folder teks dengan nama mask. kemudian add Mask
dengan klik kanan pada layer tersebut. Layer yang di mask adalah layer
praktikum. buatlah tween pada layer mask sehingga kata praktikum setelah
berada pada kotak tampil perbagian terlebih dahulu sebelum tampil semuanya.
12. Buatlah layer dengan nama script dan buatlah keyframes pada ahir timeline,
dan tambahkan ActionScript stop( ) method pada keyframes terakhir pada
timeline. Jalankan movie ini dengan menggunakan Ctrl + Enter.
13.
Publishlah dokumen yang telah dibuat sehingga format filenya menjadi .swf
dan sebuah halaman HTML dengan memilih dari menu File kemudian
Publish. Setting file yang akan di publish dapat dilihat pada Menu File
kemudian Publish Settings.
Tugas
Buatlah animasi dari nama anda dengan menggunakan bentuk, teks,
motion tween, ease, motion guide, mask, warna, urutan animasi, dan script yang
dibutuhkan. Publikasikanlah movie yang dibuat dalam bentuk .swf dan halaman
HTML. Pada animasi ini untuk teks ada dibuat kata yang dipecah menjadi huruf
ditiap layer.
-
8/18/2019 Praktikum Multimedia 2015
40/46
40
Praktikum Multimedia Modul VI
TOMBOL DAN INTERAKSI FLASH
I. TUJUAN
Setelah menyelesaikan modul ini, mahasiswa diharapkan mampu membuat
tombol dan menggunakannya untuk interaksi.
II. DASAR TEORI
Flash merupakan alat bantu untuk desain dan animasi, tetapi penggunaan aplikasi
ini belum dapat maksimal jika belum menyertakan elemen interaksi. Pada modul
sebelumnya script telah dibuat untuk mencegah terjadinya perulangan animasi. Padamodul ini akan dibuat buttons dan ActionScript sehingga pengguna dapat mengontrol
aplikasinya.
Cara yang paling gampang untuk menambahkan interaksi pada Flash ada;aj
dengan menggunakan tombol untuk menjalankan ActionScript. Pada modul ini akan lebih
dikhususkan pada penggunaan tombol. Berikut ini merupakan hal-hal yang perlu
diketahui dalam mengerjakan tombol dan ActionScript.
1. Tombol Sebagai Simbol
Tombol merupakan sebagai bentuk representasi dari banyak, tetapi ada
dua hal penting yang membedakannya. Perbedaannya adalah secara default
tombol tidak memiliki timeline yang penuh seperti pada grafik atau klip movie.
Malahan, tombol memiliki empat frame terpisah yang akan menemptakan pada
keadanan/ states berbagai macam tombol (penampilan default dari tombol, pada
saait mouse melewati tombol dan di klik).
Perbedaan kedua adalah tombol secara otomatis mengubah penampilannya
pada saat berinteraksi dengan pengguna sehingga state-nya berubah juga.Walaupun tombol harus diprogram dengan ActionScript untuk memberikan efek
pada movie, state tombol dan cursor feedback datur untuk pengguna.
Ketika melihat di dalam symbol tombol, timeline muncul secara unik
karena terdiri dari empat frames yang telah ditentukan. Ketiga frame yang
pertama adalah state tombol. State Up merepresantikan penampilan tombol ketika
kursor mouse tidak melewati tombol, state Over ditampilkan ketika mouse berada
-
8/18/2019 Praktikum Multimedia 2015
41/46
41
pada tombol, dan state Down ditampilkan ketika pengguna mengklik pada
tombol. State keempat merupakan state pada saat ditekan.
2. Navigasi dan Script
Setelah dapat membuat tombol maka langkah berikutnya adalah
memberikan script pada tombol yang telah dibuat. Flash akan menangani visual
feedback , termasuk kursor dan perubahan state, tetapi tombol belum operasional.
Untuk membuatnya menjadi operasianal maka dapat dibuat dengan menggunakan
bantuan script.
Navigasi dilakukan dengan menggunakan script. Kemampuan dasar untuk
menghunbungkan satu halaman dengan halaman lain dilakukan dengan
menggunakan scirpt. Pada aplikasi Flash, kemampuan user untuk menavigasikan
sekumpulan frame sangatlah mendasar dan penting. Tanpa kemampuan untuk
pergi ke frame tertentu pembuatan aplikasi hanya menjadi satu alur saja. Dengan
adanya navigasi maka dapat menuju ke bagian pada suatu movie sehingga dapat
menampilkan berbagai macam objek yang berbeda pada tiap navigasi. Tabel di
bawah ini merupakan script-script dasar yang diperlukan untuk mengerjakan
modul ini.
Action ActionScript notation Arguments
gotoAndStop gotoAndStop(arguments); Scene Name (Frame Label, Number, or
Expression)
gotoAndPlay gotoAndPlay(arguments); Scene Name (Frame Label, Number, or
Expression)
nextFrame nextFrame(); None
prevFrame prevFrame(); None
nextScene nextScene(); None
prevScene prevScene(); None
play play(); None
stop stop(); None
stopAllSounds stopAllSounds(); None
getURL getURL(arguments); url, target frame or window, method
for form submission
-
8/18/2019 Praktikum Multimedia 2015
42/46
42
III. LANGKAH KERJA
1.
Buatlah dokumen flash baru untuk membuat tombol.
2. Buatlah kotak untuk membuat tombol dengan menggunakan shape dan resize
menjadi 100X40. Lalu buat teks dengan kata tombol dan letakkan pada bagian
dalah kotak. Lalu pilih semua objek yang ada pada stage dan pilih Menu
Modiy lalu Convert to Symbol dan pilih tipenya button. Tes movie yang
sudah ada. Berikan nama instance name-nya dengan Tombol.
3.
Pilihlah tombol kemudian framenya di tiap state dengan mengubah warna teks
dan huruf.
Jalankan movie dengan menekan Ctrl + Enter.
4. Tambahkan satu layer untuk menampilakan objek pada saat tombol ditekan.
Buatlah objek persegi panjang pada layer tersebut. pada frame pertama objek
masih tidak ada. Frame kedua memuat objek tersebut. Pada bagian layertombol, frame pertama diisi perintah:
Tombol.onRelease = function() {
gotoAndStop(2);
};
stop();
frame kedua diisi perintah:Tombol.onRelease = function() {
gotoAndStop(1);
};
5.
Jalankan movie dengan menekan Ctrl + Enter dan cobalah menekan tombol.
Tugas
1.
Buatlah 3 tombol yang masing-masing digunakan untuk menampilkan objek
yaitu lingkaran, segi empat, dan segi tiga. Beri Animasi pada tiga objek
tersebut pada saat akan ditampilkan dan berikan keterangan mengenai objek
tersebut (misalnya: nama objek, deskripsi objek, rumus mencari keliling dan
luas).
2.
Buatlah profile diri anda yang terdiri dari halaman pembuka, profile, galeri
foto, dan halaman penutup. Tombol minimal yang harus ada adalah tombol
profile, galeri, dan replay. Berikan animasi pada semua halaman dengan
-
8/18/2019 Praktikum Multimedia 2015
43/46
43
kriteria minimal seperti yang ada pada modul sebelumnya. Berikut ini
merupakan contoh informasi minimal yang harus dibuat tetapi untuk objek
yang dibuat (misalnya tombol) tidak harus seperti layout ini.
[Judul Foto]
[Foto]
Profile Galeri Foto KeluarRe la
|< < >|>
[Nama]
Jenis kelamin, Umur, Status
Tanggal lahir : []
Alamat:
Universitas:
“[Tentang saya]”
[Foto]
Galeri foto [Nama]
Detail [Nama]
Alamat :
No Telepon :
Hobi :
Tentang saya :
Profile Galeri Foto KeluarRe la
-
8/18/2019 Praktikum Multimedia 2015
44/46
44
LAPORAN RENCANA PRAKTIKUM
MULTIMEDIA
Nama :……………..
NIM :……………..
Kelas :……………..
Modul :….(.....……..)
JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS PALANGKA RAYA
2015
-
8/18/2019 Praktikum Multimedia 2015
45/46
45
LAPORAN HASIL PRAKTIKUM
MULTIMEDIA
Nama :……………..
NIM :……………..
Kelas :……………..
Modul :….(.....……..)
JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS PALANGKA RAYA
2015
-
8/18/2019 Praktikum Multimedia 2015
46/46
DAFTAR PUSTAKA
Robert Hoekman dan Jr., Rich Shupe. 2006. Flash 8: Projects for Learning
Animation and Interactivity. O'Reilly Media: the United States of
America.
Robert Reinhardt dan Snow Dowd, 2006. Macromedia Flash 8 Bible. Wiley
Publishing, Inc: the United States of America
Harahap, M. Khoiruddin. 2004. Kreasi Video Ulead Visual Studio 11 Movie
Making For Everyone. Penerbit ANDI Yogyakarta: Yogyakarta.
Daryanto, Tri. 2005. Sistem Multimedia dan Aplikasinya. Penerbit Graha ilmu:
Yogyakarta.