PERTEMUAN 2

Computer Graphic 2Computer Graphic 2

NOMOR KODE/SKSNOMOR KODE/SKS: VCD0029 / 3 SKS / Semester III - Agustus 2010 / 13 Week: VCD0029 / 3 SKS / Semester III - Agustus 2010 / 13 Week

DOSEN PEMBINADOSEN PEMBINA: Andre Oentoro: Andre Oentoro: Rudi Margono: Rudi Margono

TUTORTUTOR: Agus Susanto: Agus Susanto: David Junaedi: David Junaedi

PERTEMUAN 2

PERTEMUAN 4

TUJUAN INSTRUKSIONAL KHUSUS

Mahasiswa mampu membuat animasi 2D secara interaktif dan berinteraksi dengan pengguna

PERTEMUAN 2

PEMBAHASAN PROJECT

• SILAHKAN PRESENTASIKAN TUGAS DIDEPAN BERSAMA DENGAN KELOMPOK

PERTEMUAN 2

LANJUTAN ACTIONSCRIPT

• Selain perletakan actionscript pada frame, yang telah kita pelajari pada pertemuan sebelumnya, actionscript juga dapat diletakkan pada tombol (button) atau movieclip tertentu.

• Untuk melakukan kontrol pada jalannya animasi, dapat digunakan perintah actionscript yang telah diletakkan pada sebuah tombol.

• Tombol disini bisa berupa Button atau Movieclip

• Bagaimana perintah actionscript dapat diletakkan pada frame didalam tombol?

PERTEMUAN 2

FORMAT ACTIONSCRIPT

• Untuk membuat sebuah movieclip bisa berfungsi sebagai tombol, dapat kita gunakan perintah on(rollover) dan on(release)

on(rollover)on(rollout)on(press)on(release)

adalah perintah actionscript yang harus diletakkan pada movieclip atau button.

PERTEMUAN 2

FORMAT ACTIONSCRIPT

contoh:

on(rollover) {stop();}

on(rollout) {play();}

on(release) {gotoAndPlay(30);}

PERTEMUAN 2

FORMAT ACTIONSCRIPT

• Pada pertemuan sebelumnya, kita telah mengenal bagaimana cara penulisan nama instance dalam actionscript

• Selain nama instance, dapat juga digunakan penanda lain, yang dikenal sebagai ‘identifiers’

• Identifiers yang umum digunakan selain nama adalah:_root_parentthis_level0

PERTEMUAN 2

FORMAT ACTIONSCRIPT

• Perhatikan penggunaan ";" pada akhir perintah, apabila kita hendak meletakkan beberapa perintah secara berurutan pada sebuah frame/symbol, maka tanda tersebut digunakan untuk membedakan antara satu perintah dengan perintah selanjutnya.

• Untuk mempermudah pengecekan, dapat digunakan tombol check spelling dan check syntax pada bagian atas Actions Window.

PERTEMUAN 2

FORMAT ACTIONSCRIPT

• Selain itu, ada juga tanda lain yang berguna untuk memberikan komentar, atau umumnya disebut remarks pada actionscript.

• Tanda // berfungsi untuk menandai bahwa karakter dalam baris yang sama adalah remarks

• Tanda /* dilanjutkan dengan */ berfungsi untuk menandai bahwa karakter yang terletak didalamnya adalah remarks

• Selain itu ada juga perintah lainnya, untuk bantuan yang dapat dilihat pada sebelah sidebar sebelah kiri pada Actions Window.

PERTEMUAN 2

KONTROL MOVIECLIP

Pada contoh berikut, kita akan melihat bagaimana membuat button yang digunakan untuk melakukan kontrol pada animasi sebuah movieclip

Selain itu juga movieclip yang digunakan untuk melakukan kontrol pada animasi movieclip.

PERTEMUAN 2

TIME BASED ACTION

Dalam Adobe Flash, kita dapat menjalankan dan menghentikan sebuah timeline dengan actionscript. Action yang diletakkan pada timeline/frame, disebut sebagai time based action.

Apabila menggunakan action ini, kita dapat menentukan KAPAN action tersebut dijalankan, berdasarkan pada nomor frame dimana action tersebut diletakkan.

Time Based Action dapat ditambahkan perintah lain seperti IF dan ELSE untuk membantu kontrol.

PERTEMUAN 2

EVENT BASED ACTION

Selain itu, ada juga event based action yang memerlukan interaksi dari pengguna sebelum action tersebut dilakukan. Sebagai contoh, adalah interaksi pengguna dengan mouse.

Selain mouse, masih banyak trigger lain yang bisa digunakan dalam Flash, seperti: penekanan tombol pada keyboard, selesainya sebuah lagu MP3, atau movie FLV, dsb…

PERTEMUAN 2

MASK

• Sebuah layer akan berubah menjadi mask dan menyembunyikan semua bidang dari layer dibawahnya, kecuali bidang yang tertutup oleh gambar pada layer mask tersebut.

• Sebuah layer mask dapat memiliki beberapa layer yang diletakkan dibawahnya.

• Sebuah layer hanya dapat memiliki sebuah layer mask.

PERTEMUAN 2

MASK

• Layer mask dapat berupa benda diam ataupun bergerak.

• Apabila dianimasikan, lebih baik symbol yang digunakan berupa movieclip.

• Dengan animasi movieclip, kita dapat membuat berbagai macam kreasi dengan menggunakan layer mask.

PERTEMUAN 2

MASK

• Layer mask akan secara otomatis dikunci pada saat kita menambahkan sebuah layer dibawahnya.

• Apabila layer mask tidak dikunci, maka kita dapat melakukan perubahan pada bentuk yang ada didalamnya.

• Layer mask yang tidak dikunci tidak akan menampilkan layer yang ada dibawahnya.

PERTEMUAN 2

GUIDE LAYER

• Layer yang diperuntukkan sebagai Guide Layer tidak akan nampak pada animasi yang sudah dipublish.

• Guide Layer, dapat digunakan sebagai garis pembantu dilayar pada saat melakukan layouting, atau digunakan sebagai Guiding Path, dimana gerakan sebuah benda akan mengikuti Guiding Path tersebut.

• Untuk menggambar, dengan mengimport gambar Bitmap kedalam layer guide, kita dapat melakukan tracing pada gambar tersebut.

PERTEMUAN 2

GUIDE LAYER

• Sebuah layer guide dapat memiliki beberapa layer yang terikat padanya.

• Sebuah layer hanya dapat memiliki sebuah layer guide saja.

• Apabila layer guide tersebut diubah, maka layer yang berada dibawahnya harus diset ulang agar kembali teratur.

PERTEMUAN 2

GUIDE LAYER

• Beberapa obyek bisa dikaitkan pada sebuah layer guide

• Benda yang dikaitkan pada guide AKAN SELALU mengambil jarak yang terdekat untuk mencapai sasaran

• Benda yang diletakkan pada layer dibawah Guiding Path, bisa diatur agar berputar sesuai dengan arah path yang ada.

PERTEMUAN 2

TUGAS

• Tugas intro akan dikumpulkan pada pertemuan ke 5, minggu depan

• Project Khusus, buat kartu lebaran untuk dikumpulkan minggu depan. Tugas kelompok. Untuk 3 kelompok (total 6 kelompok) dengan hasil terbaik akan di beri tambahan nilai +15 untuk UTS.