PELATIHAN APLIKASI TEKNOLOGI INFORMATIKA (PASTI) 2016

MODUL PEMBUATAN GAME BERBASIS

OS TIZEN

STUDY KASUS MEMBUAT

GAME ENDLESS RUN

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK
UNIVERSITAS SILIWANGI
2016
A. Persiapan
Aplikasi yang diperlukan untuk membuat Games berbasis os tizen adalah :
1. Unity3D
2. Tizen SDK
3. Blender *
4. Photoshop *
5. Corel Draw atau sejenisnya *
*Optional
B. Tahap Installasi
 Unity3D
1. Buka Unity3D.exe
2. Pada halaman “Welcome to The Unity 5.x.xxx Setup Pilih Nex

3. Selanjutnya muncul halaman licence agreement, pilih tombol I Agree

4. Selanjutnya halaman choose component, tekan tombol next.

5. Langkah selanjutnya memilih install location, biarkan saja secara default. Pilih
install.

6. Tunggu hingga proses selesai, jika prosess instalasi selesai tekan tombol next.
 7. Taraaaaa. Instalasi selesai, centang run unity 5.xx untuk membuka aplikasi Unity.

8. Selanjutnya akan diminta untuk mengisikan akun unity, jika belum punya bisa
mendaftar akun terlebih dahulu di Unity3d.com atau jika sudah punya tinggal
login menggunakan alamat email dan password yang telah didaftarkan.
 Tizen SDK
1. Jika belum punya tizen sdk bisa di download di :
https://developer.tizen.org/development/tools/download
2. Double klik aplikasi tizen-web-ide_TizenSDK_2.4.0_Rev7_usa_windows-64
3. Centang accept dan klik button yang berwarna biru.

4. Tunggu hingga proses instalasi selesai.

5. Halawan awal tizen setelah di install

6. Setelah Tizen SDK berhasil di install, Pada menu Start cari Tizen SDK -> Update
Manager

7. Masuk ke menu All Packages -> Extras -> Install Samsung Certificate Extension.
Samsung Certificate Extension berguna nantinya pada saat proses pengujian
Games ke Smartphone Tizen
C. Tahapan Pembuatan Games
User Interface
1. Buka Unity3D.
2. Klik menu File -> Build Setting -> Tizen -> Klik Switch Platform -> Close
Jika Tizen tidak tersedia, silakan klik tizen dan klik Open Download Page.
Download dan install terlebih dahulu.
Jika sudah terinstall, tutup dan buka kembali unitynya .
3. Klik Main Camera, di tab Inspector pada bagian Projection pilih Orthographic dan
seting postion menjadi 0 0 0

4. Dibagian kosong di panel hierarchy klik kanan -> 3D Object -> Cube
5. Seting posisi, ke 0 0 0, dan dibawah position ada Box Colider-> Is Trigger -> Centang

6. Klik tombol yang paling kanan untuk memperbesar/mengecilkan ukuran cube dan
buat jadi seperti gambar dibawah..
Tombol yang kedua : Untuk menggeserkan Object
Tombol yang ketiga : Untuk merotasi object
Tombol yang keempat & kelima : Untuk memperbesar/memperkecil ukuran
7. Ulangi langkah membuat cube, sehingga didapat seperti berikut :

8. Untuk mempermudah nantinya, rename terlebih dahulu cube menjadi wallKiri dan
wallKanan. Dengan cara klik kanan di cube -> Rename -> masukan wallKiri

Sehingga menjadi seperti berikut :

9. Selanjutnya kita akan membuat playernya, kita gunakan cube untuk membuat player.
Klik kanan-> 3D Object -> cube . Dan rename cube menjadi Player serta sesuaikan
ukuran cube menjadi seperti berikut :

10. Kita akan membuat rintangan-rintangannya. Untuk membuat rintangan bisa

menggunakan cube, sphere,cylender, dll. Caranya klik kanan -> 3D Object -> Cube
dan atur cube sehingga menjadi seperti berikut :
11. Beri tag untuk rintangan1 dan rintangan 2. Dengan cara klik kiri di rintangan 1 -> Tab
Inspector -> Tag -> Pilih Trap.

12. Jika tag trap belum ada, bisa menambah tag terlebih dahulu dengan cara klik Add
Tag. Dan masukan Trap. Selanjutnya klik rintangan1 lagi dan pilih tag Trap. Ulangi
cara diatas untuk rintangan2.

13. Supaya mempermudah, lakukan grouping pada rintangan1 dan rintangan 2 dan beri
nama grupRintangan1. Cara melakukan gruping yaitu Create Empty Object ->
Rename menjadi grupRintangan1 dan drag rintangan1 dan rintangan2 kedalam
grupRintangan1.
14. Lakukan duplikasi grupRintangan1 dengan cara CTRL + D. Untuk membuat
rintangan lainnya dengan cepat, tinggal atur-atur posisi rintangan-rintangannya,
contohnya seperti berikut.

15. Lakukan duplikasi lagi supaya terdapat 3 buah grup rintangan dan kembali atur posisi
sesuai dengan yang diinginkan.

Gambar diatas cube diganti menjadi sphere dan di rename menjadi rintangan4.
16. Selanjutnya kita akan membuat sebuah Text yang nantinya berguna untuk
menampilkan score. Caranya klik kanan-> UI-> Text dan atur seperti gambar
dibawah.

17. Setelah selesai, selanjutnya kita akan membuat object yang nantinya camera bisa
mengikuti gerak Player.
Caranya klik kanan-> Create empty object -> berinama CameraFollow -> letakan
diatas Main Camera, dan lakukan gruping menjadi seperti berikut :
18. Dibawah cameraFollow, buat 2 buah Empty dan berinama masing masing
SpawnPoint dan DestroyPoint. SpawnPoint nantinya berguna untuk menentukan
lokasi dari rintangan yang muncul. DestroyPoint berguna untuk memusnahkan object
jika lokasi object tersebut sudah dibawah lokasi dari DestroyPoint. Dan atur posisi
DestroyPoint di Scene supaya dibawah player.

19. Selanjutnya buat empty object dengan nama Script yang nantinya digunakan untuk
menampung script-script.

20. Buat canvas baru dengan cara klik kanan->UI->Canvas. Dan dibawah canvas yang
sudah dibuat, buat Raw Image dengan cara klik kanan->UI->Raw Image.
Canvas ini yang nantinya berfungsi ketika player menabrak rintangan / wall nantinya
akan muncul hasil score yang didapat beserta Highscorenya ..
21. Selanjutnya buat 2 buah Text dan rename masing masing namanya menjadi txtCurent,
dan txtScore. Serta buat 2 buah button yang masing masingnamanya adalah Play
Again dan Menu Utama. Sehingga tampilannya menjadi seperti berikut :

22. Tahap pembuatan UI telah selesai, selanjutnya mari ke tahap pemberian Script ..
Script
1. Buat folder Script terlebih dahulu. Dibagian assets -> klik kanan -> Create -> Folder

2. Didalam Folder buat 3 buah C# Script dengan cara klik kanan->Create->C# Script->
dan berinama masing masing PlayerScript, DestroyTrap,RandomTrap.
3. Untuk memberi script caranya double klik Script yang dituju. Misal double klik
PlayerScript.

Dan masukan script berikut :

using UnityEngine;
using UnityEngine.UI;
using System.Collections;

public class PlayerScript : MonoBehaviour {

private Rigidbody RbPlayer;
private bool Kanan;
public float Speed;
public Rigidbody Kamera;
public GameObject player, CanvasGameOver;
public bool isPause;
public Text SkorTxt;
// Use this for initialization
void Start () {
RbPlayer = GetComponent<Rigidbody>();
Kanan = true;
isPause = false;
}
// Update is called once per frame
void Update () {
int skor = PlayerPrefs.GetInt ("counter");
SkorTxt.text = "" + skor;
Speed = PlayerPrefs.GetFloat("speed");

}
void OnTriggerEnter(Collider other)
{
if(other.tag == "Trap")
{
 Time.timeScale = 0;
isPause = true;
CanvasGameOver.SetActive (true);
}
}
public void Gerak ()
{
if (isPause == false) {
Kamera.velocity = new Vector2 (0, Speed);
if (Kanan == true) {
RbPlayer.velocity = new Vector2 (Speed, Speed
);
Kanan = false;
Quaternion belokKanan = Quaternion.Euler (0f,
0f, -30f);
player.transform.localRotation = belokKanan;
} else {
RbPlayer.velocity = new Vector2 (-
Speed, Speed);
Quaternion belokKiri = Quaternion.Euler (0f,
0f, 30f);
player.transform.localRotation = belokKiri;
Kanan = true;
}

} else {
Time.timeScale = 0;
}

public void pindah(){

if (isPause == true) {
Time.timeScale = 1;
}
PlayerPrefs.DeleteKey ("counter");
PlayerPrefs.DeleteKey ("Speed");
Application.LoadLevel (0);
}
}

4. Double klik script DestroyTrap, dan masukan script berikut :

using UnityEngine;
using System.Collections;

public class DestroyTrap : MonoBehaviour {

public GameObject DestroyPoint;
public int counter;
 // Use this for initialization
void Start () {
DestroyPoint = GameObject.Find ("DestroyPoint")
;
counter = PlayerPrefs.GetInt ("counter");
if (counter == 0) {
PlayerPrefs.SetFloat ("speed", 2f);
} else {
PlayerPrefs.GetFloat ("speed");
}

}
// Update is called once per frame
void Update () {
if(transform.position.y < DestroyPoint.transfor
m.position.y)
{
int a = PlayerPrefs.GetInt ("counter");
a = a + 1;
PlayerPrefs.SetInt ("counter", a);
float b = PlayerPrefs.GetFloat ("speed");
b = b + 0.2f;
Debug.Log ("" + b);
PlayerPrefs.SetFloat ("speed", b);
Destroy(gameObject);
}
}
}

5. Double klik script RandomTrap, dan masukan script berikut :

using UnityEngine;
using System.Collections;

public class RandomTrap : MonoBehaviour {

public GameObject[] Trap;
public Transform SpawnPoint;
public float Jarak;
public int MaxTrap;

private int trap_num;

// Use this for initialization

void Start () {

// Update is called once per frame

void Update () {
 if(transform.position.y < SpawnPoint.position.y
)
{
transform.position = new Vector3(transform.
position.x, transform.position.y + Jarak);
trap_num = Random.Range(0, MaxTrap);
Instantiate(Trap[trap_num], transform.posit
ion, transform.rotation);
}
}
}

6. Untuk memberi script pada object, drag script yang dituju dan drop di object tujuan.
Kita akan memberi script PlayerScript ke Object Player dengan cara :
 Jika proses drag script sukses, maka akan muncul kotak Script dibagian kanan bawah
tab Inspector

7. Selanjutnya klik cameraFollow -> Add Component -> RigidBody

8. Klik Player dan Drag player ke player yang ada di box Script.

9. Selanjutnya Drag cameraFollow ke Kamera yang ada di box Script.

10. Drag CanvasGameOver ke Canvas Game Over yang ada di box Script. (jika namanya
masih canvas, silakan dirubah terlebih dahulu)

11. Drag txtScore ke Skor Txt di box script. (jika namanya masih text silakan rubah dulu
menjadi txtScore)
12. Selanjutnya Aktifkan grupRintangan1 dengan cara mencentang objectnya. Dengan
cara klik grupRintangan1 dan Centang box dipanel Inspector.

Lakukan hal serupa untuk grupRintangan2 dan 3. Sehingga nantinya text

grupRintangan1, grupRintangan2, grupRintangan3 tulisannya menjadi hitam (bukan
abu-abu).
13. Selanjutnya drag DestroyTrap ke grupRintangan1,grupRintangan2,grupRintangan3

14. Buah folder di asset dengan nama prefab.

15. Doublik klik folder prebab, dan Drag grupRintangan1,
grupRintangan2,grupRintangan3 ke folder Prebab.

16. Sehingga hasilnya muncul seperti berikut

17. Selanjutnya masuk ke folder script-> Drag Random Trap ke Object Script.

18. Klik object Script. Dan isi box Script seperi berikut
19. Selanjutnya tekan CTRL dan klik grupRintangan1, grupRintangan2,grupRintangan3
dan CanvasGameOver lalu jangan dicentang pada tab Inspector.

20. Selanjutnya kita akan buat button supaya player berjalan ketika kita pijit. Klik kanan
di canvas->UI->Button
21. Atur besar button sehinggan menutupi semua layar.

22. Atur button supaya jadi Transparant. Caranya klik button -> Normal Color -> Geser
bagian A sampai ke kiri.
Selanjutnya klik button -> Highlight Color -> Geser bagian A sampai ke Kiri
Selanjutnya klik button -> Pressed Color -> Geser bagian A sampai ke Kiri
Selanjutnya klik button -> Disabled Color -> Geser bagian A sampai ke Kiri
 Sehingga nampak di scene, button menjadi transparant.

23. Selanjutnya kita hilangkan text pada button. Caranya klik kanan pada Text -> Delete
24. Klik button -> di tab Inspector klik tombol tambah.

Drag Player ke tulisan none (Object) dibawah tulisan runtime Only dan Klik No
Function -> PlayerScript -> Gerak.
25. Selanjutnya klik player -> Addcomponent -> RigidBody

26. Dan atur seperti berikut :

27. Klik camera Follow -> Pada tab inspector Use Gravity jangan di centang.

28. Selanjutnya aktifkan canvasgameover -> Klik Button PlayAgain -> Tambahkn Fungsi
Pindah

29. Selanjutnya di asset buat C# Script dengan nama Highscore dan masukan script
berikut :
using UnityEngine.UI;
using UnityEngine;
using System.Collections;

public class Highscore : MonoBehaviour {

public Text score,highscores;

int curentScore,highscore;
void Start () {
//PlayerPrefs.DeleteAll ();
PlayerPrefs.GetInt ("highscore");
curentScore = PlayerPrefs.GetInt ("counter");
highscore = PlayerPrefs.GetInt ("highscore");
 cekHighscore ();
}

void cekHighscore () {

if (curentScore > highscore) {

PlayerPrefs.SetInt ("highscore", curentScore);

highscores.text = "Highscore : " + curentScore;

} else {
PlayerPrefs.SetInt ("highscore", highscore);

highscores.text = "Highscore : " + highscore;

}

score.text = "Current Score : " + curentScore;

}
}

30. Kemudian Drag script Highscore ke CanvasGameOver.

31. Klik CanvasGameOver dan Drag txtCurent ke socre di box Script.
Drag TxtHighscore ke Highscore di boxScript.

32. Selanjutnya Play

33. Maka Current Score dan Highscore akan muncul 

 34. Alhamdulillah, proses script sudah selesai. Tinggal mempercantik tampilan dan
mengganti object object sesuai dengan yang kita inginkan, misal mengganti player
dengan gambar layang-layang atau dengan yang lain.
Mempercantik tampilan
1. Siapkan desain / model sesuai dengan yang di inginkan.
2. Masukan gambar yang ingin dimasukan ke unity dengan cara drag gambar dan drop
di unity.

3. Klik gambar yang telah dimasukan ke unity, dan rubah Texture Type menjadi Sprite
(2D and UI).
 Setting box sesuai dengan gambar berikut :

Maksud gambar diatas supaya gambar yang nantinya ditampilkan tidak menampilkan
Image Size secara keseluruhan, tetapi dibatesi max. Size 256 supaya gambar yang di
load tidak terlalu berat.
4. Setelah gambar termasukan, selanjutnya tinggal mengganti object yang diinginkan.
Misal kita ingin mengganti Object player supaya menjadi gambar layang-layang yang
tadi dimasukan. Caranya Drag gambar layang-layang tadi ke object yang ingin diganti
(dalam kasus ini object Player)
 Sehingga menjadi seperti berikut :

Selanjutnya perkecil ukuran gambar layang-layang sesuaikan dengan ukuran dari

player.
Sebelum : Sesudah

5. Jika sudah diperkecil, selanjutnya tinggal menghilangkan object player dengan cara
klik object player -> di pinggir cube klik bulatan kecil -> Pilih none ..
 6. Dan Taraaaaa object player menghilang dan digantikan object layang-layang .

7. Selanjutnya tinggal ulangi langkah diatas untuk menganti object-object yang lain .

D. Tahap Porting Aplikasi ke Tizen

Porting atau istilah lain adalah membuild hasil game yang telah dibuat di unity ke extension
untuk Tizen ( .tpk ) .
Untuk melakukan porting ada beberapa tahap yang harus dikerjakan, berikut langkah-langkah
porting dari unity menjadi .tpk.
1. Buka Tizen SDK IDE terlebih dahulu. Tentukan tempat untuk menyimpan project,
atau biarkan default.
2. Klik menu Windows -> Preferences

3. Selanjutnya klik pada Tizen SDK -> Security Profiles -> Add dan masukan nama
Profile yang ingin dibuat. Contohnya “sigade”
4. Langkah selanjutnya klik tombol generate .

Dan isi data data yang dibutuhkan, data tidak harus seperti dibawah, bisa sesuai
dengan yang diinginkan. Jika sudah klik OK.
5. Selanjutnya akan muncul messageBox seperti berikut, Ok Saja 

6. Maka akan tampil tampilan berikut, selanjutnya klik tombol OK.

7. Setelah membuat sertifikat, kita akan menyiapkan Tizen CLI Evironment yang
fungsinya supaya dapat diakses oleh pihak ketiga. Caranya buka command prompt.
Kemudian masuk ke drive lokasi instalan Tizen SDK.
Masuk ke directory tizen-sdk\tools\ide\bin
Kemudian ketikan perintah berikut :
tizen.bat cli-config -g
"default.profiles.path=C:\Users\[namaKomputeranda]\Documents\Workspace
Tizen\.metadata\.plugins\org.tizen.common.sign\profiles.xml"
 Alamat yang diberi tanda merah harus sama dengan alamat pada saat kita memilih
lokasi untuk pembuatan project.

8. Selanjutnya ketikan di cmd tizen.bat cli-config –l

Maka akan tampil informasi dari profiles.xml. Text yang di dalam kotak merah harus
sama PATHnya dengan yang didaftarkan tadi
 Jika tidak sama maka buka C:\tizen-sdk\tools -> cari dan buka.tizen-cli-configuration
menggunakan notepad/ sublime text dan edit PATHnya sesuai dengan yang
didafatarkan sebelumnya.
Sebelum

Sesudah

9. Selanjutnya buka cmd kembali dan jalankan perintah tizen.bat cli-config –l jika
dibagian path sudah berubah, maka setingan telah berhasil.
10. Sekarang kita akan coba build menjadi TPK, buka kembalik project unity.
11. Klik File -> Build Setting dan klik Add Open Scenes -> lalu klik Player Settings.

12. Maka akan muncul jendela berikut :

Yang perlu di isi adalah :

Company Name : bebas diisi sesuai keinginan
Product Name : bebas diisi sesuai keinginan
 Default Orientation : yaitu orientasi yang digunakan di handphone. Ada Potrait /
Landscape / Auto Rotation.
13. Selanjutnya klik tab Icon. Jika ingin menggunakan icon, centang Ovveride For Tizen
dan pilih icon yang diinginkan

14. Klik tab other setting, isian pada company name & product name harus sama dengan
bundle identifier formatnya com.[companyname].[productname]
15. Klik publishing setting, dan isi Signing Profile Name dengan profile name yang telah
dibuat pada sertificate di Tizen SDK.

16. Setelah itu, klik file -> Build Setting -> Build
17. Beri nama aplikasi sesuai dengan yang diinginkan

18. Tunggu beberapa saat .

19. Jika sudah selesai maka hasilnya akan muncul.

E. Menguji Game di Device Tizen
1. Pada handphone tizen, masuk ke menu panggilan dan ketikan *#84936# untuk masuk
ke developer Option

2. Aktifkan Developer Option

3. Klik Developer Option -> Aktifkan USB Debuging

4. Hubungkan perangkat tizen ke komputer dengan usb, maka akan tampil gambar
berikut, klik yes.
5. Buka Tizen IDE -> Klik registered certificate

6. Maka akan muncul tampilan seperti berikut, klik replace dan klik Create new
Certificate
7. Isi password sesuai dengan yang dibuat waktu di certificate. Lalu di bagian Connected
Device klik tombol add. Maka Devicename dan DUID akan masuk dibagian kiri.
Selanjutnya klik request.

8. Setelah di klik request, maka akan tampil jendela Samsung Login. Jika belum punya
akun silakan Create akun terlebih dahulu. Jika sudah punya akun silakan login
menggunakan akunnya.
9. Tunggu beberapa saat, sampai muncul jendela seperti berikut lalu klik ok.

10. Selanjutnya klik ok .

11. Sekarang, buka project kembali di unity, dan klik file -> Build and Run.

Tunggu beberapa saat sampai proses selesai.

Jika sudah selesai, maka aplikasi akan terinstall di smartphone dan siap dijalankan.
 DAFTAR PUSTAKA
Hidayat, Ariska. https://www.codepolitan.com/tutorial/porting-game-unity3d-tizen