Anda di halaman 1dari 115

PEMROGRAMAN GAME

JOB SHEET MINGGU KE-2

Dosen : Nurseno Bayu Aji, S.Kom,M.Kom


NIP : 1991032019031010

PROGRAM STUDI TEKNIK INFORMATIKA


JURUSAN TEKNIK ELEKTRO
POLITEKNIK NEGERI SEMARANG
2019/2020
I. Tujuan Instruksional Khusus
Setelah melekukan praktikum ini Mahasiswa mampu memahami dan menerapkan
konsep dasar game.

II. Dasar Teori

III. Alat dan Bahan


1. PC / Laptop

IV. Materi
Untuk memahami elemen dasar untuk membuat game, kali ini kita akan mempelajari
aspek-aspek minimal pembuatan game dalam Unity, seperti Sprite, Input, Scene dan Audio.

A. Sprite
Sprite adalah obyek grafis 2D yang digunakan untuk game 2D. Jika Anda terbiasa
bekerja dalam 3D, sprite pada dasarnya hanya menggunakan tekstur standar. Namun,
demi efisiensi dan kenyamanan selama pengembangan, terdapat teknik khusus untuk
menggabungkan dan mengelola tekstur sprite tersebut.
Banyak file type yang mendukung sprite seperti PSD, TIFF, JPG, TGA, PNG, GIF,
BMP, IFF, dan PICT. Untuk meng-import gambar dengan multi-layer maka baiknya
Anda gunakan PSD atau TIFF. Untuk memasukkan gambar tidak transparan gunakan
JPEG, Tetapi, kalau gambarnya transparan lebih baik gunakan PNG.
Untuk ukuran asset Sprite -misalnya dengan resolusi 1280x720- dianjurkan untuk
mendesain asset menggunakan resolusi tersebut. Dengan contoh gambar background
1280x720, maka kita gunakan ukuran obyek yang lebih kecil, misalnya 512x512.
Dengan menyesuaikan ukuran , diharapkan asset yang tampil tidak pecah karena
diperbesar atau diperkecil. Lebih lanjut, dengan ukuran asset yang tepat dan tidak terlalu
besar, ukuran berkas jadi lebih optimal.
Tools yang digunakan untuk mengolah gambar antara lain : Adobe Photoshop
(berbayar), Paint.net (gratis), Gimp (gratis).
Dengan tools tersebut Anda dapat mengedit gambar sesuai kebutuhan, seperti
membuat, memotong, mengatur resolusi, mengatur warna gambar, dan banyak lagi.
Sementara untuk mencari gambar, Anda dapat menggunakan bantuan Google Images.
Tapi ingat, perhatikanlah lisensi dari masing-masing gambar yang digunakan. Beberapa
situs yang menyediakan asset game secara gratis antara lain:
https://itch.io/game-assets/free
http://www.gameart2d.com/freebies.html
https://opengameart.org/
https://kenney.nl/assets
1. Memasukkan Asset ke dalam Proyek
 Extract file zip yang telah diunduh.
 Copy kedua folder Images dan Audios hasil dari extracted zip tersebut.
 Buka File Explorer, tempatkan langsung ke dalam folder Assets C:\Users\
nama_PC_kalian\My project (default)
Atau lewat menu “Assets”  “Show in Explorer” :

Dari Editor Unity, Folder yang sudah dikopikan di atas akan otomatis muncul
pada window Project → Assets :
2. Mengatur Format Gambar
Guna membuat berkas gambar yang support object 2D dengan ukuran lebih
optimal, aturlah spesifikasi gambar pada pada jendela Inspector. Langkah-
langkahnya sebagai berikut:
 Klik gambar Battleback2.png yang terdapat di Jendela Project.
 Buka Jendela Inspector.
 Atur tipe tekstur dengan Sprite (2D and UI).
 Atur Max Size 2048.
 Tekan tombol Apply untuk menerapkan pengaturan pada gambar
Battleback2.png
Pembahasan
Untuk membuat object 2D, tipe yang digunakan adalah Sprite (2D dan UI)

Jika kita set up proyek kita dengan mode 2D, otomatis semua gambar yang
dimasukkan memiliki tipe tekstur Sprite (2D and UI). Sedangkan jika menggunakan
mode 3D, otomatis semua gambar yang dimasukkan menggunakan format default.
Kemudian untuk size dan ukuran berkas gambar, aturlah di panel di bawah ini: .

Secara default, maksimal ukuran resolusi gambar adalah 2048x2048. Jika


lebih dari itu, Anda harus mengubah Max Size sampai batas maksimal 8192x8192.
Jika nilai max size lebih kecil dari pada ukuran resolusi gambar, maka gambar akan
mengikuti resolusi max size. Alhasil, gambar menjadi lebih kecil. Oleh karena itu,
diperlukan pengaturan max size yang tepat. Nilainya merupakan kelipatan angka 2
dengan ukuran minimal 16x16 dan maksimal 8192x8192. Jika ukuran gambar Anda
adalah 1280x720 maka sebaiknya ukuran max size yang digunakan lebih besar dan
mendekati ukuran tersebut yaitu 2048x2048.Untuk lebih detailnya, kunjungi tautan
ini: https://docs.unity3d.com/Manual/class-TextureImporter.html

3. Memasukkan Gambar (Sprite) ke Editor Game


Setelah tipe tekstur sudah sesuai dengan asset untuk 2D, selanjutnya
masukkan gambar (sprite) ke editor Game. Caranya:
 Klik gambar Background.png pada jendela project.
 Drag gambar Background.png dari jendela project ke jendela Hierarchy.
 Atur posisi GameObject gambar tersebut di Inspector dengan nilai posisi x: 0,
y: 0 dan z:0.

Hasilnya sebagai berikut:

Catatan: Anda tidak dapat langsung menampilkan gambar di jendela Game


dengan memindahkan (men-drag) gambar ke jendela Game. Yang benar, lakukanlah
dengan 2 cara, yaitu men-drag gambar ke jendela Hierarchy atau ke jendela Scene.
Pembahasan
Setiap obyek gambar yang dimasukkan ke jendela Hierarchy/Scene maka
object gambar tersebut menjadi GameObject. GameObject adalah satuan object di
Unity yang terdapat satu atau banyak komponen sebagai penyusunnya.
Kemudian pada Inspector Gambar, terdapat 2 komponen Transform dan
Sprite Renderer sebagai berikut:

Komponen Transform digunakan untuk mengatur posisi, rotasi, dan skala.


Sedangkan Komponen Sprite Renderer digunakan untuk menampilkan gambar ke
GameObject. Anda dapat meminimalisasi tampilan komponen dengan cara klik
segitiga pada sebelah kiri atas komponen. Jika menjumpai ikon checkbox pada
komponen, ia digunakan untuk men-disable atau men-enable komponen tersebut.
Lebih lanjut, komponen Transform adalah komponen yang harus ada untuk
setiap GameObject. Ketika membuat GameObject baru, komponen ini tercipta
secara otomatis.

Nilai x mengatur pergeseran ke kanan dan ke kiri. Nilai y mengatur


pergeseran ke atas dan ke bawah. Sedangkan nilai z mengatur kedalaman suatu
obyek.
Sementara itu, komponen Sprite Renderer merupakan komponen tambahan
yang secara default ada ketika memasukkan gambar ke Hierarchy. Komponen
tersebut digunakan untuk menampilkan gambar.

Anda dapat mengganti gambar tersebut dengan men-drag gambar ke field


Sprite. Cara lainnya, klik ikon lingkaran kecil di sebelah kanan kemudian pilih
gambar yang akan digunakan. Anda juga dapat mengatur warna pada gambar
dengan mengatur field Color.
Anda pun bisa mengatur komponen pada GameObject dengan klik ikon
setting. Kemudian akan muncul menu seperti di bawah ini:

Berikut ini penjelasan fungsi masing-masing:

 Reset: mengatur ulang nilai yang terdapat di komponen.


 Move to Front: memindahkan posisi urutan GameObject di Hierarchy
lebih ke atas (Hanya dapat dilakukan di komponen Transform).
 Move to Back: memindahkan posisi urutan GameObject di Hierarchy
lebih ke bawah (Hanya dapat dilakukan di komponen Transform).
 Remove Component: menghapus komponen di Inspector.
 Move Up: memindahkan posisi urutan Component di Hierarchy lebih ke
atas.
 Move Down: memindahkan posisi urutan GameObject di Hierarchy
lebih ke bawah.
 Copy Component: menyalin komponen.
 Paste Component As New: menempatkan komponen baru dari yang
telah disalin beserta nilai-nilainya.
 Paste Component Values: menempatkan nilai dari komponen yang
telah disalin.
 Select Material: memilih material yang digunakan.
Setiap komponen memiliki menu yang sedikit berbeda. Di atas adalah salah
satu contoh menu setting pada komponen Sprite Renderer.

B. Camera

Setiap membuat proyek baru di Hierarchy, secara default ada Main Camera. Area
Camera ditandai dengan garis yang berwarna putih. Anda dapat mengetahui Area
tersebut dengan memilih (select) Main Camera pada jendela Hierarchy.

Area camera tersebut merupakan tampilan (view) yang akan ditampilkan di jendela
game. Objek yang berada di luar jangakauan kamera tidak dapat ditampilkan di jendela
game.Oleh karena itu, kita perlu menyesuaikan resolusi yang terdapat di jendela Game.
Di Unity secara default menggunakan Free Aspect yang rasionya mengikuti rasio di
Jendela Game.
Berikut ini adalah resolusi dari beberapa peranti (device) :
 QVGA (320×240)
 HVGA (480×320)
 WVGA (800×480)
 FWVGA (854×480)
 DVGA (960×640)
 WSVGA (1024×600)
 XGA (1024×768)
 WXGA (1366×768 / 1360×768 / 1280×800)
 QXGA (2048×1536)
 qHD (960×540)
 HD (1280×720)
 FHD (1920×1080)
 QHD (2560×1440)
Anda dapat memilih / menambahkan rasio atau nilai nilai fixed resolusi. Cukup klik
tanda plus kemudian masukkan nilai sesuai dengan resolusi peranti yang Anda
kembangkan. Perbedaannya adalah sebagai berikut:

 Free Aspect, Dengan menggunakan Free Aspect, maka tampilan akan lebih
fleksibel dengan menyesuaikan view pada resolusi jendela Game. Tampilan
dapat terlihat lebih besar atau lebih kecil.
 Menggunakan resolusi 1024x768 atau sama juga dengan menggunakan
perbandingan 4:3 dari kelipatan 256.

 Menggunakan rasio 16:9, maka akan terlihat terpotong di setiap sisinya karena
menyesuaikan ukuran tersebut.
Jadi, penggunaan resolusi yang lebih lebar akan lebih aman. Anda juga dapat
membayangkan tampilannya jika game Anda dibuka di beberapa peranti.

Mengatur Resolusi Game


Resolusi aset sesuai dengan resolusi target peranti yaitu 1280x720 atau 16:9. Asset
yang akan digunakan semestinya juga menggunakan resolusi tersebut. Untuk itu, kita
perlu mengatur resolusi pada jendela Game sebagai berikut:
Buka jendela Game, kemudian atur resolusi menjadi 16:9.
Klik salah satu gambar

Buka Inspector, atur nilai Pixels Per Unit menjadi 72, lalu klik Apply.

Hasilnya seperti berikut:


Output gambarnya memiliki resolusi 1280x720 dengan tampilan luas yang sama
dengan resolusi pada game. Perhatikan bahwa rasio antara keduanya -tampilan gambar
dan game- sama-sama 16:9. Resolusi 1280x720 adalah kelipatan 80 dari rasio 16:9. Jika
ukuran tampilan gambar tidak sama dengan ukuran resolusi, maka pastikan skala
gambar adalah 1,1,1.

Pembahasan
Di modul ini, pembelajaran menggunakan resolusi 1280x720 atau dengan
perbandingan rasio 16:9. Sedangkan penentu berapa tinggi area yang ditampilkan
adalah dari nilai Size pada Inspector Main Camera dengan nilai default 5.

Kemudian untuk memahami resolusi pada unity, Anda dapat melihat gambar di
bawah ini:
Resolusi yang digunakan adalah 1280x720 atau perbandingan 16:9. Titik 0,0 sampai
garis atas dengan jarak 5 unit merupakan ukuran Camera Size sehingga total jarak garis
bawah sampai garis atas adalah 10 unit. Untuk menentukan berapa pixel per unit, kita
dapat memperolehnya dengan cara 720 px dibagi dengan 10 unit sehingga didapat nilai
72 px / unit.

C. Parent dan Child


Di jendela Hierarchy ada 2 (dua) kondisi yang terjadi pada GameObject, yaitu sebagai
Parent atau Child. Perbedaan antara keduanya dapat digambarkan sebagai berikut:

Untuk mengelola Child pada GameObject ada beberapa cara:

 Klik kanan pada GameObject di Hierarchy kemudian pilih object lain misal Cube. Secara
otomatis Cube baru tersebut merupakan Child dari GameObject tersebut.
 Menambahkan Child dengan men-drag GameObject  yang ingin dijadikan Child ke dalam
GameObject yang akan dijadikan sebagai Parent. 

 Untuk melepas Child dari Parent, Anda dapat men-drag Child tersebut ke luar GameObject
yang sebelumnya menjadi Parent.
Untuk mengatur Transform pada Sprite di Game, Anda juga dapat menggunakan
Toolbox yang telah disediakan Unity. Toolbox ini berada di kiri atas pada editor unity dan
digunakan untuk mengatur nilai Transform dengan visual. 

Berikut ini adalah adalah tiga fungsi utama pada Toolbox tersebut:

Berikut ini adalah adalah tiga fungsi utama pada Toolbox tersebut:

 Hand: untuk mengatur tampilan view pada jendela Scene tanpa harus mengubah posisi
gameobject. Klik tengah pada Mouse untuk shortcut ke mode Hand.
 Tool 3D: untuk mengatur nilai x, y, dan z, baik itu posisi, rotasi, maupun skala.
 Tool 2D: untuk mengatur nilai x dan y, baik itu posisi, rotasi, maupun skala.

Berikut ini adalah contoh perubahan yang terjadi pada Parent:


Jika terdapat perubahan posisi, rotasi dan skala pada parent, child juga akan mengikuti.
Namun sebaliknya, perubahan pada Child maka tidak akan mempengaruhi  parent. Berikut
contohnya:

Kondisi Child ditandai dengan perbedaan posisi yang lebih ke dalam. Hal ini
memudahkan kita untuk mengelompokkan object mana saja yang perlu di-trigger dalam satu
intruksi (rotasi, posisi, skala).

Setiap perubahan pada Parent dapat mempengaruhi perubahan pada Child. Jika
GameObject Parent tidak aktif, maka GameObject sebagai Child juga tidak aktif.

Selanjutnya kita akan menerapkan materi ini pada project terdahulu dengan beberapa latihan
sebagai berikut:
Praktik: Menyusun Hewan

Ayo kita mulai menyusun gambar-gambar hewan dengan sprite ini. Lakukan hal yang sama
dengan sprite kucing.

1. Pada Hierarchy atur posisi Background dengan nilai x:0, y:0 dan z:5.
2. Masukkan gambar sprite ke jendela Scene/Hierarchy dengan susunan kiri ke kanan berupa
Kucing, Anjing, Ayam dan Sapi.
3. Atur posisi masing-masing hewan dengan detail sebagai berikut:
o Posisi Kucing x:0,y:0 dan z:0
o Posisi Anjing x:18, y:0 dan z:0
o Posisi Ayam x:36, y:0 dan z:0
o Posisi Sapi x:54, y:0 dan z:0
Susunlah seperti dibawah ini:
 Jika dilihat di Jendela Scene:

 Jika dilihat di Jendela Game


Pembahasan:

Ketiga gambar di luar view camera sehingga tidak akan nampak ketika kita membukanya di
jendela game. Kemudian atur posisi background pada nilai z:5. Tujuannya, agar background
tidak menutupi objek hewan, melainkan berada di belakangnya.   

Secara default, posisi Camera pada posisi z: -10, sehingga semakin besar nilai z maka
semakin terlihat di belakang.
Praktik: Mengimplementasikan Parent dan Child

Untuk membuat Parent kita memerlukan GameObject kosong yang di dalamnya terdapat
GameObject sprite hewan tersebut.

1. Buka jendela Hierarchy.
2. Klik kanan > Pilih Create Empty.
3. Ganti nama GameObject yang telah dibuat menjadi Hewan (Klik kanan >  Rename).
4. Atur posisi menjadi center dan skala menjadi 1.

5. Pilih semua GameObject hewan (Kucing, Anjing, Ayam, Sapi) kemudian drag dan


masukkan ke dalam GameObject  Hewan.

6. Semua hewan akan mengikuti perubahan yang terjadi pada GameObject hewan. Dengan
ini, kita bisa mengatur banyak gambar secara sekaligus dengan mode perubahan yang
sama.  Cukup gunakan satu GameObject sebagai Parent. Ketika Anda menggerakkan
GameObject Hewan, maka GameObject sebagai Childnya akan mengikuti perubahan
pada GameObject hewan.
D. Input
Anda dapat memperoleh data input dari Keyboard, Mouse, Joystick, Touch, Gyro,
Compass, Accelerometer, dan lain lain. Sedangkan untuk memperoleh nilai dari input peranti
tersebut, Anda dapat menggunakan Input Manager. Materi tentang Input Manager ini akan
kita praktikkan juga pada modul selanjutnya. OK, untuk menampilkan Input Manager ini,
Anda dapat mencari pada Menu Edit > Project Settings > Input.

Beberapa contoh input yang dapat Anda gunakan seperti Fire1, Jump, Horizontal,
Vertical, dan lain-lain. Salah satu contoh penggunaan Axis Fire1 misalnya dengan tekan
tombol Ctrl kiri atau klik kiri pada mouse. Sedangkan untuk memanggil di script, Anda dapat
menulis sebagai berikut :
. Input.GetAxis(“Fire1”)

Tanpa menggunakan Axis, Anda juga dapat langsung memanggil di script sebagai berikut
untuk merespon input klik kiri pada mouse.

. Input.GetButtonDown(0)

Selengkapnya Anda dapat mengunjungi tautan di bawah ini:

https://docs.unity3d.com/ScriptReference/Input.html.

Membuat Script baru pada GameObject Hewan

Untuk menggerakkan gambar hewan, kita akan menjalankan input tombol panah kanan dan
kiri untuk menggerakkan gambar hewan dengan langkah-langkah sebagai berikut:

1. Klik GameObject Hewan di Jendela Hierarchy.


2. Klik Add Component > New Script.
3. Beri Nama ImagesMove dan pilih Language C Sharp.
4. Klik Create and Add

5. Buka Script ImagesMove.cs dengan klik 2x dan kemudian ubah/tambahkan sebagai


berikut:

. Tambahkan deklarasi variabel pada class MoveImage.

1. int[] posX = new int[] { 0, -18, -36, -54 };


2. int idx = 0;

. Tambahkan kode pada function Update.

if (Input.GetKeyUp(KeyCode.RightArrow))

    if (idx < posX.Length - 1)

    {

        idx++;

    }

if (Input.GetKeyUp(KeyCode.LeftArrow))

    if (idx > 0)

    {

        idx--;

    }

transform.position =
Vector3.MoveTowards(transform.position, new
Vector3(posX[idx], transform.position.y), 50 *
Time.deltaTime);

6. Kemudian simpan dengan tekan tombol CTRL+S sehingga hasilnya akan seperti ini:

1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4.  
5. public class ImagesMove : MonoBehaviour
6. {
7.  
8.     int[] posX = new int[] { 0, -18, -36, -54 };
9.     int idx = 0;
10.  
11.     // Use this for initialization
12.     void Start()
13.     {
14.  
15.     }
16.  
17.     // Update is called once per frame
18.     void Update()
19.     {
20.         if (Input.GetKeyUp(KeyCode.RightArrow))
21.         {
22.             if (idx < posX.Length - 1)
23.             {
24.                 idx++;
25.             }
26.         }
27.         if (Input.GetKeyUp(KeyCode.LeftArrow))
28.         {
29.             if (idx > 0)
30.             {
31.                 idx--;
32.             }
33.         }
34.         transform.position =
Vector3.MoveTowards(transform.position, new
Vector3(posX[idx], transform.position.y), 50 *
Time.deltaTime);
35.     }
36. }

Pembahasan:

. int[] posX = new int[] { 0, -18, -36, -54 };

Nilai 0, -18, -36 dan -54 didapat dari nilai posisi x pada GameObject Hewan untuk
menampilkan gambar hewan. Contohnya, untuk menampilkan gambar Ayam maka nilai
posisi x pada GameObject Hewan adalah -36.

. if (Input.GetKeyUp(KeyCode.RightArrow))
. {
.     if (idx < posX.Length - 1)
.     {
.         idx++;
.     }
. }

Jika inputan berupa tombol panah ke kanan(right arrow) maka akan menampilkan nilai dari
indeks 1, 2, dan 3. Indeks yang ditampilkan tidak lebih dari panjang array yaitu 3 (dengan
nilai 4 kemudian dikurangi 1).  

Catatan: 

Untuk langsung mengecek kondisi, kita menggunakan nilai panjang array bukan langsung
dengan nilai 3. Sebabnya, jika ada penambahan hewan, data di array juga ditambah.
Perpindahan secara otomatis menyesuaikan.

. if (Input.GetKeyUp(KeyCode.LeftArrow))
. {
.     if (idx > 0)
.     {
.         idx--;
.     }
. }

Tombol panah ke kiri akan menampilkan indeks 2, 1, dan 0 dengan kondisi lebih dari 0.

. transform.position = Vector3.MoveTowards(transform.position,
new Vector3(posX[idx], transform.position.y), 50 *
Time.deltaTime);

"transform.position" berguna untuk mengimplementasikan perubahan posisi pada


GameObject Hewan. Sedangkan Vector3.MoveTowards  berguna untuk membuat transisi
dari posisi awal sampai posisi tujuan dengan detail sebagai berikut:

. Vector3.MoveTowards(posisi awal, posisi tujuan, waktu yang


dibutuhkan)

Waktu yang dibutuhkan untuk transisi adalah nilai kecepatan 50 dikali dengan selisih ketika
dari sebelumnya dengan menggunakan Time.deltatime.

E. Scene
Scene merupakan wadah yang menampung GameObject atau semua hal yang kita
butuhkan. Satu Scene dapat dipandang sebagai satu level atau satu screen/tampilan dari
sebuah object. Scene menyimpan semua GameObject yang terdapat di Hierarchy. Scene
memiliki Extensi dot Unity yang pernah dipraktikkan di modul terdahulu. Sekarang kita akan
membahas cara menggunakan Scene sebagai tampilan halaman pada sebuah game. Berikut
ini adalah gambaran Scene yang nanti akan dibuat.

Ketika aplikasi pertama kali dibuka, halaman Home akan tampil. Tekan tombol Enter,
maka halaman Gameplay muncul. Untuk keluar dari halaman Gameplay dan masuk Home,
tekan tombol Escape. Untuk keluar dari aplikasi, tekan tombol Escape. Kemudian muncul
pertanyaan apakah ingin keluar. Tekan tombol  Escape sekali lagi, maka Anda akan keluar
game. Namun jika tekan Enter maka kembali ke Home.

Praktik: Menambahkan Scene Baru untuk Halaman Home

Sebelum menambahkan scene baru, pastikan Anda sudah menyimpan scene yang
sedang aktif dengan tekan Ctrl+S. Langkah-langkah untuk membuat scene baru sebagai
berikut:

1. Klik Menu File > New Scene.


2. Masukkan Background.png > Ke Jendela Hierarchy, atur posisi tersebut dengan
nilai x:0, y:0 dan z:5.
3. Masukkan Halaman Home.png > Ke Jendela Hierarchy, atur posisi tersebut dengan
nilai x:0, y:0 dan z:0.
4. Sehingga hasilnya sebagai berikut:
5. Kemudian simpan Scene di dalam folder Scenes dengan tekan Ctrl+S kemudian beri
nama SceneHome.unity

Praktik: Menambahkan Scene Baru untuk Halaman Keluar

1. Klik Menu File > pilih New Scene.


2. Masukkan Background.png > Ke Jendela Hierarchy dengan posisi x:0, y:0 dan z:.5.
3. Masukkan Halaman Keluar.png > Ke Jendela Hierarchy dengan posisi x:0, y:0 dan
z.:0 sehingga hasilnya sebagai berikut:
4. Kemudian simpan Scene di dalam folder Scenes dengan tekan Ctrl+S kemudian beri
nama SceneKeluar.unity.

Menambahkan Scene 

Agar script dapat mengakses scene, maka Anda harus menambahkan scene tersebut ke daftar
Scenes in Build. Langkah-langkahnya antara lain: 

1. Buka SceneHome.unity.
2. Buka jendela Build Settings.. dengan klik menu File > Build Settings…
3. Klik Add Open Scenes untuk menambahkan Scene yang sedang dibuka.
4. Lakukan hal yang sama terhadap SceneKeluar.unity dan SceneAnimal.unity.

Seperti ini hasilnya.


Pembahasan: 

Anda dapat menghapus (tombol Delete pada Keyboard) atau mengatur urutan scene pada
daftar Scenes In Build. Scene yang memiliki indeks 0 adalah scene yang pertama dijalankan
ketika game running.

Praktik: Membuat Script untuk ScenesManager

1. Buka SceneHome.unity.
2. Klik Main Camera.
3. Pada Inspector, Klik Add Component > New Script.
4. Beri nama ScenesManager dan atur Language C Sharp.
5. Klik tombol Create and Add.
Seperti ini hasilnya.

6. Klik 2x ScenesManager.cs pada Jendela Project kemudian ubah sebagai berikut:

1. Tambahkan namespace UnityEngine.SceneManagement sebagai berikut:

1. using UnityEngine.SceneManagement;

Untuk mengakses scene, misalnya menggunakan method


SceneManager.LoadScene), setiap class perlu menambahkan nameSpace.

2. Tambahkan kode deklarasi variabel pada class ScenesManager sebagai


berikut:

public string EnterScene;

public string EscapeScene;

public bool isEscapeForQuit = false;

Terdapat 3 kondisi yaitu

1. EnterScene diproses ketika menekan tombol Enter;


2. EscapeScene diproses ketika menekan tombol Escape, dan 
3. isEscapeForQuit membuat kondisi keluar dari aplikasi ketika
menekan tombol Escape.

3. Tambahkan kode di bawah ini di dalam method Update() sebagai berikut:


if (Input.GetKeyUp(KeyCode.Return))

    Debug.Log("Name Scene: " + EnterScene);

    SceneManager.LoadScene(EnterScene);

Ketika menekan tombol Enter, kemudian menampilkan Scene yang tertulis


pada variable EnterScene.

4. Tambahkan kode di bawah ini di dalam method Update() sebagai berikut:

if (Input.GetKeyUp(KeyCode.Escape))

        {

            if (isEscapeForQuit)

            {

                Application.Quit();

            }

            else

            {

                Debug.Log("Name Scene: " + EscapeScene);

                SceneManager.LoadScene(EscapeScene);

            }

        }

Ketika kita menekan tombol Escape pada keyboard, ada 2 hal yang
terjadi:  keluar dari aplikasi atau kembali ke menu utama. Aplikasi akan keluar
ketika nilai isEscapeForQuit bernilai true. Sementara itu, aplikasi akan
kembali ke halaman menu ketika nilai isEscapeForQuit bernilai false.

Simpan perubahan dengan tekan Ctrl+S sehingga seluruhnya menjadi seperti ini.

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.SceneManagement;
 

public class ScenesManager : MonoBehaviour

    public string EnterScene;

    public string EscapeScene;

    public bool isEscapeForQuit = false;

    // Use this for initialization

    void Start()

    {

    }

    // Update is called once per frame

    void Update()

    {

if (Input.GetKeyUp(KeyCode.Return))

Debug.Log("Name Scene: " + EnterScene);

SceneManager.LoadScene(EnterScene);

if (Input.GetKeyUp(KeyCode.Escape))

if (isEscapeForQuit)

Application.Quit();

else
{

Debug.Log("Name Scene: " + EscapeScene);

SceneManager.LoadScene(EscapeScene);

    }

Praktik: Implementasi Script pada tiap Halaman

Setelah Script ScenesManager.cs selesai dibuat maka implementasikan script tersebut ke


masing-masing scene.

1. Pada SceneAnimal.unity.
2. Klik Main Camera pada hierarchy.
3. Pada Inspector, Atur komponen Scenes Manager sebagai berikut:

4. Simpan perubahan dengan tekan Ctrl+S.


5. Buka scene SceneHome.unity dengan klik 2x.
6. Klik Main Camera pada Hierarchy.
7. Tambahkan Komponen Scene Manager (Add Component > Scripts > Scenes
Manager).
8. Pada Inspector, Atur komponen Scenes Manager sebagai berikut:

9. Simpan perubahan dengan tekan Ctrl+S.


10. Buka scene SceneKeluar.unity dengan klik 2x.
11. Klik Main Camera pada hierarchy.
12. Tambahkan komponen Scene Manager (Add Component > Scripts > Scenes
Manager).
13. Pada Inspector, aturlah komponen Scenes Manager sebagai berikut:
14. Simpan perubahan dengan tekan Ctrl+S.

Pembahasan: 

Pastikan variabel EscapeScene dan EnterScene tidak kosong ketika


dipanggil SceneManager.LoadScene. Kemudian pada saat berada di SceneKeluar pastikan
juga Is Escape for Quiz tercentang. Jika tidak, maka akan keluar pesan eror ini.

F. Audio

Game akan terasa hambar jika tidak ada audio, elemen krusial dalam sebuah game.
Audio sangat membantu memberi suasana tertentu atau memperjelas material sebuah benda.
Dari audio kita mengenal tentang musik dan sound. Musik merupakan dari sebuah sound,
namun sebuah sound belum tentu sebuah musik.

Beberapa jenis audio yang di-support Unity antara lain: 

 AIFF
 WAV
 MP3 
 Ogg

Di dalam Unity, langkah langkah sampai dengan sebuah Audio berbunyi adalah
sebagai berikut:
Audio disimpan dalam variable AudioClip, kemudian dari Audio Source
memancarkan audio yang terdapat di variabel Audio clip. Audio Listener berperan sebagai
penerima dari yang dipancarkan oleh Audio Source. Audio Listener yang diterima itulah
yang sampai di telinga kita.

Untuk lebih jelasnya, kunjungi https://docs.unity3d.com/Manual/AudioOverview.html

Tools Audio

 Audacity.sourceforge.net
 tazman-audio.co.uk
 audiokinetic.com

Free Audio

 http://www.get-sounds.com/
 www.Freesound.org
 http://soundimage.org/
 https://www.partnersinrhyme.com/pir/PIRsfx.shtml
 http://www.pygame.org/wiki/resources

Sound Generate

 http://www.drpetter.se/project_sfxr.html

Praktik: Memasukkan Audio pada Masing-masing Hewan 

Kita akan memasang audio pada masing-masing GameObject Hewan.

1. Buka scene SceneAnimal.unity.
2. Pada Hierarchy, Klik GameOject Kucing.
3. Pada Inspector Kucing, tambahkan komponen baru (Klik Add
Component > Audio > Audio Source).
4. Buka folder Audios di jendela project.
5. Drag AudioKucing.ogg ke dalam field AudioClip pada komponen Audio Source di
Inspector Kucing.
6. Hilangkan centang pada Play On Awake.

Seperti ini  hasilnya:


Jika Play On Awake dicentang, maka saat pertama kali game dijalankan maka
play pada audio tersebut otomatis berfungsi. Oleh karena itu, mengingat nanti play audio
akan dikontrol oleh script maka hilangkan centang Play On Awake. Selain itu, Anda
juga dapat mengatur Volume dan Pitch Audio Anda.

Mengubah Script 

1. Pada Jendela Project.
2. Buka Script ImagesMove.cs.
3. Tambahkan kode deklarasi variabel.

public AudioSource[] audio;

Variabel audio akan diinisialisasikan lewat Inspector yang memanfaatkan


GameObject dengan komponen Audio Source.

4. Tambahkan kode di bawah ini ke method Start() dan di dalam kondisi ketika tombol


panah ditekan.

audio[idx].Play();

Setelah diinisialisasikan, variabel audio tersebut dimainkan berdasarkan idx. Nilai Idx
atau Indeks mengarah pada urutan dari gameobject yang dimasukkan di Inspector.

5. Simpan perubahan pada script dengan tekan Ctrl+S. Seperti ini  hasilnya:

1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4.  
5. public class ImagesMove : MonoBehaviour
6. {
7.  
8.     int[] posX = new int[] { 0, -18, -36, -54 };

9.     int idx = 0;
10.     public AudioSource[] audio;
11.     // Use this for initialization
12.     void Start()
13.     {
14.         audio[idx].Play();

15.     }

16.  
17.     // Update is called once per frame

18.     void Update()

19.     {

20.         if (Input.GetKeyUp(KeyCode.RightArrow))

21.         {

22.             if (idx < posX.Length - 1)

23.             {

24.                 idx++;

25.                 audio[idx].Play();

26.             }

27.         }

28.         if (Input.GetKeyUp(KeyCode.LeftArrow))

29.         {

30.             if (idx > 0)

31.             {

32.                 idx--;

33.                 audio[idx].Play();

34.             }

35.         }

36.         transform.position = Vector3.MoveTowards(transform.position, new Vector3(posX[idx],


transform.position.y), 50 * Time.deltaTime);

37.     }

38. }

Praktik: Implementasi Audio ke Komponen Script

Setelah mengedit Script, terapkan langkah berikut: 

1. Klik GameObject Hewan di Hierarchy.


2. Pada Inspector atur nilai Size menjadi 4 pada Field Audio di Komponen Image
Move.
3. Masukkan masing-masing elemen dari Hewan-hewan di Hierarchy dengan aturan
sebagai berikut:

o Kucing(Hierarchy) masukkan ke Element 0(Inspector).


o Anjing(Hierarchy) masukkan ke Element 1(Inspector).
o Ayam(Hierarchy) masukkan ke Element 2(Inspector).
o Sapi(Hierarchy) masukkan ke Element 3(Inspector).

Seperti ini hasilnya:

G. Game Pukul Bola

Game Pukul Bola adalah video game seperti tenis meja yang terdiri dari dua pemukul
dan satu bola yang dapat dimainkan oleh dua orang pemain atau lebih dengan melawan
komputer. Setiap pemain harus bisa mengembalikan setiap bola yang mengarah padanya.
Setiap kali lawan gagal menerima bola, kita akan mendapatkan satu poin, dan sebaliknya.
Setelah mencapai batas poin tertentu, kita atau lawan akan keluar sebagai pemenangnya.

Di modul ini kamu akan belajar tentang UI, Physics 2D, Transform, Material


Physics, Music dan Sound.
Praktik: Membuat Proyek Baru

1. Buka Unity.
2. Klik New.
3. Masukkan nama proyek yang diinginkan. Mari kita gunakan nama "Pong2D."
4. Centang/pilih 2D. 
5. Pilih tempat di mana proyek tersebut akan disimpan.
6. Untuk tutorial ini, pilih  OFF di sebelah tulisan “Enable Unity Analytics.”
7. Klik tombol “Create project."

Setelah membuat berkas proyek, selanjutnya Anda akan mempelajari beberapa materi
antara lain: 

 Memasukkan Assets.
 Membuat Area Game.
 Membuat Paddle (Pemukul).
 Membuat Bola.
 Menambahkan Audio.
 Membuat Score.
 Membuat Halaman Game Over dan Halaman Menu.

Memasukkan Aset 

Menyiapkan Asset
Kita memerlukan 2 gambar untuk mendukung permainan, yaitu lingkaran dan persegi.

Detailnya sebagai berikut:

Lingkaran

 Nama              : Lingkaran.png
 Ukuran            : 64x64 pixel
 Warna             : Putih
 Keterangan     : Lingkaran penuh dengan warna putih

Gambar ini akan digunakan sebagai bola

Persegi

 Nama              : Persegi.png
 Ukuran            : 64x64 pixel
 Warna             : Putih
 Keterangan   : Blok penuh dengan warna putih

Gambar ini akan digunakan sebagai Paddle dan Wall.

Praktik: Membuat Folder

Supaya penyusunannya rapi kita perlu mengelompokan jenis berkas yang sama dalam
satu folder. Caranya dengan buka panel Project, kemudian klik kanan pilih Create > Folder.
Beri nama Images. 
Anda juga dapat mengganti nama folder dengan klik 2 (dua) kali pada nama folder
secara perlahan. Tunggu beberapa saat kemudian muncul edit teks pada nama folder. Cara
lainnya, Anda dapat klik Folder kemudian tekan F12 pada keyboard.  

Praktik: Memasukkan Asset ke Proyek

Masukkan gambar yang telah kita buat/unduh sebagai aset proyek. Berikut ini langkah-
langkahnya: 

1. Masuk ke dalam folder Images yang telah dibuat dengan klik 2 kali kemudian klik
kanan > Import New Asset.

2. Kemudian masukkan kedua gambar Lingkaran dan Persegi (Ctrl+A) dan


klik Import.
3. Setelahnya muncul kedua gambar seperti di bawah ini

Praktik: Menyimpan Scene

Scene merupakan wadah yang menampung GameObject atau semua hal yang kita butuhkan.


Satu Scene dapat dipandang sebagai satu level atau satu screen/tampilan dari sebuah objek.

Setelah membuat proyek untuk pertama kali, pada panel Hierarchy terdapat sebuah Scene
(Untitled) yang memiliki satu Main Camera.

Scene yang pertama kali dibuat ini belum tersimpan. Untuk menyimpannya, ikuti langkah-
langkah berikut:

1. Buka Panel Project, kemudian buat folder baru dengan nama Scenes.


2. Untuk menyimpan dan memberi nama Scene untuk pertama kalinya, klik kanan pada
Scene Untitled, lalu pilih Save Scene As.

3. Masuk ke folder Scenes kemudian beri nama Main dan tekan tombol Save.


4. Setelah berhasil, pada Folder Scenes muncul berkas baru dengan nama Main.unity.

Membuat Background

Praktik: Menentukan Resolusi yang Digunakan

1. Sebelum menyusun sebuah tampilan, baiknya tentukan terlebih dahulu resolusi yang
digunakan. Karena target platform adalah Android, maka kita gunakan resolusi 16:9.
Buka panel Game kemudian pilih resolusi 16:9.Anda juga dapat menambahkan
resolusi tertentu dengan menekan tombol plus (+).

2. Sehingga tampilan menjadi seperti berikut ini:

Praktik: Mengubah Warna Background


1. Kamu dapat melihat komponen-komponen dari sebuah GameObject dengan cara klik
pada GameObject yang ingin dilihat. Lalu lihat pada Inspector, klik dua kali pada
Main Camera dan lihat bagian Inspector dari Main Camera. 
2. Default warna latar belakang adalah biru tua. Untuk mengubah warnanya, klik dua
kali pada Background di komponen Camera. Kemudian akan terbuka color picker
untuk memilih warna background yang diinginkan. Di pembelajaran ini kita
menggunakan warna hitam sebagai background. Sehingga hasilnya seperti berikut ini:

Dan
Membuat Area Game

Pertama mari rumuskan dulu gambar apa saja yang diperlukan dalam Membuat Area
Game Pukul Bola, antara lain:

 Garis tepi atas 


 Garis tepi bawah 
 Garis tepi kiri
 Garis tepi kanan
 Garis batas tengah
Garis atas, bawah, kiri, kanan memiliki sifat tidak dapat ditembus oleh bola
sedangkan untuk batas tengah dapat ditembus oleh bola.

Untuk semua gambar, kita akan menggunakan GameObject berupa Sprite. Sprite


adalah sebuah object 2D yang digunakan untuk karakter, peluru, elemen, di permainan 2D.
Untuk menampilkan gambar tersebut, dibutuhkan Komponen SpriteRenderer di sebuah
GameObject.

Untuk menyusun Object, gunakan toolbox yang telah tersedia.

Dengan tool tersebut, Anda dapat melakukan menggerakkan, memutar atau mengatur
besar kecil object. Anda juga dapat mengatur nilai pada Komponen Transform di Panel
Inspector.

Semua tahapan akan dibahas di bawah ini.

Praktik: Membuat Tepi dan Garis Pembatas Tengah

Selanjutnya kita akan membuat tepi dan garis pembatas tengah sebagai area game. Langkah
pertama kita akan membuat tepi atas terlebih dahulu.

1. Drag gambar Persegi dan letakkan di Panel Scene.


2. Ubahlah nama Persegi menjadi TepiAtas dengan klik kanan pada GameObject Persegi
dan pilih Rename.
3. Aturlah Posisi dan Scala sebagai berikut:

o Posisi X:0, Y:4.5 dan Z:0


o Skala X:26.8, Y:0.3 dan Z:1

4. Sehingga terlihat sebagai berikut:

5. Agar lebih menarik, Anda dapat mengubah warna pada Sprite Renderer dan pilih
warna yang Anda suka, contohnya seperti gambar di bawah ini.
6. Kemudian buatlah hal yang sama seperti TepiAtas untuk Tepi Bawah,  Tepi-Kanan
, Tepi Kiri dan BatasTengah. Detailnya sebagai berikut:

o TepiBawah
 Posisi X:0, Y:-4.5 dan Z:0
 Skala X:26.8, Y:0.3 dan Z:1

o TepiKanan
 Posisi X:8.5, Y:0 dan Z:0
 Skala X:0.3, Y:14.37 dan Z:1

o TepiKiri

 Posisi X:-8.5, Y:0 dan Z:0


 Skala X:0.3, Y:14.37 dan Z:1

o BatasTengah

 Posisi X:0, Y:0 dan Z:0


 Skala X:0.1, Y:14.37 dan Z:1

7. Berikut ini cara untuk menambahkan TepiBawah:

o Klik kanan pada Tepi Atas


o Pilih Duplicate
o Rename TepiAtas (1) menjadi TepiBawah
o Atur Pos Y menjadi -4.5

8. Selanjutnya, tambahkan tepi kiri, tepi kanan, dan batas tengah dengan cara
yang sama. Atur ukuran dan posisi tepi kiri, tepi kanan, dan batas tengah. Setelah
semua tepi dan batas ditambahkan, hasilnya sebagai berikut:

Praktik: Menambahkan Collision pada Tepi

Setelah selesai membuat tampilan Area Game, Anda akan menambahkan Collider sebagai
pembatas area agar bola tidak dapat menembus keluar area. Berikut ini caranya: 

1. Klik GameObject TepiAtas yang terdapat di Hierarchy.


2. Pada Panel Inspector, Tambahkan Komponen Collision dengan klik Add
Component > Physics 2D > Box Collider 2D.

3. Lakukan hal yang sama seperti GameObject TepiAtas pada


GameObject TepiBawah, TepiKanan dan TepiKiri. Anda dapat menambahkan
Collider secara bersamaan dengan blok ketiga gameobject di Hierarchy. Terakhir,
tambahkan Component Collider.
Membuat Paddle (Pemukul)
Segala hal yang berada pada Scene atau Hierarchy bertipe GameObject. GameObject
dapat dipandang sebagai wadah dari berbagai Components (komponen). Fungsionalitas dari
sebuah GameObject dibentuk dari komponen-komponennya. Secara default, GameObject
memiliki sebuah komponen yaitu Transform yang memiliki beberapa atribut, yaitu:

 Position: menandakan posisi dalam sumbu X, Y, dan Z.


 Rotation: menandakan rotasi pada sumbu X, Y, dan Z dalam satuan derajat.
 Scale: menandakan skala ukuran pada sumbu X, Y, dan Z. Nilai 1 adalah ukuran asli.

Setiap Component memiliki centang di sebelah namanya untuk memungkinkan ia di-


enable atau di-disable. Component yang di-disable dianggap tidak muncul atau tidak
digunakan. 

Di submodul ini kita akan membuat Paddle yang bergerak ke atas dan ke bawah
dengan menekan tombol keyboard.

Praktik: Membuat GameObject Paddle (Pemukul)

Selanjutnya kita akan membuat Paddle sebagai player. Langkah-langkahnya sebagai berikut:

1. Masukkan Persegi ke Scene kemudian ubah Nama Persegi menjadi Pemukul1.


Kemudian Atur posisi dan Skala seperti ini:

o Position: X: -7.5, Y:0 dan Z:0


o Scale : X: 0.5, Y:5 dan Z:1

2. Sehingga hasilnya sebagai berikut:


3. Ubah warna sesuai keinginan, misalnya biru. 

4. Karena Paddle merupakan objek yang tidak dapat ditembus oleh objek lain maka
tambahkan Komponen Collision dengan cara Klik Add Component > Physics
2D > Box Collider 2D.

Objek paddle sudah siap. Selanjutnya kita akan membuatnya bergerak.


Praktik: Membuat Pemukul Bergerak

Dalam tutorial ini kedua paddle akan digerakkan dengan menggunakan keyboard.
Pemukul pemain pertama (sebelah kiri) digerakkan dengan tombol W dan S sementara
Pemukul pemain kedua (sebelah kanan) digerakkan dengan tombol ↑ dan ↓. Lakukan langkah
berikut untuk setting input:

1. Buka InputManager (Klik Edit > Project Settings > Input). Karena kita akan


menambahkan varian input baru, edit field Size pada Axes dari 18 menjadi 20.

Setelah diubah sizenya maka muncul 2 tambahan baru dengan nama Cancel.


2. Untuk dua varian input terbawah, ikuti setting pada screenshot berikut.

Catatan: di versi Unity yang terbaru, jika Anda mengedit yang sudah ada misal
Vertical maka akan muncul error.

Dari sini kita memiliki 2 varian customized input.

 Vertical 1

Ini akan digunakan untuk menggerakkan Pemukul dari player 1. Pemukul


dari player 1 akan digerakkan ke bawah (negative button) dengan tombol s dan
bergerak ke atas (positive button) dengan tombol w.
 Vertical 2

Ini akan digunakan untuk menggerakkan Pemukul dari player 2. Pemukul


dari player 2 akan bergerak ke bawah (negative button) dengan tombol   (down)
dan bergerak ke atas (positive button) dengan tombol ↑ (up).

Praktik: Script dan Variable

Selanjutnya kita perlu membuat Script agar Pemukul dapat bergerak sesuai dengan masukan
dari keyboard.

1. Pada folder Assets, tambahkan folder baru. Klik kanan pada panel Project, kemudian
pilih Create > Folder dan beri nama Scripts.

2. Di dalam folder Scripts yang telah dibuat, tambahkan script baru dengan
nama PaddleController.cs. (Klik kanan > Create > C# Scripts).
3. Pada script PaddleController.cs, Klik dua kali pada file “ PaddleController.cs”
untuk mulai menambahkan script. Setiap Script pada Unity merupakan turunan dari
kelas MonoBehaviour sehingga semua fungsi dan prosedur yang ada pada kelas
MonoBehaviour dapat dimanfaatkan pada script.
Pada game Pong, script yang ditambahkan perlu mengatur:

o kecepatan pergerakan Paddle/Pemukul.
o varian input mana yang mengatur paddle tersebut: Vertical 1 atau Vertical 2.
o perubahan posisi pada sumbu Y sesuai dengan tombol yang ditekan.

4. Berikut ini merupakan contoh script yang lengkap.

o Tambahkan variabel di dalam class Paddle Controller.

1. public float kecepatan;

2. public string axis;

Dalam script di atas, terdapat dua variabel yang bersifat public, yaitu


kecepatan (kecepatan pergerakan) dan axis (untuk mengatur input keyboard).
Variabel yang bersifat public ini akan muncul sebagai field yang bisa diganti
isinya tanpa harus mengubah kode.

o Tambahkan kode di dalam function Update.

1. float gerak = Input.GetAxis(axis) * kecepatan * Time.deltaTime;

2. transform.Translate(0, gerak, 0);

float gerak = Input.GetAxis(axis) * kecepatan * Time.deltaTime; --


> Untuk memperoleh seberapa besar nilai pergerakan paddle dari
Input.GetAxis yang memperoleh nilai diantara -1 sampai 1 yang dikalikan
kecepatan dan selisih waktu (Time.deltaTime). Tujuannya, supaya dapat
berjalan dengan baik di berbagai perangkat.

transform.Translate(0, gerak, 0); --> Implementasi perpindahan terhadap


Paddle.
5. Simpan perubahan dengan Ctrl+S, sehingga seluruh kode menjadi seperti berikut:

1. using UnityEngine;
2. public class PaddleController : MonoBehaviour
3. {
4.     public float kecepatan;
5.     public string axis;
6.     // Use this for initialization
7.     void Start()
8.     {
9.     }
10.     // Update is called once per frame
11.     void Update()
12.     {
13.         float gerak = Input.GetAxis(axis) * kecepatan * Time.deltaTime;

14.         transform.Translate(0, gerak, 0);


15.     }
16. }

6. Masukkan script PaddleController.cs yang telah dibuat ke dalam


GameObject Pemukul1. Anda bisa melakukannya dengan cara drag dan drop.
7. Buka Inspector pada Pemukul1 kemudian pada field Kecepatan diisi nilai 7 dan
pada Axis diisi “Vertical1.

”Dalam screenshot di atas, kecepatan diisi dengan 7, sementara Axis diisi


dengan Vertical1. Hal ini berarti, kecepatan perpindahan adalah 7 dikali hasil
pembacaan keyboard. Sementara untuk memindahkan pemukul akan digunakan varian
input Vertical 1, yaitu w untuk perpindahan ke atas dan s untuk perpindahan ke bawah.
Pada saat di-play, dengan menekan tombol w dan s, pemukul player 1 akan bergerak.

Praktik: Memberi Batasan Atas dan Bawah 

Dalam pemrograman seringkali kita perlu mengatur sesuatu berdasarkan kondisi tertentu. Misalnya dalam
kasus Pemukul, perpindahan posisinya  perlu dibedakan berdasarkan state dari Pemukul tersebut. Berikut ini logika
kondisi yang digunakan dalam pengaturan posisi Pemukul.

 Apabila nilai yang diinput melebihi batas atas maka nilai inputan menjadi 0 berarti GameObject pemukul
tidak bergerak.
 Apabila nilai yang diinput kurang dari batas bawah maka nilai inputan menjadi 0 berarti GameObject
pemukul tidak bergerak.
 Apabila pemukul berada dalam batas bawah dan batas atas maka pemukul bebas untuk berpindah ke mana
pun.

Untuk menerapkannya,ikuti  langkah-langkah ini: 


1. Buka script PaddleController.cs dengan klik 2 kali kemudian tambahkan  kode di bawah ini.

o Tambahkan kode di dalam class PaddleController.

1. public float batasAtas;

2. public float batasBawah;

o Tambahkan kode pengecekan di dalam function Update().

1. float nextPos = transform.position.y + gerak;

2. if (nextPos > batasAtas)

3. {

4.     gerak = 0;

5. }

6. if (nextPos < batasBawah)

7. {

8.     gerak = 0;

9. }

2. Simpan perubahan dengan tekan Ctrl+S sehingga seluruh script menjadi seperti ini:

1. using UnityEngine;
2. public class PaddleController : MonoBehaviour
3. {
4.     public float batasAtas;
5.     public float batasBawah;
6.     public float kecepatan;
7.     public string axis;
8.     // Use this for initialization
9.     void Start()
10.     {
11.     }
12.     // Update is called once per frame
13.     void Update()
14.     {
15.         float gerak = Input.GetAxis(axis) * kecepatan * Time.deltaTime;

16.         float nextPos = transform.position.y + gerak;


17.         if (nextPos > batasAtas)
18.         {
19.             gerak = 0;
20.         }
21.         if (nextPos < batasBawah)
22.         {
23.             gerak = 0;
24.         }

25.         transform.Translate(0, gerak, 0);

26.     }

27. }

Memprediksi nilai posisi posisi selanjutnya apakah melewati batas atas atau batas
bawah. Jika melewati maka paddle tidak ada pergerakan selanjutnya.

3. Untuk mengetahui batas atas dan batas bawah, Anda dapat menggeser paddle ke
posisi paling atas. Anda dapat melihat nilai Y pada komponen Transform.

Kita telah mendapatkan nilai batas atas yaitu sebesar 3.45, sedangkan untuk nilai batas
bawah adalah nilai negatif dari 3.45 yaitu -3.45. Setelah mendapatkan nilai tersebut,
jangan lupa untuk mengembalikan posisi semula pada paddle dengan nilai y sama
dengan 0.
4. Kemudian isikan kedua nilai tersebut pada field Batas Atas dan Batas
Bawah. 

5. Kemudian buatlah paddle lawan. Caranya, duplikasi GameObject Pemukul1 di


Hierarchy dengan nama Pemukul2. Lalu atur posisi x menjadi 7.5. Ubahlah jadi
warna yang berbeda. Atur juga nilai Axis menjadi Vertical2 sehingga tampil seperti
ini:

Sekarang Anda sudah dapat membuat paddle yang dapat bergerak ke atas dan ke
bawah tanpa menembus dinding.
Membuat Bola
Di submodul ini, kita akan menerapkan 2D Physics ke Bola, antara lain sebagai berikut:

 RigidBody 2D, Sebuah komponen yang menerapan hukum fisika pada suatu
gameobject 2D.
 Collider 2D, sebuah komponen yang menggambarkan bentuk sebuah fisik yang dapat
digunakan untuk mendeteksi benturan dengan benda lain.
 Physics Material 2D, digunakan untuk mengatur nilai gesekan atau pantulan
terhadap benturan benda lain.

Praktik: Membuat Objek Bola

Pertama kita membuat objek bola terlebih dahulu dengan cara sebagai berikut:

Masukkan gambar Lingkaran yang terdapat di panel Project ke panel Hierarchy kemudian


ubah nama menjadi Bola. Atur posisi x, y dan z menjadi 0.

Praktik: Menambahkan Physics 2D pada Bola

Setelah objek bola dibuat, tambahkan komponen bola.

1. Buka Inspector pada Bola, Lalu tambahkan komponen RigidBody 2D (Add


Component > Physics 2D > Rigidbody 2D). Kemudian atur nilai Linear
Drag, Angular Drag, Gravity Scale menjadi 0. Jangan lupa untuk centang Freeze
Rotation Z

2. Tambahkan komponen Circle Collider 2D (Add Component > Physics 2D > Circle


Collider 2D).

3. Buat folder baru dengan nama Physics. Kemudian buat Physics Material 2D dengan
klik kanan pada panel Project > Create > Physics Material 2D dan beri
nama PhysicsBola.
4. Klik PhysicsBola pada panel Project. Kemudian pada Inspector atur nilai sebagai
berikut. Friction menjadi 0 dan Bounciness menjadi 1.

5. Terakhir, drag PhysicsBola dan drop ke field Material di Inspector Bola.


Praktik: Menambahkan Code

Kali ini kita akan mencoba menggerakkan Bola dengan menggunakan Force (tekanan).
Seperti dalam hukum Fisika, kecepatan dan arah pergerakan Bola ditentukan oleh dua hal:

 Arah dan besaran Force (tekanan)
 Massa bola

Force dalam Unity ditambahkan pada Rigidbody 2D. Dalam tutorial ini, kita mencoba
menambahkan Force sebagai pergerakan bola pertama kali. Berikut ini langkah-langkahnya.

1. Buat Script C# baru di dalam folder Scripts dengan nama BallController.cs


kemudian tambahkan kode di bawah ini.

o Tambahkan 2 variabel pada class BallController.

1. public int force;

2. Rigidbody2D rigid;

public int force; --> Dengan lewat inspector, nilai di atas untuk mengatur
kecepatan gerak bola.

Rigidbody2D rigid; --> Menyimpan variable rigidbody yang dapat dipanggil


sewaktu-waktu.

o Tambahkan kode ini di dalam function Start().

1. gid = GetComponent<Rigidbody2D>();

2. Vector2 arah = new Vector2(2, 0).normalized;

3. rigid.AddForce(arah * force);

rigid = GetComponent<Rigidbody2D>(); --> Memanggil komponen


Rigidbody2D ke dalam script.

Vector2 arah = new Vector2(2, 0).normalized; --> Menyatakan arah dari


Force, yaitu 2 satuan ke kanan dan 0 satuan ke atas.
rigid.AddForce(arah * force); --> Melontarkan bola sesuai dengan arah dan
kekuatan.

2. Simpan dengan tekan Ctrl+S sehingga seluruh kode  menjadi seperti ini: 

1. using UnityEngine;
2. public class BallController : MonoBehaviour
3. {
4.     public int force;
5.     Rigidbody2D rigid;
6.     // Use this for initialization
7.     void Start()
8.     {
9.         rigid = GetComponent<Rigidbody2D>();
10.         Vector2 arah = new Vector2(2, 0).normalized;
11.         rigid.AddForce(arah * force);
12.     }
13.     // Update is called once per frame
14.     void Update()
15.     {
16.     }
17. }
18.

3. Masukkan Script BallController.cs ke GameObject Bola yang terdapat di Hierarchy.


Kemudian Atur nilai Force menjadi 200.
Praktik: Menambahkan Reset Bola

Saat bola menyentuh tepi kanan dan tepi kiri, bola kembali ke posisi start. Jika bola
mati di sebelah kanan maka bola akan mengarah ke kanan. Begitupun sebaliknya, jika bola
mati di sebelah kiri maka bola akan mengarah ke kiri. Bagaimana cara mengaturnya? Ikuti
langkah berikut ini: 

1. Buka Script BolaController.cs dengan klik 2 kali. Lalu tambahkan kode sebagai


berikut:

o Tambahkan function di class BolaController.

1. void ResetBall()

2.     {

3.         transform.localPosition = new Vector2(0, 0);

4.         rigid.velocity = new Vector2(0, 0);

5.     }

void ResetBall() --> Function ini dibuat supaya lebih ringkas.

transform.localPosition = new Vector2(0, 0); --> Memposisikan bola di


tengah-tengah area.

rigid.velocity = new Vector2(0, 0); --> Tanpa memberi pergerakan pada bola.

o Tambahkan function OnCollisionEnter2D di class BolaController.


1. private void OnCollisionEnter2D(Collision2D coll)

2.     {
3.         if (coll.gameObject.name == "TepiKanan")

4.         {

5.             ResetBall();

6.             Vector2 arah = new Vector2(2, 0).normalized;

7.             rigid.AddForce(arah * force);

8.         }

9.         if (coll.gameObject.name == "TepiKiri")

10.         {

11.             ResetBall();

12.             Vector2 arah = new Vector2(-2, 0).normalized;

13.             rigid.AddForce(arah * force);

14.         }

15.     }

private void OnCollisionEnter2D(Collision2D coll) --> Ketika bola


mendeteksi suatu object.

if (coll.gameObject.name == "TepiKanan") --> Memastikan object tersebut


adalah TepiKanan.
ResetBall(); --> Menjalakan seluruh code yang terdapat ResetBall yang
meliputi mengatur ulang posisi bola dan pergerakan bola.

Vector2 arah = new Vector2(2, 0).normalized; --> Menentukan arah


pergerakan bola. Nilai 2 berarti bola mengarah ke kanan.

rigid.AddForce(arah * force); --> Melontarkan bola berdasarkan arah dan


kecepatan bola.

2. Simpan perubahan dengan tekan Ctrl+S sehingga seluruh kode menjadi seperti


ini: 

1. using UnityEngine;

2. public class BallController : MonoBehaviour

3. {

4.     public int force;

5.     Rigidbody2D rigid;

6.     // Use this for initialization

7.     void Start()

8.     {
9.         rigid = GetComponent<Rigidbody2D>();

10.         Vector2 arah = new Vector2(2, 0).normalized;

11.         rigid.AddForce(arah * force);

12.     }

13.     // Update is called once per frame

14.     void Update()

15.     {

16.     }

17.     private void OnCollisionEnter2D(Collision2D coll)

18.     {

19.         if (coll.gameObject.name == "TepiKanan")

20.         {

21.             ResetBall();

22.             Vector2 arah = new Vector2(2, 0).normalized;

23.             rigid.AddForce(arah * force);

24.         }

25.         if (coll.gameObject.name == "TepiKiri")

26.         {

27.             ResetBall();

28.             Vector2 arah = new Vector2(-2, 0).normalized;

29.             rigid.AddForce(arah * force);

30.         }

31.     }

32.     void ResetBall()

33.     {

34.         transform.localPosition = new Vector2(0, 0);

35.         rigid.velocity = new Vector2(0, 0);

36.     }

37. }

Praktik: Mengatur Pantulan Bola pada Paddle

Kita akan membuat sebuah pantulan berdasarkan posisi pantulan Bola terhadap posisi
Paddle. Jika bola mengenai samping/pinggir Paddle, maka bola akan terpantul miring.
Ada beberapa hal yang perlu diperhatikan.Pantulan berdasarkan posisi bola mengenai
Paddle.  Titik Paddle berfungsi sebagai acuan Pantulan bola. Jika bola mengenai bagian atas
paddle maka nilainya lebih besar 0 sehingga memantul ke atas. Sebaliknya, jika bola
mengenai bagian bawah Paddle maka nilainya kurang dari 0 sehingga memantul ke bawah.

Misalnya bola mengenai ujung atas Paddle yang mana posisi y pada bola senilai 5 dan
posisi Y pada paddle senilai 1, maka dari kedua nilai tersebut terdapat perbedaan 5 - 1 = 4
(lebih besar nilai 0 maka bola dipantul ke atas). Sedangkan jika posisi Y pada bola tepat
dengan posisi Paddle yaitu sama-sama 1 maka nilai selisih yang didapat adalah 0 (bola akan
dipantulkan lurus).

Maka yang akan kita lakukan pada bola adalah:

 Ketika Bola mengenai Paddle maka perhatikan kedua posisi.


 Hitung selisih dari kedua posisi tersebut sebagai arah lontar bola.
 Sebelum melontarkan bola, bola tersebut harus dalam keadaan diam.
 Lontarkan Bola.

Langkah-langkahnya antara lain:

1. Buka Script BallController.cs dengan klik 2 kali kmudian tambahkan kode sebagai


berikut:
2. Tambahkan kode ini di dalam function OnCollisionEnter2D(Collision2D coll).

.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2")

.         {

.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

.             Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized;

.             rigid.velocity = new Vector2(0, 0);

.             rigid.AddForce(arah * force * 2);


.         }

if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name ==


"Pemukul2") --> Memastikan objek yang bersentuhan dengan bola adalah GameObject
Pemukul1 dan Pemukul2. 

float sudut = (transform.position.y - coll.transform.position.y) * 5f; --> Kemudian


hitung seberapa kemiringan yang diberikan ke bola. 

Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized; --> Menentukan


arah bola yang akan dipantulkan. 

rigid.velocity = new Vector2(0, 0); --> Reset gerak bola (dengan kode ini, bola akan
diam). 

rigid.AddForce(arah * force * 2); --> Implementasikan arah, kekuatan lontar dan


kecepatan setelah bola menyentuh paddle. Di bagian ini Anda dapat memodifikasi agar
bola semakin cepat dengan menambahkan kelipatan setiap menjalankan kode ini.

    3.  Simpan perubahan dengan tekan Ctrl+S sehingga seluruh kode menjadi seperti ini:

. using UnityEngine;

. public class BallController : MonoBehaviour

. {

.     public int force;

.     Rigidbody2D rigid;

.     // Use this for initialization

.     void Start()

.     {

.         rigid = GetComponent<Rigidbody2D>();

.         Vector2 arah = new Vector2(2, 0).normalized;

.         rigid.AddForce(arah * force);

.     }

.     // Update is called once per frame

.     void Update()

.     {

.     }

.     private void OnCollisionEnter2D(Collision2D coll)

.     {

.         if (coll.gameObject.name == "TepiKanan")

.         {
.             ResetBall();

.             Vector2 arah = new Vector2(2, 0).normalized;

.             rigid.AddForce(arah * force);

.         }

.         if (coll.gameObject.name == "TepiKiri")

.         {

.             ResetBall();

.             Vector2 arah = new Vector2(-2, 0).normalized;

.             rigid.AddForce(arah * force);

.         }

.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2")

.         {

.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

.             Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized;

.             rigid.velocity = new Vector2(0, 0);

.             rigid.AddForce(arah * force * 2);

.         }

.     }

.     void ResetBall()

.     {

.         transform.localPosition = new Vector2(0, 0);

.         rigid.velocity = new Vector2(0, 0);

.     }

. }

Jika Anda masih kurang nyaman dengan pergerakan bola dan paddle, buka panel
Inspector pada masing masing gameobject tersebut.

Atur kecepatan pada Paddle.

Atur force untuk kekuatan lontar pada Bola.


Membuat Skor
Setelah gameplay sederhana dapat dimainkan, selanjutnya kita akan membuat skor. Di
bagian ini selain menghitung perolehan skor , kita juga akan belajar tentang UI, cara
mengaturnya, dan  implementasi Font. Anda dapat menggunakan Text, Font dan mengatur
letak posisi tersebut pada nilai score yang ditampilkan. Hal tersebut merupakan contoh
penggunaan komponen UI.

Praktik:  Menambahkan Font

Penggunaan teks sangat berhubungan dengan font. Anda dapat menggunakan berbagai model
font untuk menampilkan sebuah teks. Beberapa cara untuk mendapatkan sebuah font antara
lain: 

 Anda dapat mengunduh font dari berbagai situs dari yang gratis dan berbayar. Jangan
lupa perhatikan lisensinya ya.
 Anda dapat menggunakan font dari Standard Asset Unity dengan mengimpor
Utilities.
 Anda dapat membuat font sendiri dengan menggunakan tools vector seperti Adobe
illustrator, dll.
Pastikan style font selaras dengan style game Anda. Sebagai contoh, mengingat game pukul
bola tergolong game klasik mari kita gunakan font pixel saja.

Beberapa referensi bisa dilihat di sini http://www.1001fonts.com/pixel-fonts.html

Pada kelas ini, kita menggunakan font berikut http://www.1001fonts.com/joystix-


font.html

Langkah-langkahnya sebagai berikut:

1. Setelah Anda memiliki sebuah font buatlah folder baru dengan nama Fonts.

2. Tambahkan berkas font “joystix monospace.ttf” ke dalam folder Fonts. (Klik kanan


> Import New Asset ).
Sekarang Anda sudah memiliki font yang siap digunakan untuk UI Text.

Praktik: Membuat UI Skor

Kita akan menampilkan skor yang telah diperoleh, kemudian menampilkan skor tersebut
dengan UI Text. Langkah-langkahnya adalah sebagai berikut:

1. Tambahkan Teks baru dengan klik kanan pada Scene Main kemudian pilih
GameObject > UI > Text dan ubah nama GameObject Text menjadi Score1.

2. Klik Canvas. Pada Inspector atur UI Scale Mode di komponen Canvas Scaler menjadi Scale With
Screen. Atur Nilai Reference Resolution menjadi X: 1280 dan Y: 720.
3. Klik Score1 kemudian pada Inspector: 

o Atur nilai posisi Rect Transform menjadi Top-Center.


o Atur juga nilai Pos X: -115, Pos Y: -92, Width: 230 dan Height: 131.

o Pada komponen text, aturlah dengan nilai sebagai berikut:


 Text: 0
 Font: joystix monospace
 Font size: 86
 Alignment: Center - Center
 Color: Putih
4. Sehingga tampilan pada panel Game menjadi seperti ini:

5. Duplikasi GameObject Score1 dan ubah namanya dari Score1 (1) menjadi Score2. Pada Inspector atur Pos


X menjadi 115.
Praktik: Deklarasi dan Inisialisasi Variable Score

Selanjutnya kita akan masuk ke scripting. Pertama kita akan membuat variabel untuk menyimpan skor.

1. Buka Script BallController.cs kemudian tambahkan kode sebagai berikut:

o Tambahkan variabel skor untuk Pemukul1  dan Pemukul2.

1. int scoreP1;

2. int scoreP2;

o Tambahkan inisialisasi variabel skor di function Start().

1. scoreP1 = 0;

2. scoreP2 = 0;

2. Simpan perubahan dengan tekan Ctrl+S.

Praktik: Penghitungan Score dan Reset Posisi Bola

Selanjutnya pada prosedur OnCollisionEnter2D kita perlu menambahkan kode apabila bola


bertabrakan dengan tepi kiri atau tepi kanan. Kode tersebut akan mengatur
penambahan scoreP1 dan scoreP2.

1. Tambahkan isi prosedur OnCollisionEnter sebagai berikut:

o Tambahkan kode ini ketika bola menyentuh Tepi Kanan. 

1. scoreP1 += 1;

o Tambahkan kode ini ketika bola menyentuh Tepi Kiri.

2. scoreP2 += 1;
2. Simpan perubahan dengan tekan Ctrl+S sehingga seluruh kode menjadi seperti ini:

1. using System.Collections;

2. using System.Collections.Generic;

3. using UnityEngine;

4. public class BallController : MonoBehaviour

5. {
6.     public int force;

7.     Rigidbody2D rigid;

8.     int scoreP1;

9.     int scoreP2;

10.     // Use this for initialization

11.     void Start()

12.     {

13.         rigid = GetComponent<Rigidbody2D>();

14.         Vector2 arah = new Vector2(2, 0).normalized;

15.         rigid.AddForce(arah * force);

16.         scoreP1 = 0;

17.         scoreP2 = 0;

18.     }

19.     // Update is called once per frame

20.     void Update()

21.     {

22.     }

23.     private void OnCollisionEnter2D(Collision2D coll)

24.     {

25.         if (coll.gameObject.name == "TepiKanan")

26.         {

27.             scoreP1 += 1;

28.             ResetBall();

29.             Vector2 arah = new Vector2(2, 0).normalized;

30.             rigid.AddForce(arah * force);

31.         }

32.         if (coll.gameObject.name == "TepiKiri")

33.         {

34.             scoreP2 += 1;

35.             ResetBall();

36.             Vector2 arah = new Vector2(-2, 0).normalized;

37.             rigid.AddForce(arah * force);

38.         }

39.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2")

40.         {

41.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

42.             Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized;

43.             rigid.velocity = new Vector2(0, 0);

44.             rigid.AddForce(arah * force * 2);

45.         }

46.     }

47.     void ResetBall()

48.     {

49.         transform.localPosition = new Vector2(0, 0);


50.         rigid.velocity = new Vector2(0, 0);

51.     }

52. }

Praktik: Menuliskan Score ke Layar

Setelah menambahkan text (Score1 dan Score2 pada Canvas) kita perlu menampilkan
skor  yang diperhitungan ke layar. Penambahan skor diatur dalam Script BallController.cs.
Oleh karena itu, penulisan skor juga akan ditangani dalam script ini dengan cara sebagai
berikut:

1. Buka Script BallController.cs dengan klik 2 kali kemudian tambahkan kode sebagai
berikut:

o Tambahkan library UnityEngine.UI.

1. Using UnityEngine.UI;

Digunakan untuk mengakses komponen-komponen untuk UI.

o Tambahkan variabel di dalam class BallController.

1. Text scoreUIP1;

2. Text scoreUIP2;

Digunakan untuk menyimpan gameobject text.

o Tambahkan inisialisasi variabel scoreUIP1 dan scroreUIP2.

1. scoreUIP1 = GameObject.Find ("Score1").GetComponent<Text> ();

2. scoreUIP2 = GameObject.Find ("Score2").GetComponent<Text> ();

Fungsinya untuk mengakses GameObject yang memiliki Nama Score1 dan Score
2. Kemudian dari GameObject tersebut dicari komponen Text yang ada di
dalamnya. Komponent Text ini kemudian disimpan ke scoreUIP1 dan Score
UIP2.
o Tambahkan function di dalam class BallController.

1. void TampilkanScore()

2. {

3.     Debug.Log("Score P1: " + scoreP1 + " Score P2: " + scoreP2);

4.     scoreUIP1.text = scoreP1 + "";

5.     scoreUIP2.text = scoreP2 + "";

6. }

Digunakan untuk mengimplementasikan penampilan skor dengan memanggil


function TampilanScore().

o Tambahkan kode ini ketika scoreP1 dan scoreP2 ditambahkan.

1. TampilkanScore();

2. Simpan perubahan dengan tekan Ctrl+S sehingga seluruh kode menjadi seperti


berikut:
1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4. using UnityEngine.UI;
5. public class BallController : MonoBehaviour
6. {
7.     public int force;
8.     Rigidbody2D rigid;
9.     int scoreP1;
10.     int scoreP2;
11.     Text scoreUIP1;
12.     Text scoreUIP2;
13.     // Use this for initialization
14.     void Start()
15.     {
16.         rigid = GetComponent<Rigidbody2D>();
17.         Vector2 arah = new Vector2(2, 0).normalized;
18.         rigid.AddForce(arah * force);
19.         scoreP1 = 0;
20.         scoreP2 = 0;
21.         scoreUIP1 = GameObject.Find("Score1").GetComponent<Text>();
22.         scoreUIP2 = GameObject.Find("Score2").GetComponent<Text>();

23.     }

24.     // Update is called once per frame

25.     void Update()

26.     {

27.     }

28.     private void OnCollisionEnter2D(Collision2D coll)

29.     {

30.         if (coll.gameObject.name == "TepiKanan")

31.         {

32.             scoreP1 += 1;

33.             TampilkanScore();

34.             ResetBall();

35.             Vector2 arah = new Vector2(2, 0).normalized;

36.             rigid.AddForce(arah * force);

37.         }

38.         if (coll.gameObject.name == "TepiKiri")

39.         {

40.             scoreP2 += 1;

41.             TampilkanScore();

42.             ResetBall();

43.             Vector2 arah = new Vector2(-2, 0).normalized;

44.             rigid.AddForce(arah * force);

45.         }

46.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2")

47.         {

48.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

49.             Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized;

50.             rigid.velocity = new Vector2(0, 0);

51.             rigid.AddForce(arah * force * 2);

52.         }

53.     }

54.     void ResetBall()

55.     {

56.         transform.localPosition = new Vector2(0, 0);

57.         rigid.velocity = new Vector2(0, 0);

58.     }

59.     void TampilkanScore()

60.     {

61.         Debug.Log("Score P1: " + scoreP1 + " Score P2: " + scoreP2);

62.         scoreUIP1.text = scoreP1 + "";

63.         scoreUIP2.text = scoreP2 + "";

64.     }

65. }
Menampilkan Halaman Selesai
Halaman Selesai/Halaman Gameover wajib ada di setiap akhir kita menyelesaikan sebuah game. Di
submodul ini kita akan membahas tentang cara menampilkan halaman selesai sesaat setelah salah satu
dari player mencapai target skor. 

Seperti ini ketika dijalankan:

Praktik: Membuat UI GameOver

1. Tambahkan UI Panel pada Canvas dengan cara klik kanan pada Canvas kemudian
pilih UI > Panel. Ubah Nama dari Panel menjadi PanelSelesai.

2. Atur warna pada PanelSelesai dengan warna yang lebih gelap agar teks yang di atasnya  dapat
lebih terbaca.
3. Tambahkan 2 Text di dalam Panel (Klik kanan pada PanelSelesai, Pilih UI > Text).

Aturlah kedua Text sebagai berikut:


1. Text 1
1. Nama Object: Judul
2. Text: Permainan Selesai
3. Font: joystix monospace
4. Font Size: 77
5. Alignment: Center-Center
6. Color: Putih
2. Text 2

1. Nama Object: Pemenang


2. Text: Player Merah Pemenang!
3. Font: joystix monospace
4. Font Size: 47
5. Alignment: Center-Center
6. Color: Putih
Jangan lupa untuk mengatur posisi dan width dan height pada Rect Transform, Sehingga nampak
seperti ini:

 
4.  Tambahkan 2 Button di dalam PanelSelesai (Klik kanan pada Panel selesai > UI > Button).

Aturlah kedua Text sebagai berikut:

  Button 1
o Nama Object: BtnMenu
o Width: > 271
o Height: > 92
o Source Image: Persegi
o Normal Color: Putih
o Pressed Color: Oranye
 Text pada Botton 1

o Text: Kembali Ke Main Manu


o Font: joystix monospace
o Font Size: 26
o Alignment: Center-Center
o Color: Hitam

  Button 2

o Nama Object: BtnUlangi


o Width: > 271
o Height: > 92
o Source Image: Persegi
o Normal Color: Putih
o Pressed Color: Oranye

 Text pada Botton 2

o Text: Ulangi Permainan


o Font: joystix monospace
o Font Size: 26
o Alignment: Center-Center
o Color: Hitam
o Seperti ini ketika dijalankan:

Praktik: Membuat Kondisi untuk Menampilkan Halaman Selesai

Setelah halaman selesai , berikutnya kita membuat kondisi bahwa jika salah satu player mencapai skor 5
maka dialah pemenangnya. Seperti ini alurnya: 

 Tampilkan skor.

 Cek skor apakah sudah mencapai nilai 5.

 Jika iya, tampilkan halaman selesai dan hentikan permainan (menghilangkan bola).

Langkah-langkahnya antara lain:

1. Buka Script BallController.cs dan tambahkan kode sebagai berikut:

 Tambahkan variabel di dalam class BallController.

1. GameObject panelSelesai;

2. Text txPemenang; 
Digunakan untuk menghandle UI Selesai.

 Tambahkan inisialisasi variable panelSelesai tersebut di function Start().

3.  panelSelesai = GameObject.Find ("PanelSelesai");

4.  panelSelesai.SetActive (false); 

Kode di atas memanggil GameObject PanelSelesai yang terdapat di Hierarchy lalu


memastikannya dalam keadaaan non aktif.

 Tambahkan kode ini setelah menampilkan skor saat bola menyentuh tepi kanan.

1. if (scoreP1 == 5)

2. {

3.     panelSelesai.SetActive (true);

4.     txPemenang = GameObject.Find ("Pemenang").GetComponent<Text> ();

5.     txPemenang.text = "Player Biru Pemenang!";

6.     Destroy (gameObject);

7.     return;

8. } 

 if (scoreP1 == 5) --> Jika skor pemukul 1 lebih dari 5.

panelSelesai.SetActive(true); --> Maka halaman selesai ditampilkan.

txPemenang = GameObject.Find("Pemenang").GetComponent<Text>(); --> Cari


Komponen UI Text pada GameObject Pemenang.

txPemenang.text = "Player Biru Pemenang!"; --> Tampilkan text Player Biru


Pemenang.

Destroy(gameObject); --> Hilangkan bola.

Return; --> Kode selesai dan tidak lanjut membaca kode berikutnya.

 Tambahkan kode ini setelah menampilkan skor saat bola menyentuh tepi kiri.

1. if (scoreP2 == 5)

2. {

3.     panelSelesai.SetActive (true);

4.     txPemenang = GameObject.Find ("Pemenang").GetComponent<Text> ();

5.     txPemenang.text = "Player Merah Pemenang!";

6.     Destroy (gameObject);

7.     return;

8. } 

2. Simpan dengan tekan Ctrl+S sehingga seluruh kode menjadi sebagai berikut:


1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4. using UnityEngine.UI;
5.  
6.  
7. public class BallController : MonoBehaviour
8. {
9.  
10.  
11.     public int force;
12.     Rigidbody2D rigid;
13.  
14.  
15.     int scoreP1;
16.     int scoreP2;
17.  
18.  
19.     Text scoreUIP1;
20.     Text scoreUIP2;
21.  
22.  
23.     GameObject panelSelesai;
24.     Text txPemenang;
25.  
26.  
27.     // Use this for initialization
28.     void Start ()
29.     {
30.         rigid = GetComponent<Rigidbody2D> ();
31.         Vector2 arah = new Vector2 (2, 0).normalized;
32.         rigid.AddForce (arah * force);
33.  
34.  
35.         scoreP1 = 0;
36.         scoreP2 = 0;
37.  
38.  
39.         scoreUIP1 = GameObject.Find ("Score1").GetComponent<Text> ();

40.         scoreUIP2 = GameObject.Find ("Score2").GetComponent<Text> ();

41.  
42.  
43.         panelSelesai = GameObject.Find ("PanelSelesai");
44.         panelSelesai.SetActive (false);
45.     }

46.  
47.  
48.     // Update is called once per frame

49.     void Update ()

50.     {

51.  
52.  
53.     }

54.  
55.  
56.     private void OnCollisionEnter2D (Collision2D coll)

57.     {

58.         if (coll.gameObject.name == "TepiKanan") {

59.             scoreP1 += 1;

60.             TampilkanScore ();

61.             if (scoreP1 == 5) {

62.                 panelSelesai.SetActive (true);

63.                 txPemenang = GameObject.Find ("Pemenang").GetComponent<Text> ();

64.                 txPemenang.text = "Player Biru Pemenang!";

65.                 Destroy (gameObject);

66.                 return;

67.             }

68.             ResetBall ();

69.             Vector2 arah = new Vector2 (2, 0).normalized;

70.             rigid.AddForce (arah * force);

71.         }

72.  
73.  
74.         if (coll.gameObject.name == "TepiKiri") {

75.             scoreP2 += 1;

76.             TampilkanScore ();

77.             if (scoreP2 == 5) {

78.                 panelSelesai.SetActive (true);

79.                 txPemenang = GameObject.Find ("Pemenang").GetComponent<Text> ();

80.                 txPemenang.text = "Player Merah Pemenang!";

81.                 Destroy (gameObject);

82.                 return;

83.             }

84.             ResetBall ();

85.             Vector2 arah = new Vector2 (-2, 0).normalized;

86.             rigid.AddForce (arah * force);

87.         }

88.  
89.  
90.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2") {

91.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

92.             Vector2 arah = new Vector2 (rigid.velocity.x, sudut).normalized;

93.             rigid.velocity = new Vector2 (0, 0);

94.             rigid.AddForce (arah * force * 2);

95.         }

96.  
97.  
98.     }

99.  
100.  

101.     void ResetBall ()

102.     {

103.         transform.localPosition = new Vector2 (0, 0);

104.         rigid.velocity = new Vector2 (0, 0);

105.     }

106.  

107.  

108.     void TampilkanScore ()

109.     {

110.         Debug.Log ("Score P1: " + scoreP1 + " Score P2: " + scoreP2);

111.         scoreUIP1.text = scoreP1 + "";

112.         scoreUIP2.text = scoreP2 + "";

113.     }

114. }

Membuat dan Mengelola Halaman


Halaman utama/menu merupakan titik awal player memulai game. 
Biasanya di halaman utama/menu terdapat beberapa halaman navigasi berupa tombol yang berfungsi
untuk mengakses antara lain: 

 permainan
 halaman kredit
 keluar
 tutorial

Di pembelajaran ini kita hanya menggunakan satu tombol untuk masuk ke permainan. Selain membuat
halaman utama, tombol juga mengatur perpindahan halaman baik di halaman utama maupun di halaman
selesai.

Praktik: Membuat Halaman Menu

1. Tambahkan Scene baru dengan klik menu File > New Scene.


2. Ubah warna background pada Inspector Camera.

3. Tambahkan UI Canvas (klik kanan pada scene (Untitled*) pilih GameObject > UI > Canvas).


Pada Inspector Canvas aturlah UI Scale Mode menjadi Scale With Screen Size dan atur Reference
Resolution X: 1280 dan Y: 720

4. Susunlah Home dengan tampilan sebagai berikut:

Tambahkan satu Text dan satu Button (Pastikan ditambah di dalam Canvas). Detailnya sebagai


berikut:

o Text 1
 Nama Object: Judul
 Text: Pukul Bola
 Font: joystix monospace
 Font size: 96
 Alignment: Center - Center
 Color: Putih
o Button 1

 Nama Object: btnMulai
 Width: > 400
 Height: > 150
 Source Image: Persegi
 Normal Color: Putih
 Pressed Color: Oranye

o Text pada Botton 1

 Text: Mulai!
 Font: joystix monospace
 Font Size: 60
 Alignment: Center-Center
 Color: Hitam

5. Simpan Scene dengan klik Ctrl+S . Cara lainnya, klik Menu File > Save As di dalam


folder Scenes dan beri nama Menu.

Praktik: Mengatur Perpindahan Halaman

1. Buka Folder Scripts kemudian buat Script baru dengan nama HalamanManager.cs.

2. Buka Script HalamanManager.cs dengan klik 2 kali lalu tambahkan script berikut:

o Tambahkan library baru untuk mengelola Scene

1. using UnityEngine.SceneManagement;

Digunakan untuk mengakses method mengelola Scene.


o Tambahkan variabel di dalam class HalamanManager

1.  public bool isEscapeToExit;

Digunakan untuk menentukan fungsi tombol Escape untuk kembali ke Menu atau ke Main
(Gameplay).

o Tambahkan 2 function ke dalam class HalamanManager.

1. public void MulaiPermainan()

2. {

3.     SceneManager.LoadScene("Main");

4. }

5. public void KembaliKeMenu()

6. {

7.     SceneManager.LoadScene("Menu");

8. }

Digunakan untuk berpindah ke halaman Main dan ke halaman Menu.

o Tambahkan kode ini di dalam function Update.

1. if (Input.GetKeyUp(KeyCode.Escape))
2. {
3.     if (isEscapeToExit)
4.     {
5.         Application.Quit();
6.     }
7.     else
8.     {
9.         KembaliKeMenu();
10.     }
11. }

Ketika menekan tombol Escape, jika nilai isEscapeToExit bernilai benar maka akan


keluar dari Game. Sebaliknya, jika bernilai salah maka akan kembali ke Menu.

3. Simpan perubahan dengan Ctrl+S sehingga seluruh kode sebagai berikut:


1. using UnityEngine;
2. using UnityEngine.SceneManagement;
3. public class HalamanManager : MonoBehaviour
4. {
5.     public bool isEscapeToExit;
6.     // Use this for initialization
7.     void Start()
8.     {
9.     }
10.     // Update is called once per frame

11.     void Update()

12.     {

13.         if (Input.GetKeyUp(KeyCode.Escape))

14.         {

15.             if (isEscapeToExit)

16.             {

17.                 Application.Quit();

18.             }

19.             else

20.             {

21.                 KembaliKeMenu();

22.             }

23.         }

24.     }

25.     public void MulaiPermainan()

26.     {

27.         SceneManager.LoadScene("Main");

28.     }

29.     public void KembaliKeMenu()

30.     {

31.         SceneManager.LoadScene("Menu");

32.     }

33. }
4. Masukkan script HalamanManager.cs ke GameObject Main Camera.
Setelah Anda memasukkan script ke gameobject pada Inspector, centang “Is Escape to Exit.” Alhasil,
ketika user menekan tombol escape ia akan keluar dari aplikasi

Praktik: Daftarkan Semua Scene ke Scenes In Build

Scene yang telah dibuat tidak dapat langsung diakses. Mengingat kita sudah memiliki 2 Scene, keduanya
harus dimasukkan terlebih dulu ke Scenes In Build.

1. Buka Build Settings... (menu File > Build Settings...)


2. Tambahkan scene yang telah dibuka dengan klik Add Open Scenes.

Jika Anda memiliki lebih dari 1 scene, maka Anda harus buka scene tersebut kemudian klik Add Open
Scenes. Sehingga hasilnya seperti berikut:

3. Sekarang Scene yang telah dibuat dapat dipanggil melalui script.

Praktik: Memberi Fungsi pada Button

Setelah script sudah dibuat dan scene sudah siap, selanjutnya hubungkan script yang telah dibuat ke
Button (btnMulai). Langkah-langkahnya antara lain:

1. Klik btnMulai, kemudian pada komponen Button di panel Inspector. Klik icon + pada On Click().


2. Pada script HalamanManager.cs masukkan gameObject Main Camera ke list baru On Click ()
kemudian masukkan method HalamanManager > MulaiPermainan().

Menambahkan Audio 
Menuju bagian akhir dari modul ini, kali ini kita akan belajar menambahkan audio
agar game buatan kita lebih hidup. Dalam tutorial ini audio akan digunakan sebagai:

 Background music
 Sound effect ketika bola terpantul

Salah satu tempat yang menyediakan audio gratis adalah Audio Library – No


Copyright Music (https://www.youtube.com/channel/UCht8qITGkBvXKsR1Byln-wA).
Sebagai sampel, sound berikut ini yang akan kita gunakan.

 “Chiptune Shopping Adventures” untuk background music 


(https://www.youtube.com/watch?v=CDEbHETrg9Q).
 “How Now Brown Cow?” untuk background music (https://www.youtube.com/watch?
v=_3No0WiZE0w).
 “Glass and Metal Collision” untuk sound effect (https://www.youtube.com/watch?
v=1yr897epApM).
 “Golf Ball Hit” untuk sound effect (https://www.youtube.com/watch?v=kMr9BbC69PE).

Silakan gunakan audio lain yang Anda inginkan, tetapi perhatikan lisensinya ya. Jika
ingin konversi dari mp4 ke mp3, gunakan Online Video Converter 
(https://www.onlinevideoconverter.com/mp3-converter).
Setelah mengunduh audio pilihan, buat folder Audios serta drag and drop berkas audio
tersebut ke folder tersebut.

Pada Unity terdapat beberapa istilah yang berkaitan dengan Audio. Beberapa istilah penting
antara lain: 

 Audio Listener
Audio Listener merupakan Component yang bertindak seperti microphone. Component ini
menerima semua input dari Audio Source pada sebuah Scene dan memainkan musik melalui
speaker komputer.
 Audio Source
Audio Source merupakan Component yang memutar sebuah Audio Clip pada Scene. Efek
audio bisa ditambahkan pada Audio Source.
 Audio Clip
Audio Clip berisi data audio yang akan digunakan oleh Audio Source. Format audio yang ada
dalam Unity yaitu: .aif, .wav, .mp3, and .ogg.

Praktik: Menambahkan Background Music

Untuk menambahkan background music, lakukan tahapan berikut:

1. Buka Scene Main lalu klik Main Camera di Hierarchy. Pada Inspector tambahkan Audio
Source (Add Component > Audio > Audio Source).
2. Masukkan berkas “Chiptune Shopping Adventures.mp3” ke field AudioClip. Jangan lupa
untuk centang Loop.

Ketika dimainkan, musik langsung jalan dan secara otomatis mengulang ketika
selesai. Anda juga dapat mengatur Volume untuk menyesuaikan kenyamanan dalam
game yang Anda buat.

Praktik: Menambahkan Sound Effect

Penambahan sound effect akan dicontohkan dengan momen ketika Bola menabrak benda
lain. Langkah-langkah yang diperlukan cukup mirip dengan penambahan background music,
yaitu:

1. Klik GameObject Bola di Hierarchy. Pada Inspector tambahkan Audio Source (Add


Component > Audio > Audio Source).
Biarkan field AudioClip tetap kosong. Lalu hilangkan centang pada Play On Awake.
2. Selanjutnya, agar sound effect dapat diputar pada waktu yang sesuai, buka
script BolaController.cs dan tambahkan potongan kode berikut.

o Pada inisialisasi variabel tambahkan:

1. AudioSource audio;

2. public AudioClip hitSound;

AudioSource audio; --> Sebagai kontroller audio.

public AudioClip hitSound; --> Menyimpan berkas audio.

o Pada prosedur Start() tambahkan:

1. audio = GetComponent<AudioSource>();

Untuk “mengambil” komponen Audio Source.

o Pada prosedur OnCollisionEnter2D tambahkan:

1. audio.PlayOneShot(hitSound);

Menjalankan sebuah audio.

3. Simpan perubahan dengan tekan Ctrl+S sehingga seluruh kode seperti ini:  

1. using UnityEngine;
2. using UnityEngine.UI;
3.  
4. public class BallController : MonoBehaviour
5. {
6.     public int force;
7.     Rigidbody2D rigid;
8.     int scoreP1;
9.     int scoreP2;
10.     Text scoreUIP1;
11.     Text scoreUIP2;
12.     GameObject panelSelesai;
13.     Text txPemenang;
14.     AudioSource audio;
15.     public AudioClip hitSound;
16.    
17.     // Use this for initialization
18.     void Start()
19.     {
20.         rigid = GetComponent<Rigidbody2D>();
21.         Vector2 arah = new Vector2(2, 0).normalized;
22.         rigid.AddForce(arah * force);
23.         scoreP1 = 0;
24.         scoreP2 = 0;
25.         scoreUIP1 = GameObject.Find("Score1").GetComponent<Text>();
26.         scoreUIP2 = GameObject.Find("Score2").GetComponent<Text>();
27.         panelSelesai = GameObject.Find("PanelSelesai");
28.         panelSelesai.SetActive(false);
29.         audio = GetComponent<AudioSource>();
30.     }
31.    
32.     // Update is called once per frame
33.     void Update()
34.     {
35.    
36.     }
37.    
38.     private void OnCollisionEnter2D(Collision2D coll)
39.     {
40.         audio.PlayOneShot(hitSound);
41.         if (coll.gameObject.name == "TepiKanan")
42.         {
43.             scoreP1 += 1;
44.             TampilkanScore();
45.             if (scoreP1 == 5)
46.             {

47.                 panelSelesai.SetActive(true);

48.                 txPemenang = GameObject.Find("Pemenang").GetComponent<Text>();

49.                 txPemenang.text = "Player Biru Pemenang!";

50.                 Destroy(gameObject);

51.                 return;

52.             }

53.             ResetBall();

54.             Vector2 arah = new Vector2(2, 0).normalized;

55.             rigid.AddForce(arah * force);

56.         }

57.         if (coll.gameObject.name == "TepiKiri")

58.         {

59.             scoreP2 += 1;

60.             TampilkanScore();

61.             if (scoreP2 == 5)

62.             {

63.                 panelSelesai.SetActive(true);

64.                 txPemenang = GameObject.Find("Pemenang").GetComponent<Text>();

65.                 txPemenang.text = "Player Merah Pemenang!";

66.                 Destroy(gameObject);

67.                 return;

68.             }

69.             ResetBall();

70.             Vector2 arah = new Vector2(-2, 0).normalized;

71.             rigid.AddForce(arah * force);

72.         }

73.         if (coll.gameObject.name == "Pemukul1" || coll.gameObject.name == "Pemukul2")

74.         {

75.             float sudut = (transform.position.y - coll.transform.position.y) * 5f;

76.             Vector2 arah = new Vector2(rigid.velocity.x, sudut).normalized;

77.             rigid.velocity = new Vector2(0, 0);

78.             rigid.AddForce(arah * force * 2);

79.         }

80.     }

81.    

82.     void ResetBall()

83.     {

84.         transform.localPosition = new Vector2(0, 0);

85.         rigid.velocity = new Vector2(0, 0);

86.     }

87.    

88.     void TampilkanScore()

89.     {
90.         Debug.Log("Score P1: " + scoreP1 + " Score P2: " + scoreP2);

91.         scoreUIP1.text = scoreP1 + "";

92.         scoreUIP2.text = scoreP2 + "";

93.     }

94. }

4. Terakhir buka Inspector Bola. Lalu masukkan berkas“Glass and Metal Collision.mp3” ke field Hit
Sound Ball Controller (Script).

Anda mungkin juga menyukai