PERANCANGAN DAN PEMBUATAN APLIKASI GAME FACEBOOK “MISI SANG KAPTEN” MENGGUNAKAN ENGINE CONSTRUCT 2 BERBASIS HTML 5
NASKAH PUBLIKASI
diajukan oleh FATHURRAHMAN 11.21.0609
kepada SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM YOGYAKARTA YOGYAKARTA 2013
DESIGNING AND MAKING FACEBOOK APPLICATIONS GAMES “MISSION THE CAPTAIN” USING THE ENGINE CONSTRUCT 2 BASED HTML 5 PERANCANGAN DAN PEMBUATAN APLIKASI GAME FACEBOOK “MISI SANG KAPTEN” MENGGUNAKAN ENGINE CONSTRUCT 2 BERBASIS HTML 5 Fathurrahman Erik Hadi Saputra Jurusan Teknik Informatika STMIK AMIKOM YOGYAKARTA
ABSTRACT Gaming technology is one of the important learning medium for the development of virtual world technology. Many emerging game developed by individuals or organizations, the presence of social media facebook game which also successfully anesthetize the game lovers ranging from children to adults. Commonly used types of games for online games on facebook is a flash game, but to date has developed software to create a game with another base that is HTML5. Until now there is very little share information from the Indonesian game developers. Currently, many major game developers are aiming to online games because in addition to providing entertainment also capable of promising passive income as made famous game and played by many people in cyberspace. The captain's mission is HTML 5-based adventure game that tells how a captain should be the face of the enemy that is attacking aliens to come to earth. All adventures are in the game are made from the author's imagination. Objective of the game is the main thing is as a medium of learning to keep abreast of the latest games and game technology is also intended as a medium of entertainment for game lovers in cyberspace. Keywords: game technology, the mission captain, HTML5 Game.
1.
PENDAHULUAN Melihat dari perkembangan teknologi game di dunia maya khusunya, sampai saat
ini menampilkan perkembangan ide dan karya baru dengan berbagai jenis. Banyak game bermunculan yang dikembangkan oleh perorangan atau organisasi, dengan adanya social media facebook game didalamnya juga berhasil membius para pecinta game mulai dari anak-anak hingga orang dewasa. Kemudian baru ini muncul game baru berbasis flash yang bernama Angry Bird, pecinta game ini beragam mulai dari anak-anak sampai dewasa. Dari kasus tersebut sampai saat ini telah dikembangkan perangkat lunak yang dapat membuat game dengan tampilan seperti flash dengan basis lain yaitu HTML5. Tetapi sayangnya kebanyakan game online yang beredar dan terkenal saat ini adalah buatan orang luar negeri dan perusahaan berskala besar, sampai saat ini masih sangat minim share informasi dari para developer game Indonesia. Para developer game besar banyak yang membidik ke arah game online karena selain bisa memberikan hiburan juga mampu menjanjikan pasive income saat game yang dibuat terkenal dan dimainkan oleh banyak orang di dunia maya. Dari sekian banyak jenis game online, game ini mengangkat tema game petualangan yang menceritakan bagaimana seorang kapten harus menghadapi musuh yaitu para alien yang akan datang menyerang ke bumi dan basis game ini adalah HTML5. Semua petualangan yang dalam permainan dibuat dari imajinasi penulis. Tujuan dibuatnya game ini yang utama adalah sebagai media pembelajaran untuk mengikuti perkembangan teknologi game terbaru dan game ini juga bertujuan sebagai media hiburan bagi pecinta game di dunia maya. 2. LANDASAN TEORI 2.1 Games Online Games Online adalah jenis permainan dengan menggunakan komputer yang memanfaatkan jaringan komputer LAN atau internet sebagai media. Game Online banyak disediakan oleh perusahaan pembuat game online dan pemain dapat langsung mengakses melalui sistem yang disediakan dari perusahaan yang menyediakan 1
permainan tersebut . Menurut Andrew Rollings dan Ernest Adams, permainan daring lebih tepat disebut sebagai sebuah teknologi, dibandingkan sebagai sebuah permainan, sebuah mekanisme 1
Castronova, Edward. (2006). Synthetic Worlds: The Business and Culture of Online Games. University Of Chicago Press
1
untuk menghubungkan pemain secara bersama, dibandingkan pola tertentu dalam 2
sebuah permainan (Rolling & Adams, 2006: 770) . Game online bisa disebut sebagai bagian dari aktivitas sosial karena pemain bisa saling berinteraksi secara virtual dan seringkali menciptakan komunitas maya. Berdasarkan jenisnya, permainan online dibedakan menjadi 7 macam, yaitu: Massively Multiplayer Online First-person shooter games (MMOFPS), Massively Multiplayer Online Real-time strategy games (MMORTS), Massively Multiplayer Online Role-playing games (MMORPG), Cross-platform online play, Massively Multiplayer Online Browser Game, 3
Simulation games, Massively multiplayer online games (MMOG) . 2.2 UNSUR-UNSUR GAME ONLINE 2.2.1. GAMBAR (IMAGE) Gambar atau grafik adalah bagian yang penting dalam pembuatan game, karena pada sebuah gambar dapat menceritakan suasana bahkan maksud kata-kata. Banyak sekali ekstensi tipe file gambar. 2.2.2. TEKS (TEXT) Bagian game yang ini menampilkan kata-kata di layar, ini juga sangat penting untuk sebuah game. Teks masih menjadi sebuah bagian yang sangat dibutuhkan untuk menyebarkan sebuah informasi, dan kode program selalu menyertainya. 2.2.3. SUARA (AUDIO) Sebuah
bagian
yang
penting
dalam
unsur
game
karena
audio
dapat
membangkitkan nyawa sebuah game. Dalam teknologi game, nada yang jernih kadang menjadi sesuatu yang dibutuhkan, maka yang perlu diperhatikan adalah kualitas sound card yang terpasang di PC atau notebook. 2.2.4. ANIMASI (ANIMATION) Pemakaian animasi dalam teknologi game menjadi poin tambahan yang bagus untuk digunakan, animasi akan membuat perubahan antara gambar yang satu ke gambar yang berikutnya sehingga terbentuk sebuah gerakan yang utuh.
2
3
Rollings, Andrew; Ernest Adams. (2006). Fundamentals of Game Design. Prentice Hall. N.K., Adaman. (2005). The Developmental History of Online Gaming Design.McGraw-Hill.
2
2.3 MENGEMBANGKAN SISTEM GAME DENGAN FRAMEWORK Framework juga dibutuhkan dalam pembuatan game untuk memantau alur jalannya produksi game, berikut ini adalah framework/rancangan game yang dibuat oleh david midgley. 2.4 JENIS GAME “MISI SANG KAPTEN” Misi Sang Kapten adalah sebuah game online berjenis Massively Multiplayer Online Browser Game dengan basis sistem HTML 5, game ini bercerita tentang kisah seorang kapten yang berusaha menyelamatkan bumi dari serangan alien jahat yang akan menghancurkan bumi dan sang kapten harus menghadapi rintangan yang ada untuk menyelesaikan misinya. 2.4.1 HTML 5
HTML5 adalah bahasa markup yang bertujuan untuk penataan dan penyajian konten untuk World Wide Web, dan merupakan teknologi inti dari Internet yang awalnya diusulkan oleh Opera Software. Tujuan utamanya adalah meningkatkan bahasa dengan dukungan untuk teknologi multimedia terkini dengan tetap mudah dibaca oleh manusia dan secara konsisten dimengerti oleh komputer dan perangkat (web browser, parser, dll). 2.5 SISTEM PERANGKAT LUNAK YANG DIGUNAKAN Penggunaan perangkat lunak tidak terbatas pada satu jenis perangkat lunak yang ada. Dalam penerapan pembuatan game kali ini digunakan beberapa perangkat lunak yang mampu menangani tahap-tahap yang berkaitan dengan tampilan dari game “Misi Sang Kapten” menggunakan engine Construct 2. 2.5.1 CONSTRUCT 2 Construct 2 adalah sebuah tool berbasis HTML5 untuk menciptakan sebuah permainan. Dengan tool Construct 2 memungkinkan siapa saja membuat game tanpa harus memiliki pengalaman pemrograman. Dikembangkan oleh Scirra Ltd, Hal ini ditujukan terutama untuk para non-programmer yang ingin menciptakan sebuah game secara drag and drop menggunakan editor visual dan berbasis sistem logika perilaku. 3. ANALISIS 3.1 ANALISIS GAME Untuk membuat sebuah game dari sebuah rancangan yang simple sampai yang rumit pasti ada banyak aspek yang harus diperhitungkan, sehingga tercipta sebuah game
3
yang menarik untuk dimainkan. Pada game Misi Sang Kapten adalah penggabungan beberapa objek dan sumber daya(resources) yang kemudian diberikan sebuah logika dan animasi sehingga dapat dimainkan sesuai dengan instruksi dan konsep yang telah disiapkan sebelumnya. Langkah-langkah dalam membangun game Misi Sang Kapten merujuk pada framework project game flowchart yang dirancang oleh david midgley.
3.1.1 MENGIDENTIFIKASI AWAL PROJECT (INITIAL PROJECT) Untuk mengetahui kelemahan dan kelebihan
pada sistem game Misi Sang
Kapten, maka dibutuhkan metode analisis. Metode analisis yang digunakan pada perancangan game Misi Sang Kapten adalah metode SWOT, yaitu Strengths, Weaknesses, Opportunities, Threats.
3.1.2 DESAIN GAME, DOKUMENTASI DAN TUJUAN PROJECT (GAME DESIGN, DOCUMENTATION & PROJECT DIRECTION) 3.1.2.1. DESAIN GAME (GAME DESIGN) Game “Misi Sang Kapten” adalah game online berjenis massively multiplayer online browser game, yaitu permainan yang dimainkan pada peramban seperti Mozilla Firefox, Opera, Chrome atau Internet Explorer. Game “Misi Sang Kapten” dibangun menggunakan basis HTML 5 yang didukung dengan teknologi multimedia web. 3.1.2.1.1. FLOWCHART PROGRAM Flowchart menggambarkan urutan-urutan instruksi dari suatu program comuter. Tujuan dari menganalisa sebuah sistem adalah untuk memahami kebutuhan dari sebuah sistem. Kebutuhan sistem dapat diartikan sebagai pernyataan apa yang harus dikerjakan oleh sistem. 3.1.2.1.2. ANALISIS KEBUTUHAN SISTEM Menganalisa sebuah system memiliki tujuan untuk memahami kebutuhan dari sebuah system yang dibangun. Kebutuhan system dapat diartikan sebagai pernyataan apa yang harus dikerjakan oleh system. 3.1.2.2. DOKUMENTASI DAN TUJUAN PROJECT (DOCUMENTATION & PROJECT DIRECTION) GAME Dokumentasi adalah sekumpulan informasi yakni mencari data mengenai hal-hal berupa catatan, agenda dan sebagainya. 3.1.3 PENULISAN CERITA GAME (GAME STORY AND WRITING) “MISI SANG KAPTEN” Cerita (Story) akan memperlihatkan bagaimana alur sebuah cerita yang dibuat mampu masuk kedalam rancangan game. Sehingga cerita yang diinginkan dapat
4
tercapai. Cerita yang telah dibuat sebisa mungkin akan disambungkan kedalam animasi game yang dibuat. 3.1.4 GAMBARAN GAME (CONCEPT ART) Didalam gambaran game (Concept Art) terdapat beberapa bagian penting untuk menunjang kelancaran pembuatan game, yaitu: Desain Karakter, Desain Map, Kontrol Karakter, dan Desain Suara (Audio). 3.1.5 MATERI PEMASARAN (MARKETING MATERIALS) Dalam tahap ini game yang akan dibuat untuk proses kedepannya harus bisa diakses oleh para penyuka game, tergantung apakah game yang dibuat bertujuan untuk edukasi atau mencari keuntungan melalui penyewaan space iklan. Dalam hal ini game Misi Sang Kapten ditujukan untuk hal edukasi. Game
Misi
Sang
Kapten
menggunakan
salah
satu
media
pemasaran
http://www.facebook.com/developers.
4. IMPLEMENTASI DAN PEMBAHASAN 4.1
IMPLEMENTASI SISTEM Implementasi adalah sebuah tahap dimana sebuah sistem digunakan oleh
pengguna. Namun, sebelum sistem digunakan oleh pengguna, sistem harus melalui tahap pengujian terlebih dahulu, untuk menghindari kesalahan-kesalahan pada pemanfaatan sistem nantinya. Implementasi dan pembahasan pembuatan game MIsi Sang Kapten melanjutkan langkah-langkah sesuai framework yang dirancang oleh david midgley yang sudah diterapkan pada Bab III.
4.1.1 IMPLEMENTASI KODE (CODE IMPLEMENTATION) Sebelum implementasi kode dilakukan, yang terlebih dahulu harus dibuat adalah rancangan kerja untuk kebutuhan game keseluruhan. Secara default yang perlu dipersiapkan diantaranya adalah layout, event sheets, object types, sound dan music. 4.1.2 PENCIPTAAN GAMBAR (ART CREATION) Tahap penciptaan gambar adalah sebuah tahapan dimana konsep gambar yang telah dirancang akan diaplikasikan kedalam game, dan pada game Misi Sang Kapten penciptaan gambar dibagi menjadi 2 langkah, yaitu penciptaan gambar untuk layout title dan layout game. 1.
Penciptaan Gambar Pada Layout Title
5
Layout title adalah tahapan untuk merancang intromenu, ini yang akan pertama kali muncul saat game dimainkan dan yang perlu dilakukan pertama kali untuk penciptaan gambar pada layout title adalah menyiapkan konsep gambar yang akan dipakai dan melakukan import file kedalam layout.
Gambar 4.1 Tampilan Saat Layout Title Play di Browser 2.
Penciptaan Gambar Pada Layout Game Layout game adalah rancangan tentang game yang berjalan saat permainan
dimana gambar, suara, teks disatukan dengan kode instruksi untuk menampilkan sebuah kondisi tertentu ke browser seperti animasi gerakan pemain.
Gambar 4.2 Tampilan Saat Layout Game Play di Browser 4.1.3 PENCIPTAAN SUARA (AUDIO CREATION)
6
pada tahap ini suara akan disisipkan kedalam event kode. File suara yang sudah disiapkan sebelumnya diimport kedalam folder sounds dan music, kenapa ada 2 macam folder? karena akan disendirikan antara suara untuk background dan suara untuk material, pada game Misi Sang Kapten folder sounds untuk suara material dan folder music untuk suara background. 4.1.4 PENGUJIAN GAME DAN PENGUJIAN KESALAHAN (PLAY-TESING AND BUGTESTING) Pengujian sistem perangkat lunak(software testing) adalah merupakan bagian dari siklus
hidup
pengembangan
sebuah
perangkat
lunak(software).
Proses
pengujian(testing) ini sangat diperlukan karena untuk memverifikasi apakah setiap unit yang dikembangkan telah memenuhi kebutuhan sistem yang telah didefinisikan pada tahapan sebelumnya. Untuk pengujian(testing) menggunakan metode Black Box Testing. 4.1.4.1. BLACK BOX TESTING Black Box testing merupakan tahap pengujian yang berfokus pada persyaratan fungsional perangkat lunak. Memungkinkan pengembang perangkat lunak untuk mendapatkan serangkaian kondisi input yang mempergunakan semua persyaratan fungsional program. Berikut ini adalah table deskripsi Black Box testing : Tabel 4.1 Black Box testing Menu
Input
Output
Status
Start
Tekan tombol
Tampilan utama
Benar
“Space”
game
Tekan tombol “arah atas, bawah, depan, dan belakang”
Tampilan player
Gerakan player ke atas, bawah, depan, dan belakang
Gerakan mengeluarkan
bergerak ke arah atas, bawah, depan, dan belakang
Tekan tombol “Shift”
roket Gerakan menembak
Benar
Player mengeluarkan
Benar
roket Tekan tombol
Player menembak
7
Benar
“Space” Kembali ke intromenu
Tekan tombol
Kembali ke
“Backspace”
intromenu
Benar
Semua fungsi key dapat berjalan dengan lancar, dari hasil tes Black Box Testing dapat diambil kesimpulan bahwa key dan sistem berjalan dengan lancar. 4.1.5 MEMPROMOSIKAN GAME (MILESTONE BUILDS) Dalam mempromosikan game yang telah selesai dibangun, fasilitas yang dirasa paling tepat untuk itu adalah dengan membuat fans page melalui media social networking facebook.com, dengan cara itu antusias para penikmat game dapat dilihat dari banyaknya like. Berikut ini adalah tampilan fans page game Misi Sang Kapten dan url bisa diakses di http://www.facebook.com/MIsiSangKapten.
Gambar 4.3 Tampilan Fans Page Game Misi Sang Kapten 4.1.6 MENERBITKAN GAME (ONGOING PUBLISHER / OWNER MILESTONES) Setelah konsep dituangkan kedalam penciptaan game dan dilakukan testing tidak mengalami masalah maka selanjutnya dilakukan proses eksporting project game menjadi file HTML 5, ini merupakan proses akhir dari perancangan game Misi Sang Kapten. Proses eksporting itu sendiri merupakan sebuah proses dimana mendeploy source code menjadi sebuah paket aplikasi yang kemudian akan dijalankan menggunakan perangkat keras. Berikut
ini
adalah
tampilan
game
http://misikapten.androios.net/.
8
saat
dijalankan
melalui
url
Gambar 4.4 Tampilan Play Game dari Self Hosting Setelah game bisa diakses melalui domain, selanjutnya adalah memasang game ke
apps
facebook,
untuk
mendaftar
anggota
melalui
link
https://developers.facebook.com/. Untuk aplikasi yang telah selesai dibuat akan mendapatkan link menuju ke appcenter. Dan game berhasil dijalankan via facebook.
Gambar 4.5 Tampilan Game Misi Sang Kapten di Facebook 4.1.7 TAHAP AKHIR (FINAL GAME) Pada tahap akhir ini akan dibahas petunjuk dan penggunaan game Misi Sang Kapten. Adapun langkah-langkahnya adalah sebagai berikut : 1.
Pastikan
perangkat
komputer
terhubung
ke
http://misikapten.androios.net/
internet
dan
buka
url atau
https://www.facebook.com/appcenter/misi_kapten. 2.
Selanjutnya akan muncul tampilan Intromenu, disana akan terdapat teks instruksi key yang dipakai saat permainan dimulai.
3.
Jika ditekan tombol keyboard “space” maka permainan akan dimulai. Dalam permainan ini musuh akan berdatangan dari depan. Yang perlu dilakukan oleh
9
player adalah menghindari atau menembak musuh. Saat musuh berhasil ditembak maka skor akan bertambah, tetapi apabila player terkena serangan musuh makan skor dan life akan berkurang. Apabila life player habis maka game akan dimulai lagi dari awal. 4.
Untuk memulai permainan kembali bisa dengan menekan tombol “backspace” maka akan kembali masuk ke Intromenu.
5.
Untuk mendapatkan hasil yang bagus setidaknya menggunakan resolusi layar 1024x768.
5. KESIMPULAN Berdasarkan penelitian dan perancangan yang penulis kerjakan dan berdasarkan dari rumusan masalah yang ada, kesimpulan yang dapat diambil dari skripsi ini adalah : 1.
Game Misi Sang Kapten berbasis HTML 5 dan dapat berjalan pada semua browser yang telah menggunakan teknologi HTML 5.
2.
Game Misi Sang Kapten dapat dimainkan secara Online menggunakan web browser.
3.
Semua gerakan dan alur permainan dapat berjalan dengan baik.
4.
Engine Construct 2 bisa digunakan untuk membuat
HTML 5.
10
game browser berbasis
DAFTAR PUSTAKA Castronova, Edward. 2006. Synthetic Worlds: The Business and Culture of Online Games. Chicago: University Of Chicago Press. N.K., Adaman. 2005. The Developmental History of Online Gaming Design. New York City: McGraw-Hill. Rollings, Andrew dan Ernest Adams. 2006. Fundamentals of Game Design. USA: Prentice Hall. Gullen, Ashley dan Thomas Gullen. 2011. Construct 2. http://www.scirra.com/construct2, diakses tanggal 10 Maret 2013. Gullen, Ashley dan Thomas Gullen. 2011. Construct 2 System Requirements. https://www.scirra.com/manual/6/system-requirements, diakses tanggal 10 Maret 2013. Gullen,
Ashley. 2011. Beginner’s guide to Construct 2. http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2, di akses tanggal 10 Maret 2013.
11
