Cara Membuat Flash Game: 4 Langkah (dengan Gambar)

Daftar Isi:

Cara Membuat Flash Game: 4 Langkah (dengan Gambar)
Cara Membuat Flash Game: 4 Langkah (dengan Gambar)
Anonim

Flash adalah format populer untuk video game berbasis browser yang terlihat di situs seperti Newgrounds dan Kongregate. Sementara format Flash perlahan-lahan menjadi kurang dimanfaatkan dalam menghadapi aplikasi seluler yang berkembang, banyak game berkualitas masih dibuat dengannya. Flash menggunakan ActionScript, bahasa yang mudah dipelajari yang memberi Anda kendali atas objek di layar Anda. Artikel wikiHow ini akan mengajari Anda cara mempelajari cara membuat game Flash dasar.

Langkah

Bagian 1 dari 3: Memulai Proses

381698 1
381698 1

Langkah 1. Rancang game Anda

Sebelum Anda mulai membuat kode, ada baiknya jika Anda memiliki gambaran kasar tentang apa yang Anda ingin game Anda lakukan. Flash paling cocok untuk game sederhana, jadi fokuslah untuk membuat game yang hanya memiliki sedikit mekanisme yang perlu dikhawatirkan oleh pemain. Cobalah untuk memiliki genre dasar dan beberapa mekanisme dalam pikiran sebelum Anda mulai membuat prototipe. Lihat panduan ini untuk detail lebih lanjut tentang fase perencanaan pengembangan video game. Game Flash umum meliputi:

  • Pelari tak berujung: Permainan ini secara otomatis memindahkan karakter, dan pemain bertanggung jawab untuk melompati rintangan atau berinteraksi dengan permainan. Pemain biasanya hanya memiliki satu atau dua opsi dalam hal kontrol.
  • Brawlers: Ini biasanya side scrolling dan menugaskan pemain dengan mengalahkan musuh untuk maju. Karakter pemain seringkali memiliki beberapa jurus yang bisa mereka lakukan untuk mengalahkan musuh.
  • Teka-teki: Permainan ini meminta pemain untuk memecahkan teka-teki untuk mengalahkan setiap level. Ini dapat berkisar dari gaya Match-3 seperti Bejeweled hingga pemecahan teka-teki yang lebih kompleks yang biasanya ditemukan dalam game Petualangan.
  • RPG: Game-game ini berfokus pada pengembangan dan perkembangan karakter, dan membuat pemain bergerak melalui berbagai lingkungan dengan berbagai jenis musuh. Mekanik pertempuran sangat bervariasi dari RPG ke RPG, tetapi banyak yang berbasis giliran. RPG bisa jauh lebih sulit untuk dikodekan daripada game aksi sederhana.
381698 2
381698 2

Langkah 2. Pelajari keunggulan Flash

Flash paling cocok untuk game 2D. Dimungkinkan untuk membuat game 3D di Flash, tetapi ini sangat canggih dan membutuhkan pengetahuan bahasa yang signifikan. Hampir setiap game Flash yang sukses adalah 2D.

Flash game juga paling cocok untuk sesi cepat. Ini karena sebagian besar pemain game Flash bermain saat mereka memiliki sedikit waktu luang, seperti saat istirahat, yang berarti sesi permainan biasanya berlangsung selama 15 menit atau kurang

381698 3
381698 3

Langkah 3. Biasakan diri Anda dengan bahasa ActionScript3 (AS3)

Flash game diprogram dalam AS3, dan Anda harus memiliki pemahaman dasar tentang cara kerjanya agar berhasil membuat game. Anda dapat membuat game sederhana dengan pemahaman dasar tentang cara membuat kode di AS3.

Ada beberapa buku tentang ActionScript yang tersedia di Amazon dan toko lain, bersama dengan sejumlah besar tutorial dan contoh online

381698 4
381698 4

Langkah 4. Unduh Flash Professional

Program ini membutuhkan biaya, tetapi merupakan cara terbaik untuk membuat program Flash dengan cepat. Ada opsi lain yang tersedia, termasuk opsi sumber terbuka, tetapi sering kali kurang kompatibel atau membutuhkan waktu lebih lama untuk menyelesaikan tugas yang sama.

Flash Professional adalah satu-satunya program yang Anda perlukan untuk mulai membuat game

Bagian 2 dari 3: Menulis Game Dasar

381698 5
381698 5

Langkah 1. Pahami blok bangunan dasar kode AS3

Saat Anda membuat game dasar, ada beberapa struktur kode berbeda yang akan Anda gunakan. Ada tiga bagian utama dari setiap kode AS3:

  • Variabel - Ini adalah bagaimana data Anda disimpan. Data dapat berupa angka, kata (string), objek, dan lainnya. Variabel didefinisikan oleh kode var dan harus berupa satu kata.

    var playerHealth:Nomor = 100; // "var" menunjukkan bahwa Anda sedang mendefinisikan sebuah variabel. // "playerHealth" adalah nama variabel. // "Nomor" adalah tipe data. // "100" adalah nilai yang diberikan ke variabel. // Semua baris actionscript diakhiri dengan ";"

  • Penangan Acara - Penangan acara mencari hal-hal tertentu yang akan terjadi, dan kemudian memberi tahu sisa program. Ini penting untuk input pemain dan kode berulang. Penangan acara biasanya memanggil fungsi.

    addEventListener(MouseEvent. KLIK, swingSword); // "addEventListener()" mendefinisikan event handler. // "MouseEvent" adalah kategori input yang sedang didengarkan. // ". CLICK" adalah kejadian spesifik dalam kategori MouseEvent. // "swingSword" adalah fungsi yang dipanggil saat event terjadi.

  • Fungsi - Bagian kode yang ditetapkan ke kata kunci yang dapat dipanggil nanti. Fungsi menangani sebagian besar pemrograman game Anda, dan game yang kompleks dapat memiliki ratusan fungsi sementara game yang lebih sederhana mungkin hanya memiliki beberapa fungsi. Mereka dapat berada dalam urutan apa pun karena mereka hanya bekerja ketika mereka dipanggil.

    fungsi swingSword (e:MouseEvent):void; { //Kode Anda ada di sini } // "fungsi" adalah kata kunci yang muncul di awal setiap fungsi. // "swingSword" adalah nama fungsi. // "e:MouseEvent" adalah parameter tambahan, yang menunjukkan bahwa fungsi // dipanggil dari event listener. // ":void" adalah nilai yang dikembalikan oleh fungsi. Jika tidak ada nilai // yang dikembalikan, gunakan:void.

381698 6
381698 6

Langkah 2. Buat objek

ActionScript digunakan untuk mempengaruhi objek di Flash. Untuk membuat game, Anda perlu membuat objek yang akan berinteraksi dengan pemain. Tergantung pada panduan yang Anda baca, objek dapat disebut sebagai sprite, aktor, atau klip video. Untuk permainan sederhana ini, Anda akan membuat persegi panjang.

  • Buka Flash Professional jika Anda belum melakukannya. Buat proyek ActionScript 3 baru.
  • Klik alat menggambar Persegi Panjang dari panel Alat. Panel ini mungkin berada di lokasi yang berbeda tergantung pada konfigurasi Flash Professional. Gambarlah sebuah persegi panjang di jendela Scene Anda.
  • Pilih persegi panjang menggunakan alat Seleksi.
381698 7
381698 7

Langkah 3. Tetapkan properti ke objek

Dengan persegi panjang yang baru Anda buat dipilih, buka menu Modify dan pilih "Convert to Symbol". Anda juga dapat menekan F8 sebagai jalan pintas. Di jendela "Konversikan ke Simbol", beri nama objek yang mudah dikenali, seperti "musuh".

  • Temukan jendela Properties. Di bagian atas jendela, akan ada bidang teks kosong berlabel "Nama Instance" saat Anda mengarahkan kursor ke atasnya. Beri nama sama seperti yang Anda lakukan saat mengubahnya menjadi simbol ("musuh"). Ini menciptakan nama unik yang dapat berinteraksi dengan melalui kode AS3.
  • Setiap "instance" adalah objek terpisah yang dapat dipengaruhi oleh kode. Anda dapat menyalin instance yang sudah dibuat beberapa kali dengan mengklik tab Library dan menyeret instance ke TKP. Setiap kali Anda menambahkan satu, namanya akan diubah untuk menunjukkan bahwa itu adalah objek yang terpisah ("musuh", "musuh1", "musuh2", dll.).
  • Saat Anda merujuk ke objek dalam kode, Anda hanya perlu menggunakan nama instance, dalam hal ini "musuh".
381698 8
381698 8

Langkah 4. Pelajari bagaimana Anda dapat mengubah properti sebuah instance

Setelah Anda membuat instance, Anda dapat menyesuaikan properti melalui AS3. Ini memungkinkan Anda memindahkan objek di sekitar layar, mengubah ukurannya, dan sebagainya. Anda dapat menyesuaikan properti dengan mengetikkan instance, diikuti dengan titik ".", diikuti oleh properti, diikuti dengan nilai:

  • musuh.x = 150; Hal ini mempengaruhi posisi objek musuh pada sumbu X.
  • musuh.y = 150; Hal ini mempengaruhi posisi objek musuh pada sumbu Y. Sumbu Y dihitung dari atas adegan.
  • musuh.rotasi = 45; Memutar objek musuh 45° searah jarum jam.
  • musuh.skalaX = 3; Membentang lebar objek musuh dengan faktor 3. Angka (-) akan membalik objek.
  • musuh.skalaY = 0,5; Menekan objek hingga setengah tingginya.
381698 9
381698 9

Langkah 5. Periksa perintah trace()

Perintah ini akan mengembalikan nilai saat ini untuk objek tertentu, dan berguna untuk menentukan apakah semuanya berjalan sebagaimana mestinya. Anda mungkin tidak ingin memasukkan perintah Trace dalam kode akhir Anda, tetapi ini berguna untuk debugging.

381698 10
381698 10

Langkah 6. Bangun permainan dasar menggunakan informasi di atas

Sekarang setelah Anda memiliki pemahaman dasar tentang fungsi inti, Anda dapat membuat game di mana musuh berubah ukuran setiap kali Anda mengkliknya, hingga kehabisan kesehatan.

var musuhHP:Nomor = 100; // menetapkan HP (kesehatan) musuh menjadi 100 di awal. var playerAttack:Nomor = 10; // mengatur kekuatan serangan pemain saat mereka mengklik. musuh.addEventListener(MouseEvent. CLICK, attackEnemy); // Dengan menambahkan fungsi ini langsung ke objek musuh, // fungsi hanya terjadi ketika objek itu sendiri // diklik, bukan mengklik di mana pun di layar. setEnemyLocation(); // Ini memanggil fungsi berikut untuk menempatkan musuh // di layar. Ini terjadi saat permainan dimulai. fungsi setEnemyLocation ():void { musuh.x = 200; // memindahkan musuh ke 200 piksel dari kiri layar musuh.y = 150; // memindahkan musuh ke bawah 150 piksel dari atas layar musuh.rotasi = 45; // memutar musuh 45 derajat searah jarum jam trace("nilai x musuh adalah", musuh.x, "dan nilai y musuh adalah", musuh.y); // Menampilkan posisi musuh saat ini untuk debugging } fungsi attackEnemy (e:MouseEvent):void // Ini membuat fungsi serangan ketika musuh diklik { musuhHP = musuhHP - playerAttack; // Mengurangi nilai serangan dari nilai HP, // menghasilkan nilai HP baru. musuh.scaleX = HP musuh / 100; // Mengubah lebar berdasarkan nilai HP baru. // Ini dibagi dengan 100 untuk mengubahnya menjadi desimal. musuh.skalaY = HP musuh / 100; // Mengubah ketinggian berdasarkan jejak nilai HP baru ("Musuh memiliki", HP musuh, "HP kiri"); //Menampilkan berapa banyak HP yang tersisa dari musuh }

381698 11
381698 11

Langkah 7. Cobalah

Setelah Anda membuat kode, Anda dapat menguji game baru Anda. Klik menu Control dan pilih Test Movie. Permainan Anda akan dimulai, dan Anda dapat mengklik objek musuh untuk mengubah ukurannya. Keluaran Jejak Anda akan ditampilkan di jendela Keluaran.

Bagian 3 dari 3: Mempelajari Teknik Tingkat Lanjut

381698 12
381698 12

Langkah 1. Pelajari cara kerja paket

ActionScript berbasis Java, dan menggunakan sistem paket yang sangat mirip. Paket memungkinkan Anda untuk menyimpan variabel, konstanta, fungsi, dan informasi lainnya dalam file terpisah, dan kemudian mengimpor file-file ini ke dalam program Anda. Ini sangat berguna jika Anda ingin menggunakan paket yang telah dikembangkan orang lain yang akan membuat game Anda lebih mudah dibuat.

Lihat panduan ini untuk detail lebih lanjut tentang cara kerja paket di Java

381698 13
381698 13

Langkah 2. Bangun folder proyek Anda

Jika Anda membuat game dengan banyak gambar dan klip suara, Anda perlu membuat struktur folder untuk game Anda. Ini akan memungkinkan Anda untuk dengan mudah menyimpan berbagai elemen Anda, serta menyimpan paket yang berbeda untuk dipanggil.

  • Buat folder dasar untuk proyek Anda. Di folder dasar, Anda harus memiliki folder "img" untuk semua aset seni Anda, folder "snd" untuk semua aset suara Anda, dan folder "src" untuk semua paket dan kode game Anda.
  • Buat folder "Game" di folder "src" untuk menyimpan file Constants Anda.
  • Struktur khusus ini tidak diperlukan, tetapi merupakan cara mudah untuk mengatur pekerjaan dan materi Anda, terutama untuk proyek yang lebih besar. Untuk permainan sederhana yang dijelaskan di atas, Anda tidak perlu membuat direktori apa pun.
381698 14
381698 14

Langkah 3. Tambahkan suara ke game Anda

Sebuah permainan tanpa suara atau musik akan cepat menjadi membosankan bagi pemain. Anda dapat menambahkan suara ke objek ke Flash menggunakan alat Lapisan. Lihat panduan ini untuk lebih jelasnya.

381698 15
381698 15

Langkah 4. Buat file Konstanta

Jika gim Anda memiliki banyak nilai yang akan tetap sama sepanjang gim, Anda dapat membuat file Konstanta untuk menyimpan semuanya di satu tempat sehingga Anda dapat memanggilnya dengan mudah. Konstanta dapat mencakup nilai-nilai seperti gravitasi, kecepatan pemain, dan nilai lain yang mungkin perlu Anda panggil berulang kali.

  • Jika Anda membuat file Konstanta, itu perlu ditempatkan di folder di proyek Anda dan kemudian diimpor sebagai paket. Misalnya, katakanlah Anda membuat file Constants.as dan meletakkannya di direktori Game Anda. Untuk mengimpornya, Anda akan menggunakan kode berikut:

    paket { impor Game.*; }

381698 16
381698 16

Langkah 5. Lihat permainan orang lain

Sementara banyak pengembang tidak akan mengungkapkan kode untuk game mereka, ada berbagai tutorial proyek dan proyek terbuka lainnya yang memungkinkan Anda melihat kode dan bagaimana kode tersebut berinteraksi dengan objek game. Ini adalah cara yang bagus untuk mempelajari beberapa teknik lanjutan yang dapat membantu permainan Anda menonjol.

Direkomendasikan: