tutorial membuat game flash sederhana

12
sainTutorial Membuat Game Flash Sederhana Pada tutorial ini saya menggunakan action script 2.0 dan adobe flash CS3. Maaf sebelumnya jika pada gambar terdapat bahasa yang aneh. Saya sendiri tidak tahu itu bahasa apa. Pembukaan 1. Buatlah new flash document dengan ukuran stage 500x400 pixels dan 20 fps. 2. Buatlah 3 layer baru dan beri masing masing layer dengan nama bg, simbol,label dan action. 3. Seleksi seluruh frame 1 pada semua layer lalu sambil menekan tombol ctrl seleksi seluruh frame 5,frame 10,frame 15,frame 20, frame 30, dan frame 35 di semua layer, lalu tekan F7. 4. Seleksi frame 40 di semua layer,lalu tekan F5. 5. Klik layer label lalu. Klik frame 1 dan buka panel properties lalu ketikkan menu pada kolom frame label. Ulangi hal yang sama pada frame 5,10,15,20,30,dan 35 dengan masing masing nama about,help,highScore,game,gameover dan win. 6. Klik frame 1 layer action lalu tekan F9. masukkan script : stop(); lakukan hal yang sama pada frame 5,10,15,20,30,35 layer action. Lihat pada gambar 1.1 Gambar 1.1 7. Klik frame 1 layer simbol dan buatlah 5 tombol play,highscore,help,about dan exit. 8. Klik tombol play lalu tekan F9,masukkan script : on(release){ gotoAndPlay("game") } 8. klik tombol highscore lalu tekan F9, masukkan script :

Upload: salsala

Post on 01-Jul-2015

2.314 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: tutorial membuat game flash sederhana

sainTutorial Membuat Game Flash Sederhana

Pada tutorial ini saya menggunakan action script 2.0 dan adobe flash CS3. Maaf sebelumnya jika pada gambar terdapat bahasa yang aneh. Saya sendiri tidak tahu itu bahasa apa.Pembukaan1. Buatlah new flash document dengan ukuran stage 500x400 pixels dan 20 fps.2. Buatlah 3 layer baru dan beri masing masing layer dengan nama bg, simbol,label

dan action.3. Seleksi seluruh frame 1 pada semua layer lalu sambil menekan tombol ctrl seleksi

seluruh frame 5,frame 10,frame 15,frame 20, frame 30, dan frame 35 di semua layer, lalu tekan F7.

4. Seleksi frame 40 di semua layer,lalu tekan F5.5. Klik layer label lalu. Klik frame 1 dan buka panel properties lalu ketikkan menu

pada kolom frame label. Ulangi hal yang sama pada frame 5,10,15,20,30,dan 35 dengan masing masing nama about,help,highScore,game,gameover dan win.

6. Klik frame 1 layer action lalu tekan F9. masukkan script :stop();lakukan hal yang sama pada frame 5,10,15,20,30,35 layer action.

Lihat pada gambar 1.1

Gambar 1.1

7. Klik frame 1 layer simbol dan buatlah 5 tombol play,highscore,help,about dan exit.8. Klik tombol play lalu tekan F9,masukkan script :

on(release){gotoAndPlay("game")

}8. klik tombol highscore lalu tekan F9, masukkan script :

Page 2: tutorial membuat game flash sederhana

on(release){gotoAndPlay("highScore")

}9. klik tombol help lalu tekan F9, masukkan script :

on(release){gotoAndPlay("help")

}10. klik tombol about lalu tekan F9, masukkan script :

on(release){gotoAndPlay("about")

}11. klik tombol exit lalu tekan F9, masukkan script :

on (release) {fscommand("quit", "");

}12. buat tombol back di frame 5 layer simbol. Tekan F9 lalu masukkan script :

on(release){gotoAndPlay("menu")

}

Copy tombol back tersebut lalu paste-kan di frame 10 dan 15 layer simbol.13. Buat 2 buah dynamic text di frame 15 layer simbol beri masing-masing dengan

nama variable tampil1 dan tampil 2. Buat sebuah tulisan menggunakan static text “HIGHSCORE” pada frame 15 layer bg,dan ketakkan di kiri atas stage.Lihat pada gambar.

Page 3: tutorial membuat game flash sederhana

Gambar 1.2

Klik frame 15 layer action,tekan F9 lalu tambahkan script :

tampil1 = "";tampil2 = "";DataSkor = SharedObject.getLocal("masukkanSkor");DataSkor.data.pemain.sortOn("skornya",Array.DESCENDING | Array.NUMERIC);if (!DataSkor.data.pemain) {

DataSkor.data.pemain = new Array();DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.push({skornya:0, namanya:"None"});DataSkor.data.pemain.sortOn("skornya",Array.DESCENDING |

Array.NUMERIC);}for (i=0; i<10; i++) {

tampil2 += DataSkor.data.pemain[i].skornya+newline;}for (i=0; i<10; i++) {

tampil1 += DataSkor.data.pemain[i].namanya+newline;}

Membuat Bagian Utama Game14. Klik frame 20 layer simbol dan buat 2 buah static text,masing-masing ketikkan

“score :” dan “level :”[tanpa tanda kutip]

15. buat 3 buah dynamic text masing-masing beri nama variable skor_txt,level_txt, dan nyawa_txt. Lihat pada gambar.

Page 4: tutorial membuat game flash sederhana

Gambar 1.3

16. buat karakter kecoa beserta musuh serta bonusnya seperti berikut atau sesuai kreativitas anda. Convert menjadi movie clip dan masing-masing diberi nama :

17. hapus seluruh movieclip tersebut dari stage kecuali movieclip kecoa .18. Klik kanan movie clip bonus_nilai pada library. Klik linkage. Beri tanda centang

pada export for actionscript. Masukkan identifier seperti yang tertulis diatas.19. Ulangi langkah 18 pada movieclip tulang,bonus_nyawa, kotoran, d_kotoran,

s_kotoran, dan tengkorak.20. Klik movieclip kecoa, buka panel properties,pada kolom instance name ketikkan

kecoa.

kecoa

bonus_nilailinkage:bonus_nilai

tulanglinkage:tulang

bonus_nyawalinkage:bonus_nyawa

tengkoraklinkage:tengkorak

s_kotoranlinkage:s_kotoran

d_kotoranlinkage:d_kotoran

kotoranlinkage:kotoran

Page 5: tutorial membuat game flash sederhana

Gambar 1.4

21. Drag movie clip kecoa dari library ke stage [tanpa instance name],lalu kecilkan ukurannya dan letakkan di sebelah dynanic text nyawa_txt.

22. Klik frame 20 layer bg. Buatlah 4 buah persegi panjang berwarna putih,sesuaikan dengan panjang dan lebar stage. Lihat pada gambar.

Gambar 1.523. Seleksi kotak putih yang atas,convert menjadi movieclip. Beri nama dinding_atas.

Pastikan titik registration berada di tengah bawah. Klik movieclip dinding_atas dan beri instance name dinding_atas.

24. Ulangi langkah 23 pada kotak di kiri,bawah dan kanan. Beri nama dan instance name : Nama :dinding_kiri, instance name :dinding_kiri Nama :dinding_bwh, instance name :dinding_bawah Nama :dinding_kanan, instance name :dinding_kanan

25. Buatlah sebuah static text bertuliskan NEXT LEVEL. Convert static text tersebut menjadi movieclip dengan nama nextLevel.

Page 6: tutorial membuat game flash sederhana

26. Klik 2 kali movieclip nextLevel untuk mengeditnya. Klik frame 10 layer 1 lalu tekan F6.

27. Klik frame 11 layer 1,tekan F7. klik frame 11 layer 1 dan masukkan action script :stop();

Kembali ke stage utama dengan menakan ctrl+E.28. Hapus movieclip nextLevel dari stage. Klik kanan movieclip nextLevel pada

library,pilih linkage. Beri tanda centang pada export for actionscript lalu masukkan identifier nextLevel. Lihat pada gambar.

Gambar 1.6

29. Klik frame 20 layer action,tekan F9 lalu tambahkan script :

nyawa = 7;nyawaMax = 7;skor = 0;waktu = 5;level = 1;kecepatanTulang = 5;kecepatanKotoran = 4;kecepatanNyawa = 20;kecepatanBonus = 10;kecoa.onEnterFrame = function() {

nyawa_txt = nyawa;vskor = skor;waktu++;level_txt = level;if (Key.isDown(Key.UP)) {

this._y -= 13;}if (Key.isDown(Key.DOWN)) {

this._y += 13;}if (Key.isDown(Key.RIGHT)) {

this._x += 13;

Page 7: tutorial membuat game flash sederhana

}if (Key.isDown(Key.LEFT)) {

this._x -= 13;}if (this.hitTest(dinding_bawah)) {

this._y -= 10;}if (this.hitTest(dinding_atas)) {

this._y += 10;}if (this.hitTest(dinding_kanan)) {

this._x -= 10;}if (this.hitTest(dinding_kiri)) {

this._x += 10;}if (waktu == 10) {

waktu -= 10;tulang = attachMovie("tulang", "tulang"+_root.getNextHighestDepth(),

_root.getNextHighestDepth(), {_x:20+random(430), _y:1});tulang.onEnterFrame = function() {

this._y += kecepatanTulang;this._rotation -= 5;if (this.hitTest(kecoa)) {

skor += 75;this.removeMovieClip();

}};

if (waktu<=20) {waktu -= 10;kotoran = attachMovie("kotoran",

"kotoran"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:0, _y:50+random(300)});

kotoran.onEnterFrame = function() {this._x += kecepatanKotoran;if (this.hitTest(kecoa)) {

nyawa--;this.removeMovieClip();

}};

}if (level>5) {

if (waktu<=10) {waktu -= 10;d_kotoran = attachMovie("d_kotoran",

"d_kotoran"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:0, _y:50+random(300)});

d_kotoran.onEnterFrame = function() {this._x += kecepatanKotoran;if (this.hitTest(kecoa)) {

skor -= 100;nyawa -= 2;

Page 8: tutorial membuat game flash sederhana

this.removeMovieClip();}

};}

}if (level>6) {

if (waktu<=20) {waktu += 15;s_kotoran = attachMovie("s_kotoran",

"s_kotoran"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:50+random(300), _y:450-random(30)});

s_kotoran.onEnterFrame = function() {this._y -= kecepatanKotoran;if (this.hitTest(kecoa)) {

skor -= 1000;this.removeMovieClip();

}};

}}if (level<6) {

if (waktu<=20) {waktu -= 15;tengkorak = attachMovie("tengkorak",

"tengkorak"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:30+random(400), _y:0});

tengkorak.onEnterFrame = function() {this._y += 10;if (this.hitTest(kecoa)) {

skor += 1000;nyawa--;this.removeMovieClip();

}};

}}if (level>3) {

if (waktu<=25) {waktu -= 10;bonus_nyawa = attachMovie("bonus_nyawa",

"bonus_nyawa"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:550, _y:50+random(300)});

bonus_nyawa.onEnterFrame = function() {this._x -= kecepatanNyawa;this._y += 5+random(2);this._rotation -= random(1);if (this.hitTest(kecoa)) {

if (nyawa<nyawaMax) {nyawa++;this.removeMovieClip();

}}

};

Page 9: tutorial membuat game flash sederhana

}}i f (wak tu<23) {

waktu += 10;bonus_n i l a i = at tachMov ie ( " bonus_n i l a i " ,

"bonus_n i l a i " + _ r oo t . ge tNex tH ighes tDep th ( ) , _roo t . ge tNex tH ighes tDep th ( ) , {_x :20+random(430) , _y:1 } ) ;

bonus_n i l a i . o nEn te rF rame = func t i on ( ) {th i s . _y += kecepatanBonus ;th i s . _ r o t a t i o n += 5;i f ( th i s . h i t T es t ( k ecoa ) ) {

skor += 250;th i s . r emoveMov ieC l i p ( ) ;

}} ;

}}i f (skor>=2500* l eve l and leve l<10 ) {

nextLeve l = at tachMov ie ( " nex tLeve l " , "nex tLeve l " , 200, {_x :250 , _y:250} ) ;

leve l++ ;kecepatanTu lang += 2;kecepatanKoto ran++ ;kecepatanNyawa += 2;kecepatanBonus++;

}/ / j i k a nyawa = 0 maka gameoveri f (nyawa<1) {

nextLeve l . r emoveMov ieC l i p ( ) ;gotoAndPlay ( "gameover " ) ;

}/ / j i k a sudah menyelesa i kan leve l 10 maka menangi f ( l eve l == 11) {

gotoAndPlay ( "w in " ) ;nextLeve l . r emoveMov ieC l i p ( ) ;

}} ;

Pembuatan Bagian Akhir30. Klik frame 30 layer bg, kemudian buat tulisan GAME OVER menggunakan static

text.31. Klik frame 30 layer simbol. Buat 2 buah static text masing-masing bertuliskan

“your sxore :” dan “your name :” [tanpa tanda kutip].32. Buat sebuah dynamic text disebelah tulisan “your score :”. Beri variable skor pada

dynamic text tersebut.33. Buat sebuah input text disebelah tulisan “your name :”. Beri variable nama pada

input text tersebut.34. Buat 2 buah tombol masing-masing diberi nama playAgain_btn dan save_btn.

Lalu drag tombol exit dari library ke stage.

Page 10: tutorial membuat game flash sederhana

35. Klik tombol save_btn,buka panel properties dan masukkan save sebagai instance name.

36. Klik tombol playAgain_btn,tekan F9 lalu masukkan script :on( re l ease ) {

gotoAndPlay ( "menu" )}

37. Klik tombol exit,tekan F9 lalu masukkan script :on ( re l ease ) {

fscommand("qu i t " , " " )}

38. Copy seluruh isi frame 30 layer simbol lalu paste-kan ke frame 35 layer simbol.39. Klik frame 30 layer action,tekan F9 lalu masukkan script :

nama = " Inse r t your name" ;func t i on s impanScore (sco re , p layer ) {

DataSkor = SharedObjec t . ge t Loca l ( "masukkanSkor " ) ;i f ( !Da taSkor . da t a . pemain ) {

DataSkor .da ta . pemain = new Array ( ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;DataSkor .da ta . pemain .push ( { s ko rnya :0 , namanya: "None" } ) ;

}DataSkor.data.pemain.push({skornya:score, namanya:player});DataSkor.flush();

}save.onRelease = function() {

simpanScore(skor,nama);gotoAndStop("highscore")

};

40. Klik frame 35 layer action,lalu tambahkan script yang sama seperti frame 30 layer action.

41. Klik frame 35 layer bg. Tambahkan tulisan “CONGRATULATION!! YOU WIN!!” menggunakan static text.

Penyelesaian42. Klik frame 5 layer bg. Tambahkan keterangan tentang game yang Anda buat

tersebut, contoh lihat pada gambar .

Page 11: tutorial membuat game flash sederhana

Gambar 1.7

43. Klik frame 10 layer bg. Buat tulisan “HELP” mrnggunakan static text.44. Buat sebuah kotak ditengah-tengah stage. Drag movieclip kecoa,bonus_nilai,

tulang, bonus_nyawa, kotoran, d_kotoran, s_kotoran, dan tengkorak ke dalam kotak tersebut dan perkecil ukurannya.

45. Sesuaikan posisinya,beri keterangan dengan static text dan atur seperti gambar berikut.

Gambar 1.8

Page 12: tutorial membuat game flash sederhana

46. Jika Anda menginginkan background pembuka yang lebih baik, Anda bisa membuatnya sendiri. Contoh background pembuka.

Gambar 1.9

47. Letakkan background tersebut di frame 1 layer bg.48. Simpan game dengan nama the bone eater cockroach

Demikian tutorial yang singkat ini. Mungkin masih ditemukan banyak kesalahan pada tutorial ini. Mohon dimaklumi, karena yang membuat tutorial ini masih sangat pemula (hehehe). Kritik dan saran akan Saya terima dengan senang hati.

Contact person: [email protected] [email protected]

copyright © 2010 husain,inc