Kali ini kita akan memodifikasi tutorial scrolling background dengan motion tween. Kita akan membuat background bergerak hanya jika tombol panah kanan/kiri pada keyboard ditekan.
1. Bukalah fla dari tutorial scrolling background dengan motion tween.
2. Tekan tombol insert layer pada timeline sehingga akan muncul layer baru bernama Layer 2. Klik frame 1 Layer 2 kemudian buatlah sebuah lingkaran kecil berwarna kuning dengan hitam sebagai warna garisnya.
3. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan pemain sebagai name dan movie clip sebagai type lalu tekan ok.
4. Seleksi movie clip pemain di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkanpemain sebagai instance name. Letakkan movie clip pemain ini pada stage bagian kiri atas.
5. Klik frame 1 Layer 2 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
//membuat variable kecepatan dengan nilai 2
kecepatan = 2;
//membuat variable angka dengan nilai 1
angka = 1;
//perintah yang dijalankan jika frame pada movie clip pemain dimainkan
pemain.onEnterFrame = function() {
//jika tombol panah kiri pada keyboard ditekan
if (Key.isDown(Key.LEFT)) {
//koordinat x movie clip ini dikurangi nilai variable kecepatan
this._x -= kecepatan;
//nilai variable angka dikurangi 1
angka--;
//jika nilai variable angka kurang dari 1
if (angka<1) {
//ubah nilai variable angka menjadi jumlah frame pada timeline scene 1
angka = _totalframes;
}
}
//jika tombol panah kanan pada keyboard ditekan
if (Key.isDown(Key.RIGHT)) {
//koordinat x movie clip ini ditambah nilai variable kecepatan
this._x += kecepatan;
//nilai variable angka ditambah 1
angka++;
//jika nilai variable angka lebih dari jumlah frame pada timeline scene 1
if (angka>_totalframes) {
//ubah nilai variable angka menjadi 1
angka = 1;
}
}
//jika tombol panah atas pada keyboard ditekan
if (Key.isDown(Key.UP)) {
//koordinat y movie clip ini dikurangi nilai variable kecepatan
this._y -= kecepatan;
}
//jika tombol panah bawah pada keyboard ditekan
if (Key.isDown(Key.DOWN)) {
//koordinat y movie clip ini ditambah nilai variable kecepatan
this._y += kecepatan;
}
//mainkan frame pada scene 1 sesuai nilai pada variable angka
gotoAndStop(angka);
};
6. Tekan Ctrl+Enter untuk melihat hasilnya.
7. Tekan tombol panah kanan/kiri untuk menggerakkan pemain dan bakground ke kanan/ke kiri. Tekan tombol panah atas/bawah untuk menggerakkan pemain ke atas/ke bawah.
Pada tutorial kali ini kita akan membuat animasi awan. Tutorial ini dapat digunakan dalam sebuah game, misalnya game pesawat terbang. Terdapat 2 buah pilihan, menggunakan movie clip di stage atau menggunakan metode attchMovie.
AWAN MOVIE CLIP
1. Buatlah sebuah flash document dengan biru sebagai warna stagenya.
2. Buatlah sebuah awan seperti gambar di bawah ini :
3. Seleksi awan tersebut dan tekan F8. Pada panel yang muncul masukkan awan sebagai name dan movie clip sebagai type serta titik registrationnya berada di tengah-tengah lalu tekan ok.
4. Seleksi movie clip awan di stage lalu tekan Ctrl+D sebanyak 3 sehingga muncul 4 buah movie clip awan di stage.
5. Seleksi movie clip awan pertama di stage dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan awan1 sebagai instance name. 6. Seleksi movie clip awan kedua di stage dan pada panel properties masukkan awan2 sebagai instance name.
7. Seleksi movie clip awan ketiga di stage dan pada panel properties masukkan awan3 sebagai instance name.
8. Seleksi movie clip awan keempat di stage dan pada panel properties masukkan awan4 sebagai instance name.
9. Atur letak keempat buah movie clip awan tadi seperti gambar di bawah ini :
10. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
1. Buatlah sebuah flash document dengan biru sebagai warna stagenya. 2. Buatlah sebuah awan seperti gambar di bawah ini :
3. Seleksi awan tersebut dan tekan F8. Pada panel yang muncul masukkan awan sebagai name dan movie clip sebagai type serta titik registrationnya berada di tengah-tengah lalu tekan ok.
4. Klik kanan movie clip di stage dan pilih Edit untuk masuk ke dalam stage.
5. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
1
kecepatan = random(4)+1;
6. Tekan Ctrl+E untuk kembali ke stage scene 1.
7. Hapus movie clip awan dari stage. Buka panel library dengan menekan Ctrl+L. Klik kanan movie clip awan dan pilih Linkage.
8. Pada panel yang muncul berikan tanda centang/contreng pada Export for ActionScript dan masukkan awan sebagai Identifier lalu tekan ok.
9. Klik frame 1 dan pada panel actions yang muncul masukkan script berikut :
Password digunakan untuk melindungi data-data agar hanya bisa dibuka oleh pemiliknya saja. Hal serupa dapat kita lakukan di Flash. Kita dapat membuat sebuah form Password yang kita tempatkan saat swf tampil sehingga ketika password yang dimasukan salah maka swf tidak bisa dijalankan. Tutorial mengenai bentuk dasar form password tersebut dapat anda lihat di bawah ini :
1. Buatlah 3 buah Blank Keyframe (seleksi 3 buah frame lalu tekan F7) dan berikan script berikut pada ketiga Blank Keyframe tersebut :
1
stop();
Gambar Blank Keyframe yang telah diberi script stop();
2. Pilih frame 1 dan buatlah sebuah Static Text bertuliskan Password:
3. Buatlah sebuah Input Text dengan Var : jawaban. Berikan angka 11 pada Maximum characters (hal ini akan membuat jumlah huruf/angka yang dapat dimasukan di Input Text hanya 11 karakter) dan ubah Line type menjadi Password (hal ini akan membuat huruf/angka yang dimasukkan tulisannya akan berbentuk * , jika anda tidak ingin tulisannya berbentuk * maka pilih Single Line sebagai Line Type)
Gambar Properties Input Text
4. Masih di Frame 1 buatlah sebuah Symbol Button bertuliskan OK dan masukan script berikut pada Button tersebut :
Kita bisa menggerakan objek dengan mouse ataupun dengan keyboard. Di tutorial ini kita akan menggunakan keyboard sebagai pengontrolnya. Tombol yang digunakan pun yang sudah umum digunakan yaitu tombol panah atas, kanan, kiri, bawah.
1. Buatlah objek yang akan digerakan, sebagai contoh saya menggunakan sebuah lingkaran.
2. Seleksi lingkaran tadi lalu tekan F8. Pada kotak dialog yang muncul pilih Movie Clip sebagai type lalu tekan OK
3. Seleksi movie clip yang baru dibuat tadi lalu tekan F9. Pada kotak actions yang muncul tuliskan script di bawah ini :
onClipEvent (load) {
kecepatan = 10;
}
onClipEvent (enterFrame) {
//ketika tombol panah kiri pada keyboard ditekan
if (Key.isDown(Key.LEFT)) {
//posisi x movie clip ini akan dikurangai kecepatan / movie clip ini bergerak ke kiri
_x -= kecepatan;
}
//ketika tombol panah kanan pada keyboard ditekan
if (Key.isDown(Key.RIGHT)) {
//posisi x movie clip ini akan ditambah kecepatan / movie clip ini bergerak ke kanan
_x += kecepatan;
}
//ketika tombol panah atas pada keyboard ditekan
if (Key.isDown(Key.UP)) {
//posisi y movie clip ini akan dikurangai kecepatan / movie clip ini bergerak ke atas
_y -= kecepatan;
}
//ketika tombol panah bawah pada keyboard ditekan
if (Key.isDown(Key.DOWN)) {
//posisi y movie clip ini akan ditambah kecepatan / movie clip ini bergerak ke bawah
_y += kecepatan;
}
}
Berikut ini pengembangan dari tutorial dasar maze game. Di permainan ini kita akan menggerakan 2 pemain sekaligus dalam sebuah maze.
1. Buatlah sebuah flash document.
2. Buatlah sebuah garis persegi.
3. Buatlah beberapa garis seperti gambar dibawah ini :
4. Kemudian warnai seperti gambar di bawah ini :
5. Seleksi seluruh objek, kemudian tekan F8. Pada panel yang muncul masukkan Dinding sebagai name dan movie clip sebagai type lalu tekan ok.
6. Seleksi movie clip Dinding kemudian tekan Ctrl+F3. Pada panel properties yang muncul ketikkan dinding di dalam kotak instance name.
7. Letakkan movie clip Dinding ditengah-tengah stage.
8. Buatlah sebuah lingkaran berwarna merah kemudian tekan F8. Pada panel yang muncul masukkan Pemain1sebagai name dan movie clip sebagai type lalu tekan ok.
9. Seleksi movie clip Pemain1 kemudian pada panel properties, ketikkan pemain1 di dalam kotak instance name.
10. Buatlah sebuah lingkaran berwarna biru kemudian tekan F8. Pada panel yang muncul masukkan Pemain2sebagai name dan movie clip sebagai type lalu tekan ok.
11. Seleksi movie clip Pemain2 kemudian pada panel properties, ketikkan pemain2 di dalam kotak instance name.
12. Letakkan movie clip Pemain1 dan Pemain2 seperti gambar di bawah ini :
13. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :
stop();
//jari-jari pemain
jarijari1 = pemain1._width/2;
jarijari2 = pemain2._width/2;
//kecepatan pemain bergerak
kecepatan = 5;
onEnterFrame = function() {
//jika tombol panah kiri ditekan
if (Key.isDown(Key.LEFT)) {
//pemain1 dan pemain2 bergerak ke kiri
pemain1._x -= kecepatan;
pemain2._x -= kecepatan;
}
//jika tombol panah kanan ditekan
if (Key.isDown(Key.RIGHT)) {
//pemain1 dan pemain2 bergerak ke kanan
pemain1._x += kecepatan;
pemain2._x += kecepatan;
}
//jika tombol panah atas ditekan
if (Key.isDown(Key.UP)) {
//pemain1 dan pemain2 bergerak ke atas
pemain1._y -= kecepatan;
pemain2._y -= kecepatan;
}
//jika tombol panah bawah ditekan
if (Key.isDown(Key.DOWN)) {
//pemain1 dan pemain2 bergerak ke bawah
pemain1._y += kecepatan;
pemain2._y += kecepatan;
}
//membuat pemain1 tidak dapat melewati dinding
while (dinding.hitTest(pemain1._x, pemain1._y+jarijari1, true)) {
pemain1._y--;
}
while (dinding.hitTest(pemain1._x, pemain1._y-jarijari1, true)) {
pemain1._y++;
}
while (dinding.hitTest(pemain1._x-jarijari1, pemain1._y, true)) {
pemain1._x++;
}
while (dinding.hitTest(pemain1._x+jarijari1, pemain1._y, true)) {
pemain1._x--;
}
while (dinding.hitTest(pemain1._x-jarijari1, pemain1._y+jarijari1, true)) {
pemain1._x++;
pemain1._y--;
}
while (dinding.hitTest(pemain1._x+jarijari1, pemain1._y-jarijari1, true)) {
pemain1._x--;
pemain1._y++;
}
while (dinding.hitTest(pemain1._x-jarijari1, pemain1._y-jarijari1, true)) {
pemain1._x++;
pemain1._y++;
}
while (dinding.hitTest(pemain1._x+jarijari1, pemain1._y+jarijari1, true)) {
pemain1._x--;
pemain1._y--;
}
//membuat pemain2 tidak dapat melewati dinding
while (dinding.hitTest(pemain2._x, pemain2._y+jarijari2, true)) {
pemain2._y--;
}
while (dinding.hitTest(pemain2._x, pemain2._y-jarijari2, true)) {
pemain2._y++;
}
while (dinding.hitTest(pemain2._x-jarijari2, pemain2._y, true)) {
pemain2._x++;
}
while (dinding.hitTest(pemain2._x+jarijari2, pemain2._y, true)) {
pemain2._x--;
}
while (dinding.hitTest(pemain2._x-jarijari2, pemain2._y+jarijari2, true)) {
pemain2._x++;
pemain2._y--;
}
while (dinding.hitTest(pemain2._x+jarijari2, pemain2._y-jarijari2, true)) {
pemain2._x--;
pemain2._y++;
}
while (dinding.hitTest(pemain2._x-jarijari2, pemain2._y-jarijari2, true)) {
pemain2._x++;
pemain2._y++;
}
while (dinding.hitTest(pemain2._x+jarijari2, pemain2._y+jarijari2, true)) {
pemain2._x--;
pemain2._y--;
}
};
14. Tekan Ctrl+Enter untuk melihat hasilnya :
Gunakan tombol panah untuk menggerakan pada pemain
Cobalah untuk menggerakan pemain sampai diujung atas
15. Ketika anda memainkkannya memang akan terkesan mudah sekali dimainkan. Tapi ini hanya dasarnya saja. Anda dapat menambahkan rintangan, semisal monster atau tombak dinding, yang mana jika pemain menabraknya maka permainan akan berakhir. Sehingga game akan menjadi lebih menantang untuk dimainkan.
Proses terakhir dalam pembuatan animasi interaktif ini adalah menguji animasi dan membuat file exe pada animasi. Pengujian animasi dapat dilakukan dengan cara menekan tombol P.
Selain itu, Blender telah menyediakan satu pilihan menu yang berfungsi untuk meyimpan animasi menjadi file yang berakhiran .exe. Dengan demikian maka program yang di buat dapat langsung dijalankan di bawah sistem operasi Windows. Proses penyimpanannya dengan cara memilih file --> Save Game As Runtime pada tipe window User Preferences. Setelah itu menambah beberapa file dari folder instalasi Blender, file yang ditambahkan yaitu :
Secara default, pada saat animasi dijalankan, kamera akan berada tetap ditempatnya walaupun objek bergerak menjauhi kamera. Disini kita akan menggunakan kamera yang ditempatkan di belakang objek mobil dan mengikuti pergerakan objek mobil tersebut sehingga seolah-olah yang bergerak adalah lingkungannya.
Untuk melakukan itu diperlukan fasilitas parent. Dengan adanya parent, maka kamera akan mengikuti objek mobil kemanapun objek tersebut berpindah.
Langkah pertama yang perlu lakukan adalah mengatur pandangan kamera terhadap objek mobil. Hotkeys yang digunakan dalam mengatur kamera adalah tombol G dan R.
Tombol G digunakan untuk memindahkan posisi suatu objek dan tombol R digunakan untuk memutar suatu objek.
Untuk melihat perubahan hasil dari pengaturan kamera ini, objek harus berada pada tipe window 3D View dan dalam sudut pandang kamera dengan cara menekan tombol angka 0 pada keyboard.
Setelah melakukan pengaturan kamera, langkah selanjutnya adalah membuat parent antara objek mobil dengan kamera dengan memilih kedua objek tersebut lalu tekan Ctrl-P (make parent).
Pada bagian ini, diperlukan mesh kubus sebagai objek tambahan. Objek kubus ditempatkan tersendiri dengan tidak menyentuh objek lain.
Langkah pertamanya adalah menentukan tipe objek pada objek kubus. Penulis menggunakan static. Dengan mengatur model menjadi static, maka objek kubus tesebut akan diam, tidak terpengaruh gaya gravitasi.
Setelah itu tambahkan sensor, controller, dan actuators pada objek kubus.
Pada bagian sensor, gunakan sensor touch sehingga jika objek kubus bersentuhan dengan objek lain maka actuators akan dijalankan.Pada bagian controller, gunakan controller AND. Controller ini berguna untuk menghubungkan antara sensor dengan keyboard.
Pada bagian actuators, gunakan actuators game. Untuk pengaturan game didalam animasi, kita akan menentukan scene menjadi quit this game sehingga jika ada objek lain menyentuh objek ini maka animasi akan berhenti (exit).
Pada bagian ini, perlu memasukkan musik dengan format wav.
Langkah pertama adalah memasukkan musik ke dalam Blender dengan cara menekan konteks scene dan sub konteks sound. Kemudian tambahkan file musik yang berformat wav. Setelah itu tambahkan sensor, controller, dan actuators pada objek utama.
Pada bagian sensor, gunakan sensor always sehingga sensor ini akan diaktifkan terus menerus selama animasi dijalankan.
Pada bagian controller, gunakan controller AND. Controller ini berguna untuk menghubungkan antara sensor dengan keyboard.
Pada bagian actuators, gunakan actuators sound. Untuk pengaturan sound di dalam animasi, kita memasukkan file sound yang telah dimuat sebelumnya. Kemudian menentukan mode suara, mode suara yang dipilih adalah mode loop end sehingga musik atau suara akan terus dimainkan selama animasi dijalankan.
Untuk membuat animasi mobil, kita akan memanfaatkan fasilitas logic. Fasilitas logic dapat diakses dengan menggunakan tombol F4.
Langkah pertama yang harus dilakukan adalah menentukan tipe objek pada objek utama. Kita akan menggunakan rigid body. Rigid body dapat secara otomatis menyeimbangkan objek apabila objek tersebut berbenturan dengan objek lainnya.
Setelah itu tambahkan sensor, controller dan actuators untuk melakukan gerak interaktif pada objek.
Pada bagian sensor dibutuhkan 4 sensor keyboard dan pada masing-masing sensor keyboard itu dimasukkan key (tombol keyboard). Tambahkan tombol arah pada keyboard sehingga nanti hasilnya akan melakukan interaksi antara objek dengan pengguna.
Bagian controller juga membutuhkan 4 controller, yaitu controller AND. Controller ini berguna untuk menghubungkan antara sensor dengan keyboard.
Pada bagian actuators membutuhkan 4 actuator motion untuk mengatur pergerakan atau perputaran objek. Untuk pengaturan gerak ke arah depan, tentukan Loc sebesar 0,10 pada sumbu y dan force sebesar 1,00 pada sumbu y. Untuk pengaturan gerak ke arah belakang, tentukan Loc sebesar -0,10 pada sumbu y. Untuk pengaturan gerak ke arah kanan, tentukan Rot sebesar 0,01 pada sumbu x. Untuk pengaturan gerak ke arah kiri, tentukan Rot sebesar -0,01 pada sumbu x.
Pada bagian animasi bola, pertama-tama tambahkan mesh bola (UVsphere) sebagai objek tambahan. Kemudian tambahkan juga material pada objek bola tersebut.
Kemudian menentukan tipe objek pada objek bola. Disini menggunakan dynamic. Dengan mengatur tipe objek menjadi dynamic, maka objek bola tesebut akan dapat bergerak dan terpengaruh gaya gravitasi.
Setelah itu kita akan menambahkan sensor, controller, dan actuators pada objek bola.
Pada bagian sensor, gunakan sensor touch sehingga jika objek bola bersentuhan dengan objek lain maka actuators akan dijalankan.
Pada bagian controller, gunakan controller AND. Controller ini berguna untuk menghubungkan antara sensor dengan keyboard.
Pada bagian actuators, gunakan actuators motion. Untuk pengaturan gerak ke arah atas secara otomatis pada bola, tentukan force sebesar 250,00 pada sumbu z. Hasilnya adalah jika bola menyentuh sesuatu objek maka bola tersebut akan memantul ke atas sehingga secara otomatis akan terus memantul karena adanya gaya gravitasi.
Objek lingkungan ini hanya terdiri dari susunan mesh kubus (cube).
Langkah pertama dalam membuat objek lingkungan adalah menambahkan mesh kubus (cube) dengan cara menekan tombol spasi kemudian memilih mesh. Setelah objek ditambahkan, kita akan membesarkan ukuran kubus. Tombol S digunakan untuk memperbesar ukuran suatu objek.
Setelah objek kubus selesai dilakukan, langkah selanjutnya menambahkan susunan kubus pada sisi-sisi terluar. Pada bagian ini, menggunakan fasilitas extrude dan duplicate. Fasilitas duplicate berfungsi untuk menduplikasi sebuah objek sehingga ada satu atau lebih objek yang mirip dengan objek aslinya. Tombol shift-D digunakan untuk melakukan duplicate.
Kemudian kita akan juga menambahkan objek pembatas atau rintangan pada objek lingkungan. Disini kita menggunakan mesh cylinder.
Hotkeys yang digunakan dalam membuat rintangan ini adalah tombol S, R, dan G.
Tombol S digunakan untuk memperbesar ukuran suatu objek.
Tombol R digunakan untuk memutar suatu objek.
Tombol G digunakan untuk memindahkan posisi suatu objek.
Langkah terakhir dalam pembuatan objek lingkungan adalah penambahan UV Unwrapping pada objek. Untuk melakukan UV Unwrapping, objek berada pada mode edit dan type draw textured. Kemudian masukkan gambar pada tipe window UV / Image Editor. Setelah gambar dimasukkan, kita kembali ke tipe window 3D view dan melakukan UVUnwrap dengan cara menekan tombol U.
Seperti sudah dijelaskan sebelumnya, objek utama disini yaitu sebuah objek mobil.
Langkah pertama setelah perangkat lunak Blender dijalankan adalah memasukkan gambar mobil dua dimensi, yang digunakan sebagai contoh dalam pembuatan mobil tiga dimensi di Blender. Sehingga jika proses pembuatan mobil tiga dimensi selesai dilakukan, maka gambar ini akan dihilangkan dari layar kerja Blender.
Kemudian menambahkan sebuah mesh yang berupa papan (plane) dan membentuk plane tersebut hingga menjadi sebuah mobil dua dimensi dengan menggunakan fasilitas seleksi. Fasilitas seleksi dilakukan pada mode edit. Untuk merubah mode dari mode objek ke mode edit dapat menggunakan tombol tab. Sebelum melakukan seleksi, terlebih dahulu digunakan fasilitas subdivide pada bagian panel konteks editing pada Blender. Penggunaan fasilitas ini untuk memperbanyak titik atau vertex pada plane sehingga dapat mempermudah pembuatan mobil dua dimensi.
Setelah proses pembuatan mobil dua dimensi selesai dilakukan, langkah selanjutnya adalah mengunakan fasilitas extrude, yaitu fasilitas dalam Blender yang berfungsi untuk memanjangkan atau melebarkan bidang / garis / titik yang telah diseleksi. Extrude dapat digunakan dengan cara menekan tombol E pada keyboard dan hanya dapat dilakukan pada mode edit.
Kemudian kita juga menambahkan roda pada objek badan mobil yang telah dibuat. Pada bagian ini, yang ditambahkan adalah mesh cylinder dan dalam proses penambahan mesh ini berada pada mode edit.
Langkah terakhir dalam pembuatan objek mobil adalah penambahan material pada objek agar terlihat lebih menarik. Untuk menambahkan material, objek berada pada mode objek. Kemudian masuk pada konteks shading dan sub konteks material di dalam button window. Pada kolom material, kita akan menentukan warna pada objek dengan cara mengatur nilai R : 1,000, G : 0,458, B : 0.000 sehingga hasil yang didapatkan adalah warna orange.
