Pengantar Flash Adobe flash atau sebelumnya Macromedia Flash merupakan software multifungsi.

Terlepas dari fungsi awalnya, yaitu mempermudah pembuatan animasi web, ternyata flash berkembang pesat hingga dapat kita manfaatkan sebagai software multi media yang luar biasa. Bahkan Flash dengan action script-nya dapat dimanfaatkan menjadi program pembuat game yang mudah dan efektif. ebelum lebih lanjut mengenai pembuatan game flash, kita harus memahami terlebih dahulu bahwa membuat game flash itu menyenangkan dan menguntungkan. Bagi sebagian orang memainkan game sangat menyenangkan, konsep inilah yang harus kita pegang yaitu kita berusaha untuk menyenangkan orang lain melalui sebuah game. emakin orang lain menikmati permainan game buatan kita, disitulah letak keberhasilan kita sebagai seorang pembuat game. !emrograman komputer pada umumnya akan sulit dipahami oleh seseorang yang awam terhadap sebuah bahasa pemrograman. "isisi lain membuat game merupakan salah satu penerapan dari ilmu pemrograman komputer. #amun kita tidak perlu berkecil hati, karena flash dan action scriptnya sangat mudah untuk dipelajari dan melalui buku ini saya berusaha membagi sedikit pengetahuan saya tentang membuat game dengan flash. Metode Memahami Buku Ini Buku ini menjelaskan sebisa mungkin tentang proses pembuatan game secara berurutan. $kutilah tutorial satu demi satu mulai dari bab awal sampai bab akhir-dan jangan anda lompati sebuah tutorial kecuali anda sudah memahaminya. Apabila anda menemui kesulitan dalam menuliskan script nantinya, anda dapat membuka file pada %" tutorial. &arena action yang dipakai dalam buku ini adalah action dasar, maka action-action pada buku ini dapat bekerja pada Action cript '.(, ).(, dan *.(. Area Kerja dalam Flash ebelum memulai proses pembuatan game, akan lebih baik jika kita mengenal siapa dan bagaimana flash itu. Area kerja Flash +m,, m, )((-, dan flash ./ pada dasarnya terdiri atas beberapa komponen yaitu Menu, Toolbo,, Timeline, tage dan !anel.

Menu berisi kontrol untuk berbagai fungsi seperti membuat, membuka, menyimpan file, dan sebagainya sesuai dengan menu yang ditampilkan. Stage adalah area persegi empat yang merupakan tempat dimana kita membuat obyek animasi atau aplikasi yang akan di jalankan. Toolbox berisi menu untuk membuat atau menggambar bentuk . Toolbo, terbagi menjadi empat bagian yaitu drawing tool, 0iew, color, dan option Timeline adalah tempat kita dapat membuat dan mengontrol obyek dan animasi. Panel berisi kontrol fungsi yang dipakai dalam Flash yaitu untuk mengganti dan memodifikasi berbagai properti obyek animasi dengan cepat

Dasar Penulisan Action Script dalam Flash Macromedia Flash memiliki fasilitas berupa Action cript, yang dapat kita

manfaatkan sebagai media dalam membuat suatu program aplikasi, multimedia, %" interaktif bahkan game. Macromedia Flash memiliki ratusan script dengan fungsi yang berbeda-bedaakan tetapi yang sering digunakan hanya beberapa script saja, sehingga akan memudahkan kita apabila kita masih awam terhadap Flash maupun Action cript-nya. "alam Flash terdapat dua mode panel penulisan script yaitu mode normal dan mode e,pert. !ada dasarnya mode e,pert lebih mudah untuk dipelajari daripada mode normal, sehingga seluruh action pada tutorial di dalam buku ini ditulis dalam mode e,pert.

!ilihan mode e,pert dalam flash Pola Penulisan Action Script dalam Flash Action script dalam flash dapat dituliskan pada * tempat yaitu pada button, pada mo0ieclip, dan pada frame dengan aturan yang berbeda. Pola Penulisan Action Script pada Button %ara penulisan action pada tombol adalah sebagai berikut 1 '. Buatlah sebuah kotak dengan menggunakan rectangle tool. Anda juga bisa membuat rounded rectangle dengan memilih option rounded rectangle radius.

eting dalam membuat kotak ). Buatlah static te,t 2tombol3 tepat diatas kotak yang sebelumnya telah kita buat, caranya klik te,t tool, kemudian buka properties dan atur jenis huruf, ukuran dan warna. Buka panel properties +apabila belum terbuka pilih menu window4properties/. !astikan option static te,t pada te,t type.

Te,t tool dan te,t properties

Bentuk tombol *. eleksi kotak dan te,t tersebut, kemudian kon0ert menjadi symbol dengan dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih button pada option beha0iour dan ketikan tombol pada name.

%on0ert to symbol

-. "ouble klik tombol tersebut untuk memasuki mode edit. !erhatikan dalam symbol bertipe button terdapat - frame yaitu up, over, down dan hit. Up menunjukan kondisi normal suatu tombol. Over menunjukan kondisi tombol saat mouse

berada tepat di atasnya. Down menunjukan kondisi tombol saat ditekan dan Hit merupakan area penekanan +sensor/ tombol tersebut. Frame pada symbol button 5. &lik frame over kemudian masukan ke !rame dengan menekan tombol "# +pilih menu insert4keyframe/. 6bah warna dan ukuran tombol pada frame over tersebut. 6ntuk frame Down dan Hit biasanya bisa kita abaikan.

!enambahan keyfame pada frame o0er

!erbedaan warna dan ukuran antara frame up dan frame o0er 7. Tekan tombol $trl%& untuk kembali ke Stage utama. &lik tombol dan dalam kondisi tombol terpilih buka panel action+ tekan F8 atau klik menu windows4action apabila panel action belum terbuka dan pastikan mode penulisan adalah mode e,pert jika menggunakan flash M9 atau Flash ./. &emudian ketikan script sebagai berikut 1 on +release/: ;; menampilkan pesan pada output panel saat tombol ditekan trace+2tombol ditekan3/< = action pada button

>. ?alankan mo0ie dengan menekan tombol $trl'&nter. Tekan tombol tersebut, maka akan mucul tampilan 2tombol ditekan3 pada output panel. Tekan tombol %trl@A untuk kembali ke stage !enjelasan pola penulisan action script pada button adalah sebagai berikut 1 '. Action pada button harus dimulai dengan script on() ). "i dalam tanda kurung () pada scrip on berisi mouse event seperti release, press, drago0er, rollout dan sebagainya. Mouse e0ent menyatakan sebuah kejadian yang akan di eksekusi oleh action tersebut saat mouse melakukan kegiatan tertentu. ebagai contoh 1 mouse e0ent release berarti perintah dalam blok * + akan dijalankan ketika mouse menekan tombol. *. Tanda * merupakan awal suatu blok script. Bang dimaksud dengan blok scrip adalah suatu kumpulan perintah yang akan dijalankan sepanjang mo0ie e0ent. -. Tanda ,, merupakan tanda yang menyatakan komentar. Baris yang memiliki tanda tersebut tidak dianggap sebagai suatu perintah. Meskipun demikian tanda ,, sangat membantu memberi informasi pada penulisan action scrip kita. 5. Baris trace(-tombol ditekan.)/ merupakan baris perintah. !erintah dalam button harus ditulis didalam sebuah blok mouse e0ent. perintah selalu diakhiri dengan tanda / 7. Tanda + merupakan penutup suatu blok script. etiap akhir penulisan sebuah

Pola Penulisan Action Script pada Movieclip %ara penulisan action pada mo0ieclip adalah sebagai berikut 1 '. Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool. +isi/. !erhatikan bahwa sebuah obyek dalam flash memiliki ) bagian yaitu stoke +garis tepi/ dan fill

C0al tool dan obyek dalam flash ). eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name.

%on0ert to symbol *. &lik mo0ieclip bola, dan dalam kondisi terseleksi buka panel action + tekan f8 atau klik menu windows4action apabila panel action belum terbuka dan pastikan mode penulisan adalah mode e,pert jika menggunakan flash M9 atau Flash ./. &emudian ketikan script sebagai berikut 1 on%lipD0ent +enterFrame/ : ;; menggerakan obyek kekanan E, @F '(< = action pada mo0ieclip -. ?alankan mo0ie dengan menekan tombol %trl@Dnter. Maka bola akan bergerak ke kanan sampai hilang dari layar. Tekan tombol %trl@A untuk kembali ke stage !enjelasan pola penulisan action script pada mo0ieclip adalah sebagai berikut 1 '. Action pada mo0ieclip harus dimulai dengan script on() atau on$lip&vent() ). "i dalam tanda kurung () pada scrip on maupun on$lip&vent berisi movie event seperti load, enterframe, mouse down, release dan sebagainya. Mo0ie e0ent

menyatakan sebuah kejadian yang akan di eksekusi oleh action tersebut. ebagai contoh 1 mo0ie e0ent enter"rame berarti perintah dalam blok * + akan dijalankan sepanjang frame tempat mo0ieklip tersebut aktif dan mo0ie e0ent load berarti perintah dalam blok * + akan dijalankan satu kali saja yaitu ketika mo0ieclip di load +ditampilkan/ oleh flash player. *. Tanda * merupakan awal suatu blok script. Bang dimaksud dengan blok scrip adalah suatu kumpulan perintah yang akan dijalankan sepanjang mo0ie e0ent. -. Tanda ,, merupakan tanda yang menyatakan komentar. Baris yang memiliki tanda tersebut tidak dianggap sebagai suatu perintah. Meskipun demikian tanda ,, sangat membantu memberi informasi pada penulisan action scrip kita. 5. Baris 0x'123/ merupakan baris perintah. !erintah dalam mo0ieclip harus ditulis didalam sebuah blok mo0ie e0ent. etiap akhir penulisan sebuah perintah selalu diakhiri dengan tanda / 7. Tanda + merupakan penutup suatu blok script.

!ola penulisan script pada mo0ieclip &euntungan penulisan script pada mo0ieclip 1 '. "ibandingkan dengan menulis action diframe, penulisan script di dalam mo0ieclip lebih mudah. ). 6ntuk mendeteksi kesalahan satu obyek, pada penulisan ini lebih cepat dibandingkan dengan penulisan action pada frame +dengan catatan apabila suatu saat kita mengolah script dalam jumlah ratusan sampai ribuan baris/.

Pola Penulisan Action Script pada Frame &edua cara penulisan script diatas yaitu penulisan script di dalam button dan di dalam mo0ieclip, dapat ditulis dalam bentuk lain yang mana penulisan scriptnya diletakan didalam sebuah frame. Gal utama yang harus diingat dalam penulisan action pada frame adalah instance name4 $nstance name merupakan salah satu identitas yang terpenting dalam flash yang membedakan antara obyek satu dengan obyek yang lain.

!roperties sebuah symbol Aturan pemberian nama instance name antara lain adalah 1 '. #ama intansi boleh sama dengan nama symbol. ). Tidak boleh menggunakan spasi, titik, dan tanda baca yang lain. *. Tidak boleh menggunakan nama yang sama dengan suatu perintah dalam flash misalnya 1 ob ek, level, break dan sebagainya. -. Tidak boleh menggunakan angka saja untuk nama akan tetapi sebuah nama instansi boleh diikuti dengan angka. %ontoh yang salah 125, 26, dan sebagainya, contoh yang benar 1 bola2, bola05 dan sebagainya. 5. Tidak boleh ada nama instansi yang sama. 7. 6ntuk mempermudah proses penulisan script, dapat ditambahkan 20mc3 untuk symbol bertipe mo0ieclip dan 20btn3 untuk symbol bertipe button. %ontoh 1 2bola20mc3, 2tombol20btn3 dan sebagainya. >. "ua atau lebih symbol yang sama boleh dipakai, tetapi harus memiliki nama instansi yang berbeda. %ara penulisan action pada mo0ieclip adalah sebagai berikut 1

'. Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool. eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name.

%on0ert to symbol ). &lik symbol bola tersebut, kemudian buka panel instance dan ketikan nama 2bola3 pada instance name.

!roperties mo0ieclip bola *. Buatlah sebuah layer baru dan ubah namanya menjadi layer action. !enambahan layer action akan mempermudah kita dalam penulisan action pada frame, sehingga tidak akan mengganggu obyek yang lain.

layer action -. &lik frame ' layer action, dan dalam kondisi frame ' terseleksi buka panel action + tekan f8 atau klik menu windows4action apabila panel action belum terbuka dan pastikan mode penulisan adalah mode e,pert jika menggunakan flash M9 atau Flash ./.

bola.onDnterFrame F function+/ : ;;menggerakan bola kekanan this.E, @F '(< =< 5. ?alankan Mo0ie dengan menekan tombol %trl@Dnter, maka kita akan melihat hasil yang sama dengan dengan cara penulisan action pada mo0ieclip. !enjelasan pola penulisan action script pada frame adalah sebagai berikut 1 '. ebuah penulisan script di frame memiliki * tipe penulisan yaitu penulisan di dalam suatu blok movie event atau mouse event, contoh on&nter!rame 1 !unction()*+ dan penulisan tanpa movie event atau mouse event, tipe penulisan yang ke tiga adalah kombinasi dari keduanya, contohnya akan kita dapati pada program di bab selanjutnya ). !ada dasarnya penulisan action pada frame sama dengan penulisan pada mo0ieclip maupun pada button. Ganya saja pada frame terdapat script !unction() dan penggunaan nama instansi . *. !erhatikan perbedaan antara penulisan pada frame dan penulisan pada mo0iclip berikut bari s 1. pada frame bola.onEnterFrame = function{ pada movieclip perbedaan

onClipEvent(enterFrame Perubahan ){ penulisan dari moviclip ke frame adalah penggunaan nama instansi didepan movieevent dan penggunaan script function( baris komentar sama di seluruh penulisan penggunaan kata(kata this

!!menggerakan bola kekanan

!!menggerakan bola kekanan #$%=1&'

".

this.#$%=1&'

harus disertakan pada penulisan ). *' * di frame pada penulisan di frame sebuah akhir dari movie event function diakhiri dengan tanda ! perbedaan antara penulisan di frame dan di mo0ieclip -. Apabila ingin menuliskan action button pada frame, maka yang harus di ubah adalah movie event diubah menjadi mouse event. contoh 7 tombol4on8elease 1 !unction()*+ &euntungan penulisan script pada frame 1 '. "ibandingkan dengan menulis action di mo0ieclip, penulisan script di dalam mo0ieclip cenderung lebih rumit, akan tetapi bagi programmer yang familiar dengan bahasa pemrograman seperti %@@, ?a0a, "elphi atau H basic, penulisan pada frame akan menjadi lebih mudah. ). Iebih mudah dalam menuliskan function tertentu atau perintah berulang yang sering dipakai. *. &arena seluruh script biasanya dituliskan pada frame, maka mengecek action seluruh obyek yang ada akan lebih mudah, tanpa harus ke masing-masing obyek.

Kesalahan Action Script eseorang yang baru belajar action script maupun seseorang yang telah mahir menggunakan actionscript tidak pernah terlepas dari sebuah kesalahan. "alam sebuah pemrograman terdpat ) jenis kesalahan, yaitu kesalahan penulisan dan kesalahan logika. Kesalahan Penulisan Action Script &esalahan yang paling sering dilakukan oleh orang yang baru belajar scipt adalah kesalahan penulisan script. 6ntuk mengetahui kesalahan penulisan, flash menyediakan fasilitas check s ntax pada panel action.

check synta, "engan menekan tombol check s ntac tersebut, dapat diketahui apakah scrip yang ditulis benar atau memiliki kesalahan.

) kemungkinan saat menekan tombol check s ntax. &esalahan penulisan akan ditampilkan pada output panel. cene, layer, dan frame tempat kita melakukan kesalahan serta baris ke berapa yang salah akan membantu kita dalam memperbaiki sebuah kesalahan. &esalahan yang sering muncul antara lain adalah 1 '. &esalahan penulisan action yang sederhana, contoh 1 action duplicateMovie$lip salah ketik menjadi duplikateMovie$lip4 ). &esalahan penggunaan spasi, menuliskan nama instance atau 0ariabel dengan tanda spasi, contoh 1 nilai sa a 1 233/ seharusnya ditulis nilai0sa a 1 233/ Tips dari penulis 1 ketika kita menuliskan sebuah action jangan terlalu sering menggunakan spasi, sebab flash dapat menata script secara otomatis apabila kita menekan tombol auto !ormat.

auto format

*. &esalahan penggunaan huruf kecil dan huruf besar. Action script flash sebagian besar tidak sensitive case +peka terhadap huruf kecil dan huruf besar/. Akan tetpi flash membedakan sebuah teks dengan warna yang berbeda. &etika kita menuliskan action tanpa memperhatikan huruf kecil dan huruf besar, maka teks tersebut akan berwarna hitam, sedangkan apabila benar maka teks akan berwarna biru gelap. !embedaan warna teks dalam action script adalah sebagai berikut 1 '. Aarna biru gelap digunakan sebagai warna action. ). Aarna biru terang digunakan sebagai warna string. *. Aarna abu-abu digunakan sebagai warna komentar. -. Aarna hitam digunakan untuk menuliskan te,t selain * jenis te,t di atas. -. &esalahan penggunaan tanda 2*+2. eorang yang baru belajar flash sering kebingungan dalam menggunakan tanda tersebut. Tanda tersebut merupakan sebuah tanda blok action, dalam artian seluruh action yang berada dalam tanda 2*+3 berarti masuk kedalam blok tertentu seperti blok movie event, mouse event, !unction, blok i!, blok !or dan sebagainya. ?umlah tanda 2*2 harus sama dengan jumlah tanda 2+3. Tips dari penulis adalah 1 setelah kita menuliskan tanda 2*2, segeralah menuliskan tanda -+3, kemudian letakkan kursor di tengah karakter tersebut dan tekan enter atau langsung tuliskan action yang dibutuhkan di dalamnya. 5. &esalahan penggunaan tanda 2( )2. Berbeda dengan tanda 2*+3 tanda 2( )3 bukan menyatakan suatu blok tetapi biasanya merupakan bagian dari penulisan action digunakan. contoh 1 if (444): =, trace(444)/.. ?umlah tanda 2(2 daam satu baris perintah harus sama dengan jumlah tanda 2)3. 7. &esalahan penggunaan tanda F dan tanda FF. Tanda FF hanya digunakan pada suatu kondisi. edangkan tanda F digunakan untuk mengeset nilai suatu 0ariabel >. &esalahan penggunaan titik. "alam bahasa pemrograman apapun, karakter titik +243/ adalah karakter yang 0ital, sehingga harus diperhatikan penggunaannya. Kesalahan "ogika Action Script &esalahan logika tidak dapat dideteksi oleh tombol check s ntax, karena kesalahan ini berasal dari programmernya. &esalahan logika sebenarnya adalah kesalahan dalam menyusun dan menggunakan action script, sehingga menyebabkan program yang

dibuat berjalan lambat, ada bagian yang seharusnya bergerak menjadi tidak bergerak, memakan memori komputer dan sebagainya yang sering disebut dengan istilah bug. 6ntuk memperbaiki bug jalankan terlebih dahulu, kemudian ujilah program tersebut sesering mungkin dan carilah peluang yang dapat terjadi sebanyak mungkin. &etika menemukan bagian yang salah, kembali ke action dan carilah bagian mana yang menyebabkan kesalahan tersebut, kemudian perbaiki sebisa mungkin.

Menggunakan Action Script Dasar pada Flash etelah mempelajari pola penulisan scrip dalam flash, langkah selanjutnya adalah memahami penggunaan action script. etiap action memiliki kegunaan masingmasing, script mana dan kapan kita menggunakannya adalah hal yang harus dilatih secara terus-menerus apabila ingin menjadi pakar dalam pemrograman action cript flash. Mengenal sistem kordinat la#ar !ada mata pelajaran matematika, kita mengenal sistem kordinat kartesian. !engetahuan yang kuat akan matematika, akan sangat mendukung kita nantinya dalam memahami sistem korninat layar. !ada sistem kordinat kartesian sumbu utama dibagi menjadi sumbu , +horisontal/ dan sumbu y +0ertikal/. !ersimpangan antara sumbu tersebut merupakan kordinat +(,(/. !ada sumbu , semakin ke kiri maka nilai , semakin kecil dan sebaliknya semakin ke kanan nilai , semakin besar. !ada sumbu y semakin ke bawah maka nilai y semakin kecil dan sebaliknya semakin ke atas nilai y semakin besar. !ada sistem kordinat layar komputer, hampir sama dengan kordinat kartesian, sumbu utama dibagi menjadi sumbu , +horisontal/ dan sumbu y +0ertikal/. Akan tetapi kordinat +(,(/ adalah pojok kiri atas layar. !erbedaan selanjutnya adalah pada sumbu y. !ada sumbu y semakin ke bawah maka nilai y semakin besar dan sebaliknya semakin ke atas nilai y semakin kecil. !erhatikan gambar berikut1

kordinat kartesian dan kordinat layar pada flash %ontoh penerapan dari sistem kordinat layar dalam flash adalah sebagai berikut 1 !ermasalahan 1 Buatlah sebuah bola yang bergerak secara diagonal dari kiri atas ke kanan bawah untuk menyelesaikan soal tersebut, kita gambarkan dahulu secara 0isual sebagai berikut 1

pergerakan bola secara diagonal ?adi untuk menggerakan bola secara diagonal, maka pada saat yang bersamaan sumbu , digerakkan ke kanan +ditambah/ dan sumbu y digerakan ke bawah +ditambah/. !roses pembuatan aplikasinya adalah sebagai berikut 1 '. Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool.

C0al tool dalam flash

eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name. !erhatikan bagian regristration, bagian tersebut menentukan posisi suatu mo0ieclip. ebagai contoh, ketika kita ). memilih regristration pada bagian tengah, maka posisi penghitungan kordinat mo0ieclip nantinya dihitung di bagian tengah tidak seperti yang terlihat pada properties +karena pada properties hitungan posisi dimulai dari pojok kiri atas/.

!osisi regristration

!erhitungan kordinat suatu symbol *. &lik mo0ieclip bola ubah posisinya tau letakan di pojok kanan atas stage, dan dalam kondisi terseleksi buka panel action + tekan f8 atau klik menu windows4action apabila panel action belum terbuka dan pastikan mode penulisan adalah mode e,pert jika menggunakan flash M9 atau Flash ./. &emudian ketikan script sebagai berikut 1 on%lipD0ent +enterFrame/ : ;; menggerakan bola diagonal E, @F '(< Ey @F '(< =

-. ?alankan mo0ie dengan menekan tombol %trl@Dnter. Maka bola akan bergerak diagonal dari kiri atas ke kanan bawah sampai hilang dari layar. Tekan tombol %trl@A untuk kembali ke stage !enjelasan program '. Baris on$lip&vent (enter"rame) * berarti bahwa perintah dalam blok * + akan dijalankan sepanjang frame aktif artinya pada default seting frame rate 1 ') fps +frame per secon/, maka perintah dalam blok : = akan dijalankan setiap seperduabelas detik sepanjang mo0ie tersebut dijalankan. ). Baris ,, menggerakan bola diagonal merupakan baris komentar, baris ini tidak dijalankan oleh flash. *. Baris 0x '1 23/ berarti setiap seperduabelas detik kordinat , dari bola ditambah '( pi,el, sehingga bola bergerak kekanan. Tanda '1 merupakan bentuk penyedehanaan dari action 0x 1 0x'23< -. Baris 0 '1 23/ berarti setiap seperduabelas detik kordinat y dari bola ditambah '( pi,el, sehingga bola bergerak kebawah. 5. &arena komputer mengitung dengan sangat cepat, perhitungan dalam satu blok * + dapat dikerjakan dengan sekaligus sehingga bola tampak bergerak diagonal.

Mengenal varia$el Hariabel adalah suatu lokasi didalam memori komputer yang digunakan untuk menyimpan suatu nilai dan nilai yang ada didalamnya dapat diubah. terdapat ) cara dalam membuat 0ariabel dalam flash cara yang pertama adalah dengan menuliskan langsung nama 0ariabel dan nilainya contoh 1 score 1 2333/ dengan action tersebut secara otomatis akan membuat satu 0ariabel baru bernama score dengan nilai '(((< %ara yang kedua adalah dengan menuliskan action var di depan 0ariabel yang kita tuliskan, contoh 1 var score 1 2333/ dengan action tersebut secara otomatis akan membuat satu 0ariabel baru bernama score dengan nilai '(((<

aturan pemberian nama 0ariabel 1 .. 0ariabel tidak boleh sama dengan nama instansi suatu symbol. 8. Tidak boleh menggunakan spasi, titik, dan tanda baca yang lain. '(. Tidak boleh menggunakan nama yang sama dengan suatu perintah dalam flash misalnya 1 ob ek, level, break dan sebagainya. ''. Tidak boleh menggunakan angka saja untuk nama akan tetapi 0ariabel boleh diikuti dengan angka. %ontoh yang salah 125, 26, dan sebagainya, contoh yang benar 1 nilai2, nilai05 dan sebagainya. '). Tidak sensiti0e case, boleh menggunakan huruf besar atau huruf kecil. Tipe 0ariabel dalam flash terdapat beberapa tipe 0ariabel, beberapa yang sering dipakai antara lain 1 Tipe Hariabel #umber tring Boolean array %ontoh !enulisan score F '(((< i@@< nama F 23< teks F 2contoh3< mati F true< kalah F false< datapemain F JK< hari F J2senin3,3selasa3K highscore F J'((, .(, >5K

Mengenal o$#ek properties ebuah obyek dalam flash bisa berupa mo0ieclip, button, graphic, sound, 0ideo, bitmap dan component. Akan tetapi yang dapat diaplikasikan dengan action hanya obyek mo0ieclip, button dan sound. %omponet memiliki build in action script, sehingga dapat langsung kita pakai, sedangkan bitmap dan graphic tidak dapat dimasuki oleh action. etiap obyek yang dapat dimasuki action memiliki beberapa properties seperti kordinat ,, kordinat y, panjang, tinggi, frame yang aktif, warna dan sebagainya. &arena yang akan sering kita pakai adalah mo0ieclip, berikut ini adalah beberapa properties dari sebuah mo0ieclip1 %&

E, merupakan koordinat sumbu , suatu symbol terhadap stage. !erhatikan pada pelajaran sebelumnya bahwa perhitungan , dihitung dari titik registration nya, bukan dari pojok kiri atas seperti yang terlihat pada properties. %# Ey merupakan koordinat sumbu y suatu symbol terhadap stage. eperti halnya E,, perhitungan koordinat sumbu Ey pusat point regristation dari symbol terhadap stage. !erhatikan action script berikut 1 on%lipD0ent+load/: E, F '((< Ey F '((< = Action diatas akan mengeset posisi obyek +symbol/ kekordinat +'((,'((/ terhadap stage saat symbol tersebut ditampilkan pertama kali. %&scale E,scale merupakan presentase dari skala pembesaran horisontal suatu symbol terhadap titik regristasi. #ilai default E,scale sebelum diubah adalah '((. Cbyek yang memiliki nilai E,scale dibawah '(( akan memiliki ukuran yang lebih kecil dari ukuran aslinya, begitu pula sebaliknya. %#scale Eyscale merupakan presentase dari skala pembesaran 0ertikal suatu symbol terhadap titik regristasi. contoh 1 on%lipD0ent+load/: E,scale F )((< ;; pembesaran ) kali ke sumbu , Eyscale F )((< ;; pembesaran ) kali ke sumbu y = Action diatas memperbesar symbol menjadi ) kali lebih besar pada saat symbol tersebut ditampilkan pertama kali. %visi$le ;; kordinat sumbu , ;; kordinat sumbu y

E0isible adalah property pada symbol yang menentukan apakah obyek tersebut ditampakkan atau tidak pada stage. E0isible bernilai ' agar obyek tampak dan bernilai ( agar obyek tidak tampak. contoh 1 on%lipD0ent+load/: E0isible F (< ;; tidak tampak = Action diatas menyebabkan obyek tidak tampak pada stage. %alpha Ealpha adalah property pada symbol yang menentukan alpha 0alue +transparency/ obyek tersebut. Ealpha bernilai ( sampai '(( dimana nilai ( berarti obyek tidak tampak +transparan/ dan '(( berarti obyek tampak +solid/. contoh 1 on%lipD0ent+load/: Ealpha F 5(< ;; semi transparan = Action diatas menyebabkan obyek mengalami tranparansi sebanyak 5(L. %rotation Erotation merupakan property yang menunjukan posisi perputaran obyek tersebut searah jarum pada titik registrationnya. contoh 1 on%lipD0ent+enterFrame/: Erotation @F '(< = Action diatas menyebabkan obyek berputar searah jarumjam dengan pusat titik registrationnya. %currentframe ;; berputar searah jarum jam

nilai pada Ecurrentframe menunjukan frame yang aktif pada sebuah mo0ie atau sebuah mo0ieklip. !enjelasan yang lebih mendetail terdapat pada bab selanjutnya.

Menghentikan Movie dengan stop( ! action stop+/ digunakan untuk menghentikan mo0ie yang sedang berjalan. 6ntuk lebih jelasnya perhatikan contoh berikut 1 '. Buatlah sebuah bola dengan o0al tool, kemudian con0ert menjadi symbol movieclip dengan nama bola. ). eleksi bola, kemudian letakkan disebelah kiri stage. *. &lik frame )(, kemudian tambahkan keyframe dengan menekan tombol F7.

&emudian geser bola ke kanan stage. posisi mo0ieclip bola pada frame ' dan frame )( -. &lik kanan pada timeline frame '(, kemudian pilih create motion tween.

%reate motion tween 5. ?alankan mo0ie dengan menekan tombol %trl@Dnter. Maka akan didapatkan sebuah gerakan bola dari kiri kekanan secara looping 7. &embali ke stage dengan menekan tombol %trl@A, kemudian tambahkan sebuah layer baru +layer action/.

penambahan layer action >. &lik frame '( layer action, kemudian masukan keyframe dengan menekan tombol F7. "alam keadaan frame '( terseleksi, buka panel action dan ketikan action stop()/

script stop+/< pada frame '( layer action .. ?alankan Mo0ie dengan menekan tombol %trl@Dnter, maka bola akan berhenti saat berada di tengah stage. Gal tersebut diakibatkan karena adanya action stop+/< sehingga mo0ie berhenti. 8. impan file tersebut.

Menjalankan Movie dengan pla#( ! action play+/ digunakan untuk menjalankan frame yang berhenti akibat script stop+/< . 6ntuk lebih jelasnya perhatikan contoh berikut 1 '. Ianjutkan file latihan sebelumnya +penggunaan stop+//. ). &lik layer ', kemudian tambahkan layer baru diatasnya. 6bah nama layer menjadi layer tombol.

menambah layer *. &lik frame '( layer tombol, kemudian masukan keyframe. Buatlah sebuah bentuk tombol di tengah stage.

tombol pada frame '( layer tombol

-.

eleksi bentuk tombol tersebut dan con0ert menjadi symbol dengan menekan tombol F.. &etikan nama 2play3 dan pilih button pada beha0iour.

5. "alam kondisi tombol 2play3 terseleksi, buka panel action dan ketikan script berikut 1 on +release/ : ;;jika ditekan maka mainkan frame selanjutnya play+/< =

7. ?alankan mo0ie. !ada saat bola berhenti, tekan tombol dan bola akan bergerak lagi. Action pla ()/ pada tombol menyebabkan mo0ie berjalan kembali ketika tombol ditekan.

gotoAndStop(frame Action goto9ndStop() digunakan untuk menghentikan mo0ie pada frame yang inginkan. frame dapat diisi dengan menggunakan angka tempat frame yang diinginkan atau frame label. !erhatikan contoh berikut 1 '. Buatlah sebuah mo0ieclip bola dan letakan disebelah kiri stage. ). &lik frame )( kemudian masukan keyframe. Meser posisi mo0ieklip bola ke sebelah kanan stage. *. &lik kanan frame '( kemudian pilih create motion tween, maka akan terbentuk animasi bola bergerak dari kiri ke kanan secara looping. -. Tambahkan sebuah layer diatas la er 2 dan ubah namanya menjadi layer action. 5. &lik frame '( layer action, masukan keyframe. &emudian buka panel action dan ketikan action goto9ndStop(2)/

!eletakan script gotoAnd top+'/<

7. ?alankan mo0ie, maka ketika bola sampai di tengah stage, bola akan kembali dan berhenti ke posisi awal di kiri stage. gotoAndPla#(frame Action goto9ndPla () digunakan untuk memainkan mo0ie pada frame yang inginkan, merupakan kebalikan dari action goto9ndStop()/ catatan 1 suatu ketika terdapat action goto9ndStop(-awal.)/ kata 2awal3 merupakan !rame label. untuk menambahkan frame label, masukan keyframe pada frame yang diinginkan, buka panel properties dan ketikan pada te,tbo, Nframe label4.

'n(lip)vent(event Cn%lipD0ent berisi 1 load perintah akan dijalankan ketika pertama kali mo0ie klip di load oleh time line unload perintah akan dijalankan ketika suatu mo0ie klip di remo0e+ dihilangkan / dari time line enter"rame perintah kan dijalankan secara terus menerus sepanjang frame yang aktif mouseMove perintah akan dijalankan ketika mouse digerakkan mouseDown perintah akan dijalankan ketika mouse ditekan mouseUp perintah akan dijalankan ketika mouse dilepaskan ke Down perintah akan dijalankan ketika mendeteksi adanya tombol yang ditekan dengan menggunakan action &ey.get%ode ke Up perintah akan dijalankan ketika mendeteksi adanya tombol yang dilepaskan dengan menggunakan action &ey.get%ode adalah suatu script yang digunakan oleh suatu mo0ie klip untuk melaksanakan beberapa perintah lain dalam suatu blok e0ent. !arameter D0ent dapat

!emahaman lebih lanjut mengenai script ini akan terbentuk seiring dengan latihan kita dalam mengolah action script. *race(pesan !erintah trace() digunakan untuk menampilkan sesuatu pada output panel. !enggunaan action trace sangat bermanfaat dalam pemrograman lebih lanjut nantinya, sebagai penguji kesalahan akan suatu baris program. !erhatikan contoh penggunaan action script trace berikut1 '. &lik frame ', kemudian buka panel action dan ketikan script1 trace(2333)/ kemudian jalankan mo0ie. Maka akan muncul te,t 2'(((3 pada output panel .

tampilan pada output ). Tekan %trl@A untuk kembali ke tage. elanjutnya ubah action pada frame ' menjadi 1 trace(-halo apa kabar:.)/ &emudian jalankan kembali mo0ie. Maka tampilan yang muncul adalah sebagai berikut 1

tampilan pada output *. Tekan %trl@A untuk kembali ke tage. elanjutnya ubah action pada frame ' menjadi 1 trace(nilai)/ &emudian jalankan kembali mo0ie. Maka tampilan yang muncul adalah sebagai berikut 1

tampilan pada output -. Tekan %trl@A untuk kembali ke tage. elanjutnya tambahkan action pada frame ' menjadi 1

nilai F '(((< trace+nilai/< &emudian jalankan kembali mo0ie. Maka tampilan yang muncul adalah sebagai berikut 1

tampilan pada output &esimpulan yang dapat diambil adalah sebagai berikut 1 '. nilai di dalam tanda +/ pada action trace+/ dapat diisi dengan bilangan. ). kata 2halo apa kabar:3 dapat ditampilkan karena merupakan obyek string +berada didalam tanda 23/. *. kata nilai tidak dapat ditampilkan, karean tidak didalam tanda 23 maka kata nilai dianggap sebagai sebuah variabel yang harus didefinisikan terlebih dahulu. -. penambahan action nilai 1 2333/ merupakan sebuah pendefinisian 0ariabel nilai sehingga 0ariabel tersebut bernilai '((( dan dapat ditampilkan oleh action trace().

Menggunakan 'perator Matematika pada Flash !ada bab sebelumnya dijelaskan bahwa matematika memegang peranan penting dalam pemrograman. Flash menunjang operasi matematika dengan banyak actionscrpit, meskipun demikian tidak semua script yang harus kita kuasai. Gal mendasar yang harus dikuasai adalah operator aritmatika. Bentuk operator aritmatika dasar dalam flash adalah sebagai berikut1 Cperator @ O ; contoh aplikasi aritmatika pada flash1 '. &lik frame ', kemudian ketikan action trace( ; ' < )/ &emudian jalankan mo0ie. Maka pada output panel akan muncul tampilan sebagai berikut 1 Fungsi penambahan pengurangan perkalian pembagian

tampilan hasil penjumlahan ). Tekan %trl@A untuk kembali ke tage. elanjutnya ubah action pada frame ' menjadi 1 trace(;'<=;)/ &emudian jalankan kembali mo0ie. Maka tampilan yang muncul adalah sebagai berikut1

tampilan hasil penjumlahan !erhatikan bahwa hasil yang ditampilkan adalah )5 bukan -5 hal tersebut dikarenakan kedudukan perkalian dan pembagian lebih tinggi daripada penjumlahan dan pengurangan, sehingga operasi perkalian dan pembagian didahulukan.

++

Cperator @@ berarti penambahan suatu 0ariabel dengan angka '. !erhatikan contoh berikut 1 '. Buatlah sebuah mo0ieclip bola, dan letakkan disebelah kiri frame. "alam kondisi bola terseleksi, buka panel action dan ketikan script berikut 1 on%lipD0ent +enterFrame/ : E,@@< = ). ?alankan mo0ie, maka bola akan bergerak dari kiri kekanan secara perlahan. Galtersebut dikarenakan setiap seperduabelas detik +bila setting default mo0ie adalah ') fps/, kordinat , bola ditambah ' pi,el. ,, ebaliknya operator -- berarti pengurangan suatu 0ariabel dengan angka '. Penggunaan varia$el dengan operator aritmatika "alam pemrograman sebagai berikut1 %ontoh kita akan mengubah nilai kordinat , suatu mo0ieklip maka bentuk penulisannya 1 bentuk standart E, F E, @ '( E, F E, - '( E, F E, O '( E, F E, ; '( penyederhanaan E, @F '( E, -F '( E, OF '( E, ;F '( penghitungan 0ariabel hampir selalu terjadi. 6ntuk mempermudah penulisan, flash menyediakan beberapa format penulisan, antara lain

Penggunaan Script Math Math merupakan sebuah obyek yang memiliki sub script lain. Cbyek Math memiliki '. action dan . script properti. '. Action tersebut antara lain adalah 7 Math4abs(), Math4sin(), Math4random() dan sebagainya. tidak terlalu sering dipakai. edangkan . propertinya antara lain adalah 1 Math4P>, Math4?@23 dan sebagainya. !enggunaan script Math dalam game

'perasi *eks (String Teks atau string dalam flash juga merupakan suatu obyek yang memiliki banyak action. !erhatikan beberapa penulisan action script berikut 1 -halo apa kabar. merupakan string karena terdapat dalam tanda 23< merupakan kesalahan penulisan script karena bukan halo apa kabar nilai nilai 1 2333 nilai 1 -2333. nilai 1 -.

string dan memiliki karakter spasi sehingga bukan 0ariabel. merupakan sebuah 0ariabel +akan tetapi tipe 0ariabel belum dapat bukan string akan tetapi berupa 0ariabel bertipe number merupakan 0ariabel bertipe string karena penambahan tanda 23 didefinisikan sebagai teks '((( bukan angka '(((. merupakan 0ariabel bertipe string ditentukan apakah bertipe string atau bertipe integer/.

Menampilkan *eks (String dalam flash 6ntuk menampilkan teks dalam flash kita dapat menggunakan te,t tool. Terdapat * tipe teks yang bisa dibentuk oleh teks tool yaitu static text, d namic text dan inputtext. Static *e&t tatic te,t digunakan untuk menampilkan suatu teks yang sifatnya tidak dapat diubah secara manual atau dengan script setelah mo0ie dipublish. 6ntuk mengatur jenis, bentuk, ukuran dan warna te,t dapat menggunakan properties.

te,t tool properties

D#namic *e&t Berbeda dengan static te,t dynamic te,t dapat diubah dengan menggunakan actionscript. !enggunaan dynamic te,t biasanya adalah untuk menampilkan suatu 0ariabel. !erhatikan contoh aplikasi penggunaan dynamic te,t berikut 1 '. &lik te,t tool kemudian buka panel properties. !ilihlah "ynamic te,t pada option te,t type dan atur bentuk, ukuran dan warna huruf sesuai dengan keinginan. ). &lik dan drag pada stage untuk membentuk sebuah te,t area

dynamic te,t properties dan te,t area yang sudah dibuat *. eleksi te,t area +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -teks. pada var4 Har merupakan nama 0ariabel yang akan ditampilkan oleh dynamic te,t terpilih.

0ar pada dynamic te,t properties -. Buatlah sebuah layer baru diatas layer ' dan ubah namanya menjadi la er action. 5. &lik frame ' la er action, buka panel action dan tuliskan action teks 1 -contoh d namic text.4 7. ?alankan Mo0ie, maka akan muncul tampilan yang sama dengan nilai 0ariabel teks. !ermasalahan 1 buatlah sebuah program yang menampilkan angka yang selalu bertambah dari waktu ke waktu. ?awaban dari permasalahan tersebut adalah sebagai berikut 1

'. &lik te,t tool kemudian buka panel properties. !ilihlah "ynamic te,t pada option te,t type dan atur bentuk, ukuran dan warna huruf sesuai dengan keinginan. ). &lik dan drag pada stage untuk membentuk sebuah te,t area *. eleksi te,t area +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -angka. pada var4

penulisan 0ariabel 2angka3 -. Buatlah sebuah layer baru diatas layer ' dan ubah namanya menjadi la er action. 5. &lik frame ' la er action, buka panel action dan tuliskan action Eroot.onDnterFrame F function+/: angka@@< = 7. ?alankan Mo0ie, maka akan muncul tampilan angka yang terus bertambah. !enjelasan program1 '. Baris 0root4on&nter"rame 1 !unction()* menyatakan bahwa perintah dalam blok:= akan dijalankan secara beluang-ulang setiap seperduabelas detik sekali. !enjelasan lebih lanjut mengenai action 0root terdapat pada bab selanjutnya ). baris angka'' menyatakan bahwa setiap seperduabelas detik 0ariabel angka ditambah satu satuan. D#namic *e&t - render te&t as .*M" !ada dynamic te,t properties terdapat tombol render text as HTM?. "engan tombol tersebut terpilih, maka dynamic te,t dapat menampilkan sebuah perintah GTMI. Agar lebih jelas perhatikan contoh berikut 1 '. &lik te,t tool kemudian buka panel properties. !ilihlah "ynamic te,t pada option te,t type dan atur bentuk, ukuran dan warna huruf sesuai dengan keinginan. ). &lik dan drag pada stage untuk membentuk sebuah te,t area *. eleksi te,t area +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -tampilan. pada var4 dan aktifkan tombol render text as HTM?

penuisan 0ariabel 2tampilan3

-. Buatlah sebuah layer baru diatas layer ' dan ubah namanya menjadi la er action. 5. &lik frame ' la er action, buka panel action dan tuliskan action tampilan 1 ABbCkata ini dicetak tebal B,bC sedangkan BiCmiringB,iCA/ 7. ?alankan Mo0ie, maka akan muncul tampilan sebagai berikut 1 ang ini dicetak

dalam 0ariabel tampilan tersebt terdapat beberapa tag HTM? seperti tag bold (BbC) dan tag italic (BiC)4 &etika tombol render te,t as GTMI aktif maka tag-tag tersebut akan dijalankan oleh dynamic te,t sehingga dihasilkan tampilan seperti pada gambar diatas. Input *e&t $nput te,t merupakan suatu form yang meminta suatu masukan dari user +pengguna/. Masukan tersebut nantinya akan dianggap sebagai nilai dari 0ariabel te,t input tersebut. Agar lebih jelas perhatikan contoh berikut 1 '. &lik te,t tool kemudian buka panel properties. !ilihlah input te,t pada option te,t type dan atur bentuk, ukuran dan warna huruf sesuai dengan keinginan. ). &lik dan drag pada stage untuk membentuk sebuah te,t area *. eleksi te,t area +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -nama. pada var4 dan aktifkan tombol show border around text4

input te,t properties

-. Buat lagi te,t area yang lebih besar +cukup untuk ) baris kata atau lebih/ di bawah te,t area yang sudah dibuat pada poin no ). 5. &lik te,t area yang bawah tersebut, kemudian buka properties dan ubah menjadi d namic text dengan 0ar 2tampilan3 dan pilih multiline pada linetype.

7. Buatlah sebuah layer baru diatas layer ' dan ubah namanya menjadi layer tombol. >. Buatlah sebuah tombol 2OD3 dan letakkan di bawah te,t area kedua. !erhatikan peletakan obyek di stage sebagai berikut 1

penataan obyek pada stage .. &lik tombol 2OD3 kemudian buka panel action dan ketikan action sebagai berikut 1 on +release/ : tampilan F Phaloo...P@nama@P apa kabarQ, sedang belajar Flash yaQP< = 8. ?alankan Mo0ie, kemudian masukan nama anda kedalam input te,t dan tekan C& action tampilan 1 Ahaloo444A'nama'A apa kabar:, sedang belaEar "lash a:A/ menyatakan bahwa teks yang ditampilkan adalah 2haloo3 ditambah dengan nama yang dimasukan dan ditambah lagi dengan kata P apa kabarQ, sedang belajar Flash yaQP. Mengu$ah varia$el string ke num$er dengan action /um$er(string ! !erhatikan contoh berikut 1 !ermasalahan1

Buatlah sebuah program penjumlahan sederhana, pengguna memasukan ) bilangan dan program menampilkan hasilnya. !enyelesaian 1 6ntuk menjawab pertanyaan tersebut, perhatikan contoh berikut 1 '. &lik te,t tool kemudian buka panel properties. !ilihlah input text pada option te,t type dan atur bentuk, ukuran dan warna huruf sesuai dengan keinginan. ). &lik dan drag pada stage untuk membentuk sebuah te,t area *. eleksi te,t area +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -bilangan02. pada var4 dan aktifkan tombol show border around text4 -. Buat lagi input te,t area dengan ukuran yang sama dan letakkan di sebelah te,t area yang sudah dibuat pada poin no ). 5. eleksi input te,t area kedua +berwarna biru jika terseleksi/ dan buka panel properties. &etikan kata -bilangan05. pada var4 7. Buat lagi input te,t area dengan ukuran yang sama dan letakkan di sebelah te,t area yang sudah dibuat pada poin no 5. >. eleksi input te,t area ketiga +berwarna biru jika terseleksi/ dan buka panel properties. 6bah tipe te,t menjadi d namci text dan ketikan kata -hasil. pada var4 .. Buatlah static text 2@3 dan 2F3 kemudian atur posisinya +lihat gambar/. 8. Buatlah sebuah tombol 2OD3 dan letakkan di bawah te,t area kedua. !erhatikan peletakan obyek di stage sebagai berikut 1

penataan obyek pada stage '(. &lik tombol 2OD3 kemudian buka panel action dan ketikan action sebagai berikut 1

on +release/ : hasil F bilanganE' @ bilanganE)< = ''. ?alankan Mo0ie, masukan angka 23 pada bilangan ' dan 53 pada bilangan ). &emudian tekan tombol OD hasil yang diperoleh adalah 2353 bukan 634 Gal tersebut dikarenakan hasil yang diperoleh dari input text selalu bertipe string, sehingga penjumlahan terhadap ) bilangan tersebut merupakan penjumlahan string -23. @ string -53. dan hasilnya -2353.4 6ntuk mengatasinya kita harus mengubah terlebih dahulu 0ariabel bertipe string ke 0ariabel bertipe number. '). Tekan %trl@A untuk kembali ke stage. &lik tombol OD kemudian ubah scriptnya menjadi 1 on +release/ : hasil F #umber+bilanganE'/ @ #umber+bilanganE)/< = '*. ?alankan Mo0ie, kemudian masukan bilangan tertentu pada ke dua input te,t. etelah tombol OD ditekan, hasil yang benar akan muncul. Action @umber(string) digunakan untuk mengcon0ert suatu string yang berada dalam tanda +/ menjadi 0ariabel bertipe number.

Action String tring merupakan suatu obyek yang memiliki sekitar ') action seperti 1 slice, subString, toUpper$ase, to?ower$ase dan sebagainya dan memiliki ' property yaitu length. !enggunaan action-action tersebut jarang ditemui dalam pemrograman game, dan penerapannya dapat ditemui pada salah satu program di dalam bab selanjutnya

Memahami Pern#ataan if0 'perator "ogika dan 'perasi Pengulangan "alam permrograman salah satu elemen terpenting adalah penyusunan logika. "an logika dalam pemrograman tidak terlepas dari pengambilan keputusan, operator logika dan pengulangan. Apabila kita memahami benar ke * hal tersebut, dapat dipastikan sebuah pemrograman game dapat dilakukan. Pern#ataan if "engan bahasa bebas i! bisa diterjemahkan menjadi 2EikaFmakaF43."engan kata lain apabila terdapat pernyataan i!, dapat dipastikan terdapat dua atau lebih kemungkinan. ebagai contoh 1 jika pesawat meledak, maka game akan berakhir. Bentuk penulisan if adalah sebagai berikut1 i! ( kondisi )* blok pern ataan bila kondisi bernilai benar + else* blok pern ataan bila kondisi bernilai salah + !erhatikan contoh penggunaan if berikut ini 1 !ermasalahan bola bergerak kembali +memantul/ ke kiri. untuk menyelesaikan permasalahan tersebut, kita gambarkan dulu secara 0isual menjadi 1 1 gerakan sebuah bola kekanan kemudian setelah berada di batas kanan layar, maka

logika sederhana pemakaian if !roses pembuatan aplikasinya adalah sebagai berikut 1 5. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. untuk mengatur properti file dapat melalui panel properties +sebelumnya pastikan dahulu tidak ada obyek yang terseleksi dan tool yang aktif adalah arrow tool.

documen properties 7. Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool.

C0al tool dalam flash >. eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name. Ietakkan bola disebelah kanan stage .. &lik mo0ieclip bola kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F -kecepatan< =

= 8. ?alankan Mo0ie, maka ketika bola telah pada kordinat yang ditentukan pada 0ariabel batas kanan, bola akan terpantul. !enjelasan program 1 '. baris on$lip&vent (load) * merupakan sebuah perintah yang akan dijalankan satu kali saja, yaitu saat bola pertama kali di load oleh mo0ie. !erintah tersebut sering kali digunakan sebagai alat untuk mengeset awal 0ariabel-0ariabel yang akan dipakai. ). baris kecepatan 1 23/ dan bataskanan 1 G33/ merupakan 0ariabel yang akan dipakai. &ecepatan menentukan arah pergeseran kordinat ,, karena bernilai positif, , akan bergeser ke kanan. Batas kanan digunakan sebagai pendeteksi apakah kondisi bola menyentuh batas kanan terjadi atau belum. *. baris on$lip&vent (enter"rame)* berarti perintah yang berada dalam blok *+ akan dijalankan secara berulang setiap seperduabelas detik secara terus menerus hingga mo0ie ditutup. -. baris 0x '1 kecepatan/ berarti kordinat , dari bola akan ditambah sejumlah nilai dari 0ariabel kecepatan. 5. baris i! (0xC1bataskanan)* berarti 2jika kordinat , lebih besar atau sama dengan 0ariabel bataskanan maka3 perintah dalam blok *+ akan dijalankan. 7. baris kecepatan 1 %kecepatan/ berarti apabila kondisi pada no 5 tercapai maka nilai kecepatan dijadikan negatif +menjadi R'(/, sehingga gerakan bola kekiri akibat script 0x '1 kecepatan ( 0x '1 %23 ). 'perator logika !ada matematika dikenal beberapa logika seperti dan, atau, dan bukan. Cperator logika biasanya digunakan untuk membentuk suatu keadaan logika +boolean/ atau kondisi bernilai benar atau salah. "alam flash juga terdapat operator logika seperti 9@D, O8, dan @OT. 'perator and Cperator and dalam flash dapat ditulis dalam ) bentuk yaitu 1 kondisi 2 HH kondisi 5 atau kondisi 2 and kondisi 5 hasil dari operator and hanya bernilai benar jika kedua kondisi bernilai benar. !erhatikan contoh berikut 1

!ermasalahan

jatuhkan sebuah bola kemudian setelah berada di batas bawah layar, maka bola bergerak memantul ke atas dan berubah bentuk menjadi kotak. untuk menyelesaikan permasalahan tersebut, kita gambarkan dulu secara 0isual menjadi 1

penggunaan logika and !roses pembuatan aplikasinya adalah sebagai berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. untuk mengatur properti file dapat melalui panel properties +sebelumnya pastikan dahulu tidak ada obyek yang terseleksi dan tool yang aktif adalah arrow tool. ). Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool. *. eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name. Ietakkan bola disebelah atas stage -. "ouble klik mo0ieclip bola untuk masuk kedalam mode edit bola. 5. "alam mode edit bola, klik frame ) kemudian masukan blank De !rame dengan menekan tombol F>. rectangle tool. tambahkan sebuah layer diatasnya, kemudian klik frame ' la er 5, buka panel action dan tuliskan action stop()/ &emudian gambarlah sebuah kotak berwarna dengan

susunan layer mo0ieclip bola 7. &embali ke stage utama dengan menekan %trl@D . >. &lik mo0ieclip bola kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : kecepatan F '(< batasbawah F 5((< = on%lipD0ent +enterFrame/ : Ey @F kecepatan< if +Ey4Fbatasbawah and EcurrentframeFF'/ : kecepatan F -kecepatan< gotoAnd top+)/< = = .. ?alankan Mo0ie, maka ketika bola telah pada kordinat yang ditentukan pada 0ariabel batas bawah, bola akan terpantul dan berubah bentuk menjadi kotak. !enjelasan program 1 '. baris on$lip&vent (load) * merupakan sebuah perintah yang akan dijalankan satu kali saja, yaitu saat bola pertama kali di load oleh mo0ie. !erintah tersebut sering kali digunakan sebagai alat untuk mengeset awal 0ariabel-0ariabel yang akan dipakai. ). baris kecepatan 1 23/ dan batasbawah 1 G33/ merupakan 0ariabel yang akan dipakai. &ecepatan menentukan arah pergeseran kordinat y, karena bernilai positif, y akan bergeser ke bawah. Batas bawah digunakan sebagai pendeteksi apakah kondisi bola menyentuh batas bawah layar terjadi atau belum.

*. baris on$lip&vent (enter"rame)* berarti perintah yang berada dalam blok *+ akan dijalankan secara berulang setiap seperduabelas detik secara terus menerus hingga mo0ie ditutup. -. baris 0 '1 kecepatan/ berarti kordinat y dari bola akan ditambah sejumlah nilai dari 0ariabel kecepatan. 5. baris i! (0 C1batasbawah and 0current!rame112)* berarti 2jika kordinat , lebih besar atau sama dengan 0ariabel batasbawah dan frame yang aktif pada mo0ieclip bola adalah frame ', maka3 perintah dalam blok *+ akan dijalankan. 7. baris kecepatan 1 %kecepatan/ berarti apabila kondisi pada no 5 tercapai maka nilai kecepatan dijadikan negatif +menjadi R'(/, sehingga gerakan bola menjadi ke atas akibat script 0 '1 kecepatan ( 0 '1 %23 ). >. baris goto9ndStop(5)/ memindah frame aktif mo0ieclip bola ke frame ), sehingga bentuk bola berubah menjadi kotak. catatan 1 pada baris i! (0 C1batasbawah and 0current!rame112)* pada bagian 0current!rame 11 2 , terdapat penggunaan dua tanda 1, pengunaan 11 hanya dalam suatu kondisi, sedangkan selain kondisi kita menggunakan satu tanda 1.

'perator or Cperator or dalam flash dapat ditulis dalam ) bentuk yaitu 1 kondisi 2 II kondisi 5 atau kondisi 2 or kondisi 5 hasil dari operator or bernilai salah jika kedua kondisi bernilai salah. !erhatikan contoh berikut 1 !ermasalahan 1 gerakan sebuah bola kekanan kemudian setelah berada di batas kanan layar, maka bola bergerak kembali +memantul/ ke kiri dan ketika bola berada dibatas kiri maka bola kembali memantul ke kanan dan seterusnya. 6ntuk menyelesaikan permasalahan tersebut, kita gambarkan dulu secara 0isual menjadi 1

penggunaan logika ATA6 !enyelesaian dari masalah diatas adalah sebagai berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. documen properties ). Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool. *. eleksi obyek lingkaran tersebut kemudian con0ert menjadi symbol dengan menekan tombol F. +pilih menu insert4con0ert to symbol/. !ilih movieclip pada option beha0iour dan ketikan bola pada name. Ietakkan bola disebelah kanan stage -. &lik mo0ieclip bola kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< bataskiri F '((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,Nbataskiri or E,4bataskanan/ : kecepatan F -kecepatan< = = 5. ?alankan Mo0ie, maka ketika bola telah pada kordinat yang ditentukan pada 0ariabel batas kanan, bola akan terpantul.

!enjelasan program 1 '. baris on$lip&vent (load) * merupakan sebuah perintah yang akan dijalankan satu kali saja, yaitu saat bola pertama kali di load oleh mo0ie. !erintah tersebut sering kali digunakan sebagai alat untuk mengeset awal 0ariabel-0ariabel yang akan dipakai. ). baris kecepatan 1 23/ bataskiri 1 233/ dan bataskanan 1 G33/ merupakan 0ariabel yang akan dipakai. &ecepatan menentukan arah pergeseran kordinat ,, karena bernilai positif, , akan bergeser ke kanan. Batas kanan dan batas kiri digunakan sebagai pendeteksi apakah kondisi bola menyentuh batas kanan atau bataskiri sudah terjadi atau belum. *. baris on$lip&vent (enter"rame)* berarti perintah yang berada dalam blok *+ akan dijalankan secara berulang setiap seperduabelas detik secara terus menerus hingga mo0ie ditutup. -. baris 0x '1 kecepatan/ berarti kordinat , dari bola akan ditambah sejumlah nilai dari 0ariabel kecepatan. 5. baris i! (0xBbataskiri or 0xCbataskanan)* berarti 2jika kordinat , lebih besar dari 0ariabel bataskanan atau kordinat , lebih kecil dari 0ariabel batas kiri maka3 perintah dalam blok *+ akan dijalankan. 7. baris kecepatan 1 %kecepatan/ berarti apabila kondisi pada no 5 tercapai maka apabila nilai kecepatan positif akan dijadikan negatif +menjadi R'(/ dan sebaliknya jika nilai kecepatan negatif maka kecepatan akan diubah nilainya menjadi positif +menjadi R+-'(/ atau @'(/. 'perator not Cperator not berarti tidak sesuai dengan kondisi. Cperator ini jarang dipakai dalam sebuah aplikasi game. Cperator not dalam flash dapat ditulis dalam ) bentuk yaitu 1 Jkondisi 2 atau not kondisi 24 Cperator not akan bernilai benar jika kondisi yang dimasukan salah dan akan bernilai salah jika kondisi yang dimasukkan adalah benar. 'perasi Pengulangan dengan for( !ada dasarnya operasi pengulangan dalam flash dapat dilakukan oleh * macam script yaitu !or, while, dan do44while. Akan tetapi pada buku ini dan buku seri pemrograman game lainnya yang sering dipakai untuk operasi pengulangan adalah

perintah

!or.

Bentuk

penulisan

operasi

for

adalah

sebagai

berikut

!or (inisialisasi/ kondisi/ pengurangan atau penambahan)* blok perintah ang diEalankan selama kondisi dipenuhi + bagian inisialisasi digunakan untuk memberi nilai kepada 0ariabel yang digunakan untuk mengontrol pengulangan. bagian kondisi digunakan untuk menghentikan pengulangan bagian pengurangan atau penambahan digunakan untuk menambah atau mengurangi 0ariabel yang diset pada inisialisasi4 6ntuk lebih jelasnya perhatikan contoh penggunaan !or berikut 1 !ermasalahan Buatlah sebuah program yang menampilkan angka ' sampai '(( !enyelesaian dari masalah tersebut terlihat sangat mudah, kita tinggal menuliskan angka dari ' sampai '(( dengan menggunakan text tool. Akan tetapi hal tersebut tentunya memakan waktu, karena ada cara yang jauh lebih mudah, yaitu 1 '. Buatlah sebuah d namic text area dengan menggunakan text tool. Atur warna, ukuran huruf, bentuk huruf dan besar area sesuai dengan yang diperlukan. ). &lik te,t area tersebut, kemudian bukalah panel properties. !ilih multiline pada line type dan ketikan 2angka3 pada 0ar. 1

dynamic te,t properties *. &emudian buatlah sebuah layer baru diatas layer ', dan ubah namanya menjadi la er action. -. &lik frame ' layer action, kemudian buka panel action dan ketikan action sebagai berikut 1 for +iF'< iNF'((< i@@/ : angka @F i@P, P< =

5. ?alankan mo0ie, maka akan muncul bilangan ' sampai dengan '((. !enjelasan program 1 '. ebuah penulisan script di frame memiliki * tipe penulisan yaitu penulisan di dalam suatu blok movie event atau mouse event, contoh on&nter!rame 1 !unction()*+ dan penulisan tanpa movie event atau mouse event, contoh adalah penggunaan for pada program yang kita buat di atas. Tipe penulisan yang lain adalah kombinasi dari keduanya, contohnya akan kita dapati pada program di bab selanjutnya. ). baris !or (i12/ iB1233/ i'')* berarti perintah dalam blok *+ akan dijalankan secara terus menerus sebanyak '(( kali +nilai 0ariabel i awal adalah ' (i 1 2) dan nilai i pada 0ariabel kondisi adalah '(( (iB1233), setiap saat i ditambah dengan angka ' (i'') sampai i F '((. etelah 0ariabel i bernilai '((, maka pengulangan dihentikan karena kondisi sudah tercapai. *. baris angka '1 i'A, ./ berarti 0ariabel angka +0ariabel yang ditampilkan oleh d namic text yang kita buat sebelumnya/ setiap saat +karena action pengulangan !or/ akan ditambah dengan number i dan string -, -. !erhatikan penjelasan berikut1 saat nilai i bernilai ' maka 0ariabel angka bernilai 1 -2, selanjutnya nilai i bernilai ) akibat scrip i'' maka 0ariabel angka yang sudah bernilai -2, - ditambah lagi dengan -5, - sehingga menjadi -2, 5, -4 proses tersebut diulang secara terus menerus oleh script !or sampai i bernilai 233 sehingga pada akhir proses diakhiri dengan nilai angka 1 -444,KK, 233, -.

Movie (lip Mo0ieclip merupakan sebuah mo0ie kecil yang berada didalam mo0ie utama. Mo0ieklip memiliki timeline sendiri, dan dapat ditampilkan dalam timeline mo0ie utama dengan satu frame saja atau lebih. Mode action pada flash sering kali melibatkan sebuah atau lebih mo0ieclip. Cleh karena itu action script khusus untuk mo0ieclip harus dipahami secara mendetail jika kita ingin menjadi seorang flash de0eloper. Mem$uat Movieclip etelah pelajaran sebelumnya, mungkin kita akan menganggap bahwa membuat mo0ieclip itu mudah, yaitu dengan membuat sebuah obyek, kemudian mengcon0ertnya menjadi mo0ieclip dengan menekan F.. "alam pemrograman game, tidaklah semudah itu. &ita harus memahami bagian yang lebih mendetail. 6ntuk lebih jelasnya perhatikan contoh sederhana berikut 1 !ermasalahan 1 buatlah sebuah animasi mobil yang bergerak kekanan dan berhenti saat berada di kanan layar. 6ntuk menyelesaikan permasalahan tersebut perhatikan gambar berikut 1

0isualisasi program

masalah yang muncul pada pembuatan program tesebut adalah pada bagian menghentikan roda saat mobil berhenti. edangkan mengenai teknik menggambar, akan dijelaskan pada bab pembuatan karakter game. !erhatikan solusi atas permasalahan tersebut, berikut ini 1 '. Buatlah file baru berukuran .(( , 7(( pi,el dan ') fps. ). "engan menggunakan drawing tool buatlah sebuah gambar frame roda, dan warnailah sesuai dengan keinginan anda. !astikan untuk menggambar 0elg walaupun sederhana, agar roda kelihatan berputar saat digerakkan.

gambar roda sebelum dan sesudah diberi warna *. eleksi gambar roda tersebut, kemudian con0ert menjadi symbol movieclip dengan nama roda. -. &emudian con0ert lagi mo0ieclip roda, menjadi symbol movieclip dengan nama animasi roda. Maksud dari mengkon0ert obyek sebanyak dua kali agar ketika kita memasuki mode edit mo0ieclip animasi roda kita tidak perlu mengkon0ert symbol lagi. + selain itu mengkon0ert menjadi suatu symbol diperlukan apabila kita akan membuat sebuah motion tween/ 5. "ouble klik mo0ieclip animasi roda untuk mengeditnya. 7. &lik frame '5, kemudian masukan ke !rame. >. elanjutnya klik kanan frame '( dan pilih create motion tween. akan didapatkan sebuah animasi roda yang berputar searah jarum jam +clockwise/. .. &lik frame '(, kemudian buka properties. !ilih $L pada option rotate. Maka

Memutar obyek searah jarum jam dengan rotate 8. ?alankan mo0ie untuk melihat hasil perputarannya. ?ika kita jeli kita akan melihat bahwa perputaran roda sedikit janggal, karena ada roda berhenti beberapa saat.

Gal tersebut dikarenakan adanya posisi roda yang sama pada frame ' dan frame '5. 6ntuk memperbaikinya tekan %trl@A. '(. !astikan terlebih dahulu anda tetap pada mode edit mo0ieclip animasi roda. &emudian tambahkan sebuah layer, dan ubah namanya menjadi la er action. ''. &lik layer action frame '5 la er action, kemudian masukan keyframe. Buka panel action dan ketikan action goto9ndPla (2)/. '). ?alankan kembali mo0ie dan sekaran perputaran roda sudah tidak janggal. Tutup kembali dengan menekan %trl@A. '*. eleksi mo0ieclip animasi roda pada stage dan hapus dengan menekan tombol Delete. ebuah obyek yang sudah di con0ert menjadi symbol secara otomatis akan masuk ke dalam librar . '-. Buatlah sebuah gambar badan mobil menggunakan drawing tool. &emudian kon0ert menjadi symbol movieclip dengan nama mobil.

gambar badan mobil pada mo0ieclip mobil '5. "ouble klik mo0ieclip mobil tersebut untuk memasuki mode edit symbol. &emudian buat layer baru di atas layer ' dan ubah namanya menjadi layer roda. '7. Buka librar dengan menakan tombol $trl'? atau klik menu window4library, jika panel library belum terbuka. &emudian drag mo0ieclip animasi roda dari library ke stage sebanyak ) kali. Atur posisinya.

drag symbol dari library ke stage '>. etelah pembuatan mo0ieclip mobil dianggap selesai, tekan %trl@D untuk kembali ke stage utama. Atur posisinya dengan meletakkan mo0ieclip mobil di sebelah kiri stage. '.. 6ntuk menggerakan mobil ke kanan, klik mo0iclip mobil, buka panel action dan ketikan action berikut 1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F (< = = '8. impan file dan jalankan mo0ie, dan kita akan mendapati mobile bergerak ke kanan dan berhenti. tetapi roda mobil tersebut masih bergerak. !enjelasan program tersebut sama dengan penjelasan program latihan i!4 6ntuk menghentikan Instance /ame Telah dijelaskan pada bab sebelumnya bahwa identitas sesungguhnya suatu symbol +mo0ieclip atau button/ adalah instance name. &egunaan instance name adalah untuk memberi identitas pada suatu symbol, sehingga kita bisa lebih spesifik memberikan action pada mo0ieclip atau button tertentu yang sudah diberi instance name. Mengatur Movieclip dari Frame dengan Movie )vent- on)nterFrame( &ita dapat mengatur property mo0ieclip, gerakan, menduplikasi atau menghapus sebuah mo0ieclip dengan menuliskan action pada frame. 6ntuk lebih jelasnya perhatikan contoh berikut 1 roda mobil terdapat pada latihan selanjutnya.

7. Buatlah sebuah obyek lingkaran dengan menggunakan o0al tool. eleksi obyek lingkaran tersebut kemudian con0ert menjadi. !ilih movieclip pada option beha0iour dan ketikan bola pada name. >. &lik symbol bola tersebut, kemudian buka panel instance dan ketikan nama 2bola3 pada instance name.

!roperties mo0ieclip bola .. Buatlah sebuah layer baru dan ubah namanya menjadi layer action. !enabahan layer action akan mempermudah kita dalam penulisan action pada frame, sehingga tidak akan mengganggu obyek yang lain.

layer action 8. &lik frame ' layer action, dan dalam kondisi frame ' terseleksi buka panel action bola.onDnterFrame F function+/ : ;;menggerakan bola kekanan this.E, @F '(< =< '(. ?alankan mo0ie, maka bola akan bergerak ke kanan. !enjelasan pola penulisan action script pada frame adalah sebagai berikut 1 ebelumnya lihatlah tabel perbedaan antara penulisan action script di frame dengan penulisan action script di mo0ieclip pada bab sebelumnya. Gal yang harus dipegang adalah kata 2bola3 dalam baris 2bola4on&nter"rame3 adalah instance name bukan nama symbol. elain itu dalam mode penulisan action di frame, kita membutuhkan action this4 untuk mengawali sebuah object property atau obyek action.

Instance /ame Bertingkat "alam latihan menggerakkan mobil yang belum terselesaikan sebelumnya, terdapat sebuah mo0ieklip yang bertingkat. Maksudnya didalam mo0ieclip mobil terdapat mo0ieclip lagi yaitu mo0ieclip animasi roda. "engan bahasa bebas dapat diterjemahkan sebagai berikut 2animasi roda adalah anak dari mobil dan mobil adalah anak dari movie utama3. "engan demikian kita bisa menambahkan instance name ang bertingkat pula pada mo0ieclip mobil tersebut. 6ntuk lebih jelasnya perhatikan contoh berikut 1 '. Buka kembali file latihan menggerakan mobil yang anda buat sebelumnya +buka file program'5-mo0ieclip.fla/. ). "ouble klik mo0ieclip mobil untuk mengeditnya. *. "alam mode edit mo0ieclip mobil, klik mo0ieclip animasi roda bagian depan, kemudian buka panel properties dan ketikan -roda02. pada instance name.

intance name animasi roda depan -. &lik mo0ieclip animasi roda bagian belakang, kemudian buka panel properties dan ketikan -roda05. pada instance name. 5. &embali ke stage utama dengan menekan tombol %trl@D. 7. &lik mo0ieclip mobil dan buka panel properties dan ketikan -mobil. pada instance name. !erhatikan hirarki instance name bertingkat berikut ini1

susunan hirarki instance name mo0ieclip roda

>. &lik kembali mo0ieclip mobil kemudian buka panel action dan tambahkah action menjadi 1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F (< ,,menghentikan roda roda024stop()/ roda054stop()/ = = .. ?alankan mo0ie, maka ketika mobil melewati batas kanan, mobil akan berhenti dan roda ikut berhenti. !enjelasan program 1 '. Baris roda024stop() berarti action stop() akan berimbas pada mo0ieclip animasi roda yang sebelumnya telah diberikan intsnce name roda02 saja. ). Baris roda054stop() memiliki penjelasan yang sama dengan penjelasan no '. *. Meskipun menggunakan mo0ieclip yang sama yaitu mo0ieclip animasi roda, instance name harus berbeda agar bisa dipengaruhi oleh action. -. Apabila script tersebut ditulis pada frame, maka bentuk penulisannya menjadi mobil4roda024stop()/ perhatikan bahwa dibagian depan diikuti dengan nama instansi induknya. Menggunakan "inkage elain instance name dalam flash juga terdapat istilah linkage sebagai identitas pengenal suatu symbol +mo0ieclip, button dan sound/. 6ntuk menambahkan linkage perhatikan contoh berikut 1

'. buka panel library, kemudian klik kanan nama symbol dan pilih menu linkage, maka akan muncul linkage properties. &etikan nama linkage pada identi!ier, aturan penulisan nama identifier sama dengan aturan penulisan instance name dan pilih option export !or action script, secara otomatis option export in !irst time akan terpilih.

membuat linkage ). &lik C&, maka pada library akan muncul nama linkage.

identifier linkage pada library Menam$ahkan Movieclip ke dalam Stage dengan attachMovie( Menambahkan mo0ieclip ke stage dapat dilakukan dengan dua cara, cara yang pertama adalah cara yang sudah kita lakukan pada latihan-latihan sebelumnya, yaitu

dengan menggambar langsung obyek pada stage, lalu mengcon0ertnya menjadi mo0ieclip atau dengan mendrag suatu mo0ieclip dai library ke stage. %ara yang kedua adalah dengan menggunakan action attachMovie() bentuk perintah tersebut adalah sebagai berikut 1 attachMovie(identi!ier, instance name, level, propert )/ Bagian identi!ier merupakan identifier linkage suatu mo0ieclip. Bagian instance name merupakan instance name baru mo0ieclip yang ditambahkan ke stage. Bagian level merupakan kedalaman dimana mo0ieclip tersebut diletakkan. !erhatikan aturan penulisan le0el berikut 1 '. le0el dapat dimulai dari angka R8888 sampai @8888, dimana le0el R8888 adalah kedalaman yang paling bawah dan @8888 adalah kedalaman yang paling atas. sistem le0el dalam attachmo0ie.

). *.

atu le0el hanya dapat ditempati oleh satu obyek. ?adi kedalaman masingmasing mo0ieclip harus berbeda. Bila kita meletakkan mo0ieclip dengan cara manual +tidak menggunakan action/, secara otomatis le0el terbentuk mulai dari le0el (. dapat ditulis atau tidak. ?ika ditulis, bagian ini menyatakan properti

Bagian propert

dari mo0ieclip yang ditambahkan. 6ntuk lebih jelasnya tentang penggunaan action attachMo0ie, perhatikan contoh berikut 1 '. Buatlah sebuah gambar lingkaran dan con0ert menjadi movieclip dengan nama bola. ). Gapus bola dari stage. &emudian buka panel library dengan menekan tombol %trl@I atau memilih menu window4library.

*. !ada library, klik kanan nama bola, kemudian pilih linkage. !ilih option export !or actionscript dan klik OD. !erhatikan bahwa identifier secara default akan mengikuti nama symbol. !erhatikan gambar pada penjelasan mengenai linkage. -. &lik frame ', buka panel action. &emudian ketikan action script berikut 1 attachMo0ie+PbolaP, PbolaE'P, ', :E,1'((, Ey1'((=/< 5. ?alankan mo0ie, maka gambar bola akan muncul pada kordinat 233,233 pada stage yang sebelumnya kosong. !enjelasan program 1 '. ebelum menggunakan action attachMovie, diharuskan terlebih dahulu untuk melinkage suatu symbol. ). Menghapus mo0ieclip bola dari stage dimaksudkan agar kita memulai program dengan stage yang kosong, sehingga penambahan mo0ieclip oleh action attachMovie akan terlihat jelas. *. &ata -bola. pada action attachMovie(AbolaA, Abola02A, 2, *0x7233, 0 7233+)/ merupakan nama identifier linkage. -. &ata -bola02. pada action attachMovie(AbolaA, Abola02A, 2, *0x7233, 0 7233+)/ merupakan nama instance name mo0ieclip yang ditambahkan. 5. &ata 223 merupakan le0el tempat kita meletakkan mo0ieclip bola. 7. &ata *0x7233, 0 7233+ merupakan bagian pengesetan poperti awal mo0ieclip bola, dimana kordinat , bernilai '(( dan kordinat y bernilai '((. ?ika bagian ini tidak ditulis, kordinat mo0ieclip secara default adalah (3, 3). !ermasalahan 1 Buatlahlah sebuah gambar lingkaran yang berderet memenuhi layar.

ebelum menyelesaikan masalahtersebut, kita gambarkan dulu secara 0isual sebagai berikut 1

0isualisasi program Masalah tersebut dapat kita selesaikan dengan dua cara, yang pertama adalah secara manual kita tata satu demi satu mo0ieclip ke stage, dan cara lain dengan menggunakan action script !or sebagai berikut 1 '. Buatlah sebuah gambar lingkaran nama bola. dengan ukuran 5( , 5( pi,el +gunakan properties untuk mengubah ukuran obyek/ dan con0ert menjadi movieclip dengan

mengeset ukuran obyek dengan properties ). Gapus bola dari stage. &emudian buka panel library dengan menekan tombol %trl@I atau memilih menu window4library. *. !ada library, klik kanan nama bola, kemudian pilih linkage. !ilih option export !or actionscript dan klik OD. -. &lik frame ', buka panel action. &emudian ketikan action script berikut 1 dalam F (< for +0ar i F (< iN'>< i@@/ : for +0ar j F (< jN'*< j@@/ : attachMo0ie+PbolaP, PbolaEP@i@PEP@j, dalam@@, :E,1+iO5(/, Ey1+jO5(/=/< = = 5. ?alankan mo0ie, maka gambar bola akan muncul secara berdekatan memenuhi stage. !enjelasan program 1 '. baris dalam 1 3/ merupakan pengesetan awal 0ariabel kedalaman mo0ieclip. ). baris !or (var i 1 3/ iB2G/ i'')* diikuti dengan baris !or (var E 1 3/ EB26/ E'')* disebut sebagai operasi pengulangan bertingkat. "alam operasi pengulangan

bertingkat, operasi pengulangan terakhir +!or (var E 1 3/ EB26/ E'')/ akan dijalankan terlebih dahulu, sehingga perintah dalam blok *+ + yang berisi attachMovie(444)/ akan dijalankan dengan nilai i 1 3 dan E 1 3 sampai EB26 terlebih dahulu, barulah nilai i bertambah menjadi i 1 2, dan nilai E menjadi ( lagi, sehingga operasi pengulangan dilakukan kembali dengan nilai i 1 2 dan E 1 3 sampai EB26. !roses tersebut berulang-ulang sampai kondisi iB2G terpenuhi. *. "alam operasi bertingkat diperlukan action var sebagai penyimpan 0ariabel. -. Baris attachMovie(AbolaA, Abola0A'i'A0A'E, dalam'', *0x7(i=;3), 0 7(E=;3)+)/ berarti mo0ieclip dengan lingkage 2bola3 pada library ditambahkan ke stage sebanyak '. , '- buah +oleh perintah !or bertingkat/, dalam penambahan tersebut masing masing mo0ieclip diberikan nama instansi yang berbeda beda yaitu sesuai dengan nomor penempatannya +Abola0A'i'A0A'E /. ebagai contoh, bola yang berada pada kolom ke 25 dan baris ke ; akan memiliki instansi name 2bola0250;.. &ata 2dalam''3 menunjukan lokasi kedalaman mo0ieclip bola, 3''3 berarti setiap proses pengulangan nilai 0ariabel dalam ditambah '. &ata 2*0x7(i=;3), 0 7(E=;3)+2 berarti pengaturan posisi kordinat masing-masing bola yang ditempatkan. %ontoh bola yang berada pada kolom ') dan baris ke 5 akan ditempatkan pada kordinat (25 x ;3, ; x ;3) atau (#33, 5;3). Angka 5( sebagai pengali, diperoleh dari lebar dan tinggi dari mo0ieclip bola yang kita tentukan sebelumnya yaitu ;3. Menduplikasi Movieclip dengan duplicateMovie(lip( Mendupilkasi mo0ieclip dapat dilakukan dengan ) cara yaitu secara manual dengan mengcopy mo0ieclip dan kemudian mempastenya, dan dengan menggunakan action script duplicateMovie$lip(). Gal utama yang harus diperhatikan adalah setiap duplikasi harus memiliki instance name yang berbeda. Menduplikasi sebuah mo0ieclip sering diperlukan dalam suatu pemrograman game. eperti memperbanyak musuh, membuat background, menampilkan senjata yang beragam dan sebagainya. Bentuk penulisan action duplicateMovie$lip ada ) yaitu 1 duplicateMovie$lip(target, nama instansi baru, kedalaman)/ dan nama instansi4duplicateMovie$lip(nama instansi baru, kedalaman, properti)/

%ontoh program berikut ini adalah aplikasi action duplicateMo0ie%lip mode kedua, sedangkan mode penulisan pertama akan dipakai pada program aplikasi pada bab selanjutnya 1 '. Buatlah sebuah gambar lingkaran dan con0ert menjadi movieclip dengan nama bola. ). Gapus bola dari stage. &emudian buka panel library dengan menekan tombol %trl@I atau memilih menu window4library. *. !ada library, klik kanan nama bola, kemudian pilih linkage. !ilih option export !or actionscript dan klik OD. -. &lik frame ', buka panel action. &emudian ketikan action script berikut 1 attachMo0ie+PbolaP, PbolaE'P, ', :E,1'((, Ey1'((=/< bolaE'.duplicateMo0ie%lip+PbolaE)P, ), :E,1)((, Ey1'((=/<

5. ?alankan mo0ie, maka gambar bola akan muncul pada kordinat 233,233 dan 533,233 pada stage yang sebelumnya kosong. !enjelasan program 1 '. baris pertama merupakan perintah untuk menambahkan mo0ieclip bola ke stage dengan nama instance -bola02.4 ). elanjutnya pada baris kedua, mo0ieclip bola02 diduplikasi menjadi mo0ieclip berinstansi name -bola05., diletakkan pada kedalaman 5 dan diletakkan pada kordinat (533, 233)4 Menghapus Movieclip dengan removeMovie(lip( etelah tidak dipakai lagi, dalam sebuah game atau aplikasi, sebuah mo0ieclip lebih baik dihapus dari stage. Gal tersebut dimaksudkan untuk memperkecil memori dan membersihkan layar tentunya. ama dengan action duplicateMo0ieclip, action remo0eMo0ieclip juga memiliki dua bentuk yaitu 1 removeMovie$lip(target)/ dan nama instansi4removeMovie$lip()/

%ontoh program berikut ini adalah aplikasi action remo0eMo0ie%lip mode kedua, sedangkan mode penulisan pertama akan dipakai pada program aplikasi pada bab selanjutnya 1 '. Buatlah sebuah gambar lingkaran dan con0ert menjadi movieclip dengan nama bola. ). Gapus bola dari stage. &emudian buka panel library dengan menekan tombol %trl@I atau memilih menu window4library. *. !ada library, klik kanan nama bola, kemudian pilih linkage. !ilih option export !or actionscript dan klik OD. -. Buatlah sebuah layer baru diatas layer ' dan ubah namanya menjadi la er action. &lik frame ' layer action, buka panel action. &emudian ketikan action script berikut 1 attachMo0ie+PbolaP, PbolaE'P, ', :E,1'((, Ey1'((=/< bolaE'.duplicateMo0ie%lip+PbolaE)P, ), :E,1)((, Ey1'((=/< 5. &lik frame ' la er 2. Buatlah sebuah tombol hapus, kemudian klik tombol hapus, buka panel action dan ketikan script berikut 1 on +release/ : bolaE).remo0eMo0ie%lip+/< = 7. ?alankan mo0ie, tekan tombol hapus maka bola05 hasil duplikasi dari bola02 akan hilang akibat action bola054removeMovie$lip()/ %atatan 1 apabila kita menambahkan mo0ieclip secara manual +dengan mendrag dari library ke stage/, action removeMovie$lip yang dipakai adalah bentuk pertama. !enjelasan mengenai hal tersebut akan dibahas pada bab selanjutnya.

Function Function selalu dihadirkan dalam setiap bahasa pemrograman. Bang dimaksud dengan function adalah kumpulan dari satu atau lebih suatu action script yang dapat dipakai menjadi sebuah perintah baru yang kita definisikan sendiri. !erhatikan contoh berikut 1 '. Buatlah file baru, kemudian klik frame ', buka panel action dan ketikan script berikut 1 function kuadrat+bilangan/: return bilanganObilangan = trace+kuadrat+8//< ). ?alankan Mo0ie maka pada panel output akan muncul angka M2. truktur dari function adalah sebagai berikut 1

!ertama kita harus memberikan sebuah nama pada functioan yang akan kita buat. Aturan pemberian nama function sama dengan aturan pemberian nama instansi. elanjutnya kita tentukan parameter atau variabel yang akan kita pakai dalam fungsi tersebut. "i dalam blok 2*+3 merupakan kumpulan perintah, yang digunakan untuk menyusun sebuah function. "alam contoh di atas, digunakan peritah return bilangan=bilangan perintah return dalam hal ini adalah untuk menghasilkan suatu nilai.

!enggunaan function dilakukan di luar blok 2*+3 function itu sendiri, dan penulisannya dapat dilakukan di atas function maupun di bawah function. !erhatikan gambar berikut 1

penggunaan function !ada contoh diatas baris trace(kuadrat(K))/ berarti menampilkan pesan pada output panel kuadrat dari K. %ontoh penggunaan yang lain adalah total 1 kuadrat(2G)/ maka dapat diartikan sebagai total 1 5MK/ . Function dapat dipakai berulang kali.

Arra# 9rra adalah suatu kumpulan data yang bertipe sama. %ontoh arra nama-nama hari berisi +2minggu3, 2senin3, 2selasa3, 2rabu3, 2kamis3, 2jumat3, 2sabtu3/. "alam flash untuk membuat sebuah array terdapat ) cara yaitu varia$el 1 ne2 Arra#( ! Action new dalam flash merupakan sebuah perintah untuk membuat obyek baru. &arena new diikuti oleh 9rra (), berarti kita membuat obyek baru bertipe array. %ontoh aplikasi penggunaan action new9rra ()/ adalah sebagai berikut 1 !ermasalahan 1 etelah game berakhir, terdapat '( nilai pemain yang terekam yaitu 1 '((, 8., '(5, >), *', 7>, ).(, )'(, 7>, 57. Buatlah sebuah aplikasi yang dapat menampilkan highscore secara berurutan +dari score tertinggi sampai score terendah/.

!enyelesaian masalah tersebut dengan menggunakan array adalah sebagai berikut 1 '. Buatlah file baru, kemudian klik frame '. Buka panel action dan ketikan action sebagai berikut 1 score F new Array+'((, 8., '(5, >), *', 7>, ).(, )'(, 7>, 57/< ;;mencari yang tertinggi banyak"ata F score.length< for +iF(< iNFbanyak"ata-'< i@@/ : dataTerkecil F i< for +jFi@'< jNbanyak"ata< j@@/ : if +scoreJjK4scoreJdataTerkecilK/ : dataTerkecil F j< = = if +dataTerkecil4i/ : penyimpan ementara F scoreJiK< scoreJiK F scoreJdataTerkecilK< scoreJdataTerkecilK F penyimpan ementara<

= = ;; menampilkan data trace+score/< ). ?alankan mo0ie, maka pada output panel akan muncul angka yang beruutan mulai dari yang tertinggi sampai terendah. !enjelasan program 1 '. baris score 1 new 9rra (233, KM, 23;, G5, 62, #G, 5M3, 523, #G, ;#)/ merupakan pengesetan 0ariabel bertipe array dan pengesetan isi datanya. Berarti nilai dari scoreN;O 1 #G/ karena penghitungan data dimulai dari angka (. ). baris ban akData 1 score4length/ length merupakan action yang digunakan untuk mengetahui jumlah data dalam arra dan disimpan pada 0ariabel ban akData. *. baris ke - sampai baris ke '7 merupakan sebuah prosedure yang mengurutkan nilai 0ariabel score dari yang tertinggi sampai yang terandah. !rinsip dasar program pengurutan data adalah sebagai berikut 1 '. impan bilangan pertama +!or (i13/ iB1ban akData%2/ i'') * / ). Ambil bilangan kedua +!or (E1i'2/ EBban akData/ E'') * / *. Bandingkan antara bilangan pertama dan bilangan kedua. +i! (scoreNEOCscoreNdataTerkecilO) * /. -. ?ika bilangan kedua lebih besar, maka balik posisi data-nya +dataTerkecil 1 E//. 5. &emudian balik nilai datanya. ebelum membalik nilai data, kita membutuhkan 0ariabel penyimpan data pertama (pen impanSementara 1 scoreNiO// 7. >. elanjutnya nilai data pertama di ubah menjadi F nilai data kedua +scoreNiO 1 scoreNdataTerkecilO//. edangkan nilai data kedua di ubah menjadi F nilai data pertama, akan tetapi berhubung nilai data pertama telah berubah menjadi nilai data kedua akibat action +scoreNiO 1 scoreNdataTerkecilO//, maka digunakanlah 0ariabel pen impanSementara yang masih memiliki nilai awal dari data pertama dengan menggunakan action +scoreNdataTerkecilO 1 pen impanSementara//

-.

elanjutnya data yang sudah diurutkan ditampilkan pada output panel dengan action trace(score)/.

varia$el 1 3 4! %ara membuat sebuah 0ariabel bertipe array selanjutnya adalah dengan menuliskan bentuk variabel 1 N O. %ara tersebut sama hasilnya dengan cara yang pertama. %ontoh aplikasi penggunaan action variabel 1 N O/ adalah sebagai berikut 1 !ermasalahan 1 Buatlah sebuah gambar berpola sebagai berikut1

!enyelesaian dari masalah tersebut adalah dengan menggunakan arra berdimensi 5. !erhatikan proses berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps< ). Buatlah gambar kotak berwarna merah dengan menggunakan rectangle tool, dengan ukuran -( , -( pi,el. elanjutnya seleksi kotak tersebut dan con0ert menjadi movieclip dengan nama kotak. *. "ouble klik mo0ieclip kotak untuk masuk ke mode edit symbol. !ada mode edit symbol, klik frame ) dan masukan keyframe. -. 6bah warna kotak dari merah menjadi biru. ehingga pada frame ' kotak berwarna merah dan pada frame ) kotak berwarna biru. elanjutnya Tekan %trl@D untuk kembali ke stage utama.

susunan obyek pada mo0ieclip kotak 5. Gapus mo0ieclip kotak dari stage. Buka panel library, kemudian klik kanan pada nama symbol dan pilih linkage. !ilih export !or action script dan klik OD4

melinkage mo0ieclip kotak 7. &lik frame ', buka panel action dan ketikkan scrip berikut 1 pola F JJ', (, (, (, (, (, (, (, (, (, 'K, J(, ', (, (, (, ', (, (, (, ', (K, J(, (, ', (, ', (, ', (, ', (, (K, J(, (, (, ', (, (, (, ', (, (, (K, J(, (, ', (, ', (, ', (, ', (, (K, J(, ', (, (, (, ', (, (, (, ', (K, J(, (, ', (, ', (, ', (, ', (, (K, J(, (, (, ', (, (, (, ', (, (, (K, J(, (, ', (, ', (, ', (, ', (, (K, J(, ', (, (, (, ', (, (, (, ', (K, J', (, (, (, (, (, (, (, (, (, 'KK< function gambar!ola+data!ola, ,awal, yawal/ : kedalaman F (< lebar F data!olaJ(K.length< tinggi F data!ola.length< for +0ar i F (< iNlebar< i@@/ : for +0ar j F (< jNtinggi< j@@/ : attachMo0ie+PkotakP, PkotakP@i@PEP@j, kedalaman@@, :E, 1 ,awal@+iO-(/, Ey 1 yawal@+jO-(/=/<

thisJPkotakP@i@PEP@jK.gotoAnd top+data!olaJjKJiK@'/< = = = gambar!ola+pola, '((, '((/< >. ?alankan mo0ie, maka akan didapatkan gambar yang diinginkan. !enjelasan program 1 '. Baris ' sampai baris '' merupakan baris tempat kita membuat 0ariabel pola bertipe arra berdimensi ) sebesar '' , '' data. ecara mudah dapat kita pahami sebagai berikut 1 bila penulisan array diawali dengan satu tanda N berarti array tersebut berdimensi ', contoh penggunaannya adalah scoreN5O 123;. penggunaannya polaN<ON5O 1 2. ). Baris ke ') +!unction gambarPola(dataPola, xawal, awal)* / merupakan sebuah fungsi untuk membuat gambar pola dengan 0ariabel dataPola sebagai informasi bentuk pola, xawal sebagai kordinat , dimulainya proses menggambar, dan awal sebagai kordinat y dimulainya prose menggambar. *. Baris kedalaman 1 3 merupakan pengesetan awal 0ariabel yang akan digunakan untuk menentukan kedalaman +level/ dari mo0ieclip yang akan dibuat. -. Baris lebar 1 dataPolaN3O4length< digunakan untuk menghitung banyaknya mo0ieclip yang akan digambar ke arah samping. !erhatikan bahwa dataPolaN3O bernilai F N2, 3, 3, 3, 3, 3, 3, 3, 3, 3, 2O, sehingga panjangnya adalah ''. 5. Baris tinggi 1 dataPola4length/ digunakan untuk menghitung banyaknya mo0ieclip yang akan digambar ke arah bawah. 7. Baris for (var i 1 3/ iBlebar/ i'') * dan for (var E 1 3/ EBtinggi/ E'')* merupakan operator pengulangan bertingkat untuk menggambar sesuai dengan pola. >. Baris attachMovie(AkotakA, AkotakA'i'A0A'E, kedalaman'',*0x 7 xawal'(i=<3), 0 7 awal'(E=<3)+)/ akan menambahkan mo0ieklip kotak ke stage sebanyak '' kali kearah samping dan '' kali ke bawah, dengan le0el kedalaman yang selalu ditambah ' +kedalaman''/, dan peletakan mo0ieclip dimulai dari kordinat xawal dan awal. edangkan bilangan <3 diperoleh dari ukuran panjang dan lebar mo0ieclip kotak. edangkan apabila diawali dengan dua tanda N, berarti array tersebut berdimensi ). %ontoh

.. Baris thisNAkotakA'i'A0A'EO4goto9ndStop(dataPolaNEONiO'2)/ merupakan baris yang membuat pola terbentuk dalam dua warna. $ngat bahwa mo0ieclip kotak memiliki ) frame, yaitu frame ' berisi kotak berwarna merah dan pada frame ) berisi kotak berwarna biru. Action thisNAkotakA'i'A0A'EO akan berpengaruh pada kotak dengan instance name -kotakA'i'A0A'E., dan action goto9ndStop(dataPolaNEONiO'2)/ menyebabkan mo0ieclip dengan instance name -kotakA'i'A0A'E. akan aktif pada nomer frame sesuai dengan dataPolaNEONiO, karena 0ariabel dataPolaNEONiO bernilai antara 3 dan 2, sedangkan frame mo0ieclip kotak bernilai 2 dan 5 maka 0ariabel dataPolaNEONiO perlu ditambah 2 ('2)4 %ontoh penerapan baris tersebut 1 suatu ketika nilai i 1 # dan E 1 5. Maka instance name yang terbentuk adalah -kotak#05., dan nilai dari dataPolaN5ON#O 1 2. Akibat penambahan ' pada 0ariabel dataPola maka keseluruhan baris action tersebut menjadi 1 kotak#054goto9ndStop(5)/ dan kotak menjadi berwarna biru. 8. baris gambarPola(pola, 233, 233)/ merupakan eksekusi dari function gambar!ola, sehingga gambarpun terjadi sesuai dengan yang diingikan.

%root0 %parent0 dan this 0root4 dalam terjemahan bebas dapat kita artikan sebagai 2akar3, 0parent dapat diartikan sebagai 2induk3 dan this dapat diartikan dengan 2symbol ini3. !erhatikan diagram berikut untuk lebih memahami * bentuk action tersebut1

penggunaan action Eroot, this dan Eparent !enjelasan dari diagram tersebut adalah 1 ebagai contoh 1 sebuah movie memiliki ) buah mo0ieclip di dalamnya yaitu movieclip 9 dan movieclip P. "i dalam Movieclip 9 terdapat ) buah mo0ieclip dengan instance name yang berbeda yaitu 1 movieclip 92 dan movieclip 95. &ita dapat mengangap mo0ie utama sebagai pohon, kemudian mo0ieclip A dan mo0ieclip B sebagai akarnya. Mo0ieclip A' dan mo0ieclip A) dapat kita anggap sebagai anak dari mo0ieclip A. Berikut adalah penjelasan masing-masing nomor 1 '. 6ntuk mengakses suatu movieclip dari movie utama (no 2) kita gunakan bentuk instance name4action,propert / contoh1 pada !rame 2 kita tuliskan action 1 nama instance movieclip P40x 1 233/ perintah tersebut akan berpengaruh pada mo0ieclip B saja, dan akan mengeset kordinat E, mo0ieclip B menjadi '((. ). 6ntuk mengakses movie utama dari movieclip (no 5) kita gunakan bentuk 0root4action,propert / atau 0parent4goto9ndStop(53) contoh 1 di !rame 2 pada movieclip 9 kita tuliskan action di dalam suatu blok mo0ie e0ent 1 0root4goto9ndStop(53)/ perintahtersebut akan menyebabkan frame aktif dari mo0ie utama berpindah dari ' ke )(. *. 6ntuk mengakses movieclip satu dari movieclip ang lain (no 6) , maka digunakan bentuk 0root4nama instansi movieklip ang akan

diakses4action,propert <. %ontoh 1 pada movieclip 9 kita ketikan action di dalam suatu blok mo0ie e0ent 1 0root4nama instance movieclip P40visible 1 3/ perintah tersebut akan menghilangkan mo0ieclip B dari stage. -. 6ntuk mengakses movieclip ang berada dalam suatu movieclip , mengakses movieclip anak dari movieclip induk (no <), maka digunakan bentuk this4nama instansi movieclip ang berada di dalamn a4action,propert / %ontoh 1 pada movieclip 9 kita ketikan action di dalam suatu blok mo0ie e0ent 1 this4nama instance movieclip 924goto9ndStop(!rame)/ perintah tersebut akan membuat movieclip 92 yang berada di dalam movieclip 9 berhenti pada frame tertentu. 5. 6ntuk mengakses moviclip induk dari movieclip anak (no ;), digunakan bentuk 0parent4action ,propert / atau 0root4instance name movieclip induk4action,propert / %ontoh 1 di dalam movieclip 92 kita ketikan action di dalam suatu blok mo0ie e0ent 7 0parent40xscale 1 ;3/ perintah tersebut akan menyebabkan movieclip 9 berubah bentuk secara horisontal menjadi setengah +5(L/ dari ukuran aslinya. 7. 6ntuk mengakses movieclip anak dari movieclip anak ang lain(no #), digunakan bentuk 0parent4instance name anak ang akan diakses4action,propert / atau 0root4instance name movieclip induk4instance name moieclip anak ang akan diakses4action,propert / contoh 1 di dalam movieclip 92 kita ketikan action di dalam suatu blok mo0ie e0ent 7 0parent4nama instansi movieclip 954stop()/ perintah tersebut akan menyebabkan movieclip 95 berhenti pada frame tertentu. >. 6ntuk mengakses movie utama dari movieclip anak (no G), digunakan bentuk 0root4action,propert / atau 0parent40parent4action,propert / contoh 1 di dalam movieclip 92 kita ketikan action di dalam suatu blok mo0ie e0ent 7 0parent40parent4goto9ndStop(-gameover.)/ perintah tersebut akan menyebabkan timeline mo0ie utama aktif pada frame berlabel 2gameo0er3. .. 6ntuk mengakses movieclip lain dari movieclip anak (no M) maka digunakan bentuk 0root4nama instansi movieclip ang akan diakses4action,propert / contoh 1 di dalam movieclip 95 kita ketikan action di dalam suatu blok mo0ie e0ent 7 0root4nama instance movieclip P40 '1 533/ perintah tersebut akan menyebabkan movieclip P bergeser kearah bawah sebanyak )(( pi,el. 8. 6ntuk mengakses movieclip anak dari movieclip lain (no K) maka digunakan bentuk 0root4nama instansi movieclip induk4nama instanse movieklip anak

ang akan diakses4action,propert / contoh 1 di dalam movieclip P kita ketikan action di dalam suatu blok mo0ie e0ent 7 0root4nama instance movieclip 94nama instance movieclip 9540alpha 1 ;3/ perintah tersebut akan menyebabkan movieclip 95 menjadi semi transparan. %root5 Ada * bentuk dasar Eroot yaitu 1 %root5action !ada bentuk ini dibelakang 0root4 diikuti dengan action script lain seperti gotoAnd top+/< stop+/< atau action yang lain. Bentuk ini pada dipakai untuk mengakses mo0ie utama. !erhatikan contoh berikut. 1 '. ebelumnya buka file latihan menggerakkan mo0ieclip mobil pada latihan sebelumnya +pada %" tutorial buka file program'5-mo0ieclip.fla/. &emudian buka panel library. ). Buatlah sebuah file baru dengan ukuran .((,7(( pi,el dan ') fps. *. &lik !rame 5, kemudian masukan ke !rame. -. !ada !rame 5, buatlah sebuah static text dengan kata 2!inish3.

tampilan pada frame ) 5. &lik !rame 2, selanjutnya drag mo0ieclip mobil dari library file latihan anda -+file tutorial program'5-mo0ieclip.fla/ yang sudah anda buka sebelumnya- ke stage, dan letakkan disebelah kiri stage. 7. &lik mobil dan ketikan action script berikut 1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F (< Eroot.gotoAnd top+)/<

= >. = elanjutnya, buatlah sebuah layer baru diatas layer ', dan ubah namanya menjadi la er action. .. &lik !rame 2 layer action, buka panel action dan ketikan action 1 8. stop+/< impan file dan jalankan mo0ie.

!enjelasan program 1 '. Action stop()/ diberikan pada frame ' la er action agar mo0ie tidak berjalan secara looping +berulang/. ). &etika mobil telah sampai di garis batas kanan, maka frame aktif dari timeline mo0ie utama dipindah ke frame ) dengan action 0root4goto9ndStop(5)/ !erhatikan bahwa script tersebut ditulis pada mo0ieclip mobil.

%root5varia$le 6 propert# !ada bentuk Eroot yang kedua, dibelakang 0root4 diisi dengan variable, seperti 0ariable score, waktu dan sebagainya. !erhatikan contoh berikut 1 '. Ianjutkan file latihan sebelumnya. &emudian pilih menu !ileCsave as dan masukan nama baru. Maksud dari langkah ini adalah agar file proses kita tidak hilang tertindih oleh file yang baru. "alam proses kerja hal tersebut sering diistilahkan sebagai work in progress. ). &lik !rame 2 la er action, kemudian tambahkan actionnya menjadi 1 stop+/< *. speed F '5< ;; mengatur kecepatan mobil dari frame elanjutnya klik mobil dan ubah scriptnya menjadi 1 on%lipD0ent +load/ : kecepatan F Eroot.speed< ;; mengakses 0ariabel speed pada frame ' layer action bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F (<

Eroot.gotoAnd top+)/< = -. = impan file dan jalankan mo0ie.

!enjelasan program 1 '. Action speed 1 2;/ diambahkan pada frame ' la er action agar kita memiliki 0ariabel baru yang akan digunakan untuk mengatur kecepatan mobil. ). elanjutnya untuk mengakses 0ariabel tersebut dari mo0ieclip, digunakan action kecepatan 1 0root4speed< sehingga dapat diartikan dengan kecepatan 1 2;<

%root5movieclip Bentuk 0root yang ketiga tersebut bedakan lagi menjadi ) yaitu1 %root5instance movieclip5varia$le6propert# Bentuk tersebut pada umumnya digunakan untuk mengakses 0ariabel yang sudah diset dari mo0ieclip lain. !erhatikan contoh berikut 1 '. ebelumnya buka file latihan menggerakkan mo0ieclip mobil pada latihan sebelumnya +pada %" tutorial buka file program'5-mo0ieclip.fla/. &emudian buka panel library. ). Buatlah sebuah file baru dengan ukuran .((,7(( pi,el dan ') fps. *. Buatlah sebuah static text dengan kata 2!inish3, kemudian con0ert te,t tersebut menjadi movieclip dengan nama !inish.

mo0ieclip !inish -. &lik mo0ieclip !inish, buka panel properties dan ketikan kata 2!inish3 pada instance name, kemudian buka panel action dan ketikan script berikut 1 on%lipD0ent +load/ : E0isible F (< =

5.

elanjutnya drag mo0ieclip mobil dari library file latihan anda -+file tutorial program'5-mo0ieclip.fla/ yang sudah anda buka sebelumnya- ke stage, dan letakkan disebelah kiri stage. !erhatikan peletakkannya 1

peletakan obyek pada stage 7. &lik mobil dan ketikan action script berikut 1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan/ : kecepatan F (< Eroot.finish.E0isible F '< = = >. ?alankan mo0ie. !enjelasan program 1 '. Mo0ieclip !inish pada awalnya diberi sebuah instance name agar bisa diakses oleh mo0ieclip lain. ). Agar tidak tampak saat pertamakali mo0ie dimainkan, maka property 0visible pada mo0ieclip !inish diset menjadi 3.

*. &etika mobil telah sampai di garis batas kanan, maka mo0ieclip finish ditampilkan dengan script 0root4!inish40visible 1 2/ !erhatikan bahwa script tersebut ditulis pada mo0ieclip mobil dan dapat mengakses property milik mo0ieclip !inish. %root5 instance movieclip5action Bentuk ini digunakan untuk mengakses suatu mo0ieclip dari mo0ieclip lain . !erhatikan contoh berikut 1 '. ebelumnya buka file latihan menggerakkan mo0ieclip mobil pada latihan sebelumnya +pada %" tutorial buka file program'5-mo0ieclip.fla/. &emudian buka panel library. ). Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. *. Buatlah sebuah static text dengan kata 2!inish3, kemudian con0ert te,t tersebut menjadi movieclip dengan nama teks!inish. mo0ieclip teks!inish

-. &emudian seleksi teks!inish, kemudian con0ert lagi menjadi movieclip dengan nama !inish. 5. "ouble klik mo0ieclip !inish. "alam mode edit symbol, klik !rame 2, kemudian drag dan geser ke !rame 5, sehingga frame ' menjadi kosong.

menggeser keyframe 7. Meser posisi mo0ieclip teks!inish ke sebelah kiri di luar stage >. &emudian klik !rame 63 dan masukkan keyframe. Meser posisi mo0ieclip teks!inish ke sebelah kanan di luar stage. .. &lik kanan frame )(, kemudian pilih create motion tween, maka akan terbentuk animasi teks yang bergerak ke samping. 8. Tambahkan sebuah layer di atas layer ' dan ubah namanya menjadi la er action.

'(. &lik !rame 2 la er action, kemudian buka panel action dan ketikan action stop+/<

pengaturan posisi pada mo0ieclip !inish ''. &embali ke stage utama dengan menekan %trl@D. '). &lik mo0ieclip !inish +saat ini hanya berupa titik, karena frame ' nya kosong/, buka panel properties dan ketikan 2!inish3 pada instance name. '*. elanjutnya drag mo0ieclip mobil dari library file latihan anda -+file tutorial program'5-mo0ieclip.fla/ yang sudah anda buka sebelumnya- ke stage, dan letakkan disebelah kiri stage. '-. &lik mobil dan ketikan action script berikut 1 on%lipD0ent +load/ : kecepatan F '(< bataskanan F >((< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4Fbataskanan and Eroot.finish.Ecurrentframe FF '/ : kecepatan F (< Eroot.finish.gotoAnd!lay+)/< = = '5. ?alankan mo0ie. !enjelasan program 1 '. Mo0ieclip !inish pada awalnya diberi sebuah instance name agar bisa diakses oleh mo0ieclip lain.

). &etika mobil telah sampai di garis batas kanan, maka mo0ieclip !inish dimainkan pada frame ) dengan script 0root4!inish4goto9ndPla (5)/ !erhatikan bahwa script tersebut ditulis pada mo0ieclip mobil dan dapat mengakses mo0ieclip !inish. *. Action and 0root4!inish40current!rame 11 2 pada kondisi i! diperlukan agar mo0ieclip !inish tidak 2terperangkap3 di frame ). eandainya action tersebut dihilangkan maka mo0ieclip !inish tidak akan bergerak. cara penulisan lain $entuk %root5movieclip5 Bentuk 0root dapat dituliskan dengan cara lain, yaitu1 %root37/AMA I/S*A/SI M'8I) ("IP745action %root37/AMA I/S*A/SI M'8I) ("IP745propert# %parent5 bentuk ini pada dasarnya memiliki fungsi yang hampir sama dengan 0root4 !erhatikan diagram penggunaan 0parent, dan dapat disimpulkan dengan bahasa sederhana bahwa 20parent digunakan oleh si anak untuk mengakses induknya3. this5 sedangkan bentuk this4 akan berimbas pada mo0ieclip dimana action this4 tersebut diletakkan. Ada dua hal mengenai penulisan this, yaitu 1 '. this bisa tidak ditulis jika action dituliskan pada mo0ieclip. %ontoh1 on%lipD0ent+enterFrame/: E, @F )(< = action tersebut ditulis pada mo0ieclip, perhatikan bahwa this tidak ditulis didepan action 0x '1 53/ meskipun demikian perintah masih dapat dijalankan. ). this harus dituliskan jika action dituliskan pada frame. %ontoh 1 bola.onDnterFrame F function+/: this.E, @F )(< = berbeda dengan cara pertama, penulisan pada frame untuk sebuah mo0ie e0ent harus menggunakan action this4 sebab jika this4 tidak dituliskan, maka action akan

berimbas pada mo0ie utama +dalam contoh ini, jika this. tidak ditulis, mo0ie utama yang akan bergerak ke kanan bukan mo0ieclip bola/. cara penulisan lain $entuk this5movieclip5 Bentuk this4 dapat dituliskan dengan cara lain, yaitu1 this37/AMA I/S*A/SI M'8I) ("IP745action this37/AMA I/S*A/SI M'8I) ("IP745propert#

Menggerakkan Movieclip Mame pada dasarnya adalah sebuah gerakan obyek yang terkendali. "alam game flash obyek yang dikendalikan sebagian besar adalah mo0ieclip. Menggerakkan mo0ieclip dapat dilakukan dengan berbagai cara baik dengan menggunakan motion tween atau menggunakan action scrip. "engan menggunaan action kita bisa melakukan berbagai gerakan mo0ieclip. Menggerakkan Movieclip dengan *eratur !ergerakan secara teratur sering kita temui dalam sebuah game. %ontoh dari gerakan yang teratur ini adalah gerakan pesawat musuh dari kiri ke kanan, gerakan background dan sebagainya

gerakan yang teratur pada game subSero 6ntuk menggerakan mo0ieclip secara teratur, perhatikan contoh berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( p, dan ') fps. ). &emudian buatlah sebuah gambar pesawat dengan menggunakan drawing tool

karakter pesawat *. eleksi gambar pesawat kemudian con0ert menjadi movieclip dengan nama Eet. Atur posisi Eet, letakkan disebelah kiri luar stage.

-. &lik Eet, kemudian buka panel action kemudian ketikan action berikut 1 on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F )(< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +E,4.((/ : E, F ,awal< Ey F '((@random+-((/< = 5. = impan mo0ie dan jalankan mo0ie, maka ketika Eet keluar dari layar, jet akan muncul kembali dengan kordinat yang berbeda. !enjelasan program tersebut adalah 1 '. !ada saat mo0ieclip Eet ditampilkan pertama kali variabel%variabel yang dibutuhkan diset terlebih dahulu. ). Baris 0 1 233'random(<33)/ berarti kordinat y dari jet diset bernilai acak antara '(( sampai 5((. random(<33) berarti mengacak bilangan ( R -((, sebagai contoh jika random(<33) bernilai 5;3, maka korninat mo0ieclip jet adalah 6;3. *. !ada baris selanjutnya kordinat x mo0ieclip jet ditambah dengan 0ariabel kecepatan secara berulang, sehingga jet akan bergerak ke kanan. -. !ernyataan i! dipakai untuk mendeteksi jet. &etika jet melebihi ukuran stage, posisi Eet dikembalikan ke posisi awal sebelum jet bergerak dan kordinat mo0ieclip jet diacak kembali. Menggerakkan Movieclip dengan Acak Membuat gerakan acak dalam flash dapat dilakukan dengan menggunakan action random(bilangan acak)/ !erhatikan contoh berikut 1 '. Buka file latihan menggerakkan secara teratur diatas, kemudian buka panel library. &ita akan menggunakan mo0ieclip Eet yang sudah ada.

). Buatlah sebuah file baru dengan ukuran .(( , 7(( p, dan ') fps. "rag mo0ieclip Eet dari library ke stage. &emudian atur posisi Eet, letakkan disebelah kiri luar stage *. &lik Eet, kemudian buka panel action kemudian ketikan action berikut 1 on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F '(< naik F (< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +random+'(/ FF */ : ;;gerakan acak naik naik F '< = else if +random+'(/ FF -/ : ;;gerakan acak turun naik F )< = else if +random+'(/ FF 5/ : ;; gerakan lurus naik F (< = ;;menggerakkan naik. if +naik FF ' and Ey45(/ : Ey -F 5< = if +naik FF ) and EyN55(/ : Ey @F 5< = ;;keluar dari stage, maka kembalikan lagi ke posisi awal if +E,4.((/ : E, F ,awal< Ey F '((@random+-((/<

= -. = impan mo0ie dan jalankan mo0ie, karena adanya action random mo0ieclip Eet akan bergerak naik turun. !enjelasan program tersebut adalah 1 '. !ada saat mo0ieclip Eet ditampilkan pertama kali variabel%variabel yang dibutuhkan diset terlebih dahulu. elain itu ditambahkan 0ariabel naik dimana akan bernilai ( jika gerakan lurus, ' untuk gerakan naik dan ) untuk gerakan turun. ). Baris i! (random(23) 11 6) * merupakan baris tempat dimana gerakan acak dihitung. Apabila kondisi bilangan random sama dengan bilangan yang ditentukan, maka Eet diset bergerak naik, turun atau lurus. !enggunaan else dalam hal ini sangat penting, karena tanpa else kemungkinan yang sering muncul adalah pada baris kondisi yang paling bawah yaitu i! (random(23) 11 ;) *. *. !ada baris selanjutnya kordinat diubah seiring dengan nilai 0ariabel naik, dan kordinat x mo0ieclip jet ditambah dengan 0ariabel kecepatan secara berulang, sehingga jet akan bergerak ke kanan. Menggerakkan Movieclip dengan Motion 9uide elain gerakan yang teratur secara 0ertikal atau horisontal dan gerakan acak, kita dapat membuat gerakan yang tidak beraturan dalam hal arah, namun teratur dalam pola gerakan. 6ntuk membuatnya kita dapat memanfaatkan motion guide, contoh penggunaannya adalah sebagai berikut 1 '. Buka file latihan menggerakkan secara teratur diatas, kemudian buka panel library. &ita akan menggunakan mo0ieclip Eet yang sudah ada. ). Buatlah sebuah file baru dengan ukuran .(( , 7(( p, dan ') fps. *. "rag mo0ieclip Eet dari library ke stage. &emudian atur posisi Eet, letakkan disebelah kiri luar stage. -. &lik Eet kemudian buka panel properties dan ketikan 2badanEet3 pada instance name.

mo0ieclip Eet dan instance name badanEet 5. &lik mo0ieclip Eet kemudian con0ert kembali menjadi movieclip animasi0Eet. &emudian double klik mo0ieclip animasi0Eet untuk mengeditnya. 7. !ada mode edit, klik frame *( dan masukan keyframe. >. Tambahkan la er guide dengan menekan tombol add motion guide.

add motion guide .. &lik !rame 2 la er guide, kemudian gambarlah pola gerakan mo0ieclip jet. !erhatikan gambar berikut 1

garis motion guide 8. &lik !rame 2 la er 2, pastikan tombol snap to ob ek dalam keadaan aktif. &emudian klik dan drag mo0ieclip Eet sampai ter-snap pada ujung kiri garis pola.

option snap to obEect dan posisi Eet terhadap garis pola '(. &lik !rame 2 la er 63, kemudian klik dan drag mo0ieclip Eet sampai ter-snap pada ujung kanan garis pola.

posisi Eet terhadap garis pola pada frame *(

''. &lik kanan !rame 53 la er 2, kemudian pilih create motion tween. Maka akan terbentuk sebuah animasi motion mo0ieclip Eet mengikuti pola yang dibuat. +garis yang kita pakai sebagai pola tidak akan ketika mo0ie dijalankan/. '). &lik !rame 53 la er 2, kemudian buka panel properties. eleksi menu orient to path, agar arah mo0ieclip Eet mengikuti pola.

penggunaan orient to path

perbedaan tanpa orien to path dan dengan orient to path '*. Buatlah sebuah layer di atas la er guide dan ubah namanya menjadi la er action. '-. &lik !rame 2 la er action, buka panel action dan ketikan action 1 stop+/< '5. &eluar dari mode edit symbol dengan menekan tombol %trl@D. '7. &lik mo0ieclip animasi0Eet, buka panel action dan ketikan action script sebagai berikut 1 on%lipD0ent +enterFrame/ : if +random+'(/ FF 5 and Ecurrentframe FF '/ : Ey F '((@random+*((/< play+/<

= = '>. impan dan jalankan mo0ie. Akan terlihat bahwa mo0ieclip Eet keluar secara acak dan bergerak sesuai pola !enjelasan program 1 '. !ada awal mo0ie dijalankan, mo0ieclip Eet tidak bergerak karena adanya action stop()/ pada !rame 2 layer action di dalam mo0ieclip animasi0Eet. ). &etika kondisi i! terpenuhi, maka kordinat dari mo0ieclip animasi0Eet diacak dan mo0ieclip tersebut dimainkan, sehingga tampak bergerak. *. &etika mo0ieclip animasi Eet berada pada !rame 63, akibat sifat mo0iclip yang selalu looping, maka frame akan berhenti ke !rame 2 lagi, dan kondisi 0current!rame 11 2 dapat dipenuhi lagi jika ada bilangan random yang tepat. Menggerakkan Movieclip dengan Ke#$oard alah satu alat pengendali gerakan dalam sebuah game adalah keyboard. Gampir sebagian besar game selalu melibatkan penggunaan keyboard. Flash menyediakan action khusus untuk mendeteksi adanya masukan dari tombol keyboard yaitu dengan action De 4 %ontoh dari penggunaan action De 4 adalah sebagai berikut. '. Buat sebuah file baru dengan ukuran .(( ,7(( pi,el, dan ') fps. ). Buatlah sebuah mobil dengan pandangan atas-dengan menggunakan drawing tool. eperti contoh gambar berikut 1

gambar mobil prespektif tampak atas *. eleksi gambar mobil tersebut dan con0ert menjadi movieclip bernama mobil. on%lipD0ent +enterFrame/ : if +&ey.is"own+&ey.IDFT// : ;; bergerak ke kiri jika panah kiri ditekan E, -F '(< -. &lik mobil, kemudian buka panel action dan ketikan action berikut 1

= if +&ey.is"own+&ey.T$MGT// : ;; bergerak ke kanan jika panah kiri ditekan E, @F '(< = = 5. simpan file dan jalankan mo0ie. &emudian tekan keyboard panah kanan dan panah kiri, lihat pergerakan mobilnya. !enjelasan program 1 '. Action De 4isDown() akan membaca apakah ada tombol yang ditekan, dan di dalam tanda () action De 4?&"T , De 48>QHT adalah kode tombol yang ditekan. ). pada baris kondisi yang pertama +i! (De 4isDown(De 4?&"T)) * /, berarti ketika tombol panah kiri ditekan, maka kordinat , mobil dikurangi agar mobil bergerak kekiri. Begitu juga dengan gerakan ke kanan ketika tombol panah kanan ditekan. %atatan 1 "alam flash beberapa tombol telah didefinisikan, seperti tombol panah, Dscape, Dnter, pasi, hift dan tombol penting lainnya. Akan tetapi beberapa tombol seperti tombol karakter A..U, angka '..(, tombol fungsi F'...F') tidak didefinisikan secara otomatis. 6ntuk itu kita harus menggunakan perintah De 4get$ode() pada mo0ie e0ent ke Down. Agar proses lebih mudah, pada %" tutorial terdapat file ke board4exe yang dapat mendefinisikan kode tombol secara otomatis. %ontoh penggunaannya sebagai berikut1 misal kita akan menggunakan tombol 293, dengan program tersebut diketahui kode tombol 293 adalah #;, maka script yang dipakai adalah 1 i! (De 4isDown(#;))*444+4

Menggerakkan Movieclip dengan Mouse elain keyboard kita juga dapat menggerakan sebuah mo0ieclip dengan mouse. Merakan yang dikendalikan dengan mouse sering kita temui pada game bertipe shooting atau permainan menembak. !ada dasarnya terdapat dua cara menggerakkan mouse yaitu dengan menggunakan action startDrag() dan menggunakan teknik mouse tracking.

contoh gerakan yang dikendalikan dengan mouse

Menggerakkan Movieclip dengan Mouse Menggunakan startDrag( ! !ada beberapa game bertipe shooting, kita akan mendapati bentuk kursor mouse yang dirubah menjadi bentuk sasaran tembak. 6ntuk merubah bentuk mouse, perhatikan contoh berikut 1 '. Buatlah sebuah file baru berukuran .(( , 7(( pi,el dan ') fps. ). "engan menggunakan drawing tool, buatlah sebuah gambar kursor yang baru.

bentuk kursor *. eleksi gambar kursor tersebut, kemudian con0ert menjadi symbol movieclip dengan nama kursor. -. &lik kursor, buka panel action dan ketikan action berikut 1 on%lipD0ent +load/ : Mouse.hide+/< = on%lipD0ent +enterFrame/ :

start"rag+this, true/< = 5. ?alankan mo0ie, kemudian gerakkan mouse. !enjelasan program 1 '. Action Mouse4hide()/ berfungsi untuk menghilangkan gambar kursor default mouse pada layar. ). Action startDrag(this, true)/ berarti mo0ieclip yang dituju +this/ akan mengikuti gerakan mouse. elain itu, posisi registration mo0ieclip yang dikenai action start"rag, akan dijadikan sama dengan kordinat , dan y mouse akibat penambahan 0ariabel boolean true. %atatan 1 action startDrag()/ hanya bisa diberikan pada satu mo0ieclip saja, apabila ada dua atau lebih yang memiliki actin tersebut di dalamnya, maka action hanya akan berefek pada salah satu dari mo0ieclip tersebut. Menggerakkan Movieclip dengan Mouse secara *racking "engan startDrag gerakan mo0ieclip selalu sama dengan gerakan mouse. Akan teapi dalam beberapa game dengan tombol kendali mouse seperti feeding frenSy, alien sky, dan beberapa game lainnya, karakter game bergerak mendekati kursor mouse dengan kecepatan tertentu. Gal tersebut sering disitilahkan dengan nama mouse tracking. %ontoh pembuatan mouse tracking adalah sebagai berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, dan ') fps. ). "engan menggunakan drawing tool buatlah sebuah gambar burung tanpa sayap.

gambar burung tanpa sayap dengan drawing tool *. eleksi gambar tersebut dan con0ert menjadi symbol movieclip dengan nama burung. -. "ouble klik mo0ieclip burung, untuk mengeditnya.

5. "alam mode edit, tambahkan sebuah layer diatas layer ' dan ubah namanya menjadi la er sa ap. 7. &lik !rame2 la er sa ap, kemudian gambarlah bentuk sayap. 6ntuk memudahkan proses, klik lock la er 2.

lock layer dan gambar sayap >. &lik !rame # la er 2, kemudian masukkan !rame dengan menekan tombol ";. .. &lik !rame 5 la er 5, masukkan ke !rame dengan menekan tombol F7, kemudian ubah posisi sayap. 8. Iakukan langkah no . pada frame * sampai frame 7 sehingga terbentuk sebuah gerakan sayap secara !rame b !rame. '(. Buatlah layer baru di bawah layer ' dan ubah namanya menjadi la er sa ap5. ''. "engan cara yang sama, buatlah animasi frame by frame sayap keduanya. !erhatikan gambar berikut.

animasi burung secara frame by frame '). &eluar dari mode edit symbol, dengan menekan %trl@D< '*. &lik burung, kemudian buka panel action dan ketikan action berikut1 on%lipD0ent +load/ : Mouse.hide+/< skala F E,scale< perlambatan F )(< = on%lipD0ent +enterFrame/ : ;; mengubah skala burung if +Eroot.E,mouse4E,/ :

E,scale F -skala< = else : E,scale F skala< = ;; tracking E, F E,@+Eroot.E,mouse-E,/;perlambatan< Ey F Ey@+Eroot.Eymouse-Ey/;perlambatan< = '-. impan file dan jalankan mo0ie. Merakkan mouse untuk melihat gerakan burung.

!enjelasan program 1 '. ebelum memulai tracking, kursor mouse dibuat tidak tampak terlebih dahulu dengan action Mouse4hide(). elanjutnya 0ariabel skala akan digunakan untuk merubah bentuk mo0ieclip burung, dan 0ariabel perlambatan menentukan kecepatan bergerak burung, semakin tinggi nilai perlambatan, gerakan burung semakin lambat. ). Baris kondisi +i! (0root40xmouseC0x)* / digunakan untuk mendeteksi posisi kursor. ?ika kursor ada disebelah kiri burung, maka posisi burung dibalik dengan menggunakan action 0xscale 1 %skala. *. Tumus sederhana dari mouse traking adalah menghitung jarak antara mouse dengan mo0ieclip kemudian dibagi dengan perlambatan. + 0x 1 0x ' (0root40xmouse%0x) , perlambatan/ /

Mendeteksi *um$ukan Tumbukan atau tabrakan adalah sebuah kejadian dimana terdapat dua mo0ieclip yang saling bertumbukan. !erhatikan gambar berikut untuk mengetahui sebuah tumbukan 1

tumbukan !erhatikan gambar tumbukan yang ke tiga, menurut mata kita mo0ieclip lingkaran dengan mo0ieclip kotak . Akan tetapi dalam flash tumbukan dihitung dari sebuah bentuk kotak yang dibentuk oleh garis-garis yang ditarik dari titik terluar sebuah mi0ieclip. !erhatikan kembali gambar berikut 1

area yang dideteksi pada saat tumbukan Mendeteksi *um$ukan dengan hit*est( ! alah satu action untuk mendeteksi tumbukan dalam flash adalah dengan menggunakan hitTest(). %ontoh dari penggunaan action hitTest() adalah sebagai berikut 1 !ermasalahan1 Buatlah sebuah bola yang bergerak memantul secara terus menerus dalam sebuah area 6ntuk menyelesaikan masalah tersebut, kita 0isualisasikan terlebih dahulu menjadi 1

logika tumbukan sederhana !roses pembuatan aplikasi tersebut adalah 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, ') fps. ). Buatlah sebuah gambar lingkaran menggunakan o0al tool. eleksi lingkaran dan con0ert menjadi movieclip dengan nama bola. *. &lik bola, kemudian buka panel properties dan ketikan 2bola3 pada instance name. -. Buat sebuah gambar kotak menggunakan rectangle tool. eleksi kotak tersebut dan con0ert menjadi movieclip dengan nama kotak. 5. &lik kotak, lakukan cop dan paste sebanyak * kali dan atur posisinya sesuai dengan gambar berikut 1

penataan obyek pada stage. 7. &lik bola, kemudian bka panel action dan ketikan action berikut 1 on%lipD0ent +load/ : kecepatan, F '(<

kecepatany F '(< = on%lipD0ent +enterFrame/ : E, @F kecepatan,< Ey @F kecepatany< = >. &lik kotak pertama +sebelah atas/, kemudian ketikan action sebagai berikut 1 on%lipD0ent +enterFrame/ : if +hitTest+Eroot.bola// : Eroot.bola.kecepatany F -Eroot.bola.kecepatany< = = .. $op seluruh action pada mo0ieclip kotak tersebut, kemudian klik mo0iclip kotak ke * +sebelah bawah/, buka panel action dan paste-kan action yang sudah dicopy sebelumnya. 8. &lik kotak kedua +sebelah kanan/, kemudian ketikan action sebagai berikut 1 on%lipD0ent +enterFrame/ : if +hitTest+Eroot.bola// : Eroot.bola.kecepatan, F -Eroot.bola.kecepatan,< = = '(. $op seluruh action pada mo0ieclip kotak tersebut, kemudian klik mo0iclip kotak ke - +sebelah kiri/, buka panel action dan paste-kan action yang sudah dicopy sebelumnya. ''. impan dan jalankan mo0ie. !enjelasan program 1 '. !ada mo0ieclip bola diberikan instance name agar bisa diakses oleh mo0ieclip lain. ). elanjutnya bola digerakkan secara diagonal dengan penambahan kordinat , dan y, dengan 0ariabel kecepatanx dan kecepatan .

*. !ada kotak 2 sampai kotak < terdapat suatu kondisi i! (hitTest(0root4bola)) yang berarti jika kotak bertumbukan dengan bola maka... -. !ada kotak 2 dan kotak 6, jika kondisi tumbukan tercapai, 0ariabel kecepatan dibalik nilainya sehingga bola memantul ke atas atau ke bawah. 5. edangkan pada kotak 5 dan kotak <, jika kondisi tumbukan tercapai, 0ariabel kecepatanx dibalik nilainya sehingga bola memantul ke kanan atau ke kiri. Mengatasi Kesalahan hit*est dengan getBounds( ! &elemahan action hitTest adalah perhitungan area tumbukan yang dimulai dari titiktitik terluar, sehingga ketika obyek belum bertumbukan, ada peluang kondisi hitTest terpenuhi. 6ntuk mengatasi kelemahan tersebut, ada suatu action dalam flash yaitu getPounds()/ !ermasalahan1 Buatlah sebuah bola yang bergerak memantul secara terus menerus dalam sebuah area yang tampak pada gambar

!ermasalahan yang muncul adalah , bentuk area tersebut cukup rumit dan kurang beraturan, sehingga penggunaan action hitTest+/ saja tidak akan menghasilkan program yang baik. 6ntuk itu digunakan action getBound+/ sebagai berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, ') fps. ). Buat sebuah gambar area seperti pada gambar menggunakan drawing tool. eleksi kotak tersebut dan con0ert menjadi movieclip dengan nama ruangan.

gambar mo0ieclip ruangan *. &lik ruangan, kemudian buka panel properties dan ketikan 2ruangan3 pada instance name. -. Buatlah sebuah gambar lingkaran menggunakan o0al tool. eleksi lingkaran dan con0ert menjadi movieclip dengan nama bola. Ietakkan bola didalam ruangan, lihat gambar sebelumnya. 5. &lik bola, kemudian buka panel action dan ketikan action berikut 1 on%lipD0ent +load/ : kecepatan, F 5@random+'(/< kecepatany F 5@random+'(/< = on%lipD0ent +enterFrame/ : E, @F kecepatan,< Ey @F kecepatany< ;; mendeteksi tumbukan dengan getBounds if +Eroot.ruangan.hitTest+getBounds+Eroot/.,Ma,, Ey, true// : kecepatan, F -kecepatan,< = if +Eroot.ruangan.hitTest+getBounds+Eroot/.,Min, Ey, true// : kecepatan, F -kecepatan,< = if +Eroot.ruangan.hitTest+E,, getBounds+Eroot/.yMa,, true// : kecepatany F -kecepatany< = if +Eroot.ruangan.hitTest+E,, getBounds+Eroot/.yMin, true// : kecepatany F -kecepatany< =

7.

= impan file dan jalankan mo0ie.

!enjelasan program 1 !enggunaan getPounds dilakukan di dalam action hitTest(), dengan 0root4nama instansi ob ek ang akan ditumbuk didepan hitTest. Hariabel xMax, xMin, Max dan Min merupakan property yang dimiliki oleh obyek yang dihitung tumbukannya +bola/. Mengatasi Kesalahan hit*est dengan Sensor elain menggunakan getBound kita juga dapat menyiasati sebuah tumbukan dengan menambahkan sensor yang tidak terlihat. ebagai contoh, dalam game bertipe action, setiap anggota badan harus dibuat sedetail mungkin dalam hal tumbukannya dengan obyek lain. !erhatikan gambar berikut1

gerakan karakter dalam game Mocil !ada salah satu gerakan karakter dalam game Mocil pada saat menendang, maka area yang dihitung dalam hitTest hanya kaki dari monster tersebut, sedangkan bagian badan yang lain tidak dihitung. !erhatikan contoh penggunaan sensor berikut 1 !ermasalahan 1 Buatlah sebuah gerakan mobil yang dapat menghindari rintangan secara otomatis. Hisualisasi dari permasalahan tersebut adalah sebagai berikut 1

0isualisasi dari aplikasi sensor !enyelesaiannya adalah sebagai berikut 1 '. ebelumnya buka terlebih dahulu file latihan menggerakkan mo0ieclip dengan keyboard yang kita buat pada latihan sebelumnya +buka file program*)mcEgerakanEkeyboard.fla pada %" tutorial/. &emudian buka panel librar . ). Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, ') fps. *. Buatlah sebuah gambar kotak dengan menggunakan rectangle tool, kemudian con0ert menjadi movieclip dengan nama sensor. -. "rag mobil dari library file yang kita buka sebelumnya +pada point '/ dan letakkan disebelah kanan bawah stage. 5. "ouble klik mobil, untuk mengeditnya. 7. "alam mode edit, buatlah sebuah layer baru diatas la er 2 dan ubah namanya menjadi la er sensor. >. &lik !rame 2 la er sensor, drag mo0ieclip sensor dari library ke stage, kemudian atur posisinya. Ietakkan sensor di depan mobil.

posisi sensor terhadap gambar mobil .. &lik mo0ieclip sensor, kemudian buka panel properties. &etikan 2sensor3 pada instance name dan tambahkan efek alpha 3R pada color.

properties mo0ieclip sensor 8. &embali ke stage utama dengan menekan %trl@D. '(. &emudian buatlah sebuah gambar rintangan berupa gambar tong, kemudian seleksi gambar dan con0ert menjadi movieclip dengan nama tong. ''. $op tong dan paste-kan sebanyak ) kali kemudian atur posisi masing masing sesuai pada gambar. '). Tambahkan instance name pada masing-masing mo0ieclip tong, yaitu -rintangan02., -rintangan05. dan -rintangan06.. instance name dan posisi obyek pada stage

'*. &lik mo0ieclip mobil, buka panel action dan ketikan script berikut 1 on%lipD0ent +load/ : skala F E,scale< kecepatan F '(< = on%lipD0ent +enterFrame/ : ;;gerakan prespektif ke atas if +Ey45(/ : Ey -F kecepatan< kecepatan -F (.'< E,scale F skala<

Eyscale F skala< skala -F (.'< = ;; menghindari rintangan if +sensor.hitTest+Eroot.rintanganE'/ or sensor.hitTest+Eroot.rintanganE)/ or sensor.hitTest+Eroot.rintanganE*// : E, -F '(< = = '-. impan dan jalankan mo0ie. !enjelasan program 1 '. ). ebelumnya mo0ieclip sensor diletakkan didalam mo0ieclip mobil dan diberikan efek alpha 1 3R agar tidak terlihat saat mo0ie dimainkan. elanjutnya dilakukan pengesetan 0ariabel yang akan digunakan yaitu 0ariabel skala dan 0ariabel kecepatan. *. 6ntuk menggerakan mobil secara prespektif, maka setiap gerakan ke atas diikuti dengan pengurangan 0ariabel skala dan 0ariabel kecepatan sebanyak +3,2/ bilangan tersebut dapat dirubah sesuai dengan ukuran mo0ie. -. !ada baris kondisi i! selanjutnya, kordinat x mo0ieclip mobil dikurangi ketika sensor dari mobil bertumbukan dengan rintangan.

"oad Movie alah satu kelemahan dari flash adalah mo0ie yang berjalan lebih lambat ketika ukuran file besar dan action yang dijalankan lebih banyak. Berapakah batasan maksimal suatu ukuran mo0ie flash agar berjalan normalQ ?awaban dari pertanyaan tersebut sangat tergantung dengan spesifikasi komputer yang akan menjalankan mo0ie tersebut. Akan tetapi jika kita mengkhususkan diri pada flash game yang dipublis pada suatu situs internet, maka ukuran maksimal mo0ie tergantung pada kecepatan modem. Meskipun tidak ada kepastian akan ukuran maksimal suatu flash mo0ie, membuat ukuran mo0ie flash menjadi semakin kecil akan mengotimalkan kerja file. 6ntuk memperkecil ukuran file, salah satu cara yang dipakai adalah memecah mo0ie menjadi file-file kecil-yang pada akhirnya file tersebut dikumpulkan menjadi satu kesatuan. !erhatikan contoh berikut 1 Mame "ig"og memiliki 7( le0el. !ada saat pemain memasuki le0el ', berarti le0el ) sampai le0el 7( tidak dipakai. Apabila seluruh le0el dijadikan dalam satu file, akan menyebabkan suatu kerugian-yaitu file le0el ) R le0el 7( yang sudah terload tidak dipakai. Gal itulah yang menyebabkan game berjalan lebih lambat. olusi yang terbaik adalah memecah file game menjadi ' le0el per ' le0el. 6ntuk memanggil pecahan file, flash menyediakan action loadMo0ie#um+/ dan loadMo0ie+/. loadMovie/um( Action ini memiliki bentuk sebagai berikut 1 loadMovie@um(-nama !ile ang akan dipanggil., level kedalaman)/ penulisan nama file harus dibuat secara mendetail dengan ekstensi filenya. contoh 2level24sw!3. Ie0el kedalaman merupakan le0el tempat mo0ie di load. !erhatikan sistem le0el pada bab mo0ieclip. Gal yang perlu diperhatikan adalah penggunaan le0el ( dan le0el selain (. !erhatikan contoh berikut 1

'. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, ') fps. ). "engan menggunakan drawing tool, buatlah tampilan pada stage seperti tampak pada gambar berikut 1

tampilan pada stage *. Buatlah sebuah tombol 2load !ile53, dan letakkan di pojok kanan bawah stage. -. &lik tombol 2load !ile53, kemudian buka panel action dan ketikan action berikut 1 on +release/ : loadMo0ie#um+Pfile).swfP, (/< 5. = impan file dengan nama 2!ile24!la3, dan jalankan mo0ie.

7. Tutup mo0ie dengan menekan tombol %trl@A. >. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, ') fps. .. "engan menggunakan drawing tool, buatlah tampilan pada stage seperti tampak pada gambar berikut 1

tampilan 2file )3 pada stage 8. impan file dengan nama 2!ile54!la3, dan jalankan mo0ie. '(. Tutup mo0ie dengan menekan tombol %trl@A. ''. Buka kembali file 2!ile24!la3, kemudian jalankan mo0ie. Tekan tombol 2load !ile53, maka tampilan pada mo0ie akan berganti dengan tampilan file ).

&etika nilai level kedalaman adalah 3, maka eksekusi perintah loadMovie@um(nama!ile, 3)/ menyebabkan pergantian tampilan file secara total. !ada contoh diatas, ketikan tombol load !ile5 ditekan, maka tampilan mo0ie pada !ile 2 segera berganti dengan tampilan mo0ie !ile 5. 6ntuk memahami penggunaan le0el kedalaman selain (, perhatikan contoh berikut1 '. Buka file 2!ile24!la2 pada latihan diatas +buka file 2program6M% loadMovie@um0!ile24!la3 pada %" tutorial/< ). &lik tombol 2load !ile53, buka panel action dan ubah action script nya menjadi 1 on +release/ : loadMo0ie#um+Pfile).swfP, '/< *. = impan file dan jalankan mo0ie. Tekan tombol 2load !ile53. maka akan mucul tampilan sebagai berikut 1

penggunaan le0el ' pada loadMo0ie#um+/. !enggunaan le0el ' akan menyebabkan mo0ie tidak berganti dengan yang baru, tetapi mo0ie yang diload menindih +berada diatas/ file yang memanggil. !erhatikan bahwa tombol 2load !ile53 masih aktif, begitu juga ketika kita meletakkan tombol pada file yang diload +file )/, tombol tersebut juga aktif. %atatan 1 File yang di-load harus berada dalam satu folder yang sama atau jika diluar folder harus diberikan sebuah nama folder yang jelas +contoh1 loadMovie@um(-444SgambarSmusuh24sw!., 2)/ !enggunaan le0el kedalaman bernilai negatif +-', -), .. /, akan mengganti tampilan file dengan tampilan file yang diload, tetapi akan ditampilkan dalam sebuah internet

browser. unloadMovie/um( 6ntuk menutup ; menghilangkan ; meng-unload file yang telah kita load dengan menggunakan action loadMo0ie#um+/ sebelumnya, flash menyediakan action 1 unIoadMo0ie#um+le0el kedalaman mo0ie yang akan di-unload/. !erhatikan contoh penggunaannya berikut ini 1 '. Buka 2file).fla3 pada latihan sebelumnya +buka file 2program*8loadMo0ie#umEfile).fla3 pada %" tutorial/. ). *. eleksi lingkaran besar atau obyek apapun yang ada pada stage, kemudian con0ert menjadi button dengan nama 2unload !ile53. eleksi tombol 2unload file)3, buka panel action dan ketikan action berikut 1 on +release/ : unloadMo0ie#um+'/< -. = impan dan jalankan file.

5. Tutup mo0ie dengan menekan tombol %trl@A. 7. Buka kembali file 2!ile24!la3, kemudian jalankan mo0ie. Tekan tombol 2load !ile53, setelah tampilan !ile 5 menumpuk diatas tampilan !ile 2, klik tombol 2unload !ile53, maka tampilan !ile 5 akan hilang +ter-unload/. loadMovie( Action loadMovie@um() memiliki kelemahan yaitu kordinat tempat me-load selalu (3, 3). ?ika kita menginginkan file diload pada kordinat tertentu, kita harus menggunakan cara lain, yaitu menggunakan action loadMovie()/ 6ntuk lebih jelasnya perhatikan gambar berikut 1

penggunaan loadMo0ie#um dan loadMo0ie

Berbeda dengan loadMo0ie#um+/, pada penggunaan loadMovie() kita membutuhkan sebuah movieclip sebagai tempat di-loadnya suatu mo0ie. 6ntuk jelasnya perhatikan permaslahan berikut 1 !ermasalahan 1 Buatlah sebuah game arcade sederhana dimana pada setiap le0el terdapat musuh yang berbeda-beda. !erhatikan contoh dibawah ini untuk membuat gerakan musuh pada masalah tersebut1 '. Gal yang difokuskan pada masalah tersebut adalah 2adanya musuh yang berbedabeda setiap le0el3. 6ntuk mengoptimalisasikan kerja, kita dapat menggunakan teknik loadMovie()/ dengan membuat mo0ie musuh terpisah-pisah. ). Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, dan ') fps. *. Buatlah sebuah gambar pesawat musuh yang pertama, seperti pada gambar atau sesuai dengan kreati0itas anda.

musuh le0el pertama -. eleksi gambar pesawat, kemudian con0ert menjadi movieclip dengan nama 2musuh23. &emudian atur posisinya terhadap stage. Ietakkan pada pojok kiri atas stage, sampai titik registrationnya berada pada kordinat (3, 3)4

peletakan mo0ieclip terhadap stage 5. &lik 2musuh23, buka panel properties dan ketikan 2musuh3 pada instance name.

7.

impan file dengan nama 2musuh24!la3, kemudian jalankan mo0ie.

>. &embali ke stage utama dengan menekan %trl@A. .. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, dan ') fps. 8. Buatlah sebuah gambar musuh yang kedua, seperti pada gambar atau sesuai dengan kreati0itas anda.

musuh le0el kedua '(. eleksi gambar musuh kemudian con0ert menjadi movieclip dengan nama 2musuh53. Ietakkan pada pojok kiri atas stage, sampai titik registrationnya berada pada kordinat (3, 3)4 ''. &lik 2musuh53, buka panel properties dan ketikan 2musuh3 pada instance name. '). impan file dengan nama 2musuh54!la3, kemudian jalankan mo0ie. '*. &embali ke stage utama dengan menekan %trl@A. '-. etelah mo0ie musuh dibuat langkah selanjutnya adalah membuat file utamanya. '5. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, dan ') fps. '7. Buatlah sebuah layer baru, dan ubah masing-masing nama layer menjadi layer 2ob ek3 dan layer 2action3. pengaturan layer

'>. elanjutnya buatlah sebuah movieclip kosong dengan cara menekan menu insertCnew s mbol. !ilih mo0ieclip pada behaviour dan ketikan loader pada nama, kemudian tekan OD.

membuat symbol baru '.. elanjutnya pada mode edit symbol mo0ieclip loader, jangan tambahkan apa-apa dan langsung kembali ke stage utama dengan menekan tombol %trl@D. '8. &lik !rame 2 la er ob ek, kemudian drag mo0ieclip loader dari library ke stage +buka panel library terlebih dahulu jika belum terbuka/. Ietakkan di sebelah kiri luar stage. &emudian buka panel properties dan ketikan 2loader3 pada instance name. )(. &lik loader kemudian buka panel action dan ketikan script sebagai berikut 1 %atatan 1 Action berikut ini adalah action untuk membuat gerakan acak, sama dengan action pada latihan menggerakan mo0ieclip secara acak pada latihan sebelumnya. Anda dapat melakukan copy dan paste script. on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F '(< naik F (< = on%lipD0ent +enterFrame/ : E, @F kecepatan< if +random+'(/ FF */ : ;;gerakan acak naik naik F '< = else if +random+'(/ FF -/ : ;;gerakan acak turun naik F )< = else if +random+'(/ FF 5/ : ;; gerakan lurus

naik F (< = ;;menggerakkan naik. if +naik FF ' and Ey45(/ : Ey -F 5< = else : ;;menggerakkan turun. = if +naik FF ) and EyN55(/ : Ey @F 5< = ;;keluar dari stage, maka kembalikan lagi ke posisi awal if +E,4.((/ : E, F ,awal< Ey F '((@random+-((/< = = )'. elanjutnya klik !rame 2 la er action, buka panel action dan tambahkan script 1 le0el F )< ;; mengubah jenis musuh berdasarkan le0el game Eroot.loader.loadMo0ie+PmusuhP@le0el.to tring+/@P.swfP/< )). ?alankan mo0ie, kemudian pada !rame 2 la er action, ubahlah nilai 0ariabel level pada action level 1 2/ menjadi level 1 5/ dan lihat hasilnya. !enjelasan program 1 '. 6ntuk menggerakan secara acak, penjelasan yang sama terdapat pada latihan menggerakan mo0ieclip secara acak pada bab sebelumnya. ). !ada frame dilakukan pengesetan 0ariabel le0el dengan nilai awal level 1 2<. *. !ada baris Eroot.loader.loadMo0ie+PmusuhP@Eroot.le0el.to tring+/@P.swfP/< dilakukan peng-load-an mo0ie 2musuh3 sesuai dengan nilai 0ariabel le0el. action le0el.to tring+/ akan mengcon0ert 0ariabel le0el yang bertipe number menjadi 0ariabel baru bertipe string. Bentuk 0root4loader4loadMovie(AmusuhA'0root4level4toString()'A4sw!A)/ juga dapat ditulis dengan 1

loadMovie(AmusuhA'0root4level4toString()'A4sw!A, 0root4loader)/. -. !enambahan instance name pada masing masing mo0ie +2musuh'3 dan 2musuh)3/ dimaskudkan untuk proses selanjutnya, seperti perhitungan tumbukan, kordinat dan sebagainya.

Memulai Pem$uatan 9ame etelah kita belajar dan memahami tentang action script dasar yang dipakai dalam flash, selanjutnya kita dapat memulai proses pembuatan game. Ide 9ame $de game adalah sebuah gagasan mengenai game yang akan dibuat. $de game tersebut meliputi jenis atau tipe game, karakter yang digunakan, cerita ; storyboard dari game, dan segala detail yang ada pada bayangan kita sebelum membuat game. Manusia memiliki ) sistem memory yaitu memori jangka panjang dan memori jangka pendek. $de game yang terlintas begitu saja dalam pikiran kita akan diingat dalam memori jangka pendek, sehingga ide tersebut sangat mudah kita lupakan. 6ntuk itu disarankan agar kita menuliskan atau mem0isualisasikan suatu ide sejak pertama kali ide tersebut terlintas pada pikiran kita. :enis 9ame aat ini sangat banyak kita temukan game, baik itu game !%, game console +seperti ! , 9BC9, ! !, #intendo " /, game G! +mobile game/ dan game flash. "ari banyaknya game yang ada, berdasarkan gameplaynya +cara memainkannya/, game dapat diklasifikasikan menjadi beberapa jenis. "alam buku ini klasifikasi game flash adalah sebagai berikut 1 '. Board game Board game atau dapat kita istilahkan sebagai 2permainan papan3. !ada jenis game ini, pemain diberikan sebuah tampilan yang berisi tentang masalah untuk diselesaikan. %ontoh dari game ini antara lain1 !ipe dream, Gangaroo, Totation, %atur, permainan kartu dan sebagainya

game 2rotation3 bertipe board game ). Arcade Mame bertipe arcade merupakan game yang menguci kecepatan tangan dari pemainnya. !ada permainan bertipe arcade, semakin tinggi le0el permainan, permainan akan berjalan semain cepat. %ontoh dari game bertipe arcade adalah 1 Suma, feeding frenSy, !acman, Arcanoid, !ong, Baba ball dan sebagainya.

game 2ballistic biscuit3 merupakan game bertipe arcade *. Action Berbeda dengan game bertipe aarcade, game bertipe action menjadikan pemain mengendalikan karakter utama dalam game tersebut untuk melakukan beberapa kegiatan +action/ seperti melompat, menembak dan sebagainya. %ontoh dari game bertipe action antara lain 1 super mario, mocil, petualangan paddle pop, alloy tease e,ile dan sebagainya.

game 2mocil3, salah satu game bertipe action -. hooting Mame bertipe shooting sebagian besar menggunakan mouse sebagai alat pengendalinya. !ada game ini pemain seolah-olah berperan sebagai penembak +first person/ atau pemain mengendalikan seorang penembak +third person/.

%ontoh game bertipe shooting antara lain 1 "uck hunt, %ounter trike, Cnimusha dan sebagainya.

game 2terorist3 merupakan salah satu game bertipe shooting 5. Fighting Mame bertipe fighting pada dasarnya sama dengan game bertipe action, hanya saja game bertipe fighting pemain mengendalikan sebuah karakter untuk berkelahi dengan karakter lain sampai salah satu karakter kalah. %ontoh dari game bertipe fighting antara lain 1 street fighter, tekken, duel, pencak silat dan sebagainya.

game 2super fighter3 salah satu game bertipe fighting 7. Tacing Mame betipe racing pada dasarnya adalah sebuah permainan menggerakkan kamera. !emain diberikan sebuah kendaraan atau sejenisnya untuk menempuh rute tertentu. %ontoh dari game bertipe racing antara lain 1 #F , Auto bahn, MotoM!, Formula ' dan sebagainya.

game 2auto bahn3 salah satu game bertipe racing >. imulation Mame bertipe simulasi adalah sebuah game yang mensimulasikan suatu kegiatan yang sesungguhnya. %ontoh dari game bertipe simulasi antara lain 1 tycoon, simulator pesawat, burger empire dan sebagainya.

game 2burger empire )3 salah satu game bertipe simulation .. Teal Time trategi Mame bertipe TT memposisikan pemain sebagai seorang pemimpin yang mengatur sesuatu +bisa berupa pasukan, koloni, kerajaan dan sebagainya/. %ontoh dari game bertipe TT antara lain1 war commander, empire earth, romance of the three kingdom dan sebagainya.

game 2war commander3 salah satu game bertipe TT 8. Tole !laying Mame !ada game bertipe T!M pemain memerankan sebuah karakter dalam game. Berbeda dengan game bertipe action, pada game T!M hal yang diutamakan adalah cerita dalam game. elain itu didalam game bertipe T!M biasanya terdapat sub game dengan tipe lain +seperti bertipe fighting, action atau TT /. %ontoh game bertipe T!M antara lain 1 BCBC games, Uelda, Megaman, Final Fantasy dan sebagainya.

game 2 marty3 salah satu game bertipe T!M '(. MMC MMC +Masi0e Multiplayer Cnline/, merupakan game yang dapat dimainkan secara bersama-sama pada internet browser. Gal yang diutamakan dalam sebuah game bertipe MMC adalah kebersamaan dengan pemain lain. %ontoh game bertipe MMC antara lain 1 ragnarok, pangya, gun bound, seal dan sebagainya. Mame flash bertipe MMC masih sangat sedikit-hal tersebut dikarenakan untuk membuat game flash MMC diperlukan software lain +ser0er side software/ seperti !G!, %M$, Fire Fo,, dan sebagainya. %ontoh dari game flash bertipe MMC antara lain 1 "ofus dan battle-on.

game 2"ofus3 salah satu game bertipe MMC-T!M Menulis Stor#$oard game etelah mendapatkan sebuah ide yang gemilang, akan lebih baik kita segera menuliskannya menjadi sebuah story board. %ontoh dari sebuah story board game adalah sebagai berikut 1 ?udul game "ig "og ?enis game Arcade istem kendali &eyboard - tombol panah dan tombol A dan U untuk menembak &arakter utama Te, si Anjing Musuh Mittymouse si tikus, corpy si &alajengking dan Tat si tikus penggali. istem permainan !emain diharuskan menembak musuh dan menggali tanah untuk mengambil tulang. etelah musuh habis dan tulang diambil semua, permainan dilanjutkan dengan le0el baru dengan musuh yang lebih banyak dan lebih pintar. esekali bonus berupa energy, nyawa, bonus poin muncul. Memvisualiasasikan Ide etelah menuliskan storyboard dari game, langkah selanjutnya adalah mem0isualisasikan ide tersebut. Hisualisasi dapat kita lakukan pada selembar kertas, maupunn dengan media komputer +tergantung media mana yang lebih dikuasai/. %ontoh dari 0isualisasi storyboad diatas adalah sebagai berikut1

0isualisasi dari sebuah storyboard Menggam$ar Karakter etelah ditentukan karakter yang akan dipakai, selanjutnya karakter tersebut dibuat dengan menggunakan drawing tool atau menggambar terlebih dahulu secara manual

pada kertas, kemudian dilakukan proses pewarnaan pada komputer. !roses detail mengenai pembuatan karakter terdapat pada bab selanjutnya. !erhatikan contoh berikut 1

sebuah karakter dalam game Menggam$ar Background elain karakter dalam sebuah game terdapat background. Teknik penggambaran Background dapat juga di lakukan secara manual maupun dengan menggunakan drawingtool.

contoh background dalam game Programming etelah semua gambar siap, bagian yang boleh dikatakan sebagai bagian terumit adalah bagian programing. 6ntuk mempermudah proses programming sebuah game dalam flash, dapat dilakukan pembagian proses menjadi beberapa bagian yang berurutan sebagai berikut 1 '. Menyusun layer dengan sistematika nama yang teratur usunan layer yang teratur sangat menunjang kelancaran pembuatan game. !erhatikan susunan layer standart berikut 1

susunan layer standart ). Menata obyek pada stage. etelah layer disusun, selanjutnya obyek diatur pada stage. ebagai catatan, penataan obyek pada stage dapat dilakukan dengan action attachMo0ie+/, sehingga proses penataan obyek pada stage bisa dilompati jika kita menggunakan action tersebut.

menata obyek pada stage *. Menambahkan instance name ; linkage. ?ika kita menambahkan obyek pada stage secara manual, langkah selanjutnya adalah menambahkan instance name. ?ika kita menambahkan obyek dengan action, langkah selanjutnya adalah menambahkan linkage.

penambahan instance name atau linkage -. Menuliskan action utama.

Bang dimaksud dengan action utama disini adalah action-action penting yang menyusun suatu game seperti menambahkan karakter +jika menggunakan linkage/, menggerakkan karakter utama, menggerakkan musuh, dan menghitung tumbukan. etelah action utama ditambahkan baik pada frame maupun pada mo0ieclip, maka game sudah dapat dijalankan meskiput belum ada detail seperti pengaturan score, penambahan co0er dan sebagainya. 5. Menambahkan ound. ound merupakan elemen yang harus diperhatikan dalam game. %ara membangkitkan sound dapat dilakukan secara manual +drag dari library ke stage/ atau menggunakan action. Iihat secara mendetail pada bab ound. 7. Menguji Mame Iangkah selanjutnya adaah menguji game. Menguji mo0ie setiap menambahkan action sangat bermanfaat untuk mengetahui suatu kesalahan sejak awal. >. Menambahkan Action pendukung. Bang termasuk dalam action pendukung antara lain 1 penambahan score, sistem bonus, sistem le0el, menambah A$ +kecerdasan buatan musuh/ dan sebagainya. .. Membuat detail game. ebagai nilai tambah dalam game adalah kedetailan game. &edetailan game dapat dicapai dengan membuat obyek-obyek tambahan yang tidak mengganggu kecepatan game. 8. Menguji game dan mencari bug Tahapan selanjutnya adalah mencari segala kemungkinan kesalahan dalam game. 6ntuk mencari bug, cara yang paling mudah adalah menguji game berkali-kali den membiarkan orang lain untuk menguji prototype game yang kita buat. '(. !roses publishing game. etelah segala kesalahan diperbaiki, tahapan selanjutnya adalah mempublis game. Iihat secara mendetail proses publising game pada bab publishing. FAV 1 Apakah kita boleh memiliki sebuah ide game yang hebatQ $de yang hebat biasanya menghasilkan sebuah karya yang hebat pula. Akan tetapi ketika kita baru belajar mengenai proses pembuatan game, simpan terlebih dahulu ide hebat tersebut menjadi sebuah story board, dan kerjakan game-game bertipe sederhana terlebih dahulu.

ebuah game yang kompleks akan memakan waktu yang banyak pada saat membuat tampilan game +grafis/, programming dan testing. ebagai contoh game 2"ofus3 dikembangkan oleh satu tim yang berisi lebih dari )( programmer dan '( game artis selama 7 bulan dan ditambah * bulan testing. Tentunya dengan waktu yang selama itu kita dapat menghasilkan banyak game sederhana sambil memperdalam ilmu pembuatan game. 6ntuk mem0isualisasikan sebuah ide yang hebat kita membutuhkan banyak hal, yaitu1 '. waktu yang banyak ). tim yang solid, tim meliputi programmer, game artis dan game tester. ebuah game yang hebat sulit dikerjakan oleh satu orang saja. ebagai contoh game Bobo karya penulis membutuhkan waktu * bulan untuk menyelesaikan prototipenya, dan tambahan ' bulan untuk menyusun ceritanya. *. modal yang besar. "engan banyaknya waktu yang dipakai dan jumlah tim, secara otomatis modal yang diperlukan dalam membuat game kompeks menjadi besar pula. 6ntuk sebuah game flash kompleks, de0eloper luar negeri mengeluarkan anggaran sekitar W7(( sampai W)(.((( +nilai tersebut masih dinilai sangat kecil bila dibandingkan dengan pembuatan game komples dengan bahasa pemrograman lain semacam MTA, #F dan game besar lainnya yang menghabiskan dana diatas 5((.((( 6 W/. -. tim pemasaran yang kuat. ?ika kita mendalami bidang game, tentunya dibutuhkan sebuah tim yang memasarkan game-game yang sudah dibuat. elain untuk mendapatkan keuntungan, tentusaja pemasaran juga digunakan untuk mengembalikan modal yang kita pakai dalam membuat game tesebut. "iluar itu semua, jika anda memiliki ide yang benar-benar baru dan hebat, segera wujudkan ide tersebut dalam sebuah storyboard plus 0isualisasinya. Anda dapat menjual ide tersebut kepada de0eloper asing atau meminta sponsor untuk mewujudkan ide anda tersebut. Mem$uat Karakter

alah satu elemen terpenting dalam game adalah game grafis, dan salah satu didalam game grafis tersebut adalah karakter +tokoh utama/ game. &arakter dalam game memiliki pengaruh yang sangat kuat terhadap game, dimana dengan karakter tersebut sebuah game dapat menjadi terkenal atau tidak. %ontoh karakter yang menjadikan suatu game terkenal antara lain 1 uper Mario pada semua seri game uper Mario, onic, Tay-man, dan beberapa karakter pada game T!M terkenal seperti Final Fantasy, hining Force, dan sebagainya. 6ntuk membuat karakter yang menarik kita perlu mengetahui seni menggambar, baik itu menggambar secara manual maupun menggambar secara digital-pada dasarnya kedua cara tersebut sama hanya saja media yang digunakan berbeda- dan pengetahuan terhadap suatu gaya desain. !embagian karakter berdasarkan gaya desain menurut penulis dalam buku ini adalah1 '. Maya Tealis "etail Maya ini biasanya ditangani oleh orang profesional yang telah mahir mengolah gambar. elain itu untuk menangani gaya realis yang detail, Flash mengalami kesulitan- karena flash tidak dapat memberikan efek shading +bayangan/ dan lighting +pencahayaan/- meskipun dalam Flash . terdapat efek blur dan shadow, tetapi efek tersebut tidak optimal untuk membuat gaya realis dan detail, sehingga dibutuhkansoftware lain semacam Adobe !hotoshop, Firework atau sejenisnya.

Mame treet fighter 0ersi Flash salah satu game bergaya Tealis "etail ). Maya Tealis ederhana

Maya ini merupakan penyederhanaan dari gaya realis sederhana. 6ntuk membuatnya dapat dilakukan proses tracing atau menjiplak sebuah gambar realis dan mengurangi detailnya. "alam game flash gaya ini lebih banyak dipakai, karena selain lebih mudah membuatnya, karakter yang tidak terlalu detail membuat mo0ie berjalan normal.

karakter bergaya Tealis ederhana *. Maya &artun Maya ini merupakan penyederhanaan dan perubahan bentuk dari gaya realis sederhana. Maya kartun tetap mempertahankan suatu bentuk standard, sebagai contoh manusia memiliki kepala, badan, tangan dan kaki. Bentuk tersebut tetap dipertahankan namun dengan proporsi dan penggayaan yang berbeda.

karakter bergaya kartun -. Maya $majinasi Maya ini bersifat bebas, tidak terikat dengan bentuk realis dan merupakan hasil dari imajinasi pencipta game. Beberapa game flash menggunakan karakter bergaya imajinasi, karena selain lebih mudah membuatnya, karakter bergaya imajinasi juga dapat mempermudah dalam membentuk sebuah image +trademark/ kepada public.

karakter bergaya imajinasi Mem$uat Karakter dengan Menggunakan Dra2ing *ool Membuat karakter dapat dilakukansecara langsung dalam flash dengan menggunakan "rawing tool. Menggambar dengan menggunakan drawing tool memiliki kelemahan yaitu untuk menghasilkan suatu gambar yang detail, kita membutuhkan waktu yang lama dan tingkat ketelitian yang tinggi. !erhatikan contoh menggambar sebuah karakter mobil berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. ). &lik rectangle tool, atur stoke color1 hitam, !ill color 1 tanpa warna +no color/ dan ukuran garis ' poin.

mengeset rectangle tool *. elanjutnya buatlah gambar kotak pada stage. mengubah bentuk dengan cepat 1 "ekatkan kursor mouse ke garis, maka kursor mouse akan berubah bentuk menjadi bentuk lengkung. &lik dan drag untuk membuat garis menjadi melengkung. "ekatkan kursor ke sudut, maka kursor akan menjadi bentuk sudut. &lik dan drag untuk mengubah posisi sudut. "ekatkan kursor ke garis dan tahan tombol %trl, kursor berbentuk lengkung. &lik dan drag untuk menambah sudut. -. Bentuk kotak tersebut menjadi bentuk dasar sebuah mobil. !erhatikan teknik

bentuk kursor mouse pada saat arrow tool aktif

5.

elanjutnya edit kembali dan tambahkan beberapa garis dengan menggunakan line tool menjadi bentuk seperti yang tampak pada gambar. bentuk kotak setelah diedit

7.

eleksi garis yang berada ditepi luar mobil, kemudian tambah ketebalan garis menjadi 5 poin +atur sesuai dengan keinginan anda/. !enambahan ketebalan garis luar akan menambah kuat karakter gambar.

gambar mobil setelah ditambah ketebalan garis luar >. eleksi seluruh garis kemudian con0ert menjadi fill dengan memilih menu modi! CshapeCconvert line to !ill. !eng-con0ert-an garis menjadi fill dimaksudkan untuk menjaga ukuran ketebalan garis agar mengikuti pembesaran atau pengecilan dengan menggunakan tranform tool. !erhatikan1 mencon0ert garis menjadi fill terkadang tidak berjalan sempurna +ada garis yang hilang/. Apabila hal tersebut terjadi, tekan tombol undo, kemudian ubahlah ukuran ketebalan garis. #aikkan atau turunkan +contoh 1 bila garis dengan ketebalan ' pi,el hilang saat dicon0ert menjadi fill ubahlah ukurannya menjadi '.' R ) pi,el/ .. Buatlah garis%garis bantu dengan warna lain, yang nantinya digunakan untuk memberikan efek gelap terang pada gambar.

8.

elanjutnya berikan warna pada gambar tersebut. !erhatikan penggunaan warna gelap dan warna terang. !enambahan gelap dan terang tersebut dapat menambah elemen estetik dalam sebuah gambar.

penambahan garis bantu dan pewarnaan gambar

warna pada panel color mi,er '(. Gapus garis bantu, selanjutnya seleksi seluruh gambar dan con0ert menjadi movieclip dengan nama mobil.

bentuk mobil seteah garis bantu dihapus ''. Tahapan selanjutnya adalah menambahkan roda. Iihat proses pembuatan roda pada bab sebelumnya +bab menggerakan mo0ieclip/. '). Ianjutkan pembuatan mobil. "ouble klik mobil untuk mengeditnya. '*. Tambahkan sebuah layer di atas layer ' dan ubah namanya menjadi la er bumper. '-. &lik !rame 2 la er bumper, kemudian dengan menggunakan oval tool dan line tool buatlah gambar tempat roda mobil, seperti yang tampak pada gambar. '5. Buatlah garis bantu untuk proses pewarnaan dan warnailah dengan menambahkan warna gelap dan terang.

menggambar dan mewarnai bumper '7. Tambahkan sebuah layer baru diatas layer ' dan dibawah layer bumper. &emudian drag mo0ieclip roda dari library ke stage sebanyak dua kali.

posisi layer roda dan peletakan roda '>. &eluar dari mode edit dan mo0ieclip mobil siap dipakai. Mengolah 9am$ar Manual dengan Flash Alternatif lain dalam membuat karakter-selain menggunakan drawing tool adalah dengan menggambar secara manual pada selembar kertas. Bagi beberapa orang menggambar di kertas jauh lebih cepat dari pada menggambar menggunakan drawing tool. Meskipun demikian, pengolahan gambar selanjutnya +proses pewarnaan/ selalu melibatkan software grafis seperti photoshop dan software sejenis lainnya. "alam flash kita juga dapat mengolah sebuah gambar manual yang telah kita buat sebelumnya. !erhatikan proses pengolahan gambar berikut1 '. Buatlah sebuah gambar karakter pada kertas dengan pensil, kemudian lakukan poses penintaan, dan hapus bekas pensil yang masih tampak. Mambar berikut adalah gambar desain karakter pada game 2Mini Soccer3.

contoh karakter yang digambar secara manual ). can gambar tersebut menjadi sebuah file betipe Epeg atau bmp. ') fps. -. $mport gambar yang sudah discan sebelumnya dengan memilih menu !ileCimport444 . Apabila anda belum membuat gambar karakter, import file gambar 2karakter desain4Epg3 pada folder gambar pada %" tutorial. *. Buka program flash, kemudian buat sebuah file dengan ukuran .(( , 7(( p, dan

panel import file 5. etelah gambar tampak pada stage, klik gambar dan pilih menu modi! C trace bitmap +pada Flash M9/ atau modi! CbitmapCtrace bitmap +pada Flash )((dan Flash ./. 7. Masukan bilangan 533 pada $olor Threshold +semakin kecil bilangan yang dimasukan, gambar akan di trace semakin detail/. Masukan ; pada Minimum 9rea dan pilih option normal pada $urve "it dan $orner Threshold.

Trace bitmap >. &lik OD, maka gambar akan terpisah berdasarkan warnanya. .. eleksi gambar yang diinginkan lalu tekan $trl ' T +cut/, kemudian hapus semua yang ada pada stage +biasanya berwarna putih atauabu-abu/, kemudian tekan $trl ' U +paste/, maka hanya gambar yang diinginkan saja yang muncul. eleksi gambar dan ubah warnanya menjadi hitam. hasildari trace bitmap

8. !erhatikan bahwa terdapat banyak kekurangan yang harus diperbaiki pada hasil trace tersebut. !erbaikilah dengan menggunakan arrow tool. memperbaiki kesalahan hasil tracing '(. etelah seluruh proses perbaikan selesai buatlah garis bantu dengan warna lain, yang nantinya digunakan untuk memberikan efek gelap terang pada gambar.

''.

elanjutnya berikan warna pada gambar tersebut. !erhatikan penggunaan warna gelap dan warna terang. teknik pewarnaan karakter

'). Gapus seluruh garis bantu, seleksi gambar kemudian con0ert menjadi mo0ieclip dengan nama 2karakter 23. '*. impan file dan mo0ieclip siap dipakai. Mengimpor File Siap Pakai elain menggunakan drawing tool dan teknik tracing, kita juga dapat mengolah gambar dengan software lain seperti Adobe !hotoshop, $mage Teady, Fire work dan sebagainya. Format file yang paling sesuai untuk file gambar siap pakai adalah file bertipe P@Q +baca1 ping/. File bertipe !#M memiliki keunggulan berupa transparency yang tidak dimiliki oleh file lain. +file bertipe M$F juga memiliki tranparansi, tetapi file M$F memiliki kualitas yang kurang bagus, sehingga jarang dipakai/. 6ntuk membuat file bertipe !#M pada program Adobe !hotoshop > +catatan 1 pada saat buku ini ditulis program !hotoshop terbaru adalah !hotoshop % ), meskipun demikian proses pembuatan tetap sama/, perhatikan contoh berikut1 '. Buatlah sebuah gambar secara manual pada kertas, tinta dan scan menjadi gambar bertipe ?!DM. Apabila anda belum membuatnya, buka file gambar 2Darakter Desain Larna4VPQ3 pada %" tutorial. ). Apabila gambar belum diwarnai, tambahkan warna dan efek dengan menggunakan tool pada program photoshop.

tool panel pada photoshop > dan hasil pewarnaannya *. !erhatikan bahwa terdapat background berwarna putih pada sekeliling gambar. Background tersebut harus dihilangkan agar saat dipakai dalam mo0ie flash warna putih tidak menutupi obyek yang ada di belakangnya. -. 6ntuk menghilangkan warna putih di sekeliling gambar, gunakan magic wand tool, dan klik pada area yang berwarna putih. eleksi +garis marXue/ berupa garis putus-putus akan terbentuk.

magic wand tool dan bentuk seleksi 5. !ilih menu selectCinverse atau tekan tombol $trl'Shi!t'>, untuk menyeleksi bagian yang dipakai. &emudian tekan tombol $trl'$ (cop ). 7. Buat file baru dengan menekan menu !ileCnew. Biarkan ukuran yang ada dan pilih transparent pada option content. Tekan OD, maka panel file baru akan terbentuk. Tekan $trl'U untuk mem-paste gambar yang sudah kita copy sebelumnya.

membuat file gambar dengan background transparan >. kemudian simpan file dengan memilih menu file4sa0e as. &etikan nama file 2karakter desain3 dan pilihlah P@Q pada tipe file. &lik OD, pilihlah none pada pilihan !#M option.

!#M option .. 6ntuk memakai gambar tersebut, buka program flash dan pilih menu !ileCimport. !ermasalahan 1 Buatlah sebuah karakter yang dapat berjalan atau berlari ke kanan dan kekiri, ketika tombol panah pada keyboard ditekan. 6ntuk menyelesaikan permasalahan tersebut, kita membutuhan sedikitnya > gambar karakter, yaitu ' gambar karakter pada posisi normal, dan 7 gambar animasi frameby-frame karakter yang sedang berEalan atau berlari. !erhatikan proses penyelesaian masalah tersebut 1

'. Buatlah gambar-gambar yang dibutuhkan untuk menyelesaikan masalah tersebut. &emudian olah menjadi gambar bertipe P@Q dengan background transparan. !erhatikan aturan pembuatan gambar karakter berlari secara frame-byframe+direkomendasikan anda memahami ') prinsip animasi, agar animasi frame by frame yang dihasilkan nantinya tampak menarik dan logis/. 6ntuk memberi nama file animasi secara frame by frame, gunakan angka yang berurutan. %ontoh nama file yang baik untuk animasi frame-by-frame 1 lari24png, lari54png,444, lari#4png. !emberian nama yang berurutan akan mempermudah proses pengolahan animasi pada Flash.

contoh file siap pakai pada game petualangan !addle !op (trademark karakter milik Walls : PT Unilever Indonesia) ). etelah file yang akan dipakai siap, buka program flash dan buatlah sebuah file dengan ukuran .(( , 7(( p,, ') fps. Anda bisa menggunakan !ile -normal4png., -car Ealan24png., 444, .car Ealan#4png. pada %" tutorial. *. &lik menu insertCnew s mbol.., kemudian ketikan 2karakter3 pada nama dan pilih movieclip pada beha0iour. -. &lik !rame 2 la er 2, kemudian pilih menu file4import. !ilih file .normal4png. +posisi karaker berdiri/ dan tekan OD. Maka pojok kiri atas gambar akan muncul tepat ditengah stage. 5. &lik !rame 5, kemudian masukkan blank ke !rame dengan menekan tombol "G. &lik menu !ileCimport.. !ilih file -car Ealan24png., dan tekan OD. ?ika anda menuliskan nama file dengan benar +menggunakan angka seperti pada contoh/, sebuah dialog panel akan muncul. &lik OD, maka akan terbentuk animasi frame by frame secara otomatis.

dialog panel ketika mengimpor file berurutan 7. Tambahkan sebuah layer baru diatas layer ', dan ubah namanya menjadi la er action. >. &lik !rame 2 la er action, buka panel action, kemudian tambahkan action 1 stop+/< susunan layer dan obyek pada mo0ieclip karakter .. &eluar dari mode edit symbol dengan menekan tombol %trl@D. 8. Buka panel library, kemudian drag mo0ieclip -karakter. ke tengah stage. '(. &lik mo0ieclip karakter, kemudian buka panel action danketikan script berikut 1

on%lipD0ent +load/ : langkah F '< skala F '((< jaraklangkah F )(< = on%lipD0ent +enterFrame/ : ;;langkah kekanan if +&ey.is"own+&ey.T$MGT// : E,scale F skala< Eyscale F skala< langkah@@< E, @F jaraklangkah< if +langkah47/ : langkah F '< =

gotoAnd top+langkah@'/< = ;;langkah kekiri if +&ey.is"own+&ey.IDFT// : E,scale F -skala< Eyscale F skala< langkah@@< E, -F jaraklangkah< if +langkah47/ : langkah F '< = gotoAnd top+langkah@'/< = = on%lipD0ent +key6p/ : ;;posisi kembali ke normal gotoAnd top+'/< = ''. impan file dan jalankan mo0ie. !enjelasan program 1 '. !ada mo0ie e0ent load, 0ariabel yang akan dipakai diset dan ditentukan nilainya. ). &etika panah kanan ditekan +i! (De 4isDown(De 48>QHT)) * /, skala mo0ieclip dijadikan positif +0xscale 1 skala//, dan 0ariabel langkah ditambah satu satuan +langkah''/. 0ariabel ini digunakan untuk menentukan langkah karakter. elanjutnya posisi mo0ieclip digeser ke kanan sejauh 0ariabel Earaklangkah +0x '1 Earaklangkah/. dan frame aktif dipindah ke posisi yang sesuai dengan 0ariabel langkah + goto9ndStop(langkah'2) /, penambahan angka ' dikarenakan animasi berlari dimulai dari frame ). *. 6ntuk mengembalikan posisi ke normal, saat tidak ada tobol ditekan, digunakan action goto9ndStop(2)/ pada mo0ie e0ent ke Up. %atatan 1 &etika menjalankan mo0ie tersebut, anda akan melihat sebuah kejanggalan +bug/

ketika anda menekan panah kanan dan diikuti dengan panah kiri. Gal tersebut dikarenakan posisi registration mo0ieclip karakter tidak berada di tengah tetapi di pojok kiri atas. 6ntuk memperbaikinya, edit mo0ieclip karakter dan geser posisi gambar di tiap-tiap frame ke tengah stage. memperbaiki bug pada frame ' mo0ieclip karakter.

Background elain karakter, dalam game juga dibutuhkan sebuah background atau latar belakang. Membuat background dalam Flash dapat dilakukan dengan beberapa cara seperti pada pembuatan karakter. Akan tetapi sebelum menginjak pada bagian pembuatan

background, akan lebih baik jika kita mengenal terlebih dahulu jenis-jenis background dalam game. Menurut saya, dalam buku ini background game flash dibedakan berdasarkan gerakkannya menjadi ) jenis yaitu1 '. tatic background. tatic background atau background diam sering kita jumpai pada game flash. elain mudah membuatnya, pada static background kita tidak membutuhkan script khusus untuk menggerakkannya. !erhatikan contoh dari game yang menggunakan static background berikut 1

penggunaan static background ). crolling Background. Berbeda dengan static background yang diam, backgrond bertipe scrolling background bergerak dari kanan kekiri, atas kebawah, atau bergerak bebas. Tingkat kesulitan dari pembuatan scrolling background adalah pada pengelolahan script, karena tanpa script yang baik, mo0ie dapat berjalan lambat. !erhatikan contoh dari game yang menggunakan scrolling background berikut 1

scrolling background edangkan background berdasarkan sudut pandangnya, saya membedakan menjadi * yaitu1 '. !andangan datar !andangan datar hampir dapat kita temui pada sebagian besar game flash. Gal tersebut dikarenakan pembuatan background dengan pandangan datar jauh lebih mudah dibandingkan dengan dua pandangan yang lain. !erhatikan contoh dari game yang menggunakan background dengan pandangan datar berikut 1

Background dengan pandangan datar ). !andangan isometri Bang dimaksud dengan pandangan isometri adalah pandangan burung +tampak atas/ dengan sudut -5 derajat. &eunggulan dari pandangan isometri adalah dapat memberikan kesan kedalaman suatu obyek dalam game. . !erhatikan contoh dari game yang menggunakan background dengan pandangan isometri berikut 1

game dengan pandangan isometri *. !andangan * "imensi. "alam flash membuat background * dimensi +memiliki dimensi panjang lebar dan tinggi/ sangat rumit, akan tetapi masih mungkin dilakukan untuk menghasilkan sebuah efek * "imensi. !erhatikan contoh dari game yang menggunakan efek * dimensi pada background berikut 1

efek *" background Static Background dengan Still Image (gam$ar diam 6ntuk membuat sebuah static background saya membagi lagi menjadi ) cara yaitu dengan menggunakan still image (gambar diam) dan menggunakan sistem tiling (pengubinan). Membuat backgroud dengan teknik still image hampir sama dengan membuat karakter, yaitu bisa menggunakan drawing tool, teknik tracing atau mengimpor gambar jadi. Berikut adalah contoh membuat static background dengan menggunakan still image1 '. Buatlah sebuah gambar background untuk sebuah game bertipe shooting, seperti pada gambar berikut +buka file 2background24png3 ada %" tutorial/, atau gambarlah sesuai dengan kreati0itas anda 1

penggunaan gambar jadi sebagai background ). Buka file latihan menggerakkan mo0ieclip dengan mouse1tracking yang kita buat pada bab sebelumnya +buka file 2program6<%mc0gerakan0mouse0tracking4!la2 pada %" tutorial/, kemudian buka library. &ita akan menggunakan mo0ieclip burung. *. etelah gambar siap, buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. -. Buatlah ) buah layer baru dan ubah nama layer masing-masing menEadi la er background, la er ob ek dan la er action.

susunan layer 5. &lik !rame 2 la er background, kemudian klik menu !ileCimport. $mportlah gambar background yang sudah kita buat. etelah gambar tampak pada stage, atur posisi dan ukuran gambar sampai sama dengan ukuran stage.

properties bitmap yang dipakai sebagai background 7. &lik tombol lock pada la er background, karena kita sudah tidak mengeditnya lagi.

lock layer >. &lik !rame 2 la er ob ek, kemudian drag mo0ieclip burung dari library file latihan mouse tracking yang sudah kita buka sebelumnya. Ietakkan disebelah kiri luar stage. Atur posisinya dan arah gerakkannya. Apabila burung menghadap ke kiri, balik posisi burung dengan menekan menu modi! Ctrans!ormC!lip horisontal.

posisi burung terhadap stage .. &lik mo0ieclip burung, kemudian buka panel properties dan ketikan 2burung023 pada instance name. elanjutnya buka panel action dan ketikan script berikut 1 on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F '(< naik F (< keluar F (< E0isible F (< = on%lipD0ent +enterFrame/ : ;;burung belum keluar if +keluar FF ( and random+)(/ FF 5/ : keluar F '< E0isible F '< = ;;burung keluar if +keluar FF '/ :

E, @F kecepatan< if +random+'(/ FF */ : ;;gerakan acak naik naik F '< = else if +random+'(/ FF -/ : ;;gerakan acak turun naik F )< = else if +random+'(/ FF 5/ : ;; gerakan lurus naik F (< = ;;menggerakkan naik. if +naik FF ' and Ey45(/ : Ey -F 5< = else : ;;menggerakkan turun. = if +naik FF ) and EyN55(/ : Ey @F 5< = ;;keluar dari stage, maka kembalikan lagi ke posisi awal if +E,4.((/ : E, F ,awal< Ey F '((@random+-((/< keluar F (< E0isible F (< = = = 8. ?alankan mo0ie, maka akan didapati burung keluar secara acak dan bergerak secara acak. Tutup mo0ie dan kembali ke stage utama. '(. &lik frame ' layer obyek, buatlah sebuah gambar target sasaran seperti pada gambar berikut 1

gambar sasaran pengganti kursor mouse ''. eleksi gambar tersebut, kemudian con0ert menjadi movieclip dengan nama 2kursor3. '). &lik 2kursor3, buka panel properties dan ketikan 2kursor3 pada instance name. Buka panel action dan ketikan script 1 on%lipD0ent +load/ : Mouse.hide+/< start"rag+this, true/< = on%lipD0ent +enterFrame/ : start"rag+this, true/< = '*. ?alankan mo0ie, anda akan mendapati kursor mouse sudah berubah bentuk. Akan tetapi burung belum dapat ditembak. 6ntuk dapat menembak burung, tutup mo0ie dan lanjutkan proses pembuatan game. '-. &lik mo0ieclip burung dan buka panel action. '5. Ietakkan kursor mouse pada baris terakhir +dibelakang tanda 2+3 terakhir/ kemudian tekan enter. &emudian tambahkan action berikut 1 on%lipD0ent +mouse"own/ : if +hitTest+Eroot.kursor// : E, F ,awal< Ey F '((@random+-((/< keluar F (< E0isible F (< = =

'7. impan dan jalankan mo0ie. 6ntuk menambah jumlah burung, anda dapat melakukan cop %paste mo0ieclip burung kemudian ubah instance name-nya dan ubah 0ariabel kecepatan untuk menambah tingkat kesulitan.

Static Background dengan Sistem *iling (pengu$inan Teknik pengubinan pada dasarnya sudah kita pelajari sebelumnya pada latihan penggunaan 0ariabel bertipe array dan pemakaian action for bertingkat. &euntungan pengunaan sistem tiling adalah kita dapat membuat background dengan berbagai alternatif hanya dengan mengubah bentuk data-nya saja. !erhatikan gambar dari game Dig Dog buatan saya berikut ini1

beberapa le0el pada game "ig "og !ada game dig dog tersebut, inti permainan pada dasarnya selalu sama dari le0el ke le0el yaitu karakter utama yang diharuskan untuk menggali tulang dan mengalahkan musuh yang ada. 6ntuk membuat arena permainan +dalam hal ini adalah background/ yang berbeda-beda, saya menggunakan sistem pengubinan dengan array ) dimensi dan for bertingkat. !erhatikan contoh berikut untuk memahami pembuatan background dengan sitem pengubinan1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. ). Buatlah layer baru dan ubah nama masing-masing layer menjadi la er background dan la er action. *. Buatlah sebuah symbol baru dengan memilih menu insertCnew s mbol. &etikan 2ubin3 pada nama dan pilih movieclip pada beha0iour. -. !ada mode edit mo0ieclip ubin, klik !rame 5 dan masukan ke !rame. 5. Buatlah sebuah gambar balok +batu bata/ berukuran 5( , 5( pi,el seperti pada gambar berikut1

7. gambar batu bata pada frame ) mo0ieclip ubin

>.

eleksi gambar pada frame ), kemudian buka panel align dengan memilih menu windowCalign. Atifkan tombol 9lign,Distribute to Stage, kemudian klik tombol align vertical center dan align horisontal center untuk memindah posisi gambar tepat pada tengah titik registrasi. panel align

.. &eluar dari mode edit symbol dengan menekan tombol %trl@D. 8. &lik !rame 2 la er background, kemudian buatlah gambar kotak dengan warna biru +Y((%%FF/ memenuhi stage. '(. Buka panel library. &lik kanan mo0ieclip ubin dan tambahkan linkage. !ilih export !or actionscript dan ketikan ubin pada identifier.

menambahkan linkage mo0ieclip ubin

''. &lik !rame 2 la er action, kemudian buka panel action dan ketikkan script berikut1 pola F JJ(, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (K, J(, (, (, (, (, (, (, (, (, (, (, ', ', ', (, (K, J(, (, (, ', ', ', (, ', (, ', (, (, (, (, (, (K, J(, ', (, (, (, (, (, (, (, (, (, (, (, (, (, (K, J(, ', ', ', ', (, ', ', ', (, (, (, (, (, (, (K, J(, (, (, (, (, (, (, (, (, (, ', ', ', ', (, (K, J(, (, (, (, (, (, (, (, ', (, (, (, (, (, (, (K, J(, (, (, (, (, ', ', ', ', ', (, (, (, (, (, (K, J(, ', ', ', (, (, (, (, (, (, (, (, (, (, (, (K, J(, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (K, J(, (, (, (, ', (, (, (, (, (, (, (, (, (, (, (K, J', ', ', ', ', ', ', ', ', ', ', ', ', ', ', 'KK< function gambar!ola+data!ola, ,awal, yawal/ : kedalaman F (< lebar F data!olaJ'K.length< tinggi F data!ola.length< for +0ar i F (< iNlebar< i@@/ : for +0ar j F (< jNtinggi< j@@/ : attachMo0ie+PubinP, PubinP@i@PEP@j, kedalaman@@, :E,1,awal@+iO5(/, Ey1yawal@+jO5(/=/< thisJPubinP@i@PEP@jK.gotoAnd top+data!olaJjKJiK@'/< = = = gambar!ola+pola, )5, )5/< '). ?alankan mo0ie, anda akan mendapati background dengan pola yang bisa diubah dengan cepat. !enjelasan program sama dengan penjelasan pada program array dan for bertingkat. %atatan 1 6ntuk memahami lebih lanjut mengenai pembuatan static background dengan sistem

tiling +pengubinan/, bacalah buku 2 eri !emrograman Mame Flash 1 Tiling Mame3. Scrolling Background dengan Motion *2een ebelum membuat sebuah scrollin background, harus kita pahami bahwa mo0ie akan berjalan lambat jika kita menggerakkan banyak obyek pada waktu yang bersamaan. 6ntuk itu kita harus memahami teknik optimalisasi dalam membuat background bergerak agar game kita nantinya tidak berjalan lambat. 6ntuk membuat sebuah scrolling background saya membagi lagi menjadi * cara yaitu dengan menggunakan motion tween, action dan menggunakan sistem tiling (pengubinan). !erhatikan membuat background dengan teknik motion tween berikut1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. ). Buat sebuah gambar gunung yang nantinya akan digunakan sebagai background. !erhatikan ukuran gambar tersebut, pastikan ukuran lebar gambar sama dengan ukuran stage yaitu .(( pi,el.

gambar background *. eleksi gambar dan con0ert menjadi movieclip dengan nama 2background3. -. "ouble klik mo0ieclip background untuk mengeditnya. 5. !ada mode edit symbol, copy gambar dan paste-kan di sebelah kanan gambar sehingga menjadi tampak seperti pada gambar berikut1

duplikasi gambar dan posisinya terhadap stage

7.

eleksi seluruh gambar kemudian con0ert kembali menjadi symbol mo0ieclip dengan nama 2gunung3.

>. &lik frame -( masukan ke !rame. Meser mo0ieclip gunung ke kiri, sehingga tampak seperti pada gambar berikut1

posisi gambar pada frame -( .. &lik kanan frame )( kemudian pilih create motion tween untuk membuat animasi motion. 8. &eluar dari mode edit symbol dan jalankan mo0ie. &ita akan mendapati background yang bergerak secara terus menerus tanpa terputus. Agar terlihat rapi bisa ditambahkan masking. Tutup mo0ie '(. 6ntuk menambahkan masking, edit kembali mo0ieclip 2background3. ''. Tambahkan sebuah layer diatas layer ', kemudian buatlah gambar kotak memenuhi stage. '). &lik kanan la er 5 dan pilih mask, maka gambar yang tampak akan terlihat rapi +semua berada di dalam stage/.

menambahkan masking '*. ?alankan mo0ie, maka tampilan background manjadi lebih baik dari sebelumnya. Scrolling Background dengan Action Sederhana &elemahan background dengan teknik motion tween adalah background yang monoton, yang akan mempercepat kebosanan pemain. 6ntuk menghindari hal tersebut, kita dapat menggunakan action sederhana pada beberapa obyek yang akan

dijadikan background. !erhatikan contoh menggerakkan background dengan action berikut1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. ). Buatlah - buah obyek berupa pohon, ) gedung dan awan, kemudian con0ert masing-masing menjadi mo0ieclip dengan nama 2pohon3, 2gedung23, 2gedung53 dan 2awan3. mo0ieclip yang dipakai untuk background

*. Ietakkan masing-masing mo0ieclip di sebelah kanan luar stage. posisi obyek pada stage -. &lik mo0ieclip 2pohon3, buka panel action dan ketikan action berikut 1 on%lipD0ent +load/ : ,awal F -'((< kecepatan F )(< keluar F (< E0isible F (< = on%lipD0ent +enterFrame/ : ;; menampilkan background secara acak if +random+*(/ FF 5 and keluar FF (/ : keluar F '< E0isible F '< = ;; menggerakkan background if +keluar FF '/ : E, @F kecepatan<

if +E,4.((/ : E, F ,awal< keluar F (< E0isible F (< = = = 5. %opy action tersebut, kemudian paste-kan pada mo0ieclip yang lain +pada mo0ieclip 2gedung'3, 2gedung)3, dan 2awan3. 7. ?alankan mo0ie, maka akan kita dapati background scrolling secara acak. >. 6bah bilangan random dan tambahkan lebih banyak obyek untuk memperbanyak 0ariasi background. Scrolling Background dengan Sistem *iling !ada beberapa game background dibuat dengan 0ariasi yang lebih menarik dan keluar secara teratur, seperti pada game uper Mario, onic, dan game sejenis lainnya. "engan membuat background yang selalu tetap dan teratur, sebuah game dapat dihafalkan dengan cepat oleh pemain, dan itulah nilai tambah sebuah game dari backgroundnya. 6ntuk membuat background yang teratur dan keluar dengan urutan tertentu, kita dapat memanfaatkan sistem pengubinan +tiling/. Akan tetapi ada beberapa hal yang harus kita perhatikan dalam membuat scrolling background dengan sistem tiling, yaitu 1 '. Mo0ie flash melambat jika kita menggerakkan banyak obyek dalam waktu yang sama. ). !erhatikan ukuran mo0ie flash. ?angan membuat mo0ie dengan ukuran yang besar, karena dipastikan dapat memperlambat mo0ie. *. 6ntuk mengetahui ukuran mo0ie yang optimal, setelah mo0ie selesai dibuat, ujilah pada komputer yang lambat +komputer dengan sepesifikasi yang buruk/. ?ika mo0ie berjalan lambat, perkecilah ukuran mo0ie. #amun jika mo0ie berjalan normal, dipastikan mo0ie yang anda buat bekerja baik pada komputer dengan spesifikasi yang lebih baik. !erhatikan proses pembuatan background dengan sistem tiling berikut 1

'. Buatlah mo0ie dengan ukuran )(( , '5( pi,el dan )5 fps. ). Buatlah layer baru dan ubah nama masing-masing layer menjadi la er background dan la er action. *. Buatlah sebuah symbol baru dengan memilih menu insertCnew s mbol. &etikan 2ubin3 pada nama dan pilih movieclip pada beha0iour. -. !ada mode edit mo0ieclip ubin, klik !rame 5 dan masukan ke !rame. 5. Buatlah sebuah gambar balok +batu bata/ berukuran '7 , '7 pi,el seperti pada gambar berikut1

gambar batu bata pada frame ) mo0ieclip ubin 7. eleksi gambar pada frame ), kemudian buka panel align dengan memilih menu windowCalign. Atifkan tombol 9lign,Distribute to Stage, kemudian klik tombol align le!t edge dan align top edge untuk memindah posisi gambar tepat pada pojok kiri atas titik registrasi.

posisi titik registrasi mo0ieclip ubin >. &eluar dari mode edit symbol dengan menekan tombol %trl@D. .. &lik !rame 2 la er background, kemudian buatlah gambar kotak dengan warna biru +Y((%%FF/ memenuhi stage. 8. Buka panel library. &lik kanan mo0ieclip ubin dan tambahkan linkage. !ilih export !or actionscript dan ketikan ubin pada identifier.

menambahkan linkage mo0ieclip ubin

'(. Buatlah symbol baru dengan memilih menu insertCnew s mbol. &etikan 2penampung3 pada nama dan pilih movieclip pada beha0iour. ''. &lik kanan mo0ieclip penampung pada library dan tambahkan linkage. !ilih export !or actionscript dan ketikan penampung pada identifier '). &lik !rame 2 la er action, kemudian buka panel action dan ketikkan script berikut1 function gambarpola+/ : for +iF(< iNtinggiTampak< i@@/ : for +jF(< jNlebarTampak@'< j@@/ : this.penampung.attachMo0ie+PtileP, PtEP@i@PEP@j, @@d/< this.penampungJPtEP@i@PEP@jK.E, F jOlebar6bin< this.penampungJPtEP@i@PEP@jK.Ey F iOtinggi6bin< this.penampungJPtEP@i@PEP@jK.gotoAnd top+map'JiKJjK@'/< = = = function geser+arah/ : if +arah FF PkananP ZZ lebar!eta4Fj/ : this.penampung.E, -F kecepatan< ,utama @F kecepatan< if +,utama4Flebar6bin/ : 0ar iAkhir F i-tinggiTampak<

while +iAkhirNi/ : 0ar jAkhir F j< while +jAkhirNj@'/ : this.penampung.attachMo0ie+PtileP,PtEP@iAkhir@PEP@jAkhir, @@d/< this.penampungJPtEP@iAkhir@PEP@jAkhirK.E, F jAkhirOlebar6bin< this.penampungJPtEP@iAkhir@PEP@jAkhirK.Ey F iAkhirOtinggi6bin< this.penampungJPtEP@iAkhir@PEP@jAkhirK.gotoAnd top+map'JiAkhirK JjAkhirK@'/< remo0eMo0ie%lip+this.penampungJPtEP@iAkhir@PEP@+jAkhirlebarTampak-'/K/< jAkhir@@< = iAkhir@@< = j@@< ,utama -F lebar6bin< = = if +arah FF PkiriP ZZ j-lebarTampak4(/ : this.penampung.E, @F kecepatan< ,utama -F kecepatan< if +,utamaNF(/ : j--< 0ar iAkhir F i-tinggiTampak< while +iAkhirNi/ : 0ar jAkhir F j-lebarTampak-'< while +jAkhirNj-lebarTampak/ : this.penampung.attachMo0ie+PtileP, PtEP@iAkhir@PEP@jAkhir, @@d/< this.penampungJPtEP@iAkhir@PEP@jAkhirK.E, F jAkhirOlebar6bin< this.penampungJPtEP@iAkhir@PEP@jAkhirK.Ey F iAkhirOtinggi6bin< this.penampungJPtEP@iAkhir@PEP@jAkhirK.gotoAnd top+map'JiAkhirK JjAkhirK@'/< remo0eMo0ie%lip+this.penampungJPtEP@iAkhir@PEP@+jAkhir@

lebarTampak@'/K/< jAkhir@@< = iAkhir@@< = ,utama @Flebar6bin< = = = map' F JJ(, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (, (K, J(, (, (, (, (, (, (, (, (, (, (, ', ', ', (, (, (, (, ', ', (K, J(, (, (, ', ', ', (, ', (, ', (, (, (, (, (, (, (, (, (, (, (K, J(, ', (, (, (, (, (, (, (, (, (, (, (, (, ', ', ', (, (, (, (K, J(, ', ', ', ', (, ', ', ', (, (, (, (, (, (, (, ', ', ', (, (K, J(, (, (, (, (, (, (, (, (, (, ', ', ', ', (, (, (, (, (, (, (K, J(, (, (, (, (, (, (, (, ', (, (, (, (, (, (, (, (, (, (, (, (K, J', ', ', ', ', ', ', ', ', ', ', ', ', ', ', (, ', ', ', ', 'KK lebar!eta F map'J(K.length< tinggi!eta F map'.length< lebarTampak F '(< tinggiTampak F .< lebar6bin F '7< tinggi6bin F '7< ,awal F '7< yawal F '7< ,utama F (< yutama F (< kecepatan F *< this.attachmo0ie +PpenampungP, PpenampungP,'/< this.penampung.E, F ,awal< this.penampung.Ey F yawal< gambarpola+/<

Eroot.onDnterFrame F function+/: if +&ey.is"own+&ey.IDFT//: geser+PkananP/ = if +&ey.is"own+&ey.T$MGT//: geser+PkiriP/ = = '*. ?alankan mo0ie. !enjelasan program1 '. !ada awalnya kita tentukan dulu background yang akan dipakai dalam bentuk array ) dimensi pada 0ariabel map'. +map2 1 N44444O//. ). elanjutnya 0ariabel yang dipakai seperti +tinggi dan lebar peta, tinggi dan lebar daerah yang tampak, dan 0ariabel yang lain/ diset nilainya. *. 6ntuk menampilkan background yang dapat digerakkan, dibutuhkan sebuah mo0ieclip kosong untuk menampungnya +this4attachmovie (ApenampungA, ApenampungA,2)//. !erhatikan bahwa mo0ieclip penampung dibutuhkan ketika kita menggerakkan background dengan sistim tiling, sedangkan pada static background dengan sistim tiling kita tidak membutuhkan mo0ieclip penampung. -. !ada action tersebut terdapat ) fungsi yaitu fungsi gambarpola dan fungsi geser. Fungsi gambarpola digunakan saat pertama kali mo0ie dijalankan, untuk menampilkan gambar pada mo0ie. elanjutnya ketika terdapat tombol panah kiri atau panah kanan ditekan +i! (De 4isDown(De 4?&"T))*/, maka fungsi geser(arah) dijalankan. 5. !erhatikan proses pada kedua fungsi tersebut. !ada fungsi gambarpola data bertipe array pada 0ariabel map2 di0isualisasikan pada stage dengan tinggi dan lebar sesuai dengan 0ariabel lebarTampak dan tinggiTampak dan diletakkan pada mo0ieclip penampung.

tampilan stage akibat 0ariabel lebarTampak dan tinggiTampak

!ada fungsi geser(arah), ketika 0ariabel arah bernilai 2kiri3, maka kordinat x dari mo0ieclip penampung digeser ke kiri. Bagian yang belum ditampilkan ditambahkan dengan action attachMo0ie +this4penampung4attachMovie(AtileA, At0A'i9khir'A0A'E9khir, ''d)// dan bagian yang tidak tampak akibat bergeser ke kiri di hilangkan dengan action remo0eMo0ieclip +removeMovie$lip(this4penampungNAt0A'i9khir'A0A'(E9khir' lebarTampak'2)O)//.

bagian yang dihilangkan dan ditambah oleh fungsi geser %atatan 1 6ntuk memahami lebih lanjut mengenai pembuatan scrolling background dengan sistim tiling pada flash game, bacalah buku 2 eri !emrograman Mame Flash 1 Tiling Mame3. Parala& Background Bang dimaksud dengan parala, background adalah background berlapis dimana background yang lebih dekat dengan mata pemain bergerak lebih cepat daripada background yang lebih jauh dari mata pemain. elain menambah kesan kedalaman, penambahan parala, background dapat menambah kesan realis suatu game.

6ntuk membuat parala, background pada game, kita harus membuat minimal ) lapis background dengan kecepatan yang berbeda. !erhatikan gambar berikut1

penggunaan parala, background pada game 2snowboard3 academy Teknik pembuatan parala, background dapat dengan * cara yaitu dengan motion, dengan action sederhana dan dengan sistim tiling. &etiga cara tersebut sama dengan tiga cara yang sudah dibahas sebelumnya, hanya saja proses diulang sebanyak ) kali dengan 0ariabel kecepatan yang berbeda-beda. Background dengan Pandangan Isometri Background dengan pandangan isometri sering dipergunakan pada game-game !% maupun gam flash yang bertipe simulasi, T!M atau TT . !erhatikan proses pembentukan background isometri berikut 1 proses pembuatan background dengan pandangan isometri

!ada dasarnya pandangan isometri diawali dengan bentuk kotak dengan pandangan datar. &otak tersebut kemudian dirotasi -5 derajat dan di lakukan pen-skalaan sebanyak 5(L secara 0ertikal. !roses pembuatan background dengan pandangan isometri dapat dilakukan dengan ) cara yaitu secara manual +menggambar pada stage/ dan dengan menggunakan action

+menggunakan sitim tiling/. !erhatikan proses pembuatan background isometri dengan cara manual +menggambar pada stage/ berikut1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el, dan ') fps. ). Buatlah sebuah layer baru dan ubah masing masing nama layer menjadi la er pola dan la er background. *. &lik !rame2 la er pola, kemudian buatlah sebuah gambar jaring-jaring persegi, seperti yang tampak pada gambar 1 gambar jaring-jaring persegi

-.

eleksi gambar tersebut, kemudian dengan menggunakan transform tool, rotasilah sebesar -5 derajat

5. &emudian lepaskan seleksi, seleksi kembali dandengan menggunakan transform tool, skew +perkecil ukuran 0ertikalnya/ menjadi setengah dari ukuran sebelumnya.

proses pembuatan background isometri secara manual 7. ?ock la er pola, kemudian klik !rame 2 la er background dan gambarlah background secara manual atau mengimpor gambar jadi. !erhatikan bahwa

peletakan background harus sesuai dengan pola yang telah dibuat. !erhatikan contoh berikut1 contoh pembuatan background isometri >. elesaikan seluruh background dan simpan file. %atatan 1 Membuat background isometri secara manual lebih mudah dibandingkan dengan membuat background isometri dengan teknik tiling, akan tetapi proses perhitungan pergerakan obyek nantinya akan jauh lebih sulit. Background Isometri dengan *eknik *iling Menggunakan teknik tiling dengan pandangan isometri pda dasarnya sama dengan teknik tiling pada static background dengan pandangan datar, hanya saja perhitungan posisinya saja yang sedikit berbeda. !erhatikan proses berikut 1 '. Buatlah sebuah file baru dengan ukuran 5(( , *(( pi,el, )5 fps. ). Buatlah sebuah movieclip baru dengan memilih menu insertCnews mbol, ketikan ubin pada nama dan klik OD. *. !ada mode edit symbol mo0ieclip ubin, pada !rame 2 buatlah gambar kotak isometri seperti yang tampak pad gambar. !erhatikan penempatan titik registrasinya. gambar pada frame ' mo0ieclip ubin

-. &lik !rame 5, kemudian masukan ke !rame. Tambahkan garis garis bantu untuk membentuk sebuah balok seperti tampak pada gambar 1 proses menggambar obyek di frame )

5. &eluar dari mode edit symbol. 7. Tambahkan linkage pada mo0ieclip 2ubin3 dan ketikan 2tile3 pada identifier.

>. Buatlah sebuah movieclip baru dengan memilih menu insertCnew s mbol dan ketikan nama 2penampung3. .. "alam mode edit mo0ieclip 2penampung3, jangan tambahkan apapun dan keluarlah dari mode edit symbl dengan menekan tombol %trl@D. 8. Tambahkan linkage pada mo0ieclip 2penampung3 dan ketikan 2penampung3 pada identifier. '(. &lik !rame 2 la er 2, kemudian buka panel action dan ketikan script berikut 1 function gambar!ola+/ : lebar F map'J(K.length< tinggi F map'.length< for +i F (< i N tinggi< i@@/ : for +j F (< j N lebar< j@@/ : this.penampung.attachMo0ie+PtileP, PtEP @ i @ PEP @ j, @@kedalaman/< this.penampungJPtEP @ i @ PEP @ jK.E, F lebar6bin ; ) O +j - i/< this.penampungJPtEP @ i @ PEP @ jK.Ey F tinggi6bin ; ) O +j @ i/< this.penampungJPtEP @ i @ PEP @ jK.gotoAnd top+map'JiKJjK@'/< = = = map' F JJ(, ', (, (, (, (, (, (, (, (, (, ( K, J(, (, ', (, (, (, (, (, (, (, (, ' K, J(, (, (, ', ', ', (, ', (, ', (, ( K, J(, ', (, (, (, (, (, (, (, (, (, ( K, J(, ', ', ', ', (, ', ', ', (, (, ( K, J(, (, (, (, (, (, (, (, (, (, ', ' K, J(, (, ', (, ', (, (, (, ', (, (, ( K, J(, (, (, (, (, (, (, (, ', (, (, ( K, J(, (, (, (, (, (, (, (, ', (, (, ( K, J', ', ', ', ', ', ', ', ', ', ', ' KK lebar6bin F -(<

tinggi6bin F )(< ,awal F )*(< yawal F *(< this.attachMo0ie+PpenampungP, PpenampungP, (/< this.penampung.E, F ,awal< this.penampung.Ey F yawal< gambar!ola+/< ''. ?alankan mo0ie dan anda akan mendapati tampilan seperti pada gambar berikut1

contoh background isometri !enjelasan program1 !ada dasarnya membuat background dengan pandangan isometri dengan sistem tiling sama dengan membuat background dengan pandangan datar, hanya saja pada peletakan posisi ubin dilakukan sedikit perubahan. !ada kordinat , posisi isometri menggunakan rumus lebarUbin , 5 = (baris % kolom) sedangkan pada kordinat y digunakan rumus tinggiUbin , 5 = (baris ' kolom). Background dengan )fek ; Dimensi Bang harus kita pahami sebelum membuat background dengan efek * "imensi adalah bahwa flash adalah program yang berbasis ) dimensi yaitu hanya memiliki kordinat , dan kordinat y. edangkan hal yang berbau * dimensi selalu memiliki sumbu yang ke * yaitu kordinat S. Gal kedua yang harus dipahami bahwa membuat background dengan efek * dimensi bukan berarti mengimport obyek * " dari luar Flash +seperti mengimport mo0ie hasil dari program wift *", *" flash dan sebagainya/ Tetapi membuat background dengan efek * dimensi adalah menciptakan kondisi seolah-olah terdapat sebuah sumbu S pada flash.

6ntuk membuat efek * dimensi diperlukan sebuah bitmap sebagai pola background. ebagai contoh jika kita akan membuat sebuah game bertipe racing, maka kita membutuhkan bitmap pola lintasan +sirkuit/. !erhatikan contoh berikut1 '. Buatlah sebuah gambar bitmap pola sirkuit dengan ukuran '((( , '((( pi,el menggunakan Adobe photoshop atau program sejenis lainnya seperti pada gambar1 +atau gunakan file 2sircuit4Epg3 pada %" tutorial/

gambar sircuit4Epg yang akan dipakai sebagai background ). Buka program Flash, buatlah file barudengan ukuran 55( , -(( pi,el dan )( fps. *. $mport gambar yang sudah anda buat sebelumnya, dengan memilih menu !ileCimport. -. eleksi gambar tersebut, kemudian con0ert menjadi mo0ieclip dengan nama 2gerak3. 5. &lik mo0ieclip 2gerak3, buka panel instance dan ketikan 2gerak3 pada instance name. 7. &lik mo0ieclip 2gerak3, kemudian con0ert kembali menjadi mo0ieclip dengan nama 2gambar3. >. &lik mo0ieclip 2gambar3, buka panel instance dan ketikan 2gambar3 pada instance name. .. &lik mo0ieclip 2gambar3, kemudian con0ert kembali menjadi mo0ieclip dengan nama 2peta3. ehingga hirarki instance name dari mo0ieclip 2peta3 adalah 1

hirarki mo0ieclip peta 8. Gapus mo0ieclip 2peta3 dari stage, kemudian buka panel library.

'(. &lik kanan mo0ieclip 2peta3 pada library, dan tambahkan linkage. !ilih export !or action script dan ketikan 2peta3 pada identi!ier. ''. Buatlah sebuah kotak dengan ukuran 55( , * pi,el. &emudian con0ert menjadi mo0ieclip mask, pilih pojok kiri atas pada registration poin.

titik registration mo0ieclip 2mask3 '). &lik kanan mo0ieclip 2mask3 pada library, dan tambahkan linkage. !ilih export !or action script dan ketikan 2mask3 pada identi!ier. '*. &lik !rame 2 la er 2, kemudian buka panel action dan ketikan script berikut1 EXuality F PICAP< ams F '< ,ms F *< ms F '< skala F '(< sudut&emiringan F '8(< for +iF'< iNFsudut&emiringan< i @F ms/ : total@@< ams @F ,ms;*(< ms F Math.floor+ams/< peta F attachMo0ie+PpetaP, PpetaP@total, iO*@'/< peta.gambar.E,scale F '((< peta.gambar.Eyscale F '((< peta.E, F )>5< peta.Ey F -((< peta.E,scale F iOskala< peta.Eyscale F iOskala< peta.onDnterFrame F function+/ : this.gambar.Erotation F Eroot.rotasi<

this.gambar.gerak.Ey @F Eroot.nilai%os< this.gambar.gerak.E, @F Eroot.nilai in< =< tutup F attachMo0ie+PmaskP, PmaskP@i, iO*@)/< tutup.Eheight F ms< tutup.Ey F )((@i< peta.setMask+tutup/< = Eroot.onDnterFrame F function+/ : kecMa, F )(< if +&ey.is"own+&ey.T$MGT// : Eroot.rotasi -F 5< = else if +&ey.is"own+&ey.IDFT// : Eroot.rotasi @F 5< = else if +&ey.is"own+&ey.6!// : Eroot.kec F 5< = else if +&ey.is"own+&ey."CA#// : Eroot.kec F -5< = else : Eroot.kec F (< = Eroot.nilai%os F Eroot.kecOMath.cos+Eroot.rotasiOMath.!$;'.(/;)< Eroot.nilai in F Eroot.kecOMath.sin+Eroot.rotasiOMath.!$;'.(/;)< =< '-. ?alankan mo0ie. untuk mempercantik tampilan tambahkan sebuah layer dibawah layer ' dan buatlah obyek berupa tanah datar dan langit.

hasil program !enjelasan program 1 '. !ada awal script diset beberapa 0ariabel yang akan dipakai dalam menggerakkan background. elain itu juga terdapat properti 0Wualit yang diset 2?OL3 untuk mempercepat jalannya mo0ie. Apabila anda ingin memperbaiki kualitas gambar, anda bisa mengeset nilai 0Wualit menjadi 2H>QH3. ). !roses pembuatan efek * dimensi pada dasarnya adalah menggambar ulang mo0ieclip 2peta3 beberapa kali sesuai dengan 0ariabel sudutDemiringan +!or (i12/ iB1sudutDemiringan/ i '1 ms) */ dengan skala yang berbeda +peta40xscale 1 i=skala/ peta40 scale 1 i=skala/)4 *. Agar gambar terlihat rapi, maka dilakukan proses masking menggunakan action peta4setMask(tutup) dimana tutup berisi mo0ieclip 2mask3 +tutup 1 attachMovie(AmaskA, AmaskA'i, i=6'5)//. -. 6ntuk menggerakkan ke berbagai arah digunakan rumus sinus dan cosinus +0root4nilai$os 1 0root4kec=Math4cos(0root4rotasi=Math4P>,2M3),5// sebagai nilai perubahan korninat x dan mo0ieclip 2gerak3 5. !erubahan ke kanan dan ke kiri akibat fungsi sinus +this4gambar4gerak40x '1 0root4nilaiSin/, sedangkan perubahan ke depan dan ke belakang akibat fungsi cosinus +this4gambar4gerak40 '1 0root4nilai$os/. 7. ?ika anda menggunakan gambar 2sircuit4Epg3 pada %" tutorial, maka pada saat mo0ie pertama kali dijalankan, anda akan berada pada daerah berwarna hijau. ?ika anda ingin berada pada track +jalan/, ubah posisi bitmap pada mo0ieclip 2gerak3. Ietakkan registration poin pada jalan seperti pada gambar berikut1

perbaikan posisi registration poin pada mo0ieclip 2gerak3

Sound elain game play+sistem permainan/, karakter, dan background, suara dalam game juga dapat menambah nilai suatu game. "alam game suara dibedakan menjadi ) yaitu suara background +Back Mround Music/ dan suara efek + ound Dffect/. &edua jens sound tersebut dapat dibuat dengan * cara, yaitu 1 dengan cara manual, dengan action script attach ound, dan dengan mengimpor ound.

Mengatur Sound dengan (ara Manual Bang dimaksud dengan cara manual menurut saya adalah dengan mengimpor file sound ke dalam library, kemudian men-drag-nya langsung ke stage. &euntungan dari cara ini adalah pada sisi kemudahannya, akan tetapi untuk mengatur ulang sound sangat sulit untuk dilakukan. !erhatikan contoh berikut 1 '. iapkan sebuah file suara atau gunakan file 2bgm24mp63 pada folder suara di %" tutorial. ). Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. *. !ilih menu !ileCimport to librar 44 dan pilih file suara yang akan diimpor, kemudian tekan C&.

bentu symbol bertipe sound pada library -. 6ntuk mengunakannya drag langsung dari library ke stage. Maka tampilan pada timeline akan berubah.

tampilan sound pada sebuah frame 5. ?alankan file, maka akan terdengar sound yang diimport sebanyak satu kali. 7. Tutup mo0ie. &lik !rame 2 dan buka panel properties. !erhatikan pada bagian sound properties. &ita dapat memilih sound yang diinginkan atau menghilangkan sound pada roll menu Sound . !ada roll menu e!!ect anda dapat memilih beberapa efek standard seperti fade in, fade out, pan left dan sebagainya. Atau anda dapat membuat efek sendiri dengan menekan tombol edit. !ada rool menu s nc anda dapat memilih mode suara yang dijalankan 1 e0ent berarti sound dapat dimainkan pada ' frame saja, akan suara akan saling bertumpukan apabila frame yang aktif lebih dari ' dan kurang

dari panjang sound. %ontoh mo0ie memiliki 5 frame aktif sedangkan panjang lagu adalah '( detik, maka suara akan bertumpukan. start stop steam berarti sound akan dimainkan sampai selesai, tanpa bertumpukan untuk menghentikan sound sound dimainkan sepanjang frame aktif. 6ntuk memainkan satu sound secara utuh, frame yang aktif harus sepanjang lamanya sound. ?oop menunjukan berapa kali sebuah sound dimainkan. sound properties

>. &lik !rame 23 kemudian masukan frame dengan menekan tombol ";. 6bahlah properties untuk lebih memahami arti sync dan effect. Menam$ah Sound dengan attachSound( ! "engan menambahkan sound secara manual terdapat kelemahan seperti sulit untuk mengatur 0olume, menghentikan sound, memulai sound pada waktu tertentu dan sebagainya. 6ntuk mengatasi masalah tersebut, flash menyediakan action attachSound()/ untuk memanfaatkan action tersebut, kita harus menambahkan linkage pada symbol sound. !erhatikan contoh penggunaan action tersebut berikut ini1 '. iapkan sebuah file suara atau gunakan file 2mati4mp63 pada folder suara di %" tutorial. ). Bukalah file latihan menggunakan static background yang telah kita buat sebelumnya, atau buka file program<5%backgroundStatic4!la pada %" tutorial. *. !ilih menu !ileCsave as, dan ketikan nama file yang baru. -. !ilih menu !ileCimport to librar 44 dan pilih file suara yang akan diimpor, kemudian tekan OD

5. Buka panel library, kemudian klik kanan pada library sound yang telah diimpor dan tambahkan linkage. !ilih export !or action script dan ketikan suara0mati pada identi!ier.

menambahkan linkage ada symbol sound 7. &lik mo0ieclip 2burung3, kemudian buka panel action dan tambahkan action-nya menjadi 1 on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F '(< naik F (< keluar F (< E0isible F (< suara F new ound+/< suara.attach ound+PsuaraEmatiP/< = on%lipD0ent +enterFrame/ : ;;burung belum keluar if +keluar FF ( and random+)(/ FF 5/ : keluar F '< E0isible F '< = ;;burung keluar if +keluar FF '/ : E, @F kecepatan< if +random+'(/ FF */ :

;;gerakan acak naik naik F '< = else if +random+'(/ FF -/ : ;;gerakan acak turun naik F )< = else if +random+'(/ FF 5/ : ;; gerakan lurus naik F (< = ;;menggerakkan naik. if +naik FF ' and Ey45(/ : Ey -F 5< = else : ;;menggerakkan turun. = if +naik FF ) and EyN55(/ : Ey @F 5< = ;;keluar dari stage, maka kembalikan lagi ke posisi awal if +E,4.((/ : E, F ,awal< Ey F '((@random+-((/< keluar F (< E0isible F (< = = = on%lipD0ent +mouse"own/ : if +hitTest+Eroot.kursor// : E, F ,awal< Ey F '((@random+-((/< keluar F (< E0isible F (< suara.start+(, '/<

= = >. Apabila pada latihan sebelumnya anda membuat beberapa burung dengan 0ariabel kecepatan dan nilai random yang berbeda, tambahkan juga action yang sama pada masing-masing mo0ieclip burung tersebut. .. ?alankan mo0ie. !enjelasan program1 '. !ada mo0ie e0ent load, dilakukan pengesetan awal sebuah obyek ound dengan action suara 1 new Sound()/ dengan action tersebut berarti telah dibuat sebuah obyek baru bertipe sound. ). elanjutnya sound ditambahkan pada mo0ie dengan action suara4attachSound(-suara0mati.)/ -suara0mati. merupakan linkage dari sound yang telah diimport. *. 6ntuk menjalankan sound, yang dalam hal ini diletakkan pada saat burung tertembak adalah dengan menggunakan action suara4start(3, 2)/ dimana 3 merupakan detik dimulainya sound dan 2 adalah jumlah sound diainkan. Mengimpor Sound dengan loadSound( ! "alam flash,penggunaan sound yang banyak apalagi dengan durasi yang panjang dapat menyebabkan ukuran file membengkak. &elemahan tersebut dapat kita tutupi dengan cara mengimpor sound dari luar mo0ie. Akan tetapi untuk mengimpor sound dari luar, flash hanya menyuport file bertipe M!*. !erhatikan contoh berikut 1 '. iapkan sebuah file suara atau gunakan file 2bgm24mp63 pada folder suara di %" tutorial. %opy file tersebut ke folder dimana anda bekerja. ). Ianjutkan file latihan attach ound atau buka file program;2% sound0attachSound4!la pada %" tutorial. *. &lik mo0ieclip 2burung3, buka panel action dan tambahkan pada blok mo0ie e0ent load menjadi 1 on%lipD0ent +load/ : Ey F '((@random+-((/< ,awal F E,< kecepatan F '(<

naik F (< keluar F (< E0isible F (< suara F new ound+/< suara.attach ound+PsuaraEmatiP/< bgm F new ound+/< bgm.load ound+Pbgm'.mp*P, (/< bgm.start+(.'5, '(/< = impan file dan jalankan mo0ie.

-.

!enjelasan program1 '. 6ntuk membuat suara background, kita harus membuat sebuah obyek baru bertipe sound dengan menggunakan action bgm 1 new Sound()/. ). 6ntuk mengimpor sound, digunakan action +bgm4loadSound(nama !ile ang akan diload, 3)/. nilai 3 berarti sound tidak streaming. +streaming berarti sound akan langsung dimulai dimainkan meskipun belum ter-load semuanya/. *. 6ntuk memainkan sound yang diimport, digunakan action bgm4start(342;, 23)/ nilai 342; dipakai agar looping suara bgm tidak terputus, apabila dimasukkan nilai ( akan terdengar suara yang terputus sesaathal tersebut dikarenakan suara bgm24mp6 yang diload dimulai pada detik ke (.'5. nilai 23 berarti suara yang diload akan dimainkan sebanyak '( kali. %atatan1 untuk mengimpor sound dari folder yang berbeda, tuliskan dengan jelas nama folder. contoh 1 bgm4loadSound(Asuara,bgm24mp6A, 3)/ untuk mengatur 0olume digunakan action suara.setUolume(3%233)/ untuk megeset speaker yang aktif digunakan action suara4setPan(%233 X 233)/ dimana R'(( berarti speaker kiri yang aktif ( berarti kedua speaker aktif dan '(( berarti speaker kanan yang aktif. 6ntuk menghentikan sebuah sound dapat digunakan action suara4stop()/ untuk menghentikan semua suara dapat digunakan action stop9llSounds()/

Mem$uat 9ame Arcade !ada bab ini kita akan memcoba membuat sebuah game sederhana bertipe arcade. Apabila anda memahami proses pembuatan game ini, maka dapat dipastikan anda akan dapat membuat game yang lebih kompleks. Stor# Board 9ame ?udul game Alien Attack ?enis game Arcade istem kendali &eyboard1 arah panah untuk menggerakkan karakter dan

&arakter utama Musuh Background etting istem permainan

spasi untuk menembak !esawat jet !esawat alien Angkasa luar dengan teknik scrolling sederhana !emain harus menembak seluruh musuh yang ada. !ada waktu-waktu tertentu, pemain dapat memperoleh bonus berupa armor bonus yang akan mengaktifkan perisai pesawat, gun bonus yang akan menambah kemampuan senjata pesawat dan speed bonus yang akan mempercepat gerakan pesawat. !ermainan berakhir jika pesawat meledak dan life point habis.

Memvisualisasikan Stor#$oard etelah storyboard tersusun, tahapan berikutnya adalah mem0isualisasikannya boleh secara manual drawing pada kertas atau secara digital sebagai beikut 1

0isualisasi dari story board Mem$uat Karakter dalam 9ame "ari 0isualisasi tersebut, kita membutuhkan beberapa gambar karakter yaitu pesawat pemain, pesawat musuh, animasi ledakan, beberapa bonus, senjata dan background. eluruh obyek tersebut dapat kita buat menggunakan drawing tool, atau mengimpor gambar siap pakai sepertipada penjelasan sebelumnya. Mem$uat Movieclip "edakan Iedakan hampir selalu dibutuhkan dalam game-game seperti yang kita buat sekarang. !ada dasarnya membuat efek ledakan yang paling efektif adalah dengan menggunakan teknik animasi frame by frame. !erhatikan proses pembuatan game 2Alien Attack3 berikut, yang dimulai dari pembuatan mo0ieclip ledakan1 '. Buatlah sebuah file baru dengan ukuran -(( , 7(( pi,el dan ') fps. ). Buatlah > buah layer baru, dan ubah nama masing-masing layer menjadi la er bg6, bg5, bg2, karakter, senEata, bonus, properti dan la er action.

susunan layer pada game 2alien attack3 *. &lik menu insertCnew s mbol. &etikan 2ledakan3 pada nama dan pilih movieclip pada beha0iour. -. !ada mode edit symbol mo0ieclip ledakan, klik !rame 2 la er 2. &emudian pilih menu !ileCimport. !ilihlah file 2gambarSledakanSimage24png3 pada %" tutorial. 5. &etika muncul seWuence image dialog +akibat dari mengimpor file dengan nama yang berurutan/, pilih 2 es3 maka akan terbentuk animasi ledakan secara frame by frame.

import seXuence of images dialog 7. !erhatikan bahwa titik registrasi tidak terletak tepat di tengah ledakan. Anda dapat merubahnya tepat di tengah dengan align panel satu frame demi satu frame. >. Tambahkan sebuah layer baru diatas la er 2. &emudian import file 2suara,ledakan4wav3 untuk menghasilkan sebuah efek suara ledakan. .. &lik !rame 2M la er 5, kemudian masukan keyframe dengan menekan tombol F7. Buka panel action, dan ketikan action stop+/< susunan layer mo0ieclip 2ledakan3 8. &eluar dari mode edit symbol dengan menekan %trl@D. '(. impan file dengan nama 2alien attack4!la3.

Mem$uat Movieclip Senjata Pemain "alam storyboard dijelaskan bahawa pesawat pemain memiliki senjata yang dapat meningkat kemampuannya ketika mendapatkan sebuah bonus. Gal tersebut berarti kita harus membuat beberapa jenis senjata dengan kemampuan yang berbeda. ebagai contoh dalam game ini terdapat - tipe senjata, perhatikan gambar berikut 1

?enis senjata 6ntuk membuat empat jenis senjata tersebut, perhatikan langkah-langkah berikut1 '. Ianjutkan file 2alien attack4!la3. ). Buatlah sebuah symbol baru dengan menekan menu insertCnew s mbol. &etikan nama 2laser3 dan pilih movieclip pada beha0iour. *. !ada mode edit symbol buatlah gambar senjata jenis pertama, seperti yang tampak pada gambar berikut 1

gambar pada mo0ieclip 2laser3 -. eleksi gambar senjata tersebut, kemudian con0ert kembali menjadi mo0ieclip dengan nama 2senEata3. 5. &lik mo0ieclip 2senEata3, kemudian buka panel properties dan ketikan 2Eenis3 pada instance name. 7. "ouble klik mo0ieclip 2senEata3 untuk mengeditnya. >. &lik !rame 5 la er 2, kemudian masukan blank keyframe. Buatlah gambar jenis senjata yang kedua, seperti yang tampak pada gambar. .. 8. elanjutnya buatlah gambar jenis senjata yang berbeda pada !rame 6 dan !rame <.

bentuk senjata pada mo0ieclip senjata '(. &eluar dari mode edit symbol , klik !rame 2 la er senEata, drag mo0ieclip 2laser3 dari library ke stage dan simpan file. Mem$uat Movieclip Perisai "alam storyboard dijelaskan bahwa pesawat memiliki perisai ketika mendapatkan armor bonus. "an ketika pesawat tertembak atau bertabrakan dengan musuh, maka perisai akan melindungi pesawat pemain. "engan imajnasi kita 0isualisasikan bentuk perisai tersebut seperti pada gambar berikut 1

gambar perisai ketika aktif untuk membuat perisai tersebut, perhatikan langkah-langkah di bawah ini 1 '. Ianjutkan fil Ianjutkan file 2alien attack4!la3. ). Buatlah sebuah symbol baru dengan menekan menu insertCnew s mbol. &etikan nama 2perisai3 dan pilih movieclip pada beha0iour. *. Tambahkan ) buah layer baru di atas layer ' dan ubah namanya menjadi la er suara dan la er action. -. &lik !rame 5 la er 2, kemudian masukkan keyframe. 5. !ada !rame 5 la er 2, buatlah sebuah lingkaran dengan menggunakan o0al tool dengan ukuran sekitar ')(,')( pi,el. Gapuslah stoke +garis tepi/-nya. 7. Buka panel color mi,er, pilih radial pada option fillstyle. &lik gradien pointer sebelah kiri dan ubah menjadi warna hijau +T 1 (, M 1 )55, B 1 (/ dan ubah alpha 0alue menjadi 7(L. &lik gradien pointer sebelah kanan dan ubah menjadi warna hijau +T 1 (, M 1 )55, B 1 (/ dan ubah alpha 0alue menjadi '(L.&emudian klik

tombol !aint Bucket Tool dan klik pada pojok kiri atas lingkaran. +matikan atau aktifkan lock fill jika tidak terbentuk radial fill yang diinginkan dan klik lagi paint bucket tool dan klik pada pojok kiri atas lingkaran/

membuat radial fill dalam flash >. eleksi lingkaran dan con0ert kembali menjadi mo0ieclip dengan nama 2plasma3. .. &lik !rame 5< la er 2 kemudian masukkan keyframe. 8. &lik !rame 23, kemudian buka panel properties. !ilih motion pada option tween dan pilih $L pada option rotate. Maka akan terbentuk animasi perisai yang berputar.

membuat animasi motion pada mo0ieclip perisai '(. &lik !rame 5 la er suara, kemudian impor file 2suaraPerisai4wav3 dari %" tutorial ke library. &emudian drag sound tersebut ke stage. ''. &lik !rame 5< la er action, masukkan keyframe. &emudian buka panel action dan ketikan script1 gotoAnd top+'/< susunan layer mo0ieclip perisai '). &eluar dari mode edit symbol dan simpan file. Mem$uat Movieclip Pesa2at Pemain &arakter utama dari game yang kita buat adalah sebuah pesawat luar angkasa yang akan meledak jika tertembak atau bertumbukan dengan musuh, atau dapat mengaktifkan perisai jika pesawat tersebut memiliki armor. "ari deskripsi tersebut

kita bisa membuat sebuah mo0ieclip pesawat dengan langkah-langkah sebagai berikut1 '. Ianjutkan file 2alien attack4!la3. ). &lik !rame 2 la er karakter. &emudian buatlah sebuah gambar pesawat dengan menggunakan drawing tool seperti pada gambar atau sesuai dengan imajinasi anda +atau importlah sebuah file png yang telah anda buat sebelumnya/. gambar karakter pesawat

*.

eleksi gambar pesawat tersebut, kemudian con0ert menjadi movieclip dengan nama pesawat.

-. "ouble klik pesawat untuk mengeditnya. !ada mode edit symbol mo0ieclip pesawat, tambahkan ) layer di atas layer ' dan ubah nama masing-masing layer menjadi la er perisai dan la er action. 5. &lik !rame 2 la er perisai, kemudian drag mo0ieclip 2perisai3 dari library ke stage. Ietakkan tepat di tengah stage +perhatikan bahawa mo0ieclip perisai berupa sebuah titik saja, hal in dikarenakan pada frame ' mo0ieclip perisai tidak terdapat obyek apapun ; blank keyframe/. Tips dari saya 1 untuk mempermudah mengatur posisi dan ukuran perisai, klik mo0ieclip perisai dan buka panel properties. 6bah symbol beha0iour menjadi graphic, pilih single !rame pada option !or graphic dan ketikan 5 pada !irst !rame. Atur posisi dan ukuran perisai, setelah dirasa cukup kembalikan beha0iournya menjadi mo0ieclip.

mengatur posisi dan ukuran perisai 7. &lik mo0ieclip perisai, buka panel properties dan ketikan 2perisai3 pada instance name.

>. &lik !rame 5 la er 2, kemudian masukan blank keyframe dengan menekan tombol F>. .. "rag mo0ieclip 2ledakan3 dari library ke stage. Atur posisi dan ukurannya terhadap pesawat. 8. &lik mo0ieclip 2ledakan3, buka panel properties dan ketikan 2ledakan3 pada instance name. '(. &lik !rame 2 la er action, kemudian buka panel action dan ketikan script 1 stop+/< ''. &eluar dari mode edit symbol, klik pesawat buka panel properties dan ketikan 2pesawat3 pada instance name kemudian simpan file. Mem$uat Movieclip Senjata Pesa2at Musuh 6ntuk meningkatkan kesulitan permainan, pesawat musuh juga dapat menembakkan senjata. 6ntuk membuatnya, perhatikan langkah berikut 1 '. &lik !rame 2 la er senEata, kemudian buatlah sebuah gambar senjata musuh menggunakan drawing tool +pada contoh ini senjata musuh menggunakan bentuk elips berwarna kuning +YFFFF((/ /

gambar senjata musuh ). *. eleksi gambar tersebut, kemudian con0ert menjadi movieclip dengan nama senEataMusuh. impan file.

Mem$uat Movieclip Pesa2at Musuh ebelum membuat pesawat musuh kita tentukan terlebih dahulu jenis musuh dan kemampuannya. "alam game ini dicontohkan terdapat ) jenis musuh, akan tetapi anda bisa menambahkannya menjadi beberapa jenis lagi. edangkan kemampuan musuh adalah dapat menembak pemain pada saat-saat tertentu. emakin tinggi le0el, semakin agresif musuh dalam bergerak dan menembak. 6ntuk membuat mo0ieclip pesawat musuh, perhatikan cara berikut 1

'. Ianjutkan file 2alien attack4!la3. ). &lik !rame 2 la er karakter. &emudian buatlah sebuah gambar pesawat musuh dengan menggunakan drawing tool seperti pada gambar atau sesuai dengan imajinasi anda +atau importlah sebuah file png yang telah anda buat sebelumnya/.

gambar musuh *. eleksi gambar pesawat tersebut, kemudian con0ert menjadi movieclip dengan nama pesawatMusuh. -. "ouble klik pesawatMusuh untuk mengeditnya. !ada mode edit symbol mo0ieclip pesawatMusuh, tambahkan layer baru di atas layer ' dan ubah la er action. 5. eleksi gambar musuh tersebut, kemudian con0ert kembali menjadi mo0ieclip dengan nama 2Eenis musuh3. 7. "ouble klik mo0ieclip Eenis musuh untuk mengeditnya. &lik !rame 5, kemudian masukan blank &eyframe. >. !ada !rame 5 tersebut buatlah gambar musuh yang kedua seperti pada gambar atau sesuai dengan imajinasi anda atau mengimpor gambar yang sudah jadi.

musuh jenis kedua .. ?ika anda ingin jenis musuh yang lain +lebih dari )/, buatah gambar pesawat musuh selanjutnya pada frame * dan seterusnya. 8. &eluar dari mode edit symbol Eenis musuh dan kembali ke mode edit symbol mo0ieclip pesawatMusuh.

'(. &lik mo0ieclip Eenis musuh, kemudian buka panel properties dan ketikan 2Eenis3 pada instance name. ''. &lik !rame 5 la er 2, kemudian masukan blank keyframe dengan menekan tombol F>. '). "rag mo0ieclip 2ledakan3 dari library ke stage. Atur posisi dan ukurannya terhadap pesawat musuh. '*. &lik mo0ieclip 2ledakan3, buka panel properties dan ketikan 2ledakan3 pada instance name. '-. &lik !rame 2 la er action, buka panel action dan ketikan script1 stop+/< '5. &eluar dari mode edit symbol dan simpan file. Mem$uat Movieclip Bonus "alam storyboard dijelaskan bahwa terdapat bonus yang keluar secara acak. Bonus dibagi menjadi - yaitu bonus armor, bonus senjata, bonus kecepatan, dan bonus life point. !erhatikan proses pembuatan mo0ieclip bonus berikut1 '. &lik !rame 2 la er bonus, kemudian buatlah sebuah gambar seperti yang tampak pada gambar berikut atau sesuai dengan keinginan anda

gambar bonus armor ). eleksi gambar tersebut, kemudian con0ert menjadi mo0ieclip dengan nama 2bonus armor3. *. "ouble klik mo0iclip 2bonus armor3, kemudian pada mode edit symbol tambahkan sebuah layer diatas layer '. -. &lik !rame 5 la er 2, masukan blank keyframe. $mport file 2Ponus4wav3 dari %" tutorial ke library. &emudian drag suaraPonus dari library ke stage. 5. &lik !rame 5 la er 2, kemudian buka panel properties. !ilihlah event pada option s nc. properties suara bonus

7. &lik !rame 2 la er 5, kemudian buka panel action dan ketikan script 1 stop+/< >. %opy mo0ieclip 2bonus armor3, kemudian paste-kan disampingnya. .. &lik kanan mo0ieclip 2bonus armor3 hasil copy-paste pada langkah no *, kemudian pilih duplicate s mbol.

menduplikasi mo0ieclip 8. &etikan 2bonus senEata3 pada symbol name, maka akan terbentuk mo0ieclip baru dengan nama 2bonus senEata3.

dialog symbol name saat menduplikasi symbol '(. "ouble klik mo0ieclip 2bonus senEata3. !ada mode edit symbol, ubah huruf 293 pada gambar menjadi huruf 2Q3 +untuk Mun/. &emudian keluar dari mode edit symbol. ''. Iakukan langkah no 6 sampai no # untuk membuat mo0ieclip 2bonus kecepatan3 +S/, dan 2bonus li!epoint3 +?/.

mo0ieclip bonus '). impan file.

Mem$uat Back9round !ada susunan layer terdapat * buah layer untuk background yaitu layer bg* untuk bakground paling bawah, layer bg) untuk background bintang yang scrolling dengan kecepatan lambat dan layer bg' untuk background bintang yang scroolling dengan kecepatan yang lebih cepat. 6ntuk membuat background perhatikan langkah berikut1 '. &lik !rame 2 la er bg6, kemudian buatlah kotak dengan warna biru gelap +Y("-A>>/ dengan ukuran yang sama dengan ukuran stage, yaitu -(( , 7(( pi,el. ). &lik ikon lock la er bg6, kemudian klik !rame 2 la er bg5. dengan menggunakan brush tool buatlah gambar titik-titik berwarna putih dengan ukuran yang berbeda dan dengan posisi yang acak memenuhi stage.

gambar pada frame ' layer bg) *. eleksi seluruh gambar pada !rame 2 la er bg5, kemudian con0ert menjadi movieclip 2background53. -. "ouble klik mo0ieclip 2background53, kemudian seleksi seluruh titik yang ada. %opy titik-titik tersebut kemudian paste-kan tepat di atasnya. !erhatikan gambar berikut1

pengaturan mo0ieclip background) 5. &eluar dari mode edit symbol. 7. &lik frame ' layer bg'. "engan cara yang sama +langkah no ) sampai -/, buatlah mo0ieclip 2background23 dengan ukuran titik yang lebih besar dan posisi yang berbeda. >. impan file.

Menata '$#ek pada Stage !ada bab memulai pembuatan game, terdapat beberapa tahapan yang akan mempermudah kita dalam membuat game. - tahapan pertama sudah kita lakukan yaitu enyusun storyboard, mem0isualisasikan storyboad, menggambar karakter dan menggambar background. Tahapan selanjutnya adalah tahapan programming. Tahapan ini dibagi menjadi beberapa tahap lagi, dan tahapan yang pertama adalah menata obyek pada stage. ?ika anda melakukan proses pembuatan karakter dan pembuatan background dengan benar, maka tugas anda pada tahapan ini relatif mudah yaitu mengatur posisi obyek seperti yang tampak pada gambar berikut1

posisi obyek terhadap stage Menam$ahkan Instance /ame Tahapan selanjutnya adalah menambahkan instance name pada obyek. !erhatikan nama mo0ieclip dan nama instance yang ditambahkan berikut ini1 mo0ieclip pesawat +pesawat pemain/ pesawatMusuh laser +senjata pemain/ senjataMusuh Menam$ahkan Action Tahapan yang paling rumit dalam game adalah menyusun action. Apabila kita masih dalam tahap awal belajar action script, maka cara yang tepat untuk melalui tahapan ini adalah dengan menuliskan sedikit script terlebih dahulu, kemudian menguji kinerja action. Bila tidak terjadi kesalahan, maka action ditambahkan lagi dan diuji kembali. !roses tersebut dilakukan secara terus menerus sampai didapatkan detail game. Menggerakkan Pesa2at Pemain dengan Ke#Board Iangkah pertama untuk memulai proses penambahan action pada suatu game yang paling mudah adalah memulai dari karakter utama. !ada game yang akan kita buat, karakter utama adalah pesawat yang dapat digerakkan ke empat arah menggunakan &eyboard. Maka proses penambahan actionnya adalah sebagai berikut 1 '. &lik mo0ieclip pesawat, kemudian buka panel action dan ketikan script berikut1 instance name pesawat musuh laser laserMusuh

on%lipD0ent +load/ : Mouse.hide+/< ,t F E,< yt F Ey< = on%lipD0ent +enterFrame/ : ;;keyboard ditekan if +&ey.is"own+&ey.IDFT/ and ,t4(/ : ,t -F *(< = if +&ey.is"own+&ey.T$MGT/ and ,tN-((/ : ,t @F *(< = if +&ey.is"own+&ey.6!/ and yt4(/ : yt -F *(< = if +&ey.is"own+&ey."CA#/ and ytN7((/ : yt @F *(< = ;; tracking E, F E,@+,t-E,/;Eroot.kecepatan!esawat< Ey F Ey@+yt-Ey/;Eroot.kecepatan!esawat< = ). &lik !rame 2 la er action, kemudian buka panel action dan ketikan script berikut1 *. kecepatan!esawat F *(< impan file dan jalankan mo0ie. %obalah untuk menekan tombol panah pada keyboard. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Menem$akkan Senjata ketika *om$ol Spasi Ditekan Iangkah selanjutnya adalah menambahkan script agar pesawat dapat menembakkan laser. elain itu untuk menambah tingkat kesulitan, terdapat sebuah 0ariabel energi yang mana energi tersebut akan berkurang ketika pemain menembakkan senjatanya. 6ntuk membuatnya kita harus menambahkan script pada ) obyek yaitu pada mo0ieclip laser dan mo0ieclip pesawat. !erhatikan langkah berikut 1

'. &lik mo0ieclip pesawat, kemudian buka panel action dan tambahkan script menjadi1 on%lipD0ent +load/ : Mouse.hide+/< ,t F E,< yt F Ey< jumlahsenjata F (< energi F '((< kedalaman enjata F '((< = on%lipD0ent +enterFrame/ : ;; menambah energi untuk senjata energi@@< if +energi4F'((/ : energi F '((< = ;;keyboard ditekan if +&ey.is"own+&ey.IDFT/ and ,t4(/ : ,t -F *(< = if +&ey.is"own+&ey.T$MGT/ and ,tN-((/ : ,t @F *(< = if +&ey.is"own+&ey.6!/ and yt4(/ : yt -F *(< = if +&ey.is"own+&ey."CA#/ and ytN7((/ : yt @F *(< = if +&ey.is"own+&ey. !A%D// : ;;menembak if +energi4F5@)OEroot.jenis enjata and Ecurrentframe FF '/ : energi -F 5@)OEroot.jenis enjata< jumlahsenjata@@< duplicateMo0ie%lip+Eroot.laser, PlaserP@jumlahsenjata,

kedalaman enjata@@/< if +kedalaman enjata4)((/ : kedalaman enjata F '((< jumlahsenjata F (< = = = ;; tracking E, F E,@+,t-E,/;Eroot.kecepatan!esawat< Ey F Ey@+yt-Ey/;Eroot.kecepatan!esawat< = ). &lik mo0ieclip laser, kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : E, F Eroot.pesawat.E,< Ey F Eroot.pesawat.Ey-)5< jenis.gotoAnd top+Eroot.jenis enjata/< = on%lipD0ent +enterFrame/ : if +EnameN4PlaserP/ : Ey -F Eroot.kecepatan enjata< if +EyN-'(/ : remo0eMo0ie%lip+this/< = = else : E, F -'((< = = *. &lik !rame 2 la er action, kemudian buka panel action dan tambahkan script script menjadi1 kecepatan!esawat F *(< jenis enjata F '< kecepatan enjata F '(< -. impan file dan jalankan mo0ie. %obalah untuk menekan tombol spasi pada keyboard. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya.

!enjelasan action 1 '. !ada mo0ieclip pesawat ditambahkan 0ariabel EumlahSenEata yang digunakan untuk menentukan nama dari masing-masing laser yang diduplikasi, 0ariabel energi yang digunakan untuk membatasi jumlah laser yang keluar secara bersamaan, dan 0ariabel kedalamanSenEata yang menentukan 0depth atau kedalaman dari masing-masing duplikasi mo0ieclip laser. +ingat bahwa ' kedalaman hanya boleh ditempati oleh ' obyek/. ). Menembakkan laser hanya jika pemain menekan tombol spasi +i!(De 4isDown(De 4SP9$&))/ dan ketika pesawat belum meledak atau saat berada pada frame ' dan energi yang ada cukup untuk menembak +i! (energiC1;'5=0root4EenisSenEata and 0current!rame 11 2/. Bila ketiga kondisi tersebut dipenuhi maka mo0ieclip laser diduplikasi. *. !ada mo0iclip laser, ketika diduplikasi akibat action duplicateMovieclip(444), maka posisi pertama muncul dari mo0ieclip laser adalah tepat di atas mo0ieclip pesawat, dan jenis senjatanya diatur sesuai dengan 0ariabel jenis enjata. +lihat blok mo0ie e0ent load/. -. !erintah i! (0nameBCAlaserA) berarti mo0ieclip laser yang sesungguhnya +bukan hasil duplikasi/ tidak akan ditampilkan pada stage. 5. elanjutnya mo0ieclip laser digerakkan ke atas dan dihapus jika keluar dari stage.

Menggerakkan Musuh Iangkah berikutnya adalah menggerakkan musuh. edangkan untuk memperbanyak musuh, cara yang paling efektif adalah dengan menggunakan action dupilcateMo0ieclip. !erhatikan proses berikut1 '. &lik mo0ieclip pesawatMusuh, kemudian buka panel action ketikan script1 on%lipD0ent +load/ : jenis.gotoAnd top+'@random+Eroot.jenisMusuh//< kecepatan F '(@Eroot.le0el< Ey F -5(< E, F '((@random+)((/< = on%lipD0ent +enterFrame/ : if +EnameN4PmusuhP/ :

Ey @F kecepatan< if +Ey475(/ : remo0eMo0ie%lip+this/< = ;;gerakan kekanan dan kekiri acak if +random+-5-+Eroot.le0elO)// FF * or +random+'(/ FF ) and Eroot.pesawat.E,4this.E,// : arah F '< = if +random+-5-+Eroot.le0elO)// FF - or +random+'(/ FF 5 and Eroot.pesawat.E,Nthis.E,// : arah F )< = if +random+-(/ FF -/ : arah F (< = ;;gerakan acak if +arah FF '/ : E, @F 5< = else if +arah FF )/ : E, -F 5< = = ). &lik !rame 2 la er action, kemudian buka panel action dan tambahkan script script menjadi1 kecepatan!esawat F *(< jenis enjata F '< kecepatan enjata F '(< le0el F '< jenisMusuh F )< musuhMati F (< jumlahMusuh&eluar F (< kedalamanMusuh F 5((< Eroot.onDnterFrame F function+/ :

;; menampilkan musuh secara acak if +musuhMatiN'(@le0elO'5 and random+5(-Eroot.le0elO)/ FF 5/ : jumlahMusuh&eluar@@< if +jumlahMusuh&eluar4F'(/ : jumlahMusuh&eluar F (< = duplicateMo0ie%lip+Eroot.musuh, PmusuhP@jumlahMusuh&eluar, kedalamanMusuh@@/< = ;; naik le0el if +musuhMati4F'(@le0elO'( and le0elN)(/ : musuhMati F (< jumlahMusuh&eluar F (< kedalamanMusuh F 5((< le0el@@< = =< *. impan file dan jalankan mo0ie. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Musuh Menem$akkan Senjata 6ntuk membuat musuh dapat menembakkan senjata, kita butuh melakukan beberapa penambahan script pada mo0ieclip senjataMusuh, pesawatMusuh dan pada frame ' layer action. !erubahan tersebut adalah sebagai berikut1 '. &lik mo0ieclip senEataMusuh, kemudian buka panel action dan ketikan script1 on%lipD0ent +enterFrame/ : if +EnameN4PlaserMusuhP/ : Ey @F '5< if +Ey47'(/ : remo0eMo0ie%lip+this/< = = =

).

elanjutnya klik mo0ieclip pesawatMusuh, kemudian buka panel action dan tambahkan script script menjadi1 ..... ;;gerakan acak if +arah FF '/ : E, @F 5< = else if +arah FF )/ : E, -F 5< = ;;menembak if +Ecurrentframe FF ' and random+*(-Eroot.le0el/ FF -/ : Eroot.jumlah enjataMusuh@@< if +Eroot.jumlah enjataMusuh4'((/ : Eroot.jumlah enjataMusuh F (< = duplicateMo0ie%lip+Eroot.laserMusuh, PlaserMusuhP@Eroot.jumlah enjataMusuh, Eroot.kedalaman enjataMusuh@@/< ErootJPlaserMusuhP@Eroot.jumlah enjataMusuhK.E, F E,< ErootJPlaserMusuhP@Eroot.jumlah enjataMusuhK.Ey F Ey@)(< = = elanjutnya klik !rame 2 la er action, kemudian buka panel action dan tambahkan script script menjadi1 .... jumlahMusuh&eluar F (< kedalamanMusuh F 5((< jumlah enjataMusuh F (< kedalaman enjataMusuh F )(((< Eroot.onDnterFrame F function+/ : ;; menampilkan musuh secara acak if +musuhMatiN'(@le0elO'5 and random+5(-Eroot.le0elO)/ FF 5/ : ....... impan file dan jalankan mo0ie. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya

*.

-.

Mendeteksi *um$ukan ebelum menambahkan action untuk tumbukan, maka kita harus mencari seluruh peluang tumbukan yang terjadi dalam game. !eluang-peluang tumbukan tersebut antara lain1 '. Tumbukan antara pesawat dengan pesawatMusuh. ). Tumbukan antara laser dengan pesawatMusuh. *. Tumbukan antara laserMusuh dengan pesawat. Mendeteksi *um$ukan antara pesa2at dengan pesa2atMusuh &etika pesawat menabrak pesawatMusuh, maka peluang yang terjadi adalah pesawatMusuh meledak, dan pesawat meledak apabila tidak memiliki armor atau pesawat mengaktifkan armor dan tidak meledak. 6ntuk membuatnya perhatikan langkah berikut1 '. &lik mo0ieclip pesawat, kemudian buka panel action dan tambahkan script menjadi1 .... ;; tracking E, F E,@+,t-E,/;Eroot.kecepatan!esawat< Ey F Ey@+yt-Ey/;Eroot.kecepatan!esawat< ;; setelah meledak if +ledakan.Ecurrentframe FF '. and mati FF (/ : ;;masih memiliki lifepoint if +Eroot.nyawa4(/ : Eroot.nyawa--< Eroot.jenis enjata F '< Eroot.armor F (< energi F '((< jumlahsenjata F (< gotoAnd top+'/< = else : ;;gameo0er = =

).

= elanjutnya klik mo0ieclip pesawatMusuh, kemudian buka panel action dan tambahkan script script menjadi1 ....... ;;menembak if +Ecurrentframe FF ' and random+*(-Eroot.le0el/ FF -/ : Eroot.jumlah enjataMusuh@@< if +Eroot.jumlah enjataMusuh4'((/ : Eroot.jumlah enjataMusuh F (< = Eroot.suaraIaserMusuh.start+(, '/< duplicateMo0ie%lip+Eroot.laserMusuh, PlaserMusuhP@Eroot.jumlah enjataMusuh, Eroot.kedalaman enjataMusuh@@/< ErootJPlaserMusuhP@Eroot.jumlah enjataMusuhK.E, F E,< ErootJPlaserMusuhP@Eroot.jumlah enjataMusuhK.Ey F Ey@)(< = ;;tumbukan dengan pesawat if +hitTest+Eroot.pesawat/ and Ecurrentframe FF ' and Eroot.pesawat.Ecurrentframe FF ' and Eroot.pesawat.perisai.Ecurrentframe FF '/ : if +Eroot.armor4(/ : ;; pesawat punya armor Eroot.armor--< Eroot.pesawat.perisai.gotoAnd!lay+)/< gotoAnd top+)/< = else : ;; pesawat meledak gotoAnd top+)/< Eroot.pesawat.gotoAnd top+)/< = = ;; setelah meledak

if +ledakan.Ecurrentframe FF './ : gotoAnd top+'/< remo0eMo0ie%lip+this/< Eroot.musuhMati@@< Eroot.score @F '((< = = *. = elanjutnya klik !rame 2 la er action, kemudian buka panel action dan tambahkan script script menjadi1 .... jumlah enjataMusuh F (< kedalaman enjataMusuh F )(((< score F (< armor F )< nyawa F )< Eroot.onDnterFrame F function+/ : ;; menampilkan musuh secara acak if +musuhMatiN'(@le0elO'5 and random+5(-Eroot.le0elO)/ FF 5/ : -. ....... impan file dan jalankan mo0ie. Tabrakkan pesawat dengan musuh dan lihatlah apakah proses tumbukan benar. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya Mendeteksi *um$ukan antara laser dengan pesa2atMusuh Tumbukan selanjutnya yang harus dideteksi adalah tumbukan antara laser dan pesawatMusuh. 6ntuk membuatnya perhatikan langkah-langkah berikut1 '. &lik mo0ieclip laser, kemudian buka panel action dan tambahkan script menjadi1 .... if +EyN-'(/ : remo0eMo0ie%lip+this/< = ;;tumbukan dengan pesawat Musuh for +iF(< this.iN'(< i@@/ : if ++hitTest+ErootJPmusuhPK/ or hitTest+ErootJPmusuhP@iK//

and ErootJPmusuhP@iK.Ecurrentframe FF '/ : ErootJPmusuhP@iK.gotoAnd top+)/< remo0eMo0ie%lip+this/< = = = else : E, F -'((< = ). = impan file dan jalankan mo0ie. %obalah menembak musuh. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Mendeteksi *um$ukan antara laserMusuh dengan pesa2at Tumbukan yang ketiga adalah tumbukan antara laserMusuh dan pesawat. 6ntuk membuatnya perhatikan langkah-langkah berikut1 '. &lik mo0ieclip senEataMusuh +mo0ieclip dengan instance name laserMusuh/, kemudian buka panel action dan tambahkan script menjadi1 on%lipD0ent +enterFrame/ : if +EnameN4PlaserMusuhP/ : Ey @F '5< if +Ey47'(/ : remo0eMo0ie%lip+this/< = ;;tumbukan dengan pesawat if +hitTest+Eroot.pesawat/ and Eroot.pesawat.Ecurrentframe FF ' and Eroot.pesawat.perisai.Ecurrentframe FF '/ : if +Eroot.armor4(/ : ;; pesawat punya armor Eroot.armor--< Eroot.pesawat.perisai.gotoAnd!lay+)/< remo0eMo0ie%lip+this/< = else : ;; pesawat meledak remo0eMo0ie%lip+this/<

Eroot.pesawat.gotoAnd top+)/< = = = ). = impan file dan jalankan mo0ie. %obalah menahan tembakan musuh. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Mengeluarkan Bonus etelah proses perhitungan tumbukan di atas, game pada dasarnya sudah dapat dimainkan. Akan tetapi terdapat beberapa elemen lagi yang perlu ditambahkan, salah satunya adalah bonus. 6ntuk menambahkan bonus perhatikan proses berikut1 '. &lik mo0ieclip bonus armor, kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : keluar F (< ya F Ey< E0isible F '< kecepatan F '(@random+'(/< = on%lipD0ent +enterFrame/ : ;; merandom waktu keluar if +keluar FF ( and random+5((/ FF ->/ : keluar F '< E0isible F '< E, F 5(@random+)5(/< = if +keluar FF '/ : Ey @F '(< if +Ey47)(/ : Ey F ya< E0isible F (< keluar F (< =

;;tabrakan dengan pemain if +hitTest+Eroot.pesawat/ and Eroot.pesawat.Ecurrentframe FF '/ : play+/< Ey F ya< E0isible F (< keluar F (< ;;dapat bonus Eroot.armor@@< = = =

).

eleksi seluruh action tersebut, kemudian klik kanan dan pilih copy.

mengopy action *. &lik mo0ieclip bonus li!e, selanjutnya buka panel action dan pastekan action yang sudah anda copy pada langkah no ). -. 6bah baris ;;dapat bonus Eroot.armor@@< menjadi ;;dapat bonus Eroot.nyawa@@< 5. &lik mo0ieclip bonus speed, selanjutnya buka panel action dan pastekan action yang sudah anda copy pada langkah no ). 7. 6bah baris ;;dapat bonus Eroot.armor@@< menjadi

;;dapat bonus if +Eroot.kecepatan!esawat4'(/ : Eroot.kecepatan!esawat -F 5< = >. &lik mo0ieclip bonus gun, selanjutnya buka panel action dan pastekan action yang sudah anda copy pada langkah no ). .. 6bah baris ;;dapat bonus Eroot.armor@@< menjadi ;;dapat bonus if +Eroot.jenis enjataN-/ : Eroot.jenis enjata@@< = 8. Eroot.pesawat.energi F '((< impan file dan jalankan mo0ie. Tunggulah bonus muncul dan tabrakkan pesawat ke bonus, untuk saat ini efek yang terlihat hanya ketika anda mendapatkan bonus gun, sedangkan bonus yang lain tidak terlihat efeknya. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Menggerakkan Background Dlemen lain yang perlu ditambahkan adalah gerakan background. 6ntuk membuatnya perhatikan proses berikut 1 '. &lik mo0ieclip 2background'3, kemudian buka panel action dan ketikan script berikut1 on%lipD0ent +load/ : ya F Ey< = on%lipD0ent +enterFrame/ : Ey @F '(< if +Ey47((/ : Ey F ya< = ). = eleksi seluruh action, klik kanan dan pilih copy.

*. &lik mo0ieclip 2background)3, kemudian pastekan action yang sudah anda copy pada langkah no ). -. 6bah baris Ey @F '(< menjadi Ey @F 5< '(. impan file dan jalankan mo0ie. !erhatikan pergerakan background. Apabila tidak terjadi kesalahan lanjutkan dengan proses selanjutnya. Menam$ahkan Sound !ada bab ound dijelaskan bahwa elemen sound memegang peranan penting dalam suatu game, karena dapat meningkatkan kerealitasan sebuah game. etelah kita menyelesaikan tahap-demi tahap di atas, pada dasarnya kita sudah membuat .(L dari total game. Akan tetapi suara yang belum ada adalah suara senjata pemain dan senjata lawan serta suara background +BMM/. 6ntuk menambahkan suara-suara tersebut, siapkan terlebih dahulu file suara yang dibutuhkan. "alam contoh ini file suara yang digunakan adalah file 2suaraIaser.wa03, 2suaraIaser).wa03 dan 2bgm).mp*3. !roses penambahan suara-suara adalah sebagai berikut1 '. %opy file 2bgm54mp63 dari %" tutorial ke folder tempat anda bekerja. ). $mportlah file 2suara?aser4wav3 dan 2suara?aser54wav3 dari %" tutorial ke library. *. &lik kanan 2suara?aser4wav3, kemudian tambahkan linkage dengan identifier 2suaraIaser3. -. &lik kanan 2suara?aser54wav3, kemudian tambahkan linkage dengan identifier 2suara?aser53. 5. &lik !rame 2 la er action, kemudian buka panel action dan tambahkan script menjadi1 .... score F (< armor F )< nyawa F )< ;;suara

bgm F new ound+/< bgm.load ound+Pbgm).mp*P, (/< bgm.setHolume+5(/< bgm.start+(, 88/< suaraIaser F new ound+/< suaraIaser.attach ound+PsuaraIaser)P/< suaraIaserMusuh F new ound+/< suaraIaserMusuh.attach ound+PsuaraIaserP/< Eroot.onDnterFrame F function+/ : ;; menampilkan musuh secara acak if +musuhMatiN'(@le0elO'5 and random+5(-Eroot.le0elO)/ FF 5/ : 7. ........... elanjutnya klik mo0ieclip pesawat, buka panel action dan tambahkan script menjadi1 .......... if +&ey.is"own+&ey. !A%D// : ;;menembak if +energi4F5@)OEroot.jenis enjata and Ecurrentframe FF '/ : Eroot.suaraIaser.start+(, '/< energi -F 5@)OEroot.jenis enjata< jumlahsenjata@@< ........ >. &emudian klik mo0ieclip pesawatMusuh, buka panel action dan tambahkan script menjadi1 ......... ;;menembak if +Ecurrentframe FF ' and random+*(-Eroot.le0el/ FF -/ : Eroot.suaraIaserMusuh.start+(, '/< Eroot.jumlah enjataMusuh@@< if +Eroot.jumlah enjataMusuh4'((/ : .. ....... impan file dan jalankan mo0ie.

!roses pembuatan game Allien attack saat ini sudah memasuki tahapan sekitar 8( L sedangkan tahap '(L selanjutnya dibahas pada bab Proses "inishing.

Finishing 9ame etelah anda menyelesaikan action utama dari sebuah game, sebagai contoh anda telah melakukan proses pembuatan game Allien Attack pada bab sebelumnya, tahapan selanjutnya adalah menyelesaikan detail dari game tersebut atau saya istilahkan sebagai proses finishing game. Gal yang harus dilakukan dalam tahap finishing antara lain adalah 1 Menambahkan properti Menambahkan co0er Menambahkan menu utama Membuat preloader

Menam$ahkan Properti 9ame Bang dimaksud dengan properti game disini adalah keterangan mengenai 0ariabel0ariabel yang harus diketahui oleh pemain. ebagai contoh 0ariabel yang harus diketahui pada game allien attack adalah 0ariabel le0el, score, energi senjata, kondisi armor dan jumlah nyawa yang dimiliki.

contoh properti pada game Allien Attack 6ntuk menambahkan properti game, perhatikan contoh berikut1

'. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya. ). &lik !rame 2 la er properti. Buatlah sebuah kotak yang akan digunakan sebagai background te,t +lihat gambar diatas/ dengan warna lain yang lebih terang +contoh 1 Y.(8%%A/. *. &emudian buatlah - buah static text 2gun power3, 2x3, 2x3 dan 2level3. Atur posisinya seperti pada gambar berikut1

posisi static te,t -. elanjutnya buatlah * buah d namic text dengan 0ariabel 20root4n awa3, 20root4armor3 dan 20root4level3. !erhatikan peletakkannya 1

posisi dynamic te,t 5. &emudian drag mo0ieclip pesawat, dan buatlah gambar perisai+sebagai ikon dari armor/ perhatikan posisinya seperti pada gambar berikut1

peletakan ikon life dan ikon armor 7. 6ntuk membuat properti gun power, buatlah sebuah kotak berwarna merah sepeti pada gambar berikut 1

indikator gun power

>.

eleksi !ill kotak tersebut, kemudian con0ert menjadi movieclip dengan nama 2gun power3 . !erhatikan pada pilihan registration pilih tengah kiri.

posisi registrasi mo0ieclip 2gin power3 .. &lik mo0ieclip 2gun power3 tersebut, kemudian buka panel action dan ketikan script1 on%lipD0ent +enterFrame/ : E,scale F Eroot.pesawat.energi< = 8. 6ntuk membuat tampilan score buatlah sebuah static text 2score3 pada pojok kiri atas stage dan sebuah d namic text disampingnya dengan 0ariabel 20root4score3. !erhatikan gambar berikut 1

posisi score pada stage '(. ?alankan mo0ie, maka pesawat atau pesawat musuh akan tampak di atas ketika melewati tampilan properti. Gal ini dikarenakan kedalaman +Edepth/ dari obyek pada layer properti masih di bawah mo0ieclip yang lain, meskipun layer properti berada diatas layer obyek yang lain. ''. 6ntuk memperbaikinya, tutup mo0ie kemudian seleksi seluruh obyek pada frame ' layer properti, dan con0ert menjadi mo0ieclip dengan nama 2properti3. &embalikan posisi titik registasi ke tengah. '). &lik mo0ieclip properti, kemudian buka panel properti dan ketikan 2properti3 pada instance name. '*. &lik mo0ieclip properti, kemudian buka panel action dan ketikan script berikut 1

on%lipD0ent +load/ : this.swap"epths+8(((/< = '-. impan dan jalankan mo0ie.

Menam$ahkan (over %o0er dalam suatu game adalah tampilan yang muncul saat pertama kali file game dijalankan. !enambahan co0er yang menarik akan membuat sebuah game menjadi lebih mudah dikenal oleh orang lain +ingat bahwa banyak orang yang menilai bahwa sebuah kesan pertama adalah yang paling diingat/ untuk itu buatlah tampilan co0er yang sebaik-baiknya. !erhatikan contoh berikut 1

co0er depan dari game 2dig dog3 6ntuk membuat tampilan co0er yang menarik, anda dapat memanfaatkan software grafis seperti Adobe !hotoshop, Firework dan software sejenis lainnya atau anda dapat membuat secara langsung pada stage dengan menggunakan drawing tool. Bang perlu diperhatikan adalah buatlah ukuran gambar sesuai dengan ukuran stage. Pemilihan 9am$ar Ilustrasi untuk (over ebuah desain grafis dapat dibentuk oleh beberapa elemen yaitu warna, gambar ilustrasi, dan typografi. &husus untuk gambar ilustrasi yang akan kita pakai sebagai co0er, harus mewakili isi dari game. Akan lebih baik jika kita menampilkan ilustrasi dengan gaya yang melebih-lebihkan sehingga pemain akan tertarik untuk memainkannya.

6ntuk game yang kita buat +alien attack/, kita dapat menampilkan karakter pesawat sebagai co0er. elain itu penggayaan desain juga diperlukan dalam sebuah co0er game. !erhatikan dua contoh co0er untuk game alien attack berikut 1

dua desain dengan penggayaan yang berbeda !ada dua desain tersebut, kemungkinan sebagian besar orang akan menyukai desain sebelah kiri. Akan tetapi membuatnya memang lebih sulit dari pada desain yang kedua. Cleh karena itu pada perusahaan de0eloper game yang sesungguhnya bagian grafis game dibuat oleh tenaga profesional khusus untuk grafis. Meskipun demikian kita yang baru belajar menjadi seorang de0eloper game, harus mampu juga memilih atau membuat sebuah tampilan grafis yang bagus untuk game kita. Pemilihan *#pografi untuk (over !emilihan typografi atau pemakaian te,t juga menjadi sebuah point penting untuk sebuah desain co0er game. Menurut teori typografi, pemilihan bentuk huruf sangat mewakili isi dari suatu desain. ebagai contoh perhatikan beberapa alternatif huruf untuk game alien attack kita berikut ini1 contoh typografi untuk coer game alien attack

huruf terpilih dan modifikasinya etelah huruf dimodifikasi, proses selanjutnya adalah menambahkan typografi pada desain yang anda buat. !erhatikan gambar berikut1

peletakan typografi pada desain co0er etelah file gambar co0er game selesai dibuat, simpan file dalam format jpg dan import ke dalam game yang kita buat. !erhatikan contoh berikut1 '. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya. ). *. eleksi !rame 2 seluruh la er +dengan cara 1 klik frame ' layer action, kemudian tahan tombol hift dan klik frame ' layer bg*/. Meser ke !rame 23. !erhatikan gambar berikut1

menggeser frame dan hasil penggeseran frame -. &lik !rame 5 la er bg6, kemudian masukan keyframe. 5. $mport file 2cover !inal4Epg3 dari %" tutorial ke stage +import file gambar untuk co0er buatan anda sendiri/, kemudian atur posisinya tepat menutupi stage. 7. &lik !rame 5 la er bg5, kemudian masukan keyframe. >. Buatlah sebuah static text 2press an ke 3, dan letakkan di bagian bawah stage. &emudian con0ert teks tersebut menjadi movieclip dengan nama 2press3.

.. "ouble klik mo0ieclip 2press3. !ada mode edit symbol klik !rame 23 la er 2, kemudian masukan blank keyframe. 8. &lik !rame 53 la er 2, kemudian masukan frame +F5/, sehingga terbentuk animasi teks berkedip. &eluar dari mode edit symbol. '(. &lik mo0ieclip 2press3, buka panel action dan ketikan script1 on%lipD0ent +enterFrame/ : if +&ey.is"own+// : Eroot.gotoAnd top+Pmenu6tamaP/< = = 2menuUtama3 adalah frame label yang belum kita buat. ''. &lik !rame 5 la er action, kemudian tambahkan keyframe. Buka panel action dan ketikan script 1 stop+/< '). Buatlah sebuah layer baru diatas layer properties dan ubah namanya menjadi la er label. '*. &lik !rame ; la er label, kemudian masukan keyframe. Buka panel properties dan ketikan 2menuUtama3 pada frame label.

penambahan frame label '-. &lik !rame 23 la er label, kemudian masukan keyframe. Buka panel properties dan ketikan 2main3 pada frame label. '5. impan file.

Menam$ahkan Menu <tama Menu utama disini adalah sebuah tampilan yang memiliki beberapa tombol akses untuk memulai game sampai dengan keluar dari game. Biasanya pada menu utama terdapat beberapa tombol yaitu 1 2start game3, 2load game3, 2high score3, 2credit3 dan 2Xuit3.

!erhatikan contoh menambahkan menu utama pada game alien attack berikut 1 '. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya. ). &lik !rame ; la er bg5, kemudian masukan blank keyframe. *. Buatlah - buah static text yaitu 2start game3, 2high score3, 2game credit3 dan 2Wuit3 dengan posisi 0ertikal.

posisi static te,t -. eleksi masing-masing te,t dan con0ert menjadi button dengan nama 2startQame3, 2highScore3, 2game$redit3 dan 2Xuit3. 5. &lik tombol 2startQame3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : gotoAnd top+PmainP/< = 7. &lik tombol 2startQame3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : gotoAnd top+Phigh coreP/< = >. &lik tombol 2game$redit3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : gotoAnd top+PcreditP/< = .. &lik tombol 2Wuit3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : fscommand+2Xuit3/< =

8. simpan file. Menam$ahkan .alaman 9ame (redit Galaman game credit biasanya berisi tentang informasi pembuat game. ebagai contoh perhatikan proses penambahan halaman game credit berikut1 '. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya. ). &lik !rame # la er bg5, kemudian masukan blank keyframe. *. Buatlah static text yang berisi tentang diri anda, sebagai contoh 1 2Alien Attack created by Aandah Mames. +www.wandah.com/3. -. elanjutnya klik !rame # la er label dan masukan keyframe. Buka panel properties dan ketikan 2credit3 pada frame label. 5. &lik frame # la er bg2 dan masukan keyframe. Buatlah sebuah tombol 2back3. 7. &lik tombol 2back3, buka panel action dan ketikan script1 on +release/ : gotoAnd top+Pmenu6tamaP/< >. = impan file dan jalankan mo0ie.

halaman Mame %redit Menam$ahkan *e&t 9ame 'ver ?alankan game alien attack yang telah anda tambahkan properti, dan apabila lifepoint ( dan pesawat meledak, maka permainan akan terhenti. Gal tersebut dikarenakan kita belum membuat tampilan game o0er. 6ntuk membuatnya perhatikan langkah-langkah berikut1 '. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya.

). Buatlah sebuah movieclip baru dengan memilih menu insert4new symbol.. ketikan 2gameOver3 pada nama symbol. *. !ada mode edit symbol buatlah sebuah static text 2MAMD CHDT3. -. eleksi te,t tersebut, kemudian con0ert menjadi movieclip 2teks game over3. efek alpha (L. 7. &lik !rame 5; la er 2, kemudian masukan keyframe. >. &lik mo0ieclip 2teks game over3, buka panel properties. &emudian tambahkan efek alpha '((L. .. &lik kanan !rame 53 dan pilih %reate Motion Tween. 8. Tambahkan ) buah layer di atas layer ', dan ubah namanya menjadi la er tombol dan la er action. '(. &lik !rame 5; la er tombol, kemudan tambahkan keyframe. ''. &emudian buatlah ) buah tombol baru yaitu tombol 2pla again3 dan tombol 2submit score3. Ietakkan dibawah mo0ieclip 2teks game o0er3. 5. &lik mo0ieclip 2teks game over3, buka panel properties. &emudian tambahkan

obyek pada frame )5 '). &lik tombol 2submit score3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : remo0eMo0ie%lip+this/< ;;bersihkan layar stopAll ounds+/< for +iF(< iN)((< i@@/ : remo0eMo0ie%lip+ErootJPmusuhP@iK/< remo0eMo0ie%lip+ErootJPlaserMusuhP@iK/< remo0eMo0ie%lip+ErootJPlaserP@iK/< = remo0eMo0ie%lip+PpropertiP/< Eroot.gotoAnd top+PsubmitP/< =

'*. &lik tombol 2pla again3, kemudian buka panel action dan ketikan scrip berikut1 on +release/ : remo0eMo0ie%lip+this/< ;;bersihkan layar stopAll ounds+/< for +iF(< iN)((< i@@/ : remo0eMo0ie%lip+ErootJPmusuhP@iK/< remo0eMo0ie%lip+ErootJPlaserMusuhP@iK/< remo0eMo0ie%lip+ErootJPlaserP@iK/< = remo0eMo0ie%lip+PpropertiP/< Eroot.gotoAnd top+Pmenu6tamaP/< = '-. &lik !rame 5; la er action, kemudan tambahkan keyframe. '5. Buka panel action dan ketikan action1 stop+/< '7. Tekan %trl@D utuk keluar dari mode edit symbol. '>. Tambahkan linkage pada mo0ieclip 2gameOver3 dan ketikan 2gameover3 pada identifier. '.. &lik mo0ieclip pesawat, kemudian buka panel action dan tambahkan script menjadi1 .... ;;masih memiliki lifepoint if +Eroot.nyawa4(/ : Eroot.nyawa--< Eroot.jenis enjata F '< Eroot.armor F (< energi F '((< jumlahsenjata F (< gotoAnd top+'/< = else : ;;gameo0er mati F '<

Eroot.attachMo0ie+Pgameo0erP, Pgameo0erP, 5(((, :E,1)((, Ey1*((=/< = = = '8. impan dan jalankan mo0ie. %obalah untuk mengalah secepatnya untuk menguji te,t game o0er. Menam$ahkan *e&t /e&t "evel ?alankan game alien attack dan capailah score )((( secepatnya, maka pada properti le0el kita akan melihat perubahan dari le0el ' ke le0el ). &elemahan dari game ini adalah efek transisi le0el yang belum ada. 6ntuk itu perlu ditambahkan sebuah transisi, perhatikan proses berikut1 '. Ianjutkan file 2alien attack4!la3 yang telah anda buat sebelumnya. ). Buatlah sebuah movieclip baru dengan memilih menu insert4new symbol.. ketikan 2next?evel3 pada nama symbol. *. !ada mode edit symbol buatlah sebuah static text 2ne,t le0el3. -. eleksi te,t tersebut, kemudian con0ert menjadi movieclip 2teks next level3. efek alpha (L. 7. &lik !rame <3 la er 2, kemudian masukan keyframe. >. &lik mo0ieclip 2teks next level3, buka panel properties. &emudian tambahkan efek alpha '((L. .. &lik kanan !rame 53 dan pilih %reate Motion Tween. 8. Tambahkan layer baru di atas layer ', dan ubah namanya menjadi la er action. '(. &lik !rame <3 la er action, kemudan tambahkan keyframe. ''. Buka panel action dan ketikan action1 remo0eMo0ie%lip+this/< '). Tekan %trl@D utuk keluar dari mode edit symbol. '*. Tambahkan linkage pada mo0ieclip 2next?evel3 dan ketikan 2next?evel3 pada identifier. '-. &lik !rame 2 la er action, kemudian buka panel action dan tambahkan script menjadi1 .... ;; naik le0el 5. &lik mo0ieclip 2teks next level3, buka panel properties. &emudian tambahkan

if +musuhMati4F'(@le0elO'( and le0elN)(/ : musuhMati F (< jumlahMusuh&eluar F (< kedalamanMusuh F 5((< le0el@@< attachMo0ie+Pne,tIe0elP, Pne,tIe0elP, 5((', :E,1)((, Ey1*((=/< = =< '5. impan file dan jalankan mo0ie. %atatan1 !ada dasarnya game Alien Attack tersebut pada dasarnya sudah selesai dibuat, akan tetapi terdapat beberapa hal yang akan dijelaskan pada bab selanjutnya, yaitu penambahan preloader, dan sistem highscore.

Pu$lishing ebuah game flash dapat dibedakan menjadi dua berdasarkan cara memainkannya, yaitu secara online melalui sebuah situs internet dan secara o!!line ketika dimainkan pada !%. &edua cara tersebut memiliki sedikit perbedaan yaitu 1 !ada online publishing game ditampilkan pada sebuah internet browser, sedangkan pada offline publishing game dijalankan oleh Aindows !rojector. !ada online publishing, kita membutuhkan sebuah preloader sedangkan pada offline publishing game tidak membutuhkan preloader.

!ada online publishing kita dapat menyimpan file +seperti menyimpan score/ dengan bantuan !G! sedangkan pada offline publishing kita kesulitan dalam menyimpan file seperti score, data pemain dan sebagainya +meskipun demikian menyimpan file secara offline masih bisa dilakukan.

Preloader Mo0ie flash secara default pada sebuah internet browser dijalankan secara streaming. Artinya file yang telah didownload akan segera ditampilkan pada browser. &etika game kita tampilkan pada suatu situs internet, maka game tidak dapat dimainkan secara langsung akan tetapi game ditampilkan secara perlahan satu obyek demi satu obyek tergantung kecepatan modem. ehingga tampilan akan terlihat kacau +kurang rapi/. 6ntuk mengatasi hal tersebut, kita membutuhkan sebuah preloader yang akan menunggu hingga seluruh file game terdownload. "engan menambahkan preloader pemain diharuskan menunggu beberapa saat sampai game siap dimainkan. !erhatikan proses penambahan preloader pada game alien attack berikut. '. Ianjutkan file 2alien attack4!la3 yang telah kita buat pada bab-bab sebelumnya. ). &lik !rame 2 la er bg6. &emudian buatlah sebuah persegi panjang. +persegi panjang tersebut akan kita pake sebagai indikator proses loading/. *. eleksi kotak dan con0ert menjadi movieclip dengan nama 2loader bar3. !ilih tengah kiri pada registration. Buatlah static text 2loading1 L3 dan d namic text dengan 0ariabel 2persen?oad3. !erhatikan peletakannya. peletakan obyek pada frame ' layer bg*

-. &lik mo0ieclip 2loaderbar3, buka panel action dan ketikan script1 on%lipD0ent +load/ : bytes F (<

totalbytes F (< = on%lipD0ent +enterFrame/ : bytes F Math.round+Eparent.getBytesIoaded+/;'()-/< totalbytes F Math.round+Eparent.getBytesTotal+/;'()-/< E,scale F Math.round++bytes;totalbytes/O'((/< Eroot.persenload F E,scale< if +bytes4Ftotalbytes/ : Eroot.gotoAnd top+)/< = = 5. &lik !rame 2 la er action, kemudian buka panel action dan ketikan script1 stop+/< 7. persenload F (< impan dan jalankan mo0ie. Anda tidak akan melihat proses loading, karena ketika dijalankan secara offline komputer seolah-olah telah mendownload seluruh file yang ada. !enjelasan program1 '. !ada saat diload terdapat ) 0ariabel yaitu 0ariabel b tes yang digunakan untuk menentukan jumlah bytes yang telah didownload, dan 0ariabel totalP tes yang menununjukan ukuran total file yang akan didownload. ). elanjutnya 0ariabel bytes dihitung dengan action +b tes 1 Math4round(0parent4getP tes?oaded(),235<)//. Math4round digunakan untuk membulatkan 0ariabel bytes. getP tes?oaded() digunakan untuk menghitung jumlah file yang telah didownload, dan 235< diperoleh dari perhitungan ' &b F '()- byte. *. Agar proses loading terlihat, digunakan mo0ieclip 2loaderbar3 yang kondisi skala , +lebar-nya/ ditentukan oleh jumlah file yang telah didownload (0xscale 1 Math4round((b tes,totalb tes)=233)// dan L angka yang ditampilkan pada dynamic te,t dengan action + 0root4persenload 1 0xscale//. -. etelah file terdownload seluruhnya, maka game dimulai +i! (b tesC1totalb tes) *444+/.

'nline Pu$lishing Agar nantinya game kita dapat dimainkan secara online, maka kita harus mempublish game menjadi ) tipe file yaitu swf dan html. !erhatikan cara mempublis file berikut1 '. Ianjutkan file 2alien attack4!la3 yang telah kita buat pada bab-bab sebelumnya. ). &lik menu file4publish settings. !ilih type !lash dan HTM?.

publish settings *. &lik Publish, dan proses publishing akan berjalan. etelah selesai, maka akan terbentuk ) file yaitu file bertipe swf dan file bertipe html !erhatikan bahwa ketika anda menjalankan file GTMI, mo0ie akan ditampilkan secara default pada pojok kiri atas browser. 6ntuk membut tampilan yang lebih menarik, anda membutuhkan program web de0eloper semacam dreamwea0er. 'ffline Pu$lishing 6ntuk kebutuhan game yang dimainkan offline, pilih type Aindows !rojector dan klik publish. File yang terbentuk adalah file bertipe e,e, sehingga file tersebut dapat dijalankan pada seluruh computer meskipun flash player belum terinstall.

mempublish dengan type e,e

.igh Score ebuah game flash online tidak akan lengkap apabila tidak memiliki fitur high score. "engan penambahan fitur ini, pemain akan tertantang untuk menjadi yang terbaik sehingga akan memainkan game beberapa kali. Berbeda dengan bahas pemrograman lain seperti Hisual %@@, Hisual Basic, atau "elphi yang dilengkapi dengan script operasi file, Flash tidak memiliki script untuk mengubah atau menyimpan data. 6ntungnya kelemahan tersebut dapat diatasi dengan menggabungkan flash dengan program lain, salah satunya adalah !G!.

Menginstal P.P ebelum memasuki proses pembuatan high score kita harus mengubah sedikit proses kerja kita. !ada bab sebelumnya dijelaskan bahwa highscore dengan !G! tidak bisa dijalankan secara offline. "isisi lain proses kerja kita selama ini adalah secara offline, untuk itu dalam pembuatan highscore kita harus membuat komputer kita 2seolaholah3 online dengan cara menjalankan program php. 6ntuk menginstal !G! anda membutuhkan file phptriad.e,e yang mana pada contoh di buku ini saya menggunakan file phptriad 0ersi ).).'. 6ntuk menginstalnya, jalankan file phptriad5%5%24exe.

ikon file phptriad)-)-' etelah selesai menginstal, pada start menu akan terdapat aplikasi baru yaitu !G! triad. Agar komputer kita 2seolah-olah3 online, terdapat * hal yang harus dilakukan yaitu1 '. ?alankan program !G! triad dengan menekan windows start menuCall programCPHP triadC9pache consoleC start 9pache.

menjalankan Apache tampilan ketika Apace dijalankan ). eluruh proses kerja anda harus berada pada !older $7S9pacheShtdocs.

folder tempat kita bekerja *. 6ntuk menjalankan program publis kedalam format GTMI, buka internet browser kemudian ketikan 2http7,,localhost,nama0!ile0 ang0akan0diEalankan4html2 pada alamat browser. +syarat 1 flash player harus sudah terinstall pada internet browser anda/.

menjalankan file html Men#impan Data Ke dalam File *=* !ada contoh berikut, kita akan mencoba membuat program sederhana untuk menyimpan sebuah 0ariabel kedalam sebuah file teks +O.t,t/. Iatihan ini sangat berguna untuk memahami proses penyimpanan highscore pada suatu game flash. !erhatikan langkah berikut 1 '. Buatlah sebuah file baru dengan ukuran .(( , 7(( pi,el dan ') fps. ). Buatlah ) buah layer baru dan ubah nama masing-masing layer menEadi la er teks, la er label dan la er action. *. &lik !rame 2 la er teks kemudian buatlah obyek seperti pada gambar berikut 1

obyek pada frame ' layer te,t -. &lik !rame 2 la er label, kemudian buka pane properties dan ketikan 2loading3 pada frame label. 5. &lik !rame 2 la er action, buka panel action dan ketikan script 1 stop+/< acak F Math.random+/O'((((((<

data&u F new IoadHars+/< data&u.load+Pdata.t,tQP@acak, data&u, P!C TP/< data&u.onIoad F function+/ : teks F data&u.nama!emain@P score P@data&u.score!emain< =< 7. &lik tombol 2simpan3, buka panel action dan ketikan script1 on +release/ : gotoAnd top+PsimpanP/< = >. &lik !rame 23 la er label, kemudian masukkan keyframe. Buka panel properties dan ketikan 2simpan3 pada frame label. .. &lik !rame 23 la er action, kemudin maukan keyframe. Buka panel action dan ketikan script 1 stop+/< acak F Math.random+/O'((((((< data&u F new IoadHars+/< data&u.load+Psimpan.phpQP@acak@PZnamaFP@nama@PZscoreFP@score, data&u, P!C TP/< data&u.onIoad F function+/ : gotoAnd!lay+PIoadingP/< 8. =< impan file pada folder 2$7,apache,htdocs3 dengan nama 2highScore4!la3, dn publish menjadi type swf dan type GTMI.

susunan layer file high core.fla '(. elanjutnya buka program @otepad. &etikan 2namaPemain1LandahHscorePemain153333 dan simpan pada folder $7,apache,htdocs dengan nama 2data4txt3.

file data.t,t ''. Buat file baru pada #otepad dengan memilih menu !ileCnew. '). elanjutnya ketikan script !G! berikut1 NQ WdataEandaFPnama!emainFP.Wnama.PZscore!emainFP.Wscore< Wfile('Ffopen+Pdata.t,tP,w/< fputs+Wfile(',WdataEanda/< fclose+Wfile('/< Q4 '*. impan simpan pada folder $7,apache,htdocs dengan nama 2simpan4php3 .

menyimpan file dengan format selain T9T pada #otepad '-. ?alankan program Apache dengan menekan windows start menuCall programCPHP triadC9pache consoleC start 9pache. '5. Buka internet browser +sebagai contoh saya menggunakan $nternet D,plorer/, kemudian ketikan alamat 2http7,,localhost,highScore4html3. ?ika proses benar, maka anda dapat memasukan nama baru dan score baru kemudian menyimpannya. %atatan 1 elain menggunakan #otepad, anda juga dapat menggunakan program web builder semacam "reamwea0er. &etika anda telah meng-upload file swf dan file GTMI tersebut kedalam sebuah situs, maka penulisan alamat tanpa diikuti teks 2localhost3. ebagai contoh setelah file tersebut saya upload ke situs saya, maka untuk mengaktifkannya saya tinga menuliskan alamat 2www4wandah4com,highscore4html3 ?ika anda bekerja pada folder baru di dalam folder %1;apache;htdocs, maka penuliasan alamat harus diikuti dengan nama folder tersebut. %ontoh 1 saya menyimpan file kerja saya pada folder $7,apache,htdocs,latihanHighscore, maka alamat yang saya ketikan pada browser adalah

2http7,,localhost,latihanHighscore,highScore4html3. !enjelasan program1 !ada file highscore.fla '. Baris acak 1 Math4random()=2333333/ akan menghailkan sebuah bilangan acak. Bilangan ini dipakai seolah-olah sebagai sebuah nomor pendaftaran pengguna suatu situs. Mengingat banyaknya pengguna internet pada waktu yang bersamaan, kemungkinan file yang kita publish didownload bersamaan sangat besar. 6ntuk itu dibutuhkan sebuah identitas yang membedakan antara pengguna satu dan pengguna yang lain. ). baris dataDu4load(Adata4txt:A'acak, dataDu, APOSTA)/ akan membuka file data4txt yang telah kita buat dan membaca 0ariabel yang ada didalamnya. *. elanjutnya 0ariabel yang telah diload ditampilkan pada dynamic te,t dengan action 2teks 1 dataDu4namaPemain'A score A'dataDu4scorePemain/3. -. &etika tombol 2simpan3 ditekan maka action pada frame berlabel simpan dijalankan. 5. 6ntuk menyimpan file digunakan action 2dataDu4load(Asimpan4php:A'acak'AHnama1A'nama'AHscore1A'score, dataDu, APOSTA)/3. Baris Asimpan4php:A'acak akan menjalankan file simpan4php yang kita buat sebelumnya. Baris 2'AHnama1A'nama'AHscore1A'score3 disebut sebagai parameter crossing dari flash ke !G!. !ada file data.t,t Teks 2namaPemain1Landah3 merupakan deklarasi sebuah 0ariabel bernama namaPemain dan bernilai Landah. elanjutnya untuk membuat 0ariabel baru harus dipisah dengan tanda 2H3. !ada file simpan.php '. Baris B: dan :C merupakan tag identitas dari sebuah program php. ). !ada baris Ydata0anda1AnamaPemain1A4Ynama4AHscorePemain1A4Yscore/. &arakter 2Y 2 dalam php digunakan untuk mendeklarasikan sebuah 0ariabel. edangkan karakter 243 pada baris tersebut berarti sebuah penambahan.

Akibat

dari

action

2dataDu4load(Asimpan4php:A'acak'AHnama1A'nama'AHscore1A'score, dataDu, APOSTA)/3 pada flash, sebagai contoh bila kita mengetikan nama 28os 3 dan nilai 25;333 pada saat mo0ie dijalankan maka nilai 0ariabel dataEanda berubah menjadi PnamaPemain18os AHscorePemain15;333<. *. Baris Y!ile321!open(Adata4txtA,w)/ berarti kita mengakses file data4txt dengan perintah menulis file+w/. -. Baris !puts(Y!ile32,Ydata0anda)/ akan menambahkan nilai dari 0ariabel data0anda kedalam file data4txt. 5. etelah selesai melakukan operasi file, dalam setiap pemrograman file harus ditutup kembali. !ada php proses tersebut menggunakan script !close(Y!ile32)/ . "engan memahami proses file tersebut, anda akan dapat mengaplikasikannya kedalam sebuah game. Men#impan Data Ke dalam File =M" &elemahan dari program sebelumnya +high core.fla/ adalah ketika kita menggunakan banyak 0ariabel -sebagai contoh kita menyimpan '( data pemain dengan nilai terbesar, maka kita harus mengakses )( 0ariabel yaitu '( 0ariabel nama dan '( 0ariabel score- kesulitan akan kita temui. 6ntuk itu diperlukan sebuah cara mengolah dan menyimpan data dengan praktis. my VI adalah salah satu penyimpan database yang sering dipakai. Akan tetapi menggunakan penggabungan antara Flash dan my VI bagi pemula cukup rumit. 6ntuk itu pada buku ini saya menjelaskan prose pengelolahan database yang lebih mudah dengan menggunakan file bertipe TM?. Mengelola data dengan 9MI lebih mudah karena Flash memiliki action yang mensupport file bertipe 9MI ini. !erhatikan contoh berikut 1 '. %opy file 2alien attack4!la3 yang telah anda buat sebelumnya ke folder $7,apache,htdocs. &emudian buka file tersebut. &ita akan menambahkan sebuah fitur highscore '( pemain teratas. ). &lik !rame 63 seluruh la er, kemudian tambahkan frame +tekan F5/. *. &lik !rame 2; seluruh la er, kemudian masukan blank keyframe +tekan F>/.

-. &lik !rame 2; la er bg6, kemudian drag bitmap 2cover !inal4Epg3 dari library ke stage. Ietakkan tepat menutupi stage. 5. &lik !rame 2; la er bg5, kemudian buatlah gambar kotak berwarna gelap di tengah stage +lihat gambar/. &otak ini kita pakai sebagai background untuk te,t agar terlihat jelas. 7. &lik frame 2; la er bg2, kemudian buatlah obyek seperti pada gambar berikut 1 >. buatlah obyek seperti pada gambar berikut 1

obyek pada frame '5 .. &lik button -submit., kemudian buka panel properties dan ketikan 2submit3 pada instance name. 8. &lik button 2back3, kemudian buka panel action dan ketikan script1 on +release/ : gotoAnd top+Pmenu6tamaP/< = '(. &lik !rame 2; la er label, kemudian buka panel properties dan ketikan 2submit3 pada frame label. ''. &lik !rame 2; la er action, kemudian buka panel action dan ketikan script 1 stop+/< data9MI' F new 9MI+/< data9MI'.ignoreAhite F true< penampung9MI F new 9MI+/< acak F Math.random+/O'(((((<

data9MI'.load+Pdatapemain.,mlQuniXFP@acak/< data9MI'.onIoad F function+/ : this.contentType F Pte,t;,mlP< =< penampung9MI.onIoad F function+/ : this.contentType F Pte,t;,mlP< =< submit.onTelease F function+/ : acak F Math.round+Math.random+/O'((((/< data9MI'.load+Pdatapemain.,mlQuniXFP@acak/< ;;menyimpan data data9MI'.first%hild.append%hild+data9MI'.createDlement+PdatapemainP//< data9MI'.first%hild.last%hild.append%hild+data9MI'.createDlement+PnamaP//< data9MI'.first%hild.last%hild.last%hild.append%hild+data9MI'.createTe,t#od e+nama//< data9MI'.first%hild.last%hild.append%hild+data9MI'.createDlement+PscoreP//< data9MI'.first%hild.last%hild.last%hild.append%hild+data9MI'.createTe,t#od e+score//< ;;akses php data9MI'.sendAndIoad+P9MI.phpP, penampung9MI/< gotoAnd top+Phigh coreP/< =< '). elanjutnya klik !rame 53 la er bg5, dan masukan blank keyframe. '*. Buatlah gambar kotak berwarna gelap di tengah stage +lihat gambar/.

'-. &lik !rame 53 la er bg2, dan masukan blank keyframe. Buatlah obyek seperti pada gambar berikut1

obyek pada frame )( '5. &lik !rame 53 la er label, kemudian masukan keyframe. Buka panel properties dan ketikan 2highScore3 pada frame label. '7. &lik !rame 53 la er action, kemudian masukan keyframe. Buka panel action dan ketikan script1 stop+/< data9MI) F new 9MI+/< data9MI).ignoreAhite F true< acak F Math.random+/O'(((((< data9MI).load+Pdatapemain.,mlQuniXFP@acak/< data9MI).onIoad F function+/ : ;; baca data file 0ar jumlah!emain F data9MI).first%hild.child#odes.length< score!emain F JK< nama!emain F JK< ,nama F PP< for +iF(< iNjumlah!emain< i@@/ : score!emainJiK F #umber+data9MI).first%hild.child#odesJiK. child#odesJ'K.first%hild.nodeHalue/< nama!emainJiK F

data9MI).first%hild.child#odesJiK.child#odesJ(K. first%hild.nodeHalue< = ;;hitung highscore for +iF(< iNFjumlah!emain-'< i@@/ : min$nde, F i< for +jFi@'< jNFjumlah!emain< j@@/ : if +score!emainJjK4score!emainJmin$nde,K/ : min$nde, F j< = = if +min$nde,4i/ : k F score!emainJiK< score!emainJiK F score!emainJmin$nde,K< score!emainJmin$nde,K F k< ,nama F nama!emainJiK< nama!emainJiK F nama!emainJmin$nde,K< nama!emainJmin$nde,K F ,nama< = = ;; tampilkan '( highscore pada dynamic te,t for +iF(< iN'(< i@@/ : teks#ama @F nama!emainJiK@P[nP< teks core @F score!emainJiK@P[nP< = =< '>. &lik button 2back3, kemudian buka panel action dan ketikan script1 on +release/ : gotoAnd top+Pmenu6tamaP/< = '.. impan file dan publish menjadi type swf dan GTMI.

susunan akhir file alien attack.fla '8. Buka program @otepad. &etikan script 9MI berikut1 Ndatapemain4 Ndatapemain4 Nnama4AandahN;nama4 Nscore4'(((N;score4 N;datapemain4 N;datapemain4 )(. impan dengan nama 2dataPemain4xml3 pada folder $7,apache,htdocs. )'. !ada #otepad, buatlah file baru dan ketikan script !G! berikut1 NQphp Wfile F fopen+Pdatapemain.,mlP, Pw@P/ or die+Pfile tidak adaP/< W,ml tring F WGTT!ETAAE!C TE"ATA< if+\fwrite+Wfile, W,ml tring//: print Pkesalahan operasi fileP< = print W,ml tring.P[nP< fclose+Wfile/< Q4 )). impan dengan nama 2TM?4php3 pada folder $7,apache,htdocs. )*. ?alankan program Apache, kemudan buka program internet browser dan ketikan 2http7,,localhost,alien attack4html3. ?alankan game, setelah game berakhir tekan tombol submit score, maka akan terlihat daftar high score.

!enjelasan program1 !ada file data!emain.9MI !ada dasarnya sebuah file 9MI memiliki format penulisan yang sama seperti GTMI, hanya saja pada type 9MI kita dapat mendefinisikan sendiri tag-tag yang dipakai. !erhatikan file tersebut 1

struktur file bertipe ,ml !ada file Alien Attack.fla !ada frame '5 layer, action digunakan sebagai alat penyimpan 1 '. baris dataTM?2 1 new TM?()/ digunakan untuk mendefinisikan sebuah obyek baru bertipe TM?. ). penampungTM? 1 new TM?()/ obyek penampungTM? digunakan untuk menyimpan data 9MI sementara sebelum disimpan kedalam sebuah file. *. Baris dataTM?24!irst$hild4last$hild4append$hild(dataTM?24create&lement(Ana maA))/ digunakan untuk membuat sebuah tag baru dalam sebuah file 9MI. -. Baris dataTM?24!irst$hild4last$hild4last$hild4append$hild(dataTM?24createText @ode(nama))/ digunakan untuk memasukan sebuah nilai nodeUalue. 5. etelah semua tag dibuat, selanjutnya data dikirim untuk diproses oleh program !G! dengan menggunakan perintah dataTM?24send9nd?oad(ATM?4phpA, penampungTM?)/. !ada frame )( layer, action digunakan sebagai alat membaca data dan mengurutkan data dari yang terbesar 1 '. Baris dataTM?54load(Adatapemain4xml:uniW1A'acak)/ digunakan untuk meng-load file dataPemain4xml. ). *. elanjutnya data file dibaca dan disimpan dalam 0ariabel bertipe array namaPemain dan scorePemain. +baris dibawah komentar ,, baca data !ile/ elanjutnya dilakukan pengurutan data dari yang tertinggi dengan menggunakan operasi !or bertingkat +prinsip sederhananya adalah jika data ke i@' lebih besar dari data ke i maka data ditukar nilainya/. -. Gigh score ditampilkan sebanyak '( data pada sebuah dynamic te,t. Akibat pemilihan option render text as HTM? pada dynamic te,t, script pada baris teks@ama '1 namaPemainNiO'ASnA/ berarti 0ariabel teks#ama ditambah namaPemainNiO dan ditambah enter +baris baru/-sehingga data akan tersusun rapi ke arah bawah.

!ada file 9MI.php '. ebelum melakukan operasi file, file dataPemain4xml dibuka terlebih dahulu dengan perintah Y!ile 1 !open(Adatapemain4xmlA, Aw'A) ). Baris YxmlString 1 YHTTP089L0POST0D9T9/ merupakan deklarasi 0ariabel ,ml tring yang nilainya sama dengan data yang tersimpan pada 0ariabel penampungTM? +di dalam file alien attack4!la !rame 2; la er action/. *. elanjutnya data disimpan dengan action print YxmlString4ASnA/. "an setelah data disimpan, file ditutup kembali dengan action !close(Y!ile)/. %atatan 1 &etika bekerja dengan !G!, kita sering kali melakukan kesalahan penulisan yang mengakibatkan terhapusnya data didalam file yang kita akses. ebagai contoh ketika kita game alien attack kita coba mainkan dan menekan tombol submit score, isi file 2data!emain.,ml3 tiba tiba hilang +ditandai dengan ukuran file ( &b-lihatlah pada windows eksplorer/. 6ntuk itu sebelum mencoba game, buka windows eksplorer, copy terlebih dahulu file 2data!emain.,ml3 kemudian pastekan sehingga terbentuk file 2copy of data!emain.,ml3. Iangkah ini bertujuan agar kita tidak membuat file berulang kali.

mengcopy file yang rawan terhapus Menyimpan file baik menjadi file bertipe T9T maupun 9MI hanya bekerja pada sebuah computer yang online +setelah mo0ie diupload ke sebuah situs/. &etika file tersebut dijalankan pada sebuah Aindows !rojector +secara offline/, operasi file tidak dapat dilakukan, sehingga data tidak akan bisa berubah.

Mensu$mit 9ame Buatan Sendiri ke Situs Internet aat ini situs yang menampilkan flash game sangat banyak. "ari data terakhir saat buku ini ditulis, jika kita memasukan keyword 2flash game3 ke sebuah search engine semacam google.co.id akan didapatkan hasil lebih dari '(..((.(((. "ari jumlah yang banyak itu sudah dapat dipastikan terdapat beberapa situs flash yang terkenal. itussitus tersebut antara lain1 '. www.miniclip.com ). www.flashgame.net *. www.flashgames)->.com. -. www.freeonlinegames.com 5. www.orisinal.com 7. www.gotoandplay.it >. www.wandah.com .. www.games.babaflash.com 8. www.arkadium.net '(. www.adobe.com;de0eloper;e,change.html dan sebagainya. "ari beberapa situs tersebut kita dapat mengirimkan game final karya kita. Beberapa diantaranya memberikan loyalti dengan kisaran antara 5( 6 W samapai )(( 6 W. edangkan beberapa karya lainnya bersedia menampilkan profil de0elopernya-hal seperti inipun juga sangat menguntungkan, karena berdasarkan sedikit pengalaman saya-anda bisa mengumpulkan '((6 W perbulan hanya dengan menyisihkan ) sampai * jam per hari -+7 hari dalam ' minggu- karena minggu itu hari libur/- waktu anda didepan komputer. $tulah inti dari buku ini saya tulis, selain membuat game itu men enangkan ternyata membuat game Euga menguntungkan. elain itu saat ini

game flash juga dapat dimainkan dalam sebuah mobile phone, sehingga peluang pasar jauh lebih besar. 6ntuk lebih mendalami game flash berbagai type bacalah buku 2Mame programming series 1 board game3, 2seri action game3, 2seri arcade game3, 2seri Tacing Mame3, 2seri Tiling Mame3, 2seri Fighting3, 2seri T!M3, 2seri TT 3, 2seri Flashlite 1 Flash Mobile Mame3 dan 2Memainkan Mame Flash pada ! ) dan 9BC93 yang merupakan kelanjutan dari buku ini. FS(ommand Fscommand pada flash memiliki 5 perintah yang paling sering dipakai dalam game, yaitu1 '. !scommand(-showmenu., -!alse.)/ digunakan untuk menghilangkan tampilan menu. Akan tetapi ketika klik kanan mouse ditekan tampilan menu masih muncul yaitu setting dan about. ). !scommand(-!ullscreen., -true.)/ digunakan untuk menampilkan mo0iesecara penuh atau tetap pada ukurannya jika nilai true diubah menjadi false. *. !scommand(-allowscale., -true.)/ digunakan agar mo0ie mengikuti perubahan ukuran projector. -. !scommand(-trapallke s., -true.)/ digunakan untuk mengunci tombol keyboard. Akibat perintah ini tombol keyboard hanya bisa diakses oleh action &ey. 5. !scommand(-Wuit.)/ digunakan untuk keluar dari aplikasi. 6ntuk mengaplikasikannya klik frame ' layer action di setiap program yang anda buat, kemudain ketikan action fscommand yang anda butuhkan. elain 5 bentuk tersebut, action fscommand juaga dapat dimanfaatkan sebagai jembatan penghubung antara program flash dengan program lain seperti ja0a, mdm Sinc dan sebagainya. Mencegah S>F decompiler &etika software AF decompiler dipasarkan +salah satu yang terbaik adalah othink AF decmpiler/ banyak de0eloper game flash kecewa, karena karyanya akan lebih mudah dibajak oleh orang lain +istilah yang populer adalah re-skining/. !ada forum-

forum flash, para de0eloper mengeluh dan berusaha untuk mencari solusi mencegah decompiler. Bagaimanapun juga file swf sangat mudah di decompiler menjadi file fla. Gal tersebut tidak bisa kita cegah- meskipun demikian terdapat beberapa software yang dapat melindungi karya anda dari decompiler semacam sw! locker. Meskipun demikian cara yang terbaik untuk melindungi karya kita dari decompiler adalah dengan mempublish file menjadi bertipe e,e dengan menggunakan software sw! to proEector. Akan tetapi game kita tidak akan bisa dimainkan secara online lagiwalaupun demikian game masih dapat dijual dengan harga yang lebih tinggi. %ara tersebut adalah tren yang dilakukan oleh pada de0eloper flash game pada saat buku ini ditulis. ofware swf to projector yang saya rekomendasikan adalah MDM Zinc dan MProEector. Atau jika anda tidak memiliki keduanya anda bisa menggunakan program editor 8esHacker. "engan salah satu software tersebut kita dapat melakukan beberapa hal yaitu1 '. Melindungi karya dari decompiler. ). Mengubah ikon flash player dengan ikon buatan sendiri. *. Menghilangkan seluruh tampilan menu saat tombol klik kanan mouse ditekan. -. Mengubah 0ersi file dan menyembunyikan te,t Macromedia Flash ; Adobe Flash !layer. 5. Menyimpan file-meskipun game dijalankan offline +fitur ini terdapat pada program M"M Uinc/. Menggunakan S>F decompiler Meskipun decompiler dianggap sebagai musibah oleh beberapa de0eloper, namun decompiler juga dianggap sebagai durian jatuh bagi de0eloper pemula. &ita dapat mengambil game buatan orang lain dari sebuah situs internet menggunakan software khusus +contoh 1 flash a0ing!lugin/ kemudian men-decompilernya. Akan tetapi tujuan dari mendecompiler bukanlah untuk proses reskining +mencuri;memplagiasi karya orang lain/-tetapi tujuan yang sebenarnya adalah

mempelajari pola kerja orang lain dalam membuat sebuah game. &ita dapat membandingkan penggunaan action yang efektif dan yang kurang efektif. buku ini hanya sebuah awal bagi saya untuk membagi sedikit pengalaman dalam membuat sebuah game flash. 6ntuk pengembangan yang selanjutnya sangat tergantung kepada ketekunan anda dan jam terbang anda dalam menghadapi sebuah logika pemrogramman game. elamat Mencoba\ Gubungi saya pada email wandah]wandah.com apabila terdapat pertanyaan yang berkaitan dengan flash programming.