Bagaimana Membuat Game Platformer

7/25/2019 Bagaimana Membuat Game Platformer

1/37

Bagaimana membuatgame platformerConstruct 2 bisa digunakan untuk membuat berbagai game dua dimensi

(2D). Dalam tutorial ini, kamu akan dibimbing untuk menguasai dasar-

dasar pembuatan platform game di Construct 2. Jika kamu masih awam

dengan Construct 2 dan lebih tertarik untuk membuat game berenis top-

down shooter, lihat tutorial alternatif berikut. !udah siap membuat gameplatformer" #$o kita mulai

Catatan: Jangan bertanya atau mencari bantuan dengan menulis komentar

di tutorial ini! Tapi masuklah ke forum kamiuntuk mendapat respon

terbaik untuk semua pertanyaan yang kamu punya.

%utorial ini menggunakan sprite dari bundel Jungle Platformer$ang kamu

dapat saat membeli Construct 2. !etelah kamu membeli, klik

link Download media bundledi menu #bout untuk mendapatkan bundelaset tambahan. Jika kamu menggunakan edisi gratis, kamu bisa

menggunakan gambar kamu sendiri, atau coba gunakan panduan pemula

alternatif$ang sekaligus men$ediakan semua sprite $ang kamu butuhkan.

&enginstal Construct 2

Jika kamu belum pun$a Construct 2, kamu bisa unduh 'ersi terbaru

Construct 2 di sini. rogram Construct 2 han$a tersedia untuk indows,

tapi game $ang kamu buat bisa dimainkan di mana saa, seperti &ac,

*inu+, atau iad. Construct 2 bisa di-install pada akun terbatas ($ang

bukan admin). Dan instalasin$a pun portable, adi kamu bisa install

Construct 2 di !B flashdisk dan membawan$a ke mana saa

&emulai

!etelah siap dan menginstall, alankan Construct 2. lik tombol /ile 0 New.
http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/forum/http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/construct2/releases/newhttp://www.scirra.com/forum/http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/construct2/releases/newhttp://www.scirra.com/tutorials/37/beginners-guide-to-construct-2


2/37

ada pilihan New Project, kamu tidak perlu mangubah apa-apa, cukup

klik Create project. Constuct 2 akan men$impan seluruh data proect dalam

satu file .cap. !ekarang kamu akan melihat satu layoutkosong, tampilan

desain tempat kamu membuat dan mengatur posisi berbagai obek, seperti

tampilan le'el dalam game atau la$ar menu. Dalam aplikasi lain, la$out ini

bisa uga disebut room,scene, atau rame.

Ukuran layout

ertama-tama, kita perlu ukuran la$out (le'el) $ang lebih besar dari ukuran

bawaan. lik kiri di area kosong di la$out dan akan muncul "ayout

PropertiesdiProperties Bar. 1anti ukuran le'el menadi 333 + 234.

!aatn$a untuk menata gambar latar belakang di sepanang la$out. Double-

clickarea kosong di la$out, akan muncul pilihan Insert Object. Doubleclick obekTiled Backgrounduntuk menambahkan latar belakang tersebut.


3/37

ursor mouse akan berubah menadi crosshair (tanda tambah). %idak

masalah dimana kamu menempatkan obek ini, pilih saa suatu tempat

pada la$out. #kan muncul Image editoragar kamu bisa memasukkangambar untuk menadi tile. !ekarang kita perlu import file #ackground

$mage%#ackground.pngdari paket sprite. lik icon Openuntuk

memasukkan gambar.


4/37

ilih file #ackground $mage%#ackground.png, lalu tutup image editor.

!ekarang kamu akan melihat sebagian gambar background di la$out.

ita perlu mengatur ukuran latar belakang untuk menutup keseluruhan

la$out. astikan obek tadi sudah dipilih (klik kiri pada gambar tersebut dila$out), lalu propertin$a akan muncul di Properties Bar. ntuk menutupi

keseluruhan la$out, atur Positionmenadi 3,3 dan Siemenadi 333,

234 (sama dengan ukuran la$out).

1ambar latar belakang ini cukup besar, adi akan sulit melihat

keseluruhann$a dengan le'el 5oom saat ini. amu bisa coba 5oom out

untuk melihat gambar tersebut lebih baik. %ahan !ontroldan Scroll rodamouse ke ba"a#untuk 5oom out. #tau kamu bisa pilih &iew- 'oom


5/37

outpada ribbon (menu di bagian atas Construct 2) beberapa kali. amu

sekarang bisa melihat keseluruhan la$out, dan akan terlihat seperti ini6

erlu kamu tahu bahwa garis putus-putus di sisi kanan atas menunukkan

ukuran la$ar dibanding dengan ukuran la$out keseluruhan. %ekan !rtl

$untuk kembali ke le'el 5oom 7338 atau pilih &iew- 'oom to ())*di

ribbon. emungkinan besar kamu akan melihat tengah-tengah la$out

sekarang, gunakan scrollbar untuk kembali ke bagian kiri atas dari la$out.

amu uga bisa click and drag tombol tengah mouse untuk bergerak

dengan bebas di la$out, atau tahan spasi untuk efek $ang sama kalau

kamu tidak pun$a tombol tengah mouse.

%enamba#kan layer

!ekarang kita perlu menambahkan beberapa obek lain. %api kita akan

terus-menerus memilih obek latar belakang secara tidak sengaa kalau kita

tidak bisa menguncin$a (lock) dan membuatn$a tidak bisa dipilih. ita bisa

menggunakan sistem la$er untuk mencapai hal tersebut.

*a$out bisa terdiri dari beberapa layer, $ang bisa kita gunakan untuk

mengelompokkan obek. Ba$angkan la$er adalah sekumpulan lembaran

kaca $ang ditumpuk satu sama lain, dengan ban$ak obek 9dilukis9 di setiap

lembar. :ni akan memudahkan kita mengatur obek mana $ang muncul di

atas obek lainn$a, dan la$er bisa disembun$ikan, dikunci, diberi efek

paralla+, dan masih ban$ak lagi. Contohn$a, dalam game ini, kita ingin

semuan$a muncul di atas latar belakang, adi kita bisa membuat la$er lain

di atas obek latar belakang tersebut.

ntuk mengatur la$er, klik &ayers tab, $ang biasan$a ada di

sebelah Project bar;


6/37

amu akan melihat "ayer )di daftar la$er (Construct mulai menghitung

dari angka nol, karena lebih mudah saat dihubungkan denganprogramming). lik ikon pensil dan ganti namala$er itu

menadi #ackground. !ekarang klik ikon hiau adduntuk menambahkan

la$er baru untuk obek lain kita, dan beri nama+ain. %erakhir, klik ikon

gembok di sebelah #ackgroundagar la$er tersebut menadi terkunci.


7/37

terpilih, kita bisa tidak sengaa menambahkan obek ke la$er $ang salah.

*ater $ang aktif akan muncul di status bar, dan uga muncul di tooltip saat

menempatkan obeck baru. astikan kamu memperhatikan hal ini.

&enambahkan tile

aket Jungle latformer memiliki tileset di file Tiles%Tiles.png. ita perlu

import file ini ke obek sprite dan menggunakann$a sebagai obek tile.

!eperti $ang kamu lakukan pada %iled Background, double clickdi area

kosong di la$out untuk memasukkan obek baru. ali ini pilih Sprite. ursor

mouse akan berubah kembali menadi tanda tambah, klik di mana saa di

sekitar tengah la$ar.

Image (ditorakan terbuka dengan beberapa window tambahan, karena

!prite bisa dianimasikan. %api saat ini kita tidak akan menalankan animasi,

dan kecepatann$a seharusn$a 3. ita akan men$impan satu tile dalam

setiap frame animasi. *alu kita bisa mengatur tile mana $ang muncul

dengan mengubah frame animasin$a.

)lik kananarea kosong di window *nimation +ramesdi bawah, dan

pilihImport sprite strip,,. :ni akan membuat kita bisa membuat kita

mengambil gambar berdasarkan grid dalam sprite animasi, $ang bisa ugakita gunakan di tile map.

!aat pilihan membuka file muncul, pilih file Tiles%Tiles.pngdari paket sprite.

Construct 2 perlu diberi tahu ada berapa tile dalam gambar tersebut. alau

kamu perhatikan, Tiles.pngterdiri dari 72+72 tile. :si (,dan (,lalu klik O).


8/37

Construct 2 akan memakan sedikit waktu untuk memotong-motong file

tersebut. !ekarang kamu pun$a 7 tile $ang diimport sebagai frame

animasi. ita tidak membutuhkan frame pertama $ang kosong, adi klik

kanandan pilihdelete.

amu mungkin perlu mengatur ukuran window-nimation ramesuntuk

melihat tile-tile kamu lebih baik. amu uga bisa klik kanan di area kosong

dan memilih ukuran thumbnailke ukuran *arge ika kamu mau.

ada awaln$a kecepatan animasi adalah =, $ang berarti gambar pada

setiap obek tile akan terus berubah. ita ingin setiap tile gambarn$a tetap

sama, adi kita perlu memastikan kecepatan animasin$a 3. ilih

animasi Deaultdi window-nimations.

!ekarang Properties Barakan menunukkan properti animasi tersebut.

bah nilai /peedmenadi $.


9/37

!ekarang gambar pada tile tidak akan berubah-ubah. %utup image editor

dengan menekan ikon > di salah satu dari tiga window $ang terakhir

muncul. !ekarang !prite tile kamu sudah muncul di la$out.

!aat masih terpilih, ganti nama obek !prite menadi Tiledi roperties Bar.

!elalu ganti nama obek menadi nama $ang sesuai dan elas.

%embuat pemandangan dengan tile

erhatikan bahwa obek !prite memiliki properti Initial frame. ita bisa

gunakan ini untuk mengubah tile saat ini. ilih obek tile dan ubah initial

frame-n$a menadi 7.

erhatikan pula perubahan gambar $ang sesuai dengan frame animasi 7.

:ni adalah cara kita untuk menampilkan berbagai enis tile di dalam sebuah

le'el.


10/37

Jika kamu tahan !ontroldan click-dragtile tersebut, kamu akan

menghasilkan obek tile lain. *akukan ini lagi dan akan kamu pun$a ? tile

dalam satu baris. ilih $ang di tengah dan ganti $nitial rame-n$a

menadi $. *akukan hal $ang sama dengan $ang di kanan, tapi

nilain$a .. amu akan memiliki susunan obek seperti ini6

Jika kamu ingin tahu bagaimana cara memeriksa nomor frame suatugambar dalam tile, double click tile tersebut. :mage editor akan muncul

bersama window animation $ang bisa kamu gunakan untuk memeriksa

frame-framen$a. :ngat kamu bisa control dragsebuah tile dan membuat tile

$ang sama, adi kamu tidak harus selalu mengetik initial frame-n$a.

%enyalakan snap to grid

#kan sangat sulit ika kita harus mengatur semua posisi tile agar seaar

dengan rapi. amu bisa men$alakan fitur grid untuk mempermudahmengatur obek. lik &iewdan pilih /nap to gridpada ribbon. ukuran awal

grid adalah ?2+?2, karena tile kita berukuran 724+724 dan merupakan

kelipatan dari ?2 adi akan bisa langsung kita gunakan untuk men$ambung

obek-obek tile kita dan masih memberikan sedikit kebebasan untuk

meletakkan tile.

Cobalah menggeser-geser tile sekarang, obek tile akan mengacu pada

grid ?2+?2 tersebut. !ekarang seharusn$a lebih mudah un$uk

9menempelkan9 tiga tile bersebelahan.


11/37

&enambahkan !prite pemain

!ekarang kita perlu tambahkan sprite untuk pemain. !ama seperti

sebelumn$a,double clickarea kosong di la$out untuk menambahkan

obek baru lalu pilihSprite. !aat muncul crosshair, klik di atas tile, lalu akan

muncul Image (ditor

ita perlu mengimpor sprite strip untuk animasi idlepemain. !eperti

sebelumn$a. klik kanan window-nimation ramesdan pilih Import sprite

strip,,,.

ilih file Player%$dle%$dle.png. :ngat bahwa itu adalah keseluruhan sprite

strip animasi, bukan han$a satu frame animasi. amu bisa mengimpor file-

file $ang berurutan dengan pilihan $mport rames..., tapi saat ini kita akan

menggunakan cara pertama saa,

arena strip-n$a tidak kotak, Construct 2 akan menebak umlah frame.

!eharusn$a Construct 2 akan menebak dengan benar bahwa

ada frame. likO)dan frame-frame tersebut akan diimpor.

:ngat bahwa kita masih pun$a frame kosong bawaan di awal. lik kanan

lalu hapus frame tersebut. !ekarang kamu akan pun$a 77 frame animasi

untuk animasi :dle pemain.


12/37

!ropping

amu mungkin memperhatikan pemain pun$a area transparan di

sekelilingn$a.


13/37

animasi. !ekarang gambar pemain akan sudah ter-crop dengan tidak ada

area $ang tidak perlu di gambarn$a.

%engatur titik origin

0riginadalah titik pusat atau 9titik penting9 obek $ang bersangkutan. Dalam

game platformer sebaikn$a origin disimpan di kaki pemain. :ni akan

membuat pemain akan tetap ada di lantai (dan berkembang ke atas, bukan

menembus ke bawah lantai) walaupun ada frame animasi $ang tinggin$a

berbeda-beda.

ntuk mengatur titik origin, klik Set origin and image pointsdi image

editor.

amu akan melihat titik merah muncul pada pemain, itu adalah titik origin.

amu bisa klik pada gambar untuk mengubah posisi origin. %api karena

kita ingin titik origin ada pada tengah-bawah gambar, kita bisa menekan

tombol 2 pada num pad (dengan num lock men$ala). Jika kamu tidak

pun$a num pad (misaln$a pada laptop), kamu bisa klik kanan 0riginpada

window $mage points$ang muncul, dan pilih 1uick assign- #ottom.

#kan merepotkan kalau kita harus melakukan ini untuk setiap frame,

untungn$a ada cara pintas6 klik kanan0rigindi window $mage points, lalu

pilih *pply to "#ole animation.


14/37

!ekarang titik origin seharusn$a sudah diset di setiap frame animasi.

%engulang animasi

lik animasi Defaultdi window-nimations, lalu ganti naman$a

menadi $dle.

Di Properties Bar, ganti /peedanimasi menadi /dan

atur "oopmenadi0es.

lik kanan animasi $dledi window-nimationsdan pilih Pre1ie". amu

akan lihat pemain bergerak atas bawah dengan pelan. !ekarang semua

sudah selesai, tutup pre'iew animasi dan image editor. amu akan melihat

pemain kamu di la$out.

1anti nama obek tersebut menadi Playerdi roperties bar agar lebih rapi.


15/37

&enambahkan beha'ior

Construct 2 memiliki ban$ak beha2iorbawaan, beha'ior ini akan membuat

obek kita bekera seperti $ang sudah ditentukan sebelumn$a, sehingga

bisa menghemat ban$ak waktu. ita bisa saa membuat ulang semua

beha'ior menggunakan sistem e'ent, tapi umumn$a akan sulit dan

memakan ban$ak waktu. arena itulah beha'ior sangat cocok untuk

menghemat waktu pembuatan game agar game kita lebih cepat bisa

dimainkan

Platform be#a1iorakan mengurusi secara teknis pergerakan karakter

dalam game platformer. #da tips penting dalam menggunakan beha'ior

ini6 gunakan be#a1ior ini pada sebua# objek persegi yang tidak

terli#at2tidak ditampilkan, dan gambar karakter ditampilkan di atasn$a.latform beha'ior bekera lebih baik ika obek $ang dipasangi beha'ior

tersebut tidak beranimasi, karena mengubah frame animasi di tengah-

tengah deteksi tumbukan dapat membuat karakter menempel sebagian ke

tembok dan membuat bingung latform beha'ior.


16/37

1anti nama obek ini menadi Player#o, karena obek tersebut adalah

kotak untuk pergerakan dan pemeriksaan tumbukan untuk pemain.

#tur Initial 1isibilitymenadi In1isibledi roperties bar karena kita ingin

kotak ini tidak terlihat.

ita uga perlu tambahkan beha'ior platform ke la$erBo+ agar memiliki

pemeriksaan tumbukan $ang lebih baik. &asih di properti la$erBo+

(dalam properties bar), klik *dd 2 (ditdi bagian (dit be#a1iors. ada

window $ang muncul, klik di tanda tambah.

Double-clickpada Platformbeha'ior.


17/37

amu sekarang bisa melihat ada beberapa properti baru untuk pergerakan

platform muncul dalam Properties bar. amu bisa mengatur opsi

pergerakan seperti kecepatan dan percepatan. ita perlu membuat

lompatan pemain lebih baik, atur Jump

strengt#ke $$dan 3ra1ityke 45$$.

ita uga ingin la$arn$a mengikuti pemain, adi klik lagi tombol tambah dantambahkan beha'ior Scroll to.

!etelah kita tambahkan kedua beha'ior tadi, tutup window Player

beha2iors.

%enamba#kan be#a1ior Solid

Beha'ior platform perlu tahu obek apa saa $ang bisa dia inak. emain

akan atuh menembus semua obek $ang tidak memiliki beha'ior Solid.Jadi pilih obek Tiledan tambahkan beha'ior Solid.

ita perlu tahu posisi pemain di atas la$erBo+. indahlah ke (1ent S#eet

. Di sini kita akan menetapkan logika game menggunakan sistem e'ent

pada Construct 2.

%embuat e1ent

A'ent bekera dengan mengui apakah suatu conditiondipenuhi, ikai$a, action$ang bersangkutan akan dialankan


18/37

Dalam kasus ini, kita ingin posisi pemain selalu ada di atas Player#o.

ntuk melakukan hal ini kita perlu mengupdate posisi pemain setiap tick,

atau frame dalam game kita.

Double click area kosongdi A'ent !heet iew untuk membuat e'entbaru.

Doubel clickobek System, $ang men$impan kondisi 42ery tick.

!ekarang ktia memiliki e'ent kosong $ang akan menalankan aksin$a

setiap tick6

)lik '*dd action'.


19/37

e want to position Player, so double-click 'Player'.

ita ingin mendapatkan posisi pemain (Player), adi double click 'Player'.

Double click/et position to another object. ntuk Object, klik 5click to

choose6dan pilih Player#o. Biarkan $mage pointbernilai 3 (mengacu padatitik origin).)lik 'Done''. %ampilan e'entn$a akan seperti ini6

!emoga ini masuk akal untuk kamu6 kita selalu mengatur posisi pemain di

atas obek la$erBo+, $ang merupakan obek dengan beha'ior pergerakan.

Jalankan game dengan klik tombol pla$ di kiri atas title bar.


20/37

Bergerak dan loncatlah menggunakan tombol panah. !ekarang 'ersi awal

dari game platformer kamu sudah bisa dimainkan

Beberapa masala#

Jika kamu coba main-main maka akan terlihat beberapa masalah6

7. emain tidak bisa menghadap kiri

2. Belum ada animasi lain.

#$o kita perbaiki hal-hal ini ertama, kita perlu buat pemain bisa

menghadap kiri dan kanan.

ertama-tama, kembali ke tampilan la$out menggunakan tab di bagian

atas.Double clickla$out untuk memasukkan obek, pilih obek )eyboard.

arena obek tersebut adalah sebuah obek input, adi tidak perlu kita

tempatkan di mana pun, fungsin$a han$a membuat input ke$board bisa

diakses oleh proect.

ita tidak perlu membuat animasi lengkap di mana pemain menghadap kiri,

kita bisa menggunakan aksi /et mirrored, $ang akan secara otomatismembalik arah obek agar menghadap ke arah sebalikn$a (dalam kasus ini

pemain akan menghadap ke kiri).

embalilah ke A'ent !heet. ita akan membuat e'ent baru dengan kondisi

!aat tombol panah kiri ditekan, dan aksi !et pemain menadi mirrored.

Double clickarea kosong untuk membuat e'ent baru, atau klik link-dd

e2ent.Double clickobek e$board agar bisa menggunakan kondisi saat

tombol ditekan.


21/37

Daftar semua kondisi untuk obek e$board akan muncul. Double

clicke'entOn key pressed.

Construct 2 perlu tahu tombol apa $ang ingin kamu deteksi. lik

tombol 6click to c#oose7, tekan tombol pana# kirilalu tekan O).lik Done.

!ekarang kita perlu menambahkan aksi kita6 !et pemain menadi

mirrored. !eperti sebelumn$a, pilih obek, lalu pilih tipe kondisi atau aksi,

lalu masukkan parameter $ang dibutuhkan. lik link *dd actiondi sebelah

kanan e'ent kita sebelumn$a. (astikan kamu tidak salah klik-dd e2ent)


22/37

Double click Player0 Double click Set mirrored0 Biarkan

staten$a +irroredlalu klik Done.

!ekarang kamu akan memiliki e'ent seperti ini6

!ekarang tamba#kan sebua# e1ent lain, double click area kosong atau

klik link-dd e2ent.

!ekarang kita lakukan proses $ang sama, tapi buat e'ent Saat tombol

pana# kanan ditekan, dan set pemain Not mirrored.


23/37

ntuk melihat lebih baik, kita bisa perbesar ukuran window. lik nama

proect di bagian atas Project #aruntuk menampilkan properti proect ini,

ubah 8indo" Sieke 7))89)).

!ekarang karena sudah ada platform untuk melompat dan la$ar $ang lebih

besar sehingga kita bisa melihat lebih ban$ak hal, kita akan tambahkan

animasi pemain $ang lain.

:ngat kita menggunakan aksi /et mirroreduntuk membalik pemain ke

kanan dan kiri, adi kita cukup mengimpor animasi dengan pemain

menghadap ke kanan.

Double clickpemain di tampilan *a$out untuk memunculkan animations

editor. #da empat animasi $ang akan kita import6

7. :dle ke lari (tween)

2. *ari

?. *ompat ke lari

. *ari ke berdiri


24/37

ntuk setiap animasi di atas, proses menambahkann$a adalah sebagai

berikut6

7. )lik kanandi animation bar (kemungkinan window $ang mela$ang di

kanan $ang berisi animasi $dle) dan pilih *dd animation.2. &asukkan nama animasi. 1unakan nama $ang mudah dimengerti

seperti$dleToun.

?. lik animasi tadi untuk pindah ke animasi tersebut. !aat ini seharun$a

han$a ada satu frame kosong.

. )lik kanandi #nimation frames bardan pili# :mport sprite strip....

(kemungkinan ada di bawah dan berisi frame-frame animasi $ang

bersangkutan)

=. %emukan sprite strip $ang diinginkan. erlu diketahui pake Jungle sprite

uga tersedia dalam E1 $ang terpisah dan bisa diimpor per frame, tapibiasan$a akan lebih cepat menggunakan sprie strip. Jadi sekarang pilih

strip animasi $ang lengkap

F. eriksa apakah umlah sel-n$a sudah benar, lalu klik G.

@. 9apusframe kosong $ang pertama, kita tidak akan membutuhkann$a.

4. Di frame pertama, tempatkan origindi kaki pemain. Cobalah untuk

men$amakan posisin$a dengan animasi $dle. %erapkan ke semua frame

animasi seperti $ang kita lakukan pada animasi $dle(klik kanan titik Grigin

pada daftar dan pilih-pply to whole animation).

4. Ta#an s#iftdan tekan !ropuntuk memotong (area sisa $angtransparan) di semua frame sekaligus.

H. Di roperties Bar, pastikan setiap animasi memiliki properti berikut6

!peed6 44pada animasi Jumprom/tand, 5untuk sisan$a

*oop60espada animasi un, :ountuk sisan$a

*akukan ini untuk setiap animasi sehingga kita pun$a lima animasi untuk

pemain.

%utup animation editor. !ekarang kita perlu memberi tahu obek pemain

kapan suatu animasi perlu dialankan. ntuk melakukan ini, beha'ior

platform men$ediakan animation trigger- e'ent $ang akan dialankan

dalam kondisi pemain perlu mengganti animasi. ita cukup menggunakan


25/37

aksi /et animationpada obek pemain. erhatikan bahwa latform beha'ior

ada pada obekPlayer#osedangkan animasi ada pada obek Player.

erhatikan pula kita memiliki animasi $dleToun, artin$a saat kita mulai

bergerak, animasi akan beralan seperti berikut ini6

Berhenti6 $dle

&ulai bergerak6 $dleToun

!aat $dleTounselesai6 un


26/37

Open full sie image

erhatikan sekarang kita sudah menggunakan sub-e1ent, $ang akanmuncul di bawah e'ent on Jump. !ub-e'ent akan diperiksa setelah e'ent9induk9 sudah dialankan.


27/37

!etelah kamu set semua e'ent tadi, alankan gamen$a. !elamat !ekarangkamu sudah membuat karakter pemain $ang beranimasi erhatikananimasi-animasi $ang berbeda ika kamu melompat dari keadaan diam

atau melompat dari keadaan berlari. erhatikan pula saat kamu mendarat,kamu akan melihat animasi :dle atau kembali ke animasi Iun, tergantungkamu bergerak atau tidak.

!ekarang saatn$a kita membuat karakter musuh

&enambahkan musuh

!emoga sekarang kamu sudah familiar dengan proses menambahkan

sprite dan animasi. Jadi untuk men$ingkat tutorial, langkah-langkahlengkapn$a tidak akan diulang. !ekarang tambahkan sebuah sprite baru

untuk musuh.

7. %ambahkan obek !prite baru di la$out.

2. :mport sprite strip 4nemies%/nail.

?.


28/37

ntuk membuat pemain men$ala, pilih obek pemain dan tamba#kan

be#a1ior +las#. astikan memilih obek pemain, bukan obek la$erBo+

(karena obek pemain $ang terlihat $ang ingin kita buat men$ala). ita akan

gunakan action 9/lash9 dari beha'ior tersebut.

indah ke sheet 'iew, tambahkan sebuah e'ent baru6

la$erBo+ -0 Gn collision with another obect -0 !nailAnem$

A'ent ini akan dialankan ketika kita bertabrakan dengan !nailAnem$ dari

sudut manapun. *alu kita bisa menggunakan sub-e'ent untuk memeriksa

apakah pemain melompati musuh dari atas atau berlari dari samping.

ertama kita perlu memeriksa apakah pemain ada di atas tanah.

%ambahkan sebuah sub-e'ent pada e'ent collision sebelumn$a6

la$erBo+ -0 :s falling

ita uga perlu memeriksa apakah pemain ada di atas musuh.


29/37

Open full sie image

ita belum selesai6 lik-kanan di bagian luar e'ent is falling9 (area disebelah kiri icon la$erBo+), dan pilih-dd ;6 4lse. 9Alse9 adalah kondisikhusus $ang akan dialankan ketika e'ent sebelumn$a tidak dialankan.!ehingga e'ent ini han$a akan dialankan ika kita bertabrakan dengankeong tapi kita tidakmenginakn$a dari atas, misaln$a karena kitamenabrakn$a dari samping. Di e'ent ini kita akan membuat pemain terluka.

%ambahkan action6

la$er -0 /lash -0 (biarkan nilai default dan pilih Done)

:ngat bahwa beha'ior /lash ada di obek la$er, bukan la$erBo+.

Open full sie image

!aat ini pemain belum bisa mati, han$a men$ala ketika terluka. %api kitasudah bisa membedakan apakah pemain menabrak musuh dari samping

atau menginakn$a dari atas. %utorial ini tidak akan membahas semuaaspek dalam game platformer, tapi semoga kamu sudah pun$a gambaranbagaimana cara membuat efek pemain mati (cobalah dengan membuatsebuah sprite 9poof9 saat musuh mati dengan menggunakan aksi 9!pawnobect9 pada obek !nailAnem$), dan bagaimana caramengurangi darahpemain (pada e'ent $ang membuat pemain men$ala).amu bisa pelaari implementasi darahLn$awa pemain di Tutorial top-do"n s#ooter, $ang ada baikn$a kamu lihat setelah tutorial ini.

!ekarang kita perlu buat musuh keong bergerak mondar mandir sepanang

platform.
https://www.scirra.com/images/articles/jumpfromaboveevent.pnghttps://www.scirra.com/images/articles/finishedjumpabove.pnghttp://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2https://www.scirra.com/images/articles/jumpfromaboveevent.pnghttps://www.scirra.com/images/articles/finishedjumpabove.pnghttp://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2


30/37

%enggerakkan musu#

%antangan utama menggerakkan keong adalah bagaimana cara

mendeteksi kapan dia mencapai uung sebuah platform. Cara termudah

untuk melakukan ini adalah dengan membuat obek penanda 9uung9.enanda ini han$alah sprite $ang tidak terlihat $ang akan membalik arah

keong ketika mereka men$entuh penanda.

ita bisa uga menggunakan beha'ior latform uga untuk keong musuh.

:ni akan memudahkan karena6

- &usuh akan bisa bergerak ke kanan dan kiri

- &usuh akan menaiki dan menuruni bukit seperti pemain

- &usuh bisa atauh dari pinggiran platform ika kita ingin seperti itu

- Jika kita ingin membuat musuh $ang bisa melompat, kita bisa membuatmusuh otomatis melompat dengan menggunakan action 9!imulate control9.

Tamba#kan be#a1ior Platform ke sprite Snail(nemy. arena kita tidak

akan menggunakan animasi $ang kompleks untuk obek ini, kita aman

menggunakan beha'ior platform langsung pada obek tanpa menggunakan

obek kotak tidak terlihat seperti pada obek pemain. erlu diketahui kalau

kamu membuat platform game dengan musuh $ang membutuhkan animasi

kompleks, kamu perlu menggunakan teknik kotak tidak terlihat seperti $ang

kita gunakan untuk obek pemain.

ita tidak ingin pemain mengontrol !nailAnem$, kita ingin mengaturn$a

untuk bergerak otomatis. ita bisa lakukan ini dengan mengatur Default

controlsmenadi :o, lalu gunakan action /imulate control. arena keong

cukup lambar, atur +a

speedmenadi


31/37

eong musuh uga perlu tahu ke arah mana dia sedang bergerak, antara

ke kiri atau ke kanan. ita bisa lakukan ini dengan Instance 1ariable, $ang

merupakan angka atau teks $ang disimpan di setiap instance obek $ang

bersangkutan. Jika kita memiliki ban$ak keong, masing-masing akan

men$impan instance 'ariabel mereka masing-masing secara terpisah.


32/37

lik O)dan tutup dialog instance 'ariable, lalu pindahlah ke e'ent sheet.

ita perlu implementasi logika berikut6

- Jika actionbernilai right, simulasikan pergerakan obek platform seperti

menahan tombol kanan agar keong bergerak ke kanan.

- Jika actionbernilai left, simulasikan pergerakan obek platform seperti

menahan tombol kiri agar keong bergerak ke kiri.

Dan6

- Jika keong menabrak 4dge+arker, putar balik nilai action(ika left

menadi right, dan ika right menadi left).

ita bisa atur pergerakan dengan menggunakan dua e'ent berikut6

A'ent6 !nailAnem$ -0 Compare instance 'ariable -0 actioneMual to right

(gunakan tanda petik untuk menandakan nilai berupa teks)

#ction6 !nailAnem$ -0 !imulate control -0 Iight

ita perlu buat e'ent dan action $ang serupa untuk arah kiri. ita uga perlu

memutar gambar keong ke kanan dan kiri seperti $ang kita lakukan untuk

obek pla$er. Jadi tambahkan /nail4nemy ;6 /et mirrored ;6 +irroredpadae'ent kiri, dan /nail4nemy ;6 /et not mirrored ;6 Not mirroreddi e'ent

kanan.


33/37

Open full sie image

!ekarang untuk membalik arah keong di uung platform6

A'ent6 !nailAnem$ -0 Gn collision with another obect -0 Adge&arker!ube'ent6 !nailAnem$ -0 Compare instance 'ariable -0 actioneMual to

right

#ction6 !nailAnem$ -0 !et 'alue -0 actionto left

!ube'ent6 Alse

#ction6 !nailAnem$ -0 !et 'alue -0 actionto right

enting untuk menggunakan else, karena semua e'ent akan dialankan

dari atas ke bawah. Jika kita tidak menggunakan elsedan han$a action

e3ual to >let>, perhatikan bahwa e'ent sebelumn$a baru saa mengubahnilai action menadi left, langsung berubah lagi nilain$a menadi right,

tanpa memberikan dampak $ang berarti. Dengan menggunakan else, kita

mencegah e'ent kedua dialankan ika e'ent pertama dialankan.

Jalankan proectn$a. erhatikan sekarang keong bergerak bolak balik di

platformn$a, dan membuat platform tersebut lebih sulit untuk dilompati. :ni

adalah contoh sistem intelenjensi buatanatau #: $ang sederhana, tapi

semoga kamu sekarang memiliki ba$angan bagaimana cara membuat

musuh $ang lebih pintar dengan mengatur pergerakann$a dengan lebih

ban$ak e'ent, bahkan mungkin membuat mereka bisa atuh dari platform,

atau menggunakan penanda lain untuk membuat musuh melompat

seakan-akan tahu bagaimana cara melompat dari platform ke platform.

Cobalah membuat platform dengan dua keong, perhatikan bahwa mereka

mengatur pergerakann$a masing-masing, karena tiap keong memiliki

'ariabelinstance$ang men$impan nilai actionmereka masing-masing.

!emoga dengan ini kamu mulai bisa melihat seberapa pentingn$a instance

'ariable untuk mengatur instance obek secara independen (mereka tidak

harus melakukan hal $ang sama persis satu sama lain di saat $ang sama).
https://www.scirra.com/images/articles/snailcontrolevents.pnghttps://www.scirra.com/images/articles/snailcontrolevents.png


34/37

Gbek $ang bisa ditembus

Jika kamu sudah meletakan beberapa tile, kamu akan lihat bahwa kalau

kamu melompat tepat di bawah platform kamu akan menabrak platform

tersebut di kepala dan akan atuh kembali ke bawah. Bagaimana caramembuat platform $ang bisa kita naiki dari bawah" :ni adalah kegunaan

beha'ior Jump-t#ru. amu bisa berdiri di atas obek Jump-thru seperti

platform lain, tapi pemain bisa melompat menembus platform ini dari

bawah.

!ekarang kita perlu buat 'ersi Jump-thru dari obek %ile kita. )lik-

kananobek %ile dan pilih !lone object type. :ni akan membuat obek

terpisah Tile,$ang bisa memiliki beha'ior $ang berbeda. 9apusbeha'ior

!olid dan tamba#kanbeha'ior Jump-thru.

1unakan tile 7? dan 7?= untuk membuat platform ump-thru seperi ini6

Jalankan game kita. erhatikan bahwa kamu bisa melompati platform

tersebut dari bawah.

!emoga sekarang kamu cukup menguasai cara mendesain satu le'el

lengkap. :ni adalah tampilan 5oom out dari le'el design $ang sudah dibuat,

untuk menunukkan seperti apa $ang bisa dicapai dengan le'el design.

erhatikan penggunaan penanda di beberapa platform untuk membuatkeong tidak atuh dari platform.


35/37

Open full sie image

Paralla;

Coba tambahkan efek paralla+ untuk membuat background terlihat lebih

auh. ilih la$er #ackgrounddi daftar la$er. Di bagian properties, set

nilai Parallamenadi 5$< 5$(setengah dari kecepatan bergerak la$er

lainn$a). erhatikan bagaimana background bergerak lebih lambat dan

membuat kesan auh. 1unakan beberapa la$er dengan nilai paralla+ $ang

berbeda untuk membuat kesan ?D pada game 2D.

esimpulan

%utorial ini sudah membahas ban$ak hal, kamu mungkin perlu untuk

membaca ulang tutorial ini suatu saat nanti. Berikut adalah beberapa poin

penting6

- ntuk beha'ior latform pada obek pemain, sebaikn$a kita

menambahkan beha'ior tersebut ke sebuah kotak $ang tidak terlihat $ang

tidak beranimasi. osisikan obek pemain $ang beranimasi di atas kotaktersebut.


36/37

tutorial ini.

- &usuh uga bisa diatur dengan beha'ior platform. bah nilai Deault

controlsmenadi Nodan gunakan action /imulate controluntuk mengatur

pergerakan secara otomatis.

- amu bisa memeriksa apakah pemain 9menginak9 musuh atau menabrakdari samping dengan mengui apakah pemain sedang atuh ($s alling) dan

posisin$a ad di atas musuh pada sumbu K saat bertabrakan. Jika tidak

(gunakan 4lse), pemain pasti sedang berlari menabrak musuh dan

harusn$a menadi terluka.

- :nstance 'ariable bisa men$impan angka atau teks $ang berbeda pada

setiap instance obek. :ni membantu kita untuk mengontrol obek secara

terpisah, $ang bisa digunakan untuk membuat inteleensi buatan atau-$.

- enanda uung platform adalah cara cepat dan mudah untuk membuat

musuh bergerak mau mundur di sebuah platform.- Jump-thru adalah platform $ang bisa dilompati dari bawah.

- aralla+ adalah efek $ang mudah namun menarik untuk ditambahkan

pada game platform.

Bisa kamu lihat kita belum memiliki satu game platformer $ang lengkap,

tapi tutorial ini sudah membahas beberapa aspek paling sulit namun

mendasar dari game platformer $ang perlu diketahui oleh semua pembuat

game platformer. Dari sini diharapkan kamu sudah memiliki gambaran

bagaimana melengkapi komponen lainn$a dari game platform. #kan butuhwaktu untuk membiasakan diri dengan Construct 2, namun mencoba hal

baru bisa men$enangkan sekaligus mengaari kita ban$ak hal. Jadi angan

ragu untuk meluangkan waktu bermain-main dengan fungsi $ang ada,

merusak, atau memperbaiki berbagai fitur, dan lihat sendiri game seperti

apa $ang bisa kamu hasilkan !elamat berkar$a

Bacaan lanjutan

amu mungkin akan tertarik dengan panduan pemula alternatif, $angmerupakan tutorial membuat top-do"n s#ooter. %utorial tersebut

membahas beberapa hal $ang berbeda seperti membuat tampilan

antarmuka, dan lebih auh tentang instance 'ariable. Dua hal ini adalah fitur

$ang bisa diterapkan uga pada platform game, adi pasti akan ada

manfaatn$a ika kamu mengikuti tutorial tersebut setelah ini.

Jika kamu ingin menambahkan musik dan efek suara, lihat bagian Sound

= %usicdi panduan.

Jika kamu ingin tahu lebih lanut tentang bagaimana kera e'ent dalam
http://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/manual/84/sounds-musichttp://www.scirra.com/manual/84/sounds-musichttp://www.scirra.com/tutorials/37/beginners-guide-to-construct-2http://www.scirra.com/manual/84/sounds-musichttp://www.scirra.com/manual/84/sounds-music


37/37

Construct 2, lihat bagian 9o" (1ents 8orkspada panduan. !angat

disarankan untuk kamu membacan$a agar kamu bisa bekera lebih cepat

dalam membuat game Dan untuk informasi lebih ban$ak lagi, angan lupa

ada dokumentasi lengkap dalam panduan.

nlock $our full gamede' potential

Upgrade to t#e Personal (dition of !onstruct 4, it has wa$ more

features and won9t holding back from making mone$ and using $our full

creati'it$ like the free edition does. :t9s a one off pa$ment and all Construct

2 editor updates are free for life

iew dealslus, it9s got a lot of additional features that will help $ou sa'e time and

make more impressi'e games
http://www.scirra.com/manual/75/how-events-workhttp://www.scirra.com/manual/1/construct-2https://www.scirra.com/store/bundles?itemID=31&sort=2&action=tutbund&utm_source=EndOfTut&utm_medium=Bundles&utm_content=253&utm_campaign=Tutorialhttps://www.scirra.com/store/bundles?itemID=31&sort=2&action=tutbund&utm_source=EndOfTut&utm_medium=Bundles&utm_content=253&utm_campaign=Tutorialhttp://www.scirra.com/manual/75/how-events-workhttp://www.scirra.com/manual/1/construct-2https://www.scirra.com/store/bundles?itemID=31&sort=2&action=tutbund&utm_source=EndOfTut&utm_medium=Bundles&utm_content=253&utm_campaign=Tutorialhttps://www.scirra.com/store/bundles?itemID=31&sort=2&action=tutbund&utm_source=EndOfTut&utm_medium=Bundles&utm_content=253&utm_campaign=Tutorial

Documents

Bagaimana Membuat Game Platformer