User Interface Game

Anda yang sering berhubungan dengan komputer tentu sudah tidak asing kan mendengar kata User interface? Ya, jika diartikan ke bahasa Indonesia User Interface berarti tampilan antar muka pengguna. Jika didefinisikan secara sederhana User Interface adalah penghubung atau mediator antara komputer dan manusia atau user komputer itu agar hubungan antara perangkat komputer dengan user bisa terjalin. User interface sangat berperan penting dalam dunia komputer karena dengan adanya user interface maka kemudahan user dalam mengoperasikan suatu perangkat komputer menjadi lebih mudah.

Sebuah Desain Interface/antarmuka pada suatu Game mempengaruhi kenyamanan dan sejauh mana user/pengguna meminati Game tersebut. Untuk itu kali ini saya akan membahas beberapa hal yang berhubungan dengan Desain Interface pada game.  Sebelum memasuki pembahasan berikutnya kita perlu mengetahui apa itu HUD. HUD adalah singkatan dari Heads-Up Display dan biasanya menunjukkan bar/kotak HP(Health Point) ataupun MP(Mana Point) dan biasanya muncul  di atas kepala karakter. Fungsi HUD ini untuk memudahkan pemain mengetahui kondisi karakter dalam permainan.

Sebuah teori mengenai desain user interface game oleh Erik Fagerholt dan Magnus Lorentzon dari Chalmers University of Technology berjudul: Beyond the HUD - User Interfaces for Increased Player Immersion in FPS Games. Mereka memperkenalkan istilah untuk berbagai jenis interface tergantung pada bagai Desain user interface dalam game berbeda dari desain UI lainnya karena melibatkan unsur tambahan fiksi. Fiksi melibatkan avatar dari pengguna yang sebenarnya, atau player. Pemain menjadi elemen tak terlihat, tapi kunci untuk cerita, seperti halnya narator dalam novel atau film. Fiksi ini dapat langsung dihubungkan ke UI, sebagian terkait, atau tidak sama sekali. Game historis tidak memiliki hubungan nyata untuk narasi game, kemungkinan besar karena game semasa dulu jarang memiliki unsur-unsur cerita yang kuat.

Setelah mengetahui  desain antarmuka game khususnya di video game terdapat beberapa elemen user Interface yaitu:

A.    Non-diegetic

Desain  Antarmuka yang diberikan sebagai tambahan di luar dunia game itu sendiri, hanya terlihat dan terdengar ke pemain di dunia nyata. Sehingga seakan-akan karakter dalam dunia game tidak melihatnya Contoh: Elemen HUD, kursor mouse, mini map, skills, dll.

B.     Diagetic

Desain antarmuka yang termasuk dalam permainan game  yaitu yang dapat dilihat dan didengar oleh karakter dalam permainan. Yang dimaksudkan pada antarmuka diagetic ini segala sesuatu yang terlihat terkecuali elemen-elemen non-diegetic seperti HUD, Kursor mouse, Informasi dari Komputer,dll  Contoh: Interface  dalam game Dead Space.(Full diagetic)

C.    Spatial

Elemen User Interface yang disajikan dalam ruang permainan 3D dengan atau tanpa suatu entitas dari dunia permainan yang sebenarnya (diegetik atau non-diegetik). Outline karakter dalam Left 4 Dead adalah contoh dari non-diegetik User Interface spatial.

D.    Meta

Gambaran yang bisa muncul dalam dunia game, namun tidak selalu divisualisasikan spasial untuk pemain.Contoh yang paling jelas adalah efek ditampilkan di layar, seperti percikan darah pada kamera untuk menunjukkan kerusakan. Contoh: Duty Calls- The Calm Before the Storm

Setelah melalui pengamatan2 diatas, maka kita bisa membuat tabel sebagai berikut:

http://teguh-cipta-halim.blogspot.co.id/2013/01/desain-pada-user-interface.html

http://www.kamu-info.web.id/2016/03/pengantar-teknologi-game.html

Arsitektur Game Engine

Arsitektur Game Engine

Game Engine adalah system perangkat lunak yang dirancang untuk menciptakan dan pengembangan video game. Ada banyak mesin permainan yang dirancang untuk bekerja pada konsol permainan video dan sistem operasi desktop seperti Microsoft Windows, Linux, dan Mac OS X. fungsionalitas inti biasanya disediakan oleh mesin permainan mencakup mesin render ( “renderer”) untuk 2D atau 3D grafis, mesin fisika atau tabrakan (dan tanggapan tabrakan), suara, script, animasi, kecerdasan buatan, jaringan, streaming, manajemen memori, threading, dukungan lokalisasi, dan adegan grafik. Proses pengembangan permainan sering dihemat oleh sebagian besar menggunakan kembali mesin permainan yang sama untuk menciptakan permainan yang berbeda.

Engine bukanlah executable program, artinya engine tidak bisa dijalankan sebagai program yang berdiri sendiri. Diperlukan sebuah program utama sebagai entry point atau titik awal jalannya program. Pada C++, entry point-nya adalah fungsi ‘main().’ Biasanya program utama ini relatif pendek. Game engine adalah program yang ‘memotori’ jalannya suatu program game. Kalau game diilustrasikan sebagai ‘musik’ yang keluar dari mp3 player, maka engine adalah ‘mp3 player’ dan program utama adalah ‘data mp3’ yang dimasukkan ke dalam mp3 player tersebut. Dengan adanya engine, waktu, tenaga dan biaya yang dibutuhkan untuk membuat game software menjadi berkurang secara signifikan.

Beberapa game dengan jenis dan gameplay yang hampir sama bisa dibuat dengan sedikit usaha bila terlebih dulu dibuat engine-nya. Setelah engine diselesaikan, programmer hanya perlu menambahkan program utama, memakai resources (objek 3D, musik, efek suara) yang baru, dan, jika benar-benar dibutuhkan, sedikit memodifikasi engine sesuai kebutuhan spesifk dari game yang bersangkutan. Program game engine seluruhnya berorientasi objek. Dia lebih bersifat reaktif daripada prosedural. Sulit untuk menggambarkan engine secara keseluruhan dalam flow-chart, karena alur program bisa diatur sesuai dengan keinginan pemakai engine, yaitu game programmer.

Tujuan Game Engine
Tujuan game engine adalah untuk mempermudah pembuatan bagian-bagian tertentu dalam game, membagi-bagi pengembangan game menjadi modul-modul tertentu dan memudahkan kolaborasi antar pihak.

Arsitektur Game Engine
Arsitek adalah pelajaran untuk membuat rancangan dari bangunan.        Sedangkan  arsitektur mesin game adalah system perangkat lunak yang  dirancang untuk menciptakan dan pengembangan video game. Dapat dikatakan  bahwa arsitektur mesin game itu adalah rancangan dari sistem perangkat  lunak dari game itu sendiri.

 Tahap awal dari merancang suatu game adalah memilih jenis game yang akan  dibuat agar dapat lebih terfokus dalam mengerjakannya. Selanjutnya adalah  mendesaian game yang akan dibuat. Setelah kita memiliki desain game,  langkah berikutnya adalah mengimplementasikan desain tersebut menjadi  source code. Apabila source telah selesai dirancang, maka game tersebut  dapat dimainkan dan digunakan sesuai yang diinginkan oleh sang pembuat  game. Apakah game tersebut dibuat untuk dikomersilkan atau dikembangkan  oleh orang lain.

Beberapa elemen yang terdapat dalam game engine, yaitu:

      a)      Tools/Data

Pada pengembangan game paling tidak dibutuhkan beberapa tools seperti 3d model editor, level editor dan graphics programs. Bahkan jika diperlukan, seringkali kita mengembangkan game engine tersebut dengan menambahkan beberapa code dan fitur yang diperlukan.

      b)      System

System adalah bagian dari game engine yang berfungsi untuk melakukan komunikasi dengan hardware yang berada di dalam mesin. System adalah bagian yang membutuhkan perubahan yang cukup banyak apabila dilakukan implementasi pada platform yang berbeda. Di dalam system sendiri terdapat beberapa sub system seperti graphics, input, sound, timer, configuration. System bertanggung jawab untuk melakukan inisialisasi, update dan mematikan sub system yang terdapat di dalamnya.

      c)       Console

Console dapat merubah setting game dan setting game engine di dalam game tanpa perlu melakukan restart pada game tersebut. Console biasa digunakan dalam proses debugging, seperti misalnya apabila game engine tersebut mengalami error maka kita hanya mengoutputkan error message tersebut ke dalam console tanpa harus melakukan restart.

      d)      Support

Support merupakan bagian yang sering digunakan pada system di galam game engine. Support berisikan rumus-rumus matematika yang biasa digunakan, vector, matrix, memory, file loader. Merupakan dasar dari game engine dan hampir digunakan dalam semua project game engine.

      e)      Renderer/Engine Core

Renderer/engine core terdiri dari beberapa sub yaitu visibility, collision detection dan response, camera, static geometry, dynamic geometry, particle systems, billboarding, meshes, skybox, lighting, fogging, vertex shading dan output.

      f)       Game Interface

Game interface merupakan layer antara game engine dan game itu sendiri. Berfungsi sebagai control yang bertuuan untuk memberikan interface apabila di dalam game engine tersebut terdapat fungsi yang bersifat dinamis sehingga memudahkan untuk mengembangkan game tersebut.

      g)      The Game

Game merupakan inti dari penggunaan game engine sendiri, sehingga ini tergantung bagaimana pengguna dalam mengembangkannya.

Beberapa contoh Game Engine Open Source :

3Dgame Studio

Delta 3D

UnrealEngine

Panda3D

Torque

Quake Engine

Sumber:

https://raflyjuninton93.wordpress.com/2015/05/06/arsitektur-game-engine/

http://komputer123456.blogspot.com/2015/04/arsitektur-game-engine.html 

http://www.academia.edu/6220575/GAME_ENGINE 

http://layarinformatika.blogspot.co.id/2016_03_01_archive.html

Konsep Pembuat Scripting Game

Konsep Pembuatan Scripting pada Game

Pengantar Teknologi Game

Script dan Skenario

Perkembangan teknologi komputer sangat mempengaruhi perkembangan yang ada dalam dunia game. Pembentukan karakter pada game semakin mendekati dengan keadaan sebenarnya pada dunia nyata. Ketika proses pembuatan game membutuhkan susunan yang lebih kompleks, timbullah kebutuhan untuk memisahkan konten (desain perilaku) dari mesin. Kehandalan seorang desainer game benar-benar dibutuhkan untuk merancang perilaku yang luas dari karakter. Banyak tersedia berbagai macam bentuk bahasa pemrograman yang ada. Tentunya dari kesemuanya itu memiliki kelebihan dan kekurangan masing-masing. Maka game developer harus benar-benar teliti dalam memilih bahasa dan menyusun script untuk membuat suatu game, agar nantinya game dapat berjalan lancar, tanpa bug, dan mampu menjalankan script dengan kebutuhan hardware seminimum mungkin.

Konsep Pembuatan Scripting pada game

• Pemilihan Bahasa Pemrograman

Pemrograman suatu game bisa menggunakan berbagai macam jenis bahasa pemrograman. Diantaranya yang terkenal adalah C++, C dan Java.

Proses pembuatan game modern bisa memakan waktu 1-3 tahun untuk menyelesaikannya. Lamanya suatu pengembangan bergantung pada sejumlah faktor, seperti genre, skala, platform pengembangan dan jumlah aset.

Sebagai contoh, sebuah game puzzle yang sederhana dengan menggunakan grafik 2D akan jauh lebih sedikit memakan waktu untuk dikembangkan daripada game role-playing komputer 3D.

Walaupun terdapat banyak sekali pilihan bahasa pemrograman untuk membuat game, namun pada intinya bahasa tersebut harus memenuhi syarat sebagai berikut :

a) Speed

Bahasa scripting untuk game harus mampu berjalan secepat mungkin. Jika kita berniat untuk menggunakan banyak script untuk perilaku karakter dan kejadian di level game, maka script akan perlu untuk mengeksekusi sebagai bagian dari loop game utama. Ini berarti bahwa script yang lambat akan memakan waktu yang kita butuhkan untuk membuat suatu adegan, menjalankan mesin fisika, atau menyiapkan audio.

b) Kompilasi dan Interpretasi (penyusunan dan penafsiran)

Bahasa scripting secara luas diinterpretasikan,melalui susunan serangkaian byte. Penafsiran bahasa diambil melalui format teks. Interpreter melihat setiap baris, penyusunan bekerja sesuai yang maksud dari script, dan melakukan tindakan yang spesifik.

Bahasa byte-terkompilasi dikonversi dari teks ke format internal, yang disebut byte code. Kode byte biasanya jauh lebih padat daripada format teks. Karena kode byte dalam suatu format dioptimalkan ketika dieksekusi, agar dapat berjalan lebih cepat.

c) Ekstensibilitas dan Integrasi

Bahasa scripting perlu memiliki akses ke fungsi yang signifikan ke dalam game. Sebuah script yang mengendalikan karakter, misalnya, harus mampu untuk menanyai game untuk mencari tahu apa yang bisa dilihat dan kemudian membiarkan game tahu apa yang akan dilakukan sebagai aksinya.

Serangkaian fungsi yang dibutuhkan untuk mengakses ini jarang diketahui ketika bahasa scripting telah diimplementasikan atau dipilih. Hal ini penting untuk memiliki sebuah bahasa yang dapat dengan mudah memanggil fungsi-fungsi atau menggunakan kelas main code dalam game. Biasanya, itu adalah penting bagi programmer untuk dapat mengekspos fungsi baru atau kelas yang dengan mudah ketika pembuat script memintanya.

d) Re-Entrancy (ikut serta ulang)

Fungsi ini sering berguna untuk memanggil script menjadi diikutsertakan ulang. Mereka dapat berjalan untuk sementara waktu, dan ketika anggaran waktu telah habis script akan dapat ditunda. Ketika script selanjutnya mendapatkan beberapa waktu kembali, maka akan dapat menjalankan kembali script yang ditunda sebelumnya.

Hal ini sering membantu untuk membiarkan kontrol hasil script saat mencapai jeda normal. Kemudian sebuah algoritma penjadwalan dapat memberikan lebih banyak waktu untuk meminimalisasi penggunaan sumber daya.

Sebuah script untuk mengendalikan sebuah karakter, misalnya, mungkin memiliki lima tahapan yang berbeda (memeriksa situasi, memeriksa kesehatan, menentukan gerakan, rencana rute, dan melaksanakan gerakan). Ini semua dapat dimasukkan dalam satu script yang menghasilkan penyekat antara setiap bagian. Kemudian masing-masing akan berjalan dengan setiap lima frame, dan beban dari eksekusi AI akan didistribusikan.

Re-entrancy yang lebih canggih harus memungkinkan penulis script untuk menandai bagian yang tidak boleh terputus.

• Embedding (penanaman)

Embedding berhubungan dengan ekstensibilitas. Sebuah bahasa yang tertanam dirancang untuk dimasukkan ke dalam program lain. Ketika kita menjalankan bahasa scripting dari workstation, biasanya akan menjalankan program khusus untuk menafsirkan file source code. Dalam game, sistem scripting perlu dikontrol dari dalam program utama. Game yang menentukan jalannya script harus dijalankan dan harus dapat memberitahu mesin terkait bahasa scripting yang cocok untuk memproses script tersebut.

• Bahasa Open Source

Banyak bahasa scripting game populer yang dirilis di bawah lisensi open source. Software open-source dirilis di bawah lisensi yang memberikan hak user untuk memasukkannya ke dalam perangkat lunak mereka sendiri tanpa membayar biaya tambahan.

Memulai sebagai teks dalam sebuah file teks, script biasanya melewati empat tahap:

1. Tokenization :

Tokenizing mengidentifikasi unsur-unsur dalam teks. Sebuah file teks hanya berisi serangkaian karakter (dalam pengertian karakter ASCII). Hasil tokenizer keluar sebagai kumpulan byte tertentu dan jenis dari kelompok tertentu yang membentuk mereka.

2. Parsing (penguraian) :

Makna dari sebuah program adalah sangat hirarkis: nama variabel dapat ditemukan dalam sebuah statement pemberian nilai, ditemukan di dalam pernyataan IF-, yang ada di dalam tubuh fungsi, di dalam definisi kelas, maupun di dalam sebuah deklarasi namespace, misalnya. Parser mengambil urutan token, mengidentifikasi peran masing-masing kode dalam program, dan mengidentifikasi struktur hirarkis keseluruhan program.

Contoh1          :  if (a < b) return;

dapat dilakukan proses parsing seperti pada bagan di bawah ini :

3. Compiler :

mengubah parse tree ke dalam kode byte yang dapat dijalankan oleh interpreter. Kode byte biasanya berbentuk data biner berurutan. Compiler non-optimasi biasanya berisi output kode byte sebagai terjemahan literal dari parse tree.

4. Interpreting :

Tahap akhir dari serangkaian ini ialah menjalankan kode byte. Dalam sebuah compiler untuk bahasa seperti C atau C++, produk akhir akan menjadi mesin instruksi yang dapat langsung dijalankan oleh prosesor. Dalam bahasa scripting, anda sering perlu untuk menyediakan layanan (seperti re-entrancy dan eksekusi yang aman) yang tidak mudah dicapai dengan bahasa mesin.Kode byte akhir dijalankan pada sebuah “mesin virtual”. Ini secara efektif menjadi sebuah emulator untuk sebuah mesin yang belum pernah ada di hardware. Anda menentukan instruksi agar mesin dapat mengeksekusi, dengan instruksi kode byte.

Contoh Pembuatan game mengunakan script bahasa C.

Disini kami mengunakan game snake mengunakan script bahasa C

Langkah pertama maskan sintaks library

1. #include <stdio.h>
2. #include <stdlib.h>
3. #include <time.h>
4. #include <sys\timeb.h>
5. #include <Windows.h>

Dalam sintaks digunakan Array dimana Array ini kita gunakan untuk menampung ular. Satu elemen pada array sama dengan satu segmen ular. Tiap elemen berisi posisi koordinat (x,y) segmen di layar. Berikut ini bentuk strukturnya. Kita beri nama Segment.

1. /** Struktur **********/
3. /**
4. Struktur untuk menampung data tiap segment dari snake 
5. (array)
6. */
7. struct Segment {
8. int x, y;
9. };

Kita tambahkan dua variabel global, yaitu array snake, dan length untuk menyimpan panjangnya.

1. /** Variabel global **********/
3. // Array untuk menampung data ular
4. struct Segment snake[2000];
6. // Variabel untuk menyimpan panjang ular (array snake)
7. int length = 0;

Untuk game ini, kita menggunakan konsep queue. Artinya, elemen pada array akan ditambahkan di awal (head), dan ketika dihapus, yang hilang adalah bagian akhir (tail). Istilahnya first in first out.

Berikut ini fungsi untuk melakukan penambahan push() dan penghapusan pop().

1. /** Fungsi-fungsi **********/
3. /**
4. Push segment ke snake (pada bagian head).
5. */
6. void push(int x, int y) {
7. for(int i = length; i > 0; i–) {
8. snake[i] = snake[i-1];
9. }
10. snake[0].x = x;
11. snake[0].y = y;
12. length++;
13. }
15. /**
16. Pop bagian ekor snake.
17. */
18. void pop() {
19. length–;
20. }

Ular 3 Segment

Sekarang mari kita coba buat ular sepanjang 3 segmen pada bagian main(). Oke, supaya mudah untuk mengubah-ubah pengaturan panjang awalnya, kita simpan nilai 3 tersebut di variabel globalsnake_size. Ketiga segmen ini kita tempatkan di baris pertama (y = 0), di kolom ke 1, 2, dan 3 (x = 0 s.d. 2).

1. /** Konfigurasi permainan **********/
3. // Panjang segment snake saat awal permainan
4. int snake_size = 3;
6. /**
7. Program utama
8. */
9. int main() {
10. // Pertama-tama, push segment (node) ke kanan 
11. // sebanyak 3 segment (sesuai nilai variable snake_size)
12. for (int i = 0; i < snake_size; i++) {
13. push(i, 0);
14. }
15. return 0;
16. }

Rendering

Setelah ular dibuat, kita akan mencetak ular tersebut di layar. Untuk mencetak, kita buat fungsidisplay(). Fungsi display() ini akan membaca nilai x dan y setiap element lalu mencetak satu karakter ‘O’ di posisi tersebut.

Untuk bisa mencetak di posisi (x,y), kita harus memindahkan kursor ke posisi tersebut. Untuk itu kita buat juga fungsi gotoxy().

1. /**
2. Pindahkan posisi kursor di layar
3. Fungsi ini spesifik untuk OS windows.
4. */
5. void gotoxy(int x, int y) {
6. COORD pos;
7. pos.X = x;
8. pos.Y = y;
9. SetConsoleCursorPosition(GetStdHandle(STD_OUTPUT_HANDLE), pos);
10. }
12. /**
13. Gambar snake (array) di layar
14. */
15. void display() {
16. for(int i = 0; i < length; i++) {
17. // Cetak di posisi x,y
18. gotoxy(snake[i].x, snake[i].y);
19. printf(“O”);
20. }
21. }

Sekarang, mari panggil display() di main(), jalankan program dan lihat hasilnya (lihat baris 11-19).

1. /**
2. Program utama
3. */
4. int main() {
5. // Pertama-tama, push segment (node) ke kanan 
6. // sebanyak 3 segment (sesuai nilai variable snake_size)
7. for (int i = 0; i < snake_size; i++) {
8. push(i, 0);
9. }
10. // Tampilkan kondisi permainan saat ini di layar…
12. // Bersihkan layar
13. system(“cls”);
15. // Cetak (render) snake di layar
16. display();
18. getchar();
19. return 0;
20. }

Game Loop

Bagaimana caranya agar ular bisa bergerak? Caranya, adalah dengan membuat infinite loop untuk me-render ulang layar setiap putarannya. Dengan demikian, setiap ada perubahan situasi (state) pada arraysnake, entah itu jumlah element (length) atau nilai x dan y nya, perubahan itu akan langsung tercermin di layar.

Mari kita taruh bagian rendering tadi ke dalam infinite loop (lihat baris 11-20).

1. /**
2. Program utama
3. */
4. int main() {
5. //Pertama-tama, push segment (node) ke kanan 
6. // sebanyak 3 segment (sesuai nilai variable snake_size)
7. for (int i = 0; i < snake_size; i++) {
8. push(i, 0);
9. }
10. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
11. while (true) {
12. // Tampilkan kondisi permainan saat ini di layar…
14. // Bersihkan layar
15. system(“cls”);
16. //Cetak (render) snake di layar
17. display();
18. }
20. getchar();
21. return 0;
22. }

Untuk menggerakkan ular ke kanan setiap 200ms, pertama-tama, di dalam game loop kita menghitung berapa waktu yang sudah terlewati, jika waktu yang berlalu sudah lebih atau sama dengan 200ms, maka kita geser ular. Sama dengan sebelumnya, agar nilai 200 ini mudah diubah-ubah, kita simpan dalam variabel global snake_speed.

1. // Kecepatan gerakan snake dalam ms
2. int snake_speed = 200;

Untuk menghitung interval waktu yang berlalu, kita gunakan fungsi ftime() untuk mendapat kan penanda waktu.

Cara menggeser ular, adalah dengan melakukan pop(), lalu push() kembali di posisi koordinat headdengan nilai x ditambah 1 karena saat ini kepala ular mengarah ke kanan.

(Lihat baris 6-8, 17-40)

1. /**
2. Program utama
3. */
4. int main() { 
6. // Untuk menyimpan penanda waktu saat snake bergerak
7. struct timeb last_timestamp;
8. ftime(&last_timestamp); // Set nilai awal
9.        
10. // Pertama-tama, push segment (node) ke kanan 
11. // sebanyak 3 segment (sesuai nilai variable snake_size)
12. for (int i = 0; i < snake_size; i++) {
13. push(i, 0);
14. }
15. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
16. while (true) {
17. // Ambil penanda waktu saat ini
18. struct timeb current_timestamp;
19. ftime(&current_timestamp);
20. // Selisih waktu terakhir dengan waktu sekarang dalam ms
21. int interval = 1000 * (current_timestamp.time –last_timestamp.time) + (current_timestamp.millitm – last_timestamp.millitm);
23. // Snake bergerak setiap 200 ms (sesuai nilai variable snake_speed)
24. // Dihitung dengan membandingkan selisih waktu sekarang dengan waktu 
25. // terakhir kali snake bergerak.
26. if (interval >= snake_speed) {
27. // Tentukan posisi x,y ke mana snake akan bergerak.
28. int x, y;
29. x = snake[0].x + 1;
30. y = snake[0].y;
32. // Pop ekor, lalu push segment ke depan head sehingga 
33. // snake tampak bergerak maju. 
34. pop();
35. push(x, y);
37. // Perbarui penanda waktu
38. last_timestamp = current_timestamp;
39. }
40. // Tampilkan kondisi permainan saat ini di layar…
42. // Bersihkan layar
43. system(“cls”);
45. // Cetak (render) snake di layar
46. display();
47. }
48. …
49. }

Coba jalankan lagi. Sekarang ular sudah bisa bergerak!

Tapi layar tampaknya berkedip-kedip. Hal ini terjadi karena program mencoba mengosongkan layar dengan system(“cls”); sebelum menggambar lagi. Umumnya pembuat game akan melakukan teknik double buffering untuk menghindari layar berkedip (flicker). Namun untuk menyederhanakan tutorial ini, kita akan lakukan pendekatan lain, yaitu dengan me-render ulang layar hanya ketika ular bergerak. Sehingga rendering hanya terjadi setiap 200ms sekali (5 FPS).

Caranya mudah, kita pindahkan baris-baris rendering ke dalam blok if(interval >= snake_speed) { } (lihat baris 30-37).

1. /**
2. Program utama
3. */
4. int main() {
5. …
6. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
7. while (true) {
8. // Ambil penanda waktu saat ini
9. struct timeb current_timestamp;
10. ftime(&current_timestamp);
11. // Selisih waktu terakhir dengan waktu sekarang dalam ms
12. int interval = 1000 * (current_timestamp.time –last_timestamp.time) + (current_timestamp.millitm – last_timestamp.millitm);
13. // Snake bergerak setiap 200 ms (sesuai nilai variable snake_speed)
14. // Dihitung dengan membandingkan selisih waktu sekarang dengan waktu 
15. // terakhir kali snake bergerak.
16. if (interval >= snake_speed) {
17. // Tentukan posisi x,y ke mana snake akan bergerak.
18. int x, y;
19. x = snake[0].x + 1;
20. y = snake[0].y;
22. // Pop ekor, lalu push segment ke depan head sehingga 
23. // snake tampak bergerak maju. 
24. pop();
25. push(x, y);
27. // Tampilkan kondisi permainan saat ini di layar…
29. // Bersihkan layar
30. system(“cls”);
32. // Cetak (render) snake di layar
33. display();
35. // Perbarui penanda waktu
36. last_timestamp = current_timestamp;
37. }
38. }
39. …
40. }

Mengontrol Arah Gerakan Ular

Untuk bisa mengontrol arah gerakan ular, kita membuat sebuah variabel global tambahan bernamadir. Variabel ini memberitahu arah push() berikutnya, apakah ke kanan, bawah, kiri, atau atas. Arah ini akan ditentukan berdasarkan input tombol panah yang ditekan.

Pertama-tama, buat variabel global dir, dengan nilai awal ke arah kanan. VK_RIGHT adalah konstanta berisi kode untuk tombol panah kanan.

1. // Arah kepala saat awal permainan
2. int dir = VK_RIGHT;

Sekarang kita modifikasi penentuan nilai x dan y untuk melakukan push() berdasarkan variabel dir. Lalu di dalam game loop, dilakukan juga pengecekan tombol yang sedang ditekan. Jika merupakan salah satu dari empat tombol panah di keyboard, maka ubah nilai dir (lihat baris 17-37, 56-73).

1. /**
2. Program utama
3. */
4. int main() {
5. …
6. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
7. while (true) {
9. …
11. // Snake bergerak setiap 200 ms (sesuai nilai variable snake_speed)
12. // Dihitung dengan membandingkan selisih waktu sekarang dengan waktu 
13. // terakhir kali snake bergerak.
14. if (interval >= snake_speed) {
15. // Tentukan posisi x,y ke mana snake akan bergerak. 
16. // Posisi dilihat dari koordinat segment kepala (head) 
17.  // dan arah (variable dir)
18. int x, y; 
19. switch (dir) {
20. case VK_LEFT:
21. x = snake[0].x – 1;
22. y = snake[0].y;
23. break;
24. case VK_RIGHT:
25. x = snake[0].x + 1;
26. y = snake[0].y;
27. break;
28. case VK_UP:
29. x = snake[0].x;
30. y = snake[0].y – 1;
31. break;
32. case VK_DOWN:
33. x = snake[0].x;
34. y = snake[0].y + 1;
35. break;
36. }
38. // Pop ekor, lalu push segment ke depan head sehingga 
39. // snake tampak bergerak maju.  
40. pop();
41. push(x, y);
43. // Tampilkan kondisi permainan saat ini di layar…
45. // Bersihkan layar
46. system(“cls”);
48. // Cetak (render) snake di layar
49. display();
51. // Perbarui penanda waktu
52. last_timestamp = current_timestamp;
53.  }
55.  // Ubah arah jika tombol panah ditekan
56. if (GetKeyState(VK_LEFT) < 0) {
57. dir = VK_LEFT;
58. }
59. if (GetKeyState(VK_RIGHT) < 0) {
60. dir = VK_RIGHT;
61. }
62. if (GetKeyState(VK_UP) < 0) {
63. dir = VK_UP;
64. }
65. if (GetKeyState(VK_DOWN) < 0) {
66. dir = VK_DOWN;
67. }
69. // Keluar dari program jika menekan tombol ESC
70. if (GetKeyState(VK_ESCAPE) < 0) {
71. return 0;
72. }
73. }
75. …
76. }

Kita juga bisa menambahkan pengecekan untuk keluar dari program jika pemain menekan tombol ESC.

Coba jalankan lagi program, sekarang kita bisa menggerakan ular dengan bebas

Collision Detection

Salah satu aspek yang penting dalam permainan ini adalah pengecekan apakah kepala ular bertabrakan dengan dinding atau dirinya sendiri. Di sini kita bisa melakukan pengecekan saat program memeroleh posisi x dan y yang baru, sebelum melakukan pop() dan push().

Jika posisi x berada di luar batasan 0-79 (panjang console) atau posisi y berada diluar batasan 0-24 (tinggi console), maka ular telah menabrak dinding, dan permainan berakhir. Sama seperti sebelum-sebelumnya, untuk nilai panjang dan lebar console bisa kita simpan di variabel global console_widthdan console_height.

1. // Panjang console
2. int console_width = 80;
4. // Tinggi console
5. int console_height = 25;

Pengecekan berikutnya yaitu mengecek apabila posisi x dan y sama dengan posisi salah satu node, yang artinya ular menabrak dirinya sendiri. Untuk mengeceknya, kita buat fungsi check_collision().

1. /**
2. Memeriksa apakah terdapat salah satu segment
3. snake (array) di koordinat x,y.
4. Return 0 artinya tidak bertumpuk, 1 artinya bertumpuk.
5. */
6. int check_collision(int x, int y) {
7. for(int i = 0; i < length; i++) {
8. if (snake[i].x == x && snake[i].y == y) {
9. return 1;
10. }
11. return 0;
12. }

Berikut ini baris-baris yang ditambahkan di main() untuk melakukan pengecekan tadi, serta tambahan baris yang dilakukan di luar game loop, setelah permainan berakhir (game over) (lihat baris 18-32, 44-48).

1. /**        
2. Program utama    
3. */
4. int main() {
5. …
6. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
7. while (true) {
9. …
10. // Snake bergerak setiap 200 ms (sesuai nilai variable snake_speed)
11. // Dihitung dengan membandingkan selisih waktu sekarang dengan waktu 
12. // terakhir kali snake bergerak.
13. if (interval >= snake_speed) {
15. …
17. // Jika posisi kepala (head) menabrak tembok pembatas, 
18. // maka permainan berakhir (keluar dari game loop)
19. if (x < 0 || x >= console_width || y < 0 || y >= console_height) {
20. break;
21. }
23. // Jika posisi kepala (head) menabrak dirinya sendiri
24. // (posisi sama dengan salah satu segment), maka permainan  
25. // berakhir (keluar dari game loop)
26. if (check_collision(x, y) == 1) {
27. break;
28. }
30. // Jika tidak terjadi tabrakan (collision), maka snake  
31. // boleh bergerak maju..
32. // Pop ekor, lalu push segment ke depan head sehingga  
33. // snake tampak bergerak maju.  
34. pop();
35. push(x, y);
37. // Tampilkan kondisi permainan saat ini di layar…
38. …
39. }
40. …
41. }
42. // Setelah keluar dari game loop, berarti permainan berakhir (game over)
43. system(“cls”);
44. printf(“GAME OVER\n”);
45. printf(“Press ENTER to exit…”);
46. getchar();
47. return
48. }

Jalankan program sekali lagi, lalu coba arahkan ular ke dinding. Untuk pengetesan tabrakan terhadap diri sendiri, bisa dilakukan dengan mengubah snake_size dengan nilai yang lebih besar, agar ular cukup panjang untuk menabrak dirinya sendiri.

Tampilan layar saat terjadi tabrakan. Permainan berakhir.

Makanan!!!

Ini adalah bagian terakhir dari tutorial ini, makanan! Ular perlu melahap makanan untuk menjadi lebih panjang. Untuk itu, kita perlu menempatkan makanan di koordinat acak. Untuk menaruh koordinat makanan, kita tambahkan dua variabel global food_x dan food_y.

1. // Posisi makanan
2. int food_x, food_y;

Meskipun makanan ditaruh secara acak, ada dua hal yang perlu diperhatikan:

1. Makanan harus berada di dalam layar console berukuran 80×25.
2. Makanan tidak boleh bertumpuk dengan ular saat ditempatkan.

Maka dari itu, kita buat sebuah fungsi place_food() untuk menaruh makanan dengan memerhatikan kedua syarat tersebut. Untuk syarat nomor 2, kita bisa memanfaatkan fungsi check_collision() yang baru saja dibuat.

1. /**
2. Taruh makanan secara acak, namun memastikan 
3. makanan tidak bertumpuk dengan salah satu segment 
4. snake (array)
5. */
6. void place_food() {
7. // Jika makanan bertumpuk dengan salah satu segment
8. // snake, ulangi penempatan makanan secara acak.
9. do {
10. food_x = rand() % console_width;
11. food_y = rand() % console_height;
12. }
13. while (check_collision(food_x, food_y) == 1);
14. }

Di awal program sebelum memasuki game loop, kita menempatkan makanan pertama. Berikutnya, makanan akan ditempatkan ulang jika posisi x dan y baru dari ular sama dengan koordinat makanan, yang artinya ular memakan makanan. Dalam hal ini, kita hanya melakukan push() tanpa melakukanpop(), sehingga jumlah elemen bertambah.

Jangan lupa pula untuk melakukan rendering makanan di layar.

Di samping itu, kita juga bisa menerapkan sistem penilaian, misalnya nilai bertambah 100 jika ular memakan makanan. Lalu pada akhir permainan (saat game over), nilai yang sudah terkumpul ditampilkan kepada pemain.

(Lihat baris 5-6, 12-13, 21-22, 41-53, 64-67, 80)

1. /**
2. Program utama
3. */
4. int main() {
5. // Randomize
6. srand(time(NULL));
8. // Untuk menyimpan penanda waktu saat snake bergerak
9. struct timeb last_timestamp;
10. ftime(&last_timestamp); // Set nilai awal
12. // Untuk menyimpan nilai
13. int score = 0;
15. // Pertama-tama, push segment (node) ke kanan 
16. // sebanyak 3 segment (sesuai nilai variable snake_size)
17. for (int i = 0; i < snake_size; i++) {
18. push(i, 0);
19. }
20. // Tempatkan makanan secara acak
21. place_food();
23. // Game loop. Bagian di dalam while akan dieksekusi terus menerus
24. while (true) {
26. …
28. // Snake bergerak setiap 500 ms (sesuai nilai variable snake_speed)
29. // Dihitung dengan membandingkan selisih waktu sekarang dengan waktu 
30. // terakhir kali snake bergerak.
31. if (interval >= snake_speed) {
33. …
35. // Jika tidak terjadi tabrakan (collision), maka snake 
36. // boleh bergerak maju..
38. // Pop ekor, lalu push segment ke depan head sehingga 
39. // snake tampak bergerak maju. 
40. // Namun jika posisi x,y ke mana kepala (head) snake akan 
41. // bergerak berada di posisi makanan, tidak perlu pop 
42. // sehingga segment bertambah panjang. 
43. if (x == food_x && y == food_y) {
44. // Dalam hal snake memakan makanan, maka nilai bertambah
45. score += 100;
47. // Lalu makanan ditempatkan ulang secara acak
48. place_food();
49. }
50. else {
51. pop();
52. }
53. push(x, y);
55. // Tampilkan kondisi permainan saat ini di layar…
57. // Bersihkan layar
58. system(“cls”);
60. // Cetak (render) snake di 
61. display();
63. // Cetak (render) makanan di layar
64. gotoxy(food_x, food_y);
65. printf(“X”);
67. // Perbarui penanda waktu
68. last_timestamp = current_timestamp;
69. }
70. …
72. }
74. // Setelah keluar dari game loop, berarti permainan berakhir (game over)
75. // Tampilkan nilai yang diraih pemain
76. system(“cls”);
77. printf(“GAME OVER\n”);
78. printf(“Your score : %d\n\n”, score);
80. printf(“Press ENTER to exit…”);
81. getchar();
83. …
85. }

Selesai! Uji coba program untuk terakhir kalinya, dan game sudah siap dimainkan!

Layar game over menunjukkan permainan berakhir beserta nilai yang diperoleh.

StoryBoard

Referensi         :

http://meramukoding.jar2.net/membuat-game-snake-dengan-bahasa-c-array/

https://wikishare27.wordpress.com/pengantar-teknologi-game1/

https://www.academia.edu/3875722/Scripting_dalam_Pembuatan_Game

https://www.script-tutorials.com/snake-game-using-html5-canvas-and-kineticjs/