37

BAB 3
ANALISIS DAN PERANCANGAN SISTEM

3.1. Peraturan Catur China
Catur China merupakan permainan yang cukup terkenal dan dimainkan oleh berbagai
komunitas pencinta catur china. Berikut adalah peraturan catur china yang dibuat oleh
Club Xiang Qi (CXQ):
Peraturan Catur China CXQ terdiri dari tiga (3) bagian:
1. Peraturan dasar mengenai langkah-langkah yang diperbolehkan.
2. Peraturan lanjutan yang melarang beberapa langkah tertentu demi permainan
yang adil.
3. Peraturan undi untuk mencegah permainan yang terlalu lama.

Gambar 3.1. Papan Catur China
38

3.1.1. Peraturan Dasar Catur China CXQ

Langkah-langkah yang diperbolehkan dalam catur china:
1. Raja (King) bergerak hanya satu (1) kotak tiap giliran, secara horizontal atau
vertikal. Bidak Raja harus selalu berada di istana, yang ditandai dengan
tanda silang (X).

2. Penjaga (Guard) hanya bergerak satu (1) kotak tiap giliran secara diagonal.
Bidak Penjaga juga harus selalu berada di istana, seperti bidak Raja.

3. Mentri (Minister) dapat bergerak dua kotak tiap giliran secara diagonal
(contoh, 2 kotak ke kiri/kanan, dan dua kotak ke atas/bawah dalam satu
gerakan). Mereka harus berada di sisi sungai tempat mereka berada. J ika ada
bidak yang berada di tengah posisi awal dan posisi tujuan bidak Mentri, maka
bidak Mentri tidak dapat mengambil langkah tersebut.

4. Benteng (Rook) dapat bergerak satu (1) atau lebih langkah secara horizontal
atau vertikal, selama diantara posisi awal dan tujuan tidak ada bidak yang
menghalangi.

5. Ksatria (Knight) dapat bergerak dua (2) kotak secara horizontal dan satu (1)
kotak secara vertikal (atau dua (2) kotak vertikal dan satu (1) kotak
horizontal). J ika ada bidak lain yang berada di sebelah bidak Kuda secara
39

horizontal atau vertikal, maka bidak Kuda tidak dapat mengambil langkah
tersebut.

6. Meriam (Cannon) dapat bergerak satu (1) atau lebih kotak secara horizontal
atau vertikal seperti bidak Benteng. Tetapi, dalam gerakan menangkap, harus
ada tepat satu kotak yang tidak kosong di antara posisi awal dan posisi akhir.
Dalam gerakan biasa, kotak di antara posisi awal dengan posisi tujuan harus
kosong.

7. Pion (Pawn) dapat bergerak satu (1) kotak tiap giliran. J ika sebuah pion
belum melewati sungai, ia hanya dapat bergerak maju secara vertikal. Setelah
ia melewati sungai, pion juga dapat bergerak secara horizontal.

8. Menangkap: Ketika satu bidak bergerak ke kotak yang sedang dikuasai oleh
bidak lawan, ia dapat menangkap bidak lawan tersebut. Bidak yang
ditangkap tersebut akan dikeluarkan dari papan.

9. Ruang gerak Raja: Kedua raja di atas papan tidak boleh berada di satu garis
vertikal yang sama tanpa ada bidak lain di antara mereka. Sebuah gerakan
yang membuat kedua raja pada posisi tersebut merupakan gerakan yang
ilegal/dilarang.

40

10. Keamanan Raja: Pemain tidak boleh membiarkan Raja ditangkap oleh
lawan pada gerakan selanjutnya. Gerakan yang secara sengaja membuat
bidak Raja pada posisi tersebut merupakan gerakan yang ilegal/dilarang.
Kondisi permainan berakhir: Permainan selesai ketika salah satu dari
situasi ini terjadi:
Checkmate: J ika salah satu bidak dapat menangkap bidak Raja lawan dan
lawannya tersebut tidak dapat menghindarinya, maka pemilik bidak
pertamalah yang menang.
Stalemate: J ika salah satu dari pemain tidak memiliki langkah yang valid,
maka pemain tersebut kalah.
J ika salah satu pihak atau kedua pihak melanggar Aturan Lanjutan
(Advanced Rules).

3.1.2. Aturan Lanjutan Catur China CXQ
Sejumlah pola langkah tidak diperbolehkan untuk memastikan
permainan berlangsung dengan adil. Singkatnya, peraturan CXQ melarang
seorang pemain untuk mengancam bidak lawan dengan menggunakan
bidaknya secara terus-menerus. Gerakan seperti itu merupakan perpetual
checks (jika bidak Raja yang terancam) atau perpetual chases (jika bidak
yang tidak dilindungi selain bidak Raja, yang terancam).
Terminologi: untuk membuat peraturannya jelas, istilah-istilah berikut ini
digunakan:
41

1. Check: sebuah gerakan dari bidak manapun yang menyebabkan bidak Raja
pihak lawan terancam untuk ditangkap pada gerakan berikutnya.
2. Same type sacrifice/trade: sebuah bidak bergerak pada posisi dimana ia
dapat menangkap bidak lawan yang tipenya sama dan pada giliran
berikutnya, bidak lawan yang lain dapat menangkap bidak tersebut.
3. Chase: sebuah bidak bergerak pada posisi dimana ia dapat menangkap bidak
lawan, yang bukan bidak Raja, pada gerakan berikutnya. Sebuah bidak
bergerak dan menyebabkan sebuah bidak meriam menyerang bidak lawan
juga disebut chase. Ada beberapa pengecualian:
apabila bidak Raja atau bidak Pion yang mengancam posisi bidak lain
tidak disebut chase.
apabila salah satu bidak mengancam untuk menangkap sebuah bidak Pion
sebelum bidak tersebut menyeberangi sungai tidak disebut chase.
same type sacrifice/trade bukanlah sebuah chase.

4. Protected: sebuah bidak terlindungi apabila ada sebuah bidak yang dapat
menangkap bidak apapun, menangkap bidak yang dilindungi tersebut. Ada
pengecualian ketika bidak Benteng tidak pernah dianggap terlindungi ketika
bidak tersebut terancam oleh bidak meriam atau ksatria milik lawan.
Semua gerakan yang mengikuti aturan dasar diperbolehkan kecuali:
1. Perpetual Check: melakukan check secara terus-menerus pada bidak lawan
dengan menggunakan satu atau lebih bidak.
42

2. Perpetual Chase: mengejar satu bidak lawan yang tidak dilindungi secara
terus-menerus dengan menggunakan satu atau lebih bidak.
Pemain yang melanggar Aturan Lanjutan akan dianggap kalah. J ika kedua
pemain melakukan perpetual check atau perpetual chase, maka permainan
dianggap seri. J ika salah satu pemain melakukan perpetual check, sedangkan
lawannnya melakukan perpetual chases, maka pemain yang melakukan
perpetual check-lah yang kalah.
CXQ membatasi seorang pemain untuk melakukan check/chase sebanyak
enam (6) kali dengan menggunakan satu bidak, dua belas (12) kali
menggunakan dua (2) bidak, dan delapan belas (18) kali jika menggunakan
tiga (3) bidak, sebelum gerakan tersebut dianggap sebagai perpetual
check/chase.

3.2. Analisa Game Sejenis
Sebagai perbandingan dan referensi untuk pembuatan game catur china,
maka diperlukan analisa dari game-game yang sejenis, sehingga aplikasi yang
dibuat pada akhirnya dapat menjadi aplikasi game yang sama baiknya atau lebih
baik dari game-game sejenis yang sudah ada di pasaran. Berikut adalah analisa
game sejenis yang sudah ada:


43

3.2.1. Xiang Qi Training (www.games.co.id)

Visual/Interface
o Tampilan Awal

Gambar 3.2. Tampilan Awal Xiang Qi Training

Kesan pertama yang diciptakan game ini adalah klasik dan
sederhana. Kesan klasik dimunculkan oleh desain bidak-bidaknya
yang tampak seperti bidak batu dan juga papannya yang nampak
seperti papan batu, seperti yang tampak pada Gambar 3.2. Kesan
sederhana dimunculkan oleh warna yang dipilih pembuat game ini
tidak banyak. Hanya warna abu-abu untuk backgroundnya, warna
light black untuk bidak di sisi kiri, warna coklat kayu untuk bidak di
sisi kanan, dan warna stone white untuk papan caturnya. Posisi
papan juga sengaja ditaruh miring agar pemain dapat melihat semua
44

bidak yang ada di atas papan dengan jelas. Di sebelah kiri atas
terdapat panel-panel menu, dan di sebelah bawah window juga
terdapat note mengenai keadaan akhir permainan atau disebut
checkmate.

o Melakukan move

Gambar 3.3. Tampilan ketika melakukan move Xiang Qi
Training

Pemain harus melakukan single click pada bidak yang ingin
digerakkan untuk melakukan suatu move. Pada saat mouse on pada
salah satu bidak, bidak akan berubah warna. J ika itu bidak kiri,
maka bidak akan berubah warna menjadi warna biru, dan jika bidak
kanan, maka bidak akan berubah menjadi warna merah. Setelah
45

click, akan muncul possible move yang dapat dilakukan bidak

tersebut, tergantung pada posisi awal bidak tersebut. Possible move
akan ditunjukkan dengan perubahan warna pada kotak papan yang
dapat dilewati bidak. Klik pada satu kotak untuk menentukan kotak
tujuan dan maka akan ada efek fade-in dan fade-out pada bidak
tersebut, dari kotak awal ke kotak tujuan.

o Melakukan penyerangan

Gambar 3.4. Tampilan setelah menyerang bidak lawan
Xiang Qi Training

Efek fade-in dan fade-out juga digunakan pada saat pemain
melakukan gerakan menyerang. Bidak yang menyerang akan fade-
out dari posisi awalnya, kemudian bidak yang diserang akan fade-
46

out dari posisinya dan digantikan oleh bidak yang menyerang,

dengan efek fade-in.

Fungsionalitas
Sisi fungsionalitas permainan catur china di website
www.games. co.id tergolong buruk karena hampir semua panel menu
yang ada di permainan ini tidak dapat digunakan atau diakses. Hanya
panel reset board dan pengatur ukuran yang berfungsi pada game ini.
Panel-panel lain yang terdiri dari multiplayer version, news update,
about, instructions, rules, dan feedback tidak dapat berfungsi. Panel-
panel tersebut merupakan hyperlink menuju halaman web yang lain.
Fungsi-fungsi dasar dalam permainan dapat berfungsi dengan
baik. Fungsi-fungsi tersebut antara lain fungsi untuk menggerakkan
bidak, melihat possible move, dan menyerang bidak lawan.

Sound
Dari pemilihan panel menu, event pada bidak sampai akhir
permainan, tidak ada sound effect yang diberikan pada permainan ini.
Ini mengakibatkan permainan menjadi lebih membosankan.

Community & Multiplayer function
Permainan ini merupakan bagian dari suatu portal game yang
memiliki ratusan mini-games yang lain dan memiliki komunitas web.
47

Untuk memainkan permainan ini tidak harus menjadi anggota

(member) dari website ini, tetapi jika ingin berkomentar, user harus
menjadi member dari komunitas website ini.
Pada permainan ini juga, dalam satu game hanya bisa melibatkan
satu (1) pemain, yang dapat menggerakkan kedua sisi bidak secara
bergantian. Fungsi multiplayer sebenarnya tersedia pada game ini, tetapi
sangat disayangkan fungsi tersebut tidak dapat dijalankan. Selain itu
juga tidak ada tanda seperti username untuk menunjukkan identitas dari
pemain yang sedang bermain di board tersebut. Seluruh permainan
bersifat independent dan tidak dapat disaksikan oleh orang lain melalui
koneksi jaringan internet.

Addictive Elements
Addictive Elements adalah elemen-elemen pada game yang dapat
membuat pemain game tersebut ingin terus memainkan game. Elemen
tersebut dapat berupa leveling, pengumpulan item, tabel high score, dan
mini-games. Xiang Qi Training tidak memiliki elemen-elemen yang
dapat membuat pemainnya akan memainkannya secara terus-menerus.
Permainan yang ditampilkan hanya permainan catur china biasa tanpa
added value yang dapat meningkatkan daya tarik permainan, seperti
tabel high score.



48

3.2.2. Xiang Qi Online (http://www.xiangqionline.com/cotuong/)

Web ini dibuat oleh VietSon, sebuah perusahaan Vietnam yang
khusus membuat website permainan kartu dan catur china. Pada saat
membuka web ini pertama kali, user akan dapat melihat daftar high scores,
new levels dan completed quests. Kemudian di sebelah kiri akan ada pilihan
PLAY. Ada dua jenis pilihan PLAY disini: PLAY biasa dan PLAY Full
Screen. J ika user melakukan klik pada pilihan PLAY biasa, maka halaman
web akan berpindah ke http://www. xiangqionline. com/vscc/play. cfm, seperti
yang tampak pada Gambar 3.5, sedangkan jika melakukan klik pada PLAY
Full Screen, maka halaman web akan men-generate suatu page baru,
seperti pada Gambar 3.6.

Tampilan Awal









Gambar 3.5. Halaman login Xiang Qi online window mode
49

Gambar 3.6. Halaman login Xiang Qi online full screen mode

Dalam tampilan permainan Xiang Qi online, terdapat papan catur china
beserta bidak-bidaknya di sebelah kiri, sedangkan di sebelah kanan terdapat
papan skor permainan, news, daftar penonton (spectators), dan tab-tab untuk
fungsi chat, profile dan settings. Di bagian bawah halaman permainan, terdapat
tombol untuk restart, resign, dan undo. Bagian paling bawah window terdapat
informasi mengenai channel dan room dimana user sekarang berada. Terakhir,
terdapat tombol change channels untuk pindah ke channel yang lain dan change
rooms untuk pindah ke room yang lain (Gambar 3.7 dan Gambar 3.8).
Bidak dua sisi dibedakan oleh dua warna yang berbeda, warna merah
untuk bidak yang berada di sisi bawah papan, dan warna hitam untuk bidak yang
berada di sisi atas papan. Nama user yang sedang bermain di room tersebut akan
ditampilkan pada room information panel yang terletak di bagian tengah atas.
50

User tidak harus memiliki account membership di VietSon untuk bisa

bermain. User dapat meng-klik tombol guest pada halaman login untuk
memainkan permainan. Tetapi dengan menggunakan fasilitas guest, score yang
dicetak user tidak akan tercatat di papan high scores.








Gambar 3.7. Halaman permainan Xiang Qi online window mode

Gambar 3.8. Halaman permainan Xiang Qi online full screen mode

51

Mengambil move
Lakukan klik pada bidak yang ingin dipindahkan untuk
melakukan move. Bidak yang di-klik akan memunculkan animasi
seperti berdetak. Kemudian arahkan kursor ke titik tujuan bidak
tersebut. Berbeda dengan Xiang Qi Training, Xiang Qi Online tidak
memberikan penanda possible move dengan perubahan warna pada arah
legal move. Pada Xiang Qi Online, legal move ditandai dengan
perubahan titik tujuan menjadi lingkaran-lingkaran berwarna merah
yang memiliki efek animasi seperti radar militer (Gambar 3.9).









Gambar 3.9. Halaman permainan Xiang Qi online pada saat melakukan move


52

Lakukan klik sekali lagi pada titik tujuan untuk mengkonfirmasi

gerakan. Setelah itu bidak akan bergeser (sliding) ke titik tujuan dan
mengeluarkan efek animasi seperti radar juga (Gambar 3.10 dan 3.11).

Gambar 3.10. Halaman permainan Xiang Qi online setelah melakukan move (1)

Gambar 3.11. Halaman permainan Xiang Qi online setelah melakukan move (2)

53

Gerakan menyerang bidak lawan

Klik pada bidak yang menjadi penyerang, lalu klik bidak lawan
yang ingin diserang. Bidak penyerang akan bergeser menuju posisi
bidak yang diserang dan kemudian akan ada efek animasi bidak yang
hancur seperti ledakan seperti yang tampak pada Gambar 3.12, yang
disertai dengan efek suara ledakan.










Gambar 3.12. Tampilan bidak menyerang Xiang Qi online

Keadaan skak adalah ketika bidak Raja pemain berada dalam
jangkauan serang bidak lawan. Pada keadaan ini, bidak Raja akan
mengeluarkan warna merah jingga di sekitarnya, sedangkan bidak
lawan yang dapat melakukan skak mate akan mengeluarkan lingkaran
merah jingga di sekitarnya, seperti yang tampak pada Gambar 3.13.

54

Gambar 3.13. Tampilan keadaan skak (check) Xiang Qi online

3.2.3. Analisa Perbandingan Game Sejenis
Game Xiang Qi Training pada www.games.co.id dan Xiang Qi
Online pada www.xiangqionline.com pada dasarnya memiliki perbedaan
yang cukup jelas. Pertama adalah pada bentuk bidak yang digunakan pada
kedua game tersebut. Pada Xiang Qi Training, bentuk bidak dibuat seperti
fungsi bidak tersebut. Contoh, untuk bidak benteng, maka bidak pada Xiang
Qi Training akan berbentuk seperti benteng atau dinding benteng, sama
bentuknya dengan pion catur konvensional, sedangkan pada Xiang Qi Online,
semua bidak memiliki bentuk yang sama yaitu bulat seperti koin. Untuk
membedakan sisi, tulisan yang diberikan di atas bidak memiliki warna yang
berbeda, dan untuk menentukan fungsi, setiap bidak diberikan tulisan
namanya di atas bidak. Permainan Catur china pada umumnya menggunakan
bidak yang bulat dan memiliki tulisan di atasnya.
55

Tabel 3.1. Tabel Perbandingan Xiang Qi Training dengan Xiang Qi Online

Xiang Qi Training Xiang Qi Online
Interface
3D, sederhana, skala dapat
diperbesar atau diperkecil
2D, cukup rumit karena banyak
fungsi
Fungsionalitas
hanya fungsi single player
yang dapat dijalankan
fungsi play, spectator, channel,
invite challenger, dan lainnya
dapat dijalankan dengan baik
Sound
tidak ada sound
terdapat sound untuk tiap move,
gerakan menyerang, dan ketika
diserang
Community &
Multiplayer
function
terdapat menu multiplayer
tetapi tidak dapat dijalankan
terdapat fungsi invite yang
memungkinkan user untuk
menantang user lain dalam satu
game
Addictive
Elements
tidak terdapat addictive
element
ada tabel high score yang
membuat user berusaha untuk
mencatatkan username-nya disana
Accessibility
relatif cepat, namun harus
melakukan search dengan
keyword chinese chess dari
website sumber
(www.games.co.id), dan
kemudian melakukan klik
pada game chinese chess yang
muncul dalam pilihan
relatif cepat dan terdapat link
langsung dari webpage sumber.
Hanya memerlukan dua (2) klik
dari website sumber

3.3. Analisa Kuesioner
Dalam merancang aplikasi, informasi dari calon user sangat penting agar
aplikasi yang dibuat pada akhirnya dapat memenuhi kebutuhan user sehingga
dapat digunakan oleh banyak user. Kuesioner dibagikan kepada 30 responden
yang merupakan pemain catur china aktif. Berikut ini adalah isi kuesioner beserta
hasil analisis kuesioner yang dikelompokkan berdasarkan pertanyaan yang ada.


56

Pertanyaan pertama :
1. Seberapa lama Bapak/Ibu/Saudara/Saudari menggunakan komputer?
a. <5 jam/minggu
b. 5 - 10 jam/minggu
c. >10 jam/minggu
d. Tidak pernah

Tabel 3.2. Tabel Hasil Kuesioner Pertanyaan No. 1
DurasiPenggunaanKomputer Jumlah Persentase
<5jam/minggu 2orang 6%
510jam/minggu 0%
>10jam/minggu 2orang 7%
tidakpernah 26orang 87%
TOTAL 30orang 100%



Gambar 3.14. Grafik Hasil Kuesioner Pertanyaan No. 1


Analisis: Hasil dari kuesioner yang menunjukkan hanya 13% calon user saja
yang pernah menggunakan komputer membuktikan bahwa sebagian besar dari
calon user memiliki kemampuan menggunakan komputer yang lemah. Di sisi
6%
0%
7%
87%
<5jam/minggu
510jam/minggu
>10jam/minggu
tidakpernah
57

positifnya, statistik ini menunjukkan besarnya pangsa pasar yang dimiliki oleh
permainan catur china online di masyarakat. Hobby bermain catur china dapat
menjadi motivasi calon user untuk belajar menggunakan komputer. User-
friendly interface akan mempermudah calon user dalam belajar menggunakan
komputer secara umum, dan website catur china secara khususnya.

Pertanyaan kedua :
2. Seberapa lama Bapak/Ibu/Saudara/Saudari menggunakan teknologi internet?
a. <5 jam/minggu
b. 5 - 10 jam/minggu
c. >10 jam/minggu
d. Tidak pernah

Tabel 3.3. Tabel Hasil Kuesioner Pertanyaan No. 2
DurasiPenggunaanInternet Jumlah Persentase
<5jam/minggu 2orang 6%
510jam/minggu 0%
>10jam/minggu 2orang 7%
tidakpernah 26orang 87%
TOTAL 30orang 100%

58

Gambar 3.15. Grafik Hasil Kuesioner Pertanyaan No. 2

Analisis: Hasil dari pertanyaan nomor dua berbanding lurus dengan hasil dari
pertanyaan nomor satu. Ini menunjukkan bahwa penggunaan komputer saat
ini hampir selalu diikuti oleh penggunaan internet oleh user. Seseorang yang
menggunakan komputer hampir bisa dipastikan juga merupakan pengguna
internet. Durasi penggunaan internet pun dapat disimpulkan bervariasi,
dengan seimbangnya jumlah responden yang memilih pilihan a dan c. Hasil
ini menunjukkan potensi yang besar untuk meningkatkan durasi penggunaan
internet oleh user, yang digunakan untuk bermain catur china online.

Pertanyaan ketiga :
3. Seberapa lama Bapak/Ibu/Saudara/Saudari bermain Xiang Qi?
a. <7 jam/minggu
b. 7 - 14 jam/minggu
c. 14 - 20 jam/minggu
6%
0%
7%
87%
<5jam/minggu
510jam/minggu
>10jam/minggu
tidakpernah
59

d. >20 jam/minggu

Tabel 3.4. Tabel Hasil Kuesioner Pertanyaan No. 3
DurasiPermainanXiangQiPerMinggu Jumlah Persentase
<7jam/minggu 7orang 24%
714jam/minggu 7orang 23%
1420jam/minggu 9orang 30%
>20jam/minggu 7orang 23%
TOTAL 30orang 100%



Gambar 3.16. Grafik Hasil Kuesioner Pertanyaan No. 3

Analisa: Hasil dari pertanyaan nomor tiga menunjukkan jawaban yang cukup
seimbang dari keempat pilihan yang ada. Hasil ini menunjukkan keberagaman
tingkat adiktif permainan catur china terhadap setiap orang dan alokasi waktu
yang mereka berikan untuk bermain catur china. Berdasarkan hasil ini, dapat
diperkirakan bahwa website permainan catur china yang dikembangkan pada
akhirnya dapat memiliki tingkat akses yang beragam dari user, dan juga
hampir dapat dipastikan dikunjungi oleh user minimal satu (1) kali dalam satu
(1) minggu untuk melakukan hobi bermain catur chinanya dari mana saja
dengan koneksi internet.
24%
23%
30%
23%
<7jam/minggu
714jam/minggu
1420jam/minggu
>20jam/minggu
60

Pertanyaan keempat :
4. Sudah berapa lama Bapak/Ibu/Saudara/Saudari memainkan Xiang Qi?
a. <1 tahun
b. 1 5 tahun
c. 5 7 tahun
d. >7 tahun

Tabel 3.5. Hasil Kuesioner Pertanyaan No. 4
LamaMengenaldanMemainkanXiangQi Jumlah Persentase
<1tahun 6orang 20%
15tahun 7orang 23%
57tahun 3orang 10%
>7tahun 14orang 47%
TOTAL 30orang 100%



Gambar 3.17. Grafik Hasil Kuesioner Pertanyaan No. 4

Analisa: Hasil pertanyaan nomor empat menunjukkan hampir setengah dari
responden memiliki pengalaman bermain catur china yang sudah lebih dari
20%
23%
10%
47%
<1tahun
15tahun
57tahun
>7tahun
61

tujuh (7) tahun. Kesimpulan yang dapat diambil dari statistik ini adalah
tingkat kesetiaan pemain catur china yang sangat tinggi, serta tingkat adiktif
permainan catur china yang kuat sehingga dapat membuat pemainnya terus
bermain hingga bertahun-tahun. Ini tentu saja merupakan informasi
menunjukkan bahwa website catur china dapat memiliki user yang stabil dan
loyal, sehingga penurunan jumlah member website akan relatif jarang terjadi.

Pertanyaan kelima :
5. Apakah Bapak/Ibu/Saudara/Saudari sering memainkan Xiang Qi di komputer
(offline atau online)?
a. Sangat sering (>14 game/minggu)
b. Lama (<14 game/minggu)
c. Cukup (<8 game/minggu)
d. Kurang (<3 game/minggu)
e. Tidak pernah

Tabel 3.6. Tabel Hasil Kuesioner Pertanyaan No. 5
DurasiMemainkanXiangQidiKomputer Jumlah Persentase
sangatsering(>14game/minggu) 3orang 10%
sering(<14game/minggu) 0%
cukup(<8game/minggu) 0%
kurang(<3game/minggu) 1orang 3%
tidakpernah 26orang 87%
TOTAL 30orang 100%

62

Gambar 3.18. Grafik Hasil Kuesioner Pertanyaan No. 5

Analisis: Hasil dari pertanyaan nomor lima menunjukkan hampir semua
pemain catur china tidak pernah memainkan permainan catur china melalui
komputer. Kesimpulan yang dapat diambil adalah permainan catur china yang
sudah ada saat ini belum dapat menarik perhatian para pemain catur china
untuk memainkannya dengan media komputer. Kurangnya kemampuan
pemain catur china untuk mengoperasikan komputer juga menjadi salah satu
penyebab rendahnya durasi permainan catur china melalui media komputer.

Pertanyaan keenam :
6. Apa yang Bapak/Ibu/Saudara/Saudari harapkan dari permainan Xiang Qi
berbasis web?

Pertanyaan nomor enam bersifat optional, yang berarti responden dapat
mengosongkan kolom jawaban pertanyaan nomor enam. Dari 30 responden
yang mengisi kuesioner, hanya ada satu responden yang mengisi kolom
10%
0%
0%
3%
87%
sangatsering(>14
game/minggu)
Sering(<14
game/minggu
Cukup(<8
game/minggu)
Kurang(<3
game/minggu)
Tidakpernah
63

jawaban nomor enam. Harapan dari responden itu adalah kecepatan akses
yang baik, kemudahan untuk sign-up, murah (volume-based), memiliki history
langkah permainan, dapat memilih bahasa tertentu, dapat meng-upload foto,
dan ada fasilitas set-up.

Setelah lima (5) pertanyaan pilihan ganda dan satu (1) pertanyaan
optional di atas, responden diminta untuk mengisi tabel prioritas elemen
permainan catur china. Berikut adalah tabelnya dan hasil statistik yang
didapatkan dari 30 responden.

Tabel 3.7. Tabel Prioritas Elemen Permainan Catur China
Unsur/Elemen Aplikasi
Permainan Catur China
Skala prioritas
(5 =paling penting, 1 =tidak penting)
Design Interface
Komunitas
Accessibility
Sound Effect
Visual Effect

Penghitungan statistik untuk tabel prioritas dilakukan dengan cara
mengkalikan jumlah orang yang memilih elemen tersebut dengan bobot yang
diberikan (dari satu sampai lima). Berikut adalah statistik yang didapatkan
dari penghitungan hasil kuesioner.

64

Tingkat prioritas unsur/elemen aplikasi permainan catur china

Unsur/Elemen
Prioritas (Bobot)
1 2 3 4 5 Total
Design Interface 1 0 5 18 6 118
Komunitas 0 1 0 9 20 138
Accessibility 0 3 22 2 3 95
Sound effect 18 10 1 0 1 46
Visual effect 11 16 2 1 0 53

Tabel 3.8. Tabel Penghitungan Bobot Prioritas Elemen Permainan Catur China

Gambar 3.19. Grafik Hasil Penghitungan Tabel Prioritas Elemen Game
Grafik di atas menunjukkan bahwa responden merasa elemen
komunitas merupakan elemen yang paling penting di dalam suatu aplikasi
permainan catur china. Elemen penting yang kedua adalah design interface,
kemudian yang ketiga adalah elemen accessibility. Elemen visual effect dan
118
138
95
46
53
0
20
40
60
80
100
120
140
160
Design
Interface
Komunitas Accessibility Soundeffect Visualeffect
Series1
65

sound effect menempati prioritas yang keempat dan kelima, yang merupakan
dua urutan terakhir dalam prioritas elemen aplikasi permainan catur china. Ini
menunjukkan ketiadaan unsur sound effect dan visual effect pada aplikasi
permainan catur china tidak akan mempengaruhi keinginan responden untuk
menggunakan aplikasi permainan.

3.4. Rancangan Aplikasi
Rancangan aplikasi dibuat berdasarkan analisa terhadap kebutuhan user
yang diketahui melalui kuesioner dan analisa terhadap aplikasi sejenis yang sudah
beredar di masyarakat. Rancangan aplikasi terbagi menjadi tiga bagian, yaitu
rancangan layar, rancangan database, dan aliran aplikasi (application flow).
Rancangan layar merupakan rancangan awal dari desain antar muka (interface)
yang akan digunakan pada aplikasi. Rancangan layar akan meliputi semua
halaman yang akan ada pada aplikasi, baik antar muka sebelum user login, dan
setelah user login. Rancangan database merupakan rancangan awal database yang
meliputi primary key tiap tabel database dan relasinya secara logical, physical,
dan conceptual. Aliran aplikasi (application flow) adalah rancangan awal peta
aplikasi. Rancangan ini akan menggambarkan dengan jelas hubungan antara tiap
halaman dan fungsi di dalam aplikasi.

66

3.4.1. Rancangan Layar

3.4.1.1. Sebelum Login
1. Halaman Index

Gambar 3.20. Rancangan Layar - Halaman Index

Halaman index adalah halaman pertama yang akan muncul ketika user
mengakses web (Gambar 3.20). Halaman ini dibuat sederhana, dengan hanya memiliki
header yang berisi gambar logo web dan nama website. Bagian tengah akan diisi dengan
gambar-gambar yang dapat diisi berita, pengumuman atau promosi, yang ditampilkan
secara bergiliran. Bagian kanan akan berisi textbox user login, yang terdiri dari
username dan password, serta button login. User belum terdaftar sebagai member dapat
melakukan registrasi dengan melakukan klik pada hyperlink yang tersedia di bawah
textbox user login.
67

2. Halaman Index - Register

Gambar 3.21. Rancangan Layar - Halaman Index Register

Hyperlink dari halaman index akan mengubah bagian kanan halaman index
menjadi sebuah form registrasi yang akan terdiri dari textbox username, password,
confirm password, e-mail, dan button register (Gambar 3.21). Hyperlink back terletak di
sebelah kanan bawah, berfungsi untuk membawa user kembali ke halaman index.
Bagian lain dari halaman index register ini sama seperti halaman index, antara lain
memiliki header yang memiliki logo web dan nama website, serta bagian gambar di
sebelah kiri form registrasi.



68

3.4.1.2. Setelah Login
1. Halaman Home

Gambar 3.22. Rancangan Layar - Halaman Home

Halaman Home adalah halaman pertama yang akan muncul setelah user
melakukan proses login (Gambar 3.22). Halaman ini memiliki header yang memiliki
gambar logo dan nama website. Tab-tab pilihan menuju halaman home, play, profile,
69

dan untuk logout berada di sebelah kanan bawah header. Kata sambutan welcome dan
username akan muncul di sebelah kanan tab logout.
Bagian tengah atas berisi profil singkat dari Top Champion dan Player of the
day, yang terdiri dari foto user, username, dan skor akumulatif tertinggi yang dimiliki
Top Champion dan Player of the day. Tabel high scorer di bagian tengah bawah akan
menampilkan sepuluh (10) user dengan high score tertinggi sejak web mulai digunakan.
Tabel tersebut menampilkan username dan skor akumulatif user tersebut. Bagian kiri
atas terdapat informasi umum dari user seperti username dan foto user. Fasilitas
message dan tombol quickplay diletakkan tepat di bawah bagian informasi umum user.

2. Halaman Server

Gambar 3.23. Rancangan Layar - Halaman Server
70

Halaman server akan muncul ketika user melakukan klik pada tab play. Halaman
server ini ditujukan untuk menampilkan pilihan server yang tersedia kepada user. User
diminta untuk memilih server yang ingin dikunjungi dari daftar yang ada. Logo dan
nama aplikasi pada halaman ini terletak pada bagian header, seperti yang tampak pada
Gambar 3.23. Tab-tab home, profile, play dan logout terletak di bagian kanan bawah
header. Di bagian tengah akan ada daftar server yang tersedia. Copyright akan menjadi
footer pada halaman server ini.

3. Halaman Lobby

Gambar 3.24. Rancangan Layar - Halaman Lobby
71

Halaman lobby akan muncul apabila user telah memilih server di halaman server
(Gambar 3.24). Header di halaman ini serupa dengan header yang ada di halaman lain,
tetap memiliki dua bagian yaitu bagian satu adalah gambar logo web dan bagian kedua
adalah nama website. Bagian ketiga dari halaman ini adalah Room List yang merupakan
daftar ruang permainan yang available dan yang sudah penuh. Bagian keempat adalah
chat room yang merupakan tempat user untuk melakukan chat dengan user lain di
server yang sama. Bagian kelima adalah server information yang memberikan informasi
mengenai server yang sedang digunakan. Bagian keenam adalah online player list, yang
merupakan daftar user yang sedang online di server yang sama. Bagian ketujuh adalah
bagian general info player, yang berisi informasi umum mengenai user, antara lain
username, foto user, high score user, dan jumlah game yang sudah dimainkan. Bagian
kedelapan adalah online friend list yang merupakan bagian yang berisi daftar dari user
lain yang telah berstatus friend dengan user utama. Bagian kesembilan adalah
commercial space, dimana iklan-iklan yang bersifat komersial dapat ditampilkan.
Bagian iklan ditampilkan di halaman ini karena user akan banyak melakukan aktivitas di
halaman lobby ini, seperti chatting, memilih server, dan edit profile.


72

4. Halaman Room

Gambar 3.25. Rancangan Layar Halaman Room

Halaman Room didominasi oleh papan permainan catur china yang berada di
sebelah kiri rancangan tampilan. Bagian atas merupakan tempat bidak-bidak berwarna
hitam, sedangkan bagian bawah adalah tempat bidak-bidak berwarna merah. Di bagian
kanan rancangan tampilan seperti pada Gambar 3.25, terdapat info umum seperti
username dan foto dari pemain di ruangan tersebut, bagian kiri untuk pemain yang
memainkan bidak merah, dan sebelah kanan untuk pemain yang memainkan bidak
hitam. Informasi mengenai waktu yang sudah berjalan dan giliran permainan
73

ditampilkan tepat di bawah informasi pemain. Bagian berikutnya adalah kotak chat yang
terletak di bawah informasi waktu dan giliran. Pemain atau penonton dapat keluar dari
ruangan dengan melakukan klik pada tombol exit yang diletakkan di bawah kotak chat.
Commercial space disediakan di sudut kanan bawah pada halaman room ini.

5. Halaman Profile

Gambar 3.26. Rancangan Layar Halaman Profile

74

Halaman profile akan muncul ketika user melakukan klik pada tab Profile di
sudut kanan atas setiap halaman. Header yang dimiliki halaman profile sama dengan
header di halaman-halaman yang sebelumnya. Foto user ditampilkan di sebelah kiri
atas, dan informasi umum serta catatan permainan user ditampilkan tepat di sebelah
kanan foto user. Daftar teman yang dimiliki user berada di bawah foto dan bagian
informasi umum user. Footer berada di baris paling bawah di halaman profile, sama
seperti footer yang ada di halaman lain.

3.4.2. Rancangan Database
Perancangan database pada aplikasi permainan catur china berbasis web ini
dibagi menjadi tiga (3) tahap, yaitu:
1. Perancangan basis data konseptual
2. Perancangan basis data logikal
3. Perancangan basis data fisikal

3.4.2.1. Perancangan Basis Data Konseptual
Perancangan basis data konseptual merupakan suatu proses perancangan
model informasi yang akan digunakan aplikasi permainan catur china berbasis
web ini. Pertama-tama yang dilakukan adalah menentukan kelas yang ada di
dalam database. Berdasarkan hasil analisa awal terhadap kebutuhan web, maka
terdapat empat (4) macam kelas yang diperlukan di dalam database, antara lain:


75

1. msUser
Kelas ini merupakan kelas yang menyimpan informasi lengkap mengenai
user. Kelas ini berisi sembilan (9) entiti yang merupakan informasi mengenai
user, diantaranya adalah:
a. serverName
Entiti ini digunakan untuk menyimpan informasi mengenai server yang
ditempati oleh user selama permainan. Entiti ini dapat berubah nilainya
apabila user melakukan perpindahan server tempat user bermain.
b. password
Entiti ini digunakan untuk menyimpan informasi mengenai kata sandi
yang digunakan user untuk mengkonfirmasi proses login. Password harus
berisi angka [0-9] dan/atau huruf [A-Z, a-z] dan tidak boleh berisi spasi [
] dan tidak boleh dikosongkan.
c. fullName
Entiti ini digunakan untuk menyimpan informasi mengenai nama lengkap
user.
d. email
Entiti ini digunakan untuk menyimpan informasi mengenai alamat e-mail
yang dimiliki user. Alamat e-mail user harus mengandung karakter [@]
untuk menjadikannya alamat e-mail yang valid.
e. gender
Entiti ini digunakan untuk menyimpan informasi mengenai jenis kelamin
user. Entiti ini dapat diisi oleh dua jenis nilai, yaitu male dan
female.
76

f. server
Entiti ini digunakan untuk menyimpan informasi mengenai server yang
ditempati oleh user.
g. room
Entiti ini digunakan untuk menyimpan informasi mengenai ruangan
permainan catur china yang sedang ditempati oleh user, baik sebagai
viewer ataupun player.
h. score
Entiti ini digunakan untuk menyimpan informasi mengenai skor yang
berhasil didapatkan user pada langkah terakhirnya di permainan catur
china terakhir yang user mainkan.
i. dailyScore
Entiti ini digunakan untuk menyimpan informasi mengenai jumlah skor
yang telah didapatkan user dari semua permainannya dalam rentang
waktu satu (1) hari. Entiti ini akan berubah nilainya apabila user bermain
pada hari setelahnya. Nilainya akan digantikan oleh skor yang didapatkan
user pada hari yang baru itu.

2. msRoom
Kelas ini merupakan kelas yang digunakan untuk menyimpan informasi
mengenai ruangan permainan catur china. Semua informasi yang digunakan
di dalam permainan disimpan pada kelas database ini. Entiti yang dimiliki
oleh kelas ini ada lima (5) entiti, antara lain:

77

a. room
Entiti ini digunakan untuk menyimpan informasi mengenai kode ruangan
permainan catur china. Setiap ruangan permainan memiliki kode yang
berbeda-beda (unik).
b. server
Entiti ini digunakan untuk menyimpan informasi mengenai server tempat
ruangan catur china yang sedang ditempati user.
c. player1
Entiti ini digunakan untuk menyimpan informasi mengenai user yang
menjadi player 1 di ruangan permainan.
d. player2
Entiti ini digunakan untuk menyimpan informasi mengenai user yang
menjadi player 2 di ruangan permainan.
e. viewer
Entiti ini digunakan untuk menyimpan informasi mengenai user yang
menjadi viewer (penonton) di ruangan permainan.

3. msServer
Kelas ini merupakan kelas yang digunakan untuk menyimpan informasi
mengenai server. Kelas msServer memiliki dua (2) entiti, yaitu:
a. server
Entiti ini digunakan untuk menyimpan informasi mengenai lokasi server
tersebut.

78

b. userOnline
Entiti ini digunakan untuk menyimpan informasi mengenai jumlah user
yang online di dalam setiap server yang aktif.

4. msHistory
Kelas ini merupakan kelas yang digunakan untuk menyimpan informasi
mengenai histori permainan. Kelas ini akan sangat berguna terutama untuk
kejadian-kejadian yang tidak diinginkan seperti koneksi internet yang putus
pada saat permainan sedang berjalan. Kelas ini memiliki 7 (tujuh) entiti di
dalamnya, antara lain:
a. room
Entiti ini digunakan untuk menyimpan informasi mengenai ruangan yang
sebelumnya digunakan oleh user.
b. server
Entiti ini digunakan untuk menyimpan informasi mengenai server yang
sebelumnya digunakan oleh user.
c. player
Entiti ini digunakan untuk menyimpan informasi mengenai username
player yang bermain di dalam ruangan permainan.
d. movingPawn
Entiti ini digunakan untuk menyimpan informasi mengenai bidak catur
china yang hendak digerakkan oleh player.


79

e. pawnFrom
Entiti ini digunakan untuk menyimpan informasi mengenai koordinat
awal bidak catur china yang hendak digerakkan oleh player.
f. destination
Entiti ini digunakan untuk menyimpan informasi mengenai koordinat
tujuan bidak catur china yang hendak digerakkan oleh player.
g. grid
Entiti ini digunakan untuk menyimpan informasi mengenai koordinat
setiap bidak catur china yang ada di papan permainan ruangan tersebut.

Hubungan relasional antar kelas ditunjukkan oleh diagram konseptual berikut ini:





Gambar 3.27. Diagram Konseptual Hubungan Relasional antar Entiti
80

3.4.2.2. Perancangan Basis Data Logikal

Perancangan basis data logikal adalah perancangan database yang
menunjukkan hubungan relasional antar kelas, multiplicity dari tiap hubungan
relasional, serta tipe data dan length dari tiap entiti yang ada. Pertama-tama yang
dilakukan adalah menganalisa fungsionalitas entiti pada rancangan database
konseptual. Pada rancangan konseptual, terdapat empat buah entiti besar, yaitu
msUser, msRoom, msServer dan msHistory. Keempat entiti tersebut merupakan
entiti pokok dalam menjalankan fungsi game di dalam website. Menurut
rancangan awal, website tidak hanya memiliki fungsi bermain game saja, tetapi
juga terdapat fungsi-fungsi pendukung lainnya, seperti send message, chat, add
friend, edit profile. Rancangan database konseptual yang telah dibuat tidak
memfasilitasi fungsi-fungsi pendukung tersebut, sehingga perlu dilakukan
perubahan dan perluasan pada database. Berikut adalah daftar fungsi-fungsi yang
belum difasilitasi pada rancangan konseptual dan perlu untuk ditambahkan dalam
rancangan logikal:
1. Send message
2. Chat
3. Add and Delete Friend
4. Edit profile
5. High score
6. Player of the Day

81

Fungsi-fungsi pendukung di atas memerlukan entiti dan atribut yang

dapat menyimpan informasi yang dibutuhkan fungsi-fungsi tersebut.
Penambahan entiti dan atribut diperlukan untuk memfasilitasi fungsi-fungsi
tersebut. Berikut adalah entiti-entiti yang ditambahkan di dalam rancangan
database:
1. trMemberActi vity : untuk menyimpan data aktivitas user, seperti status
online user, keberadaannya di dalam website, dan waktu login dan logout
user.
2. trGame : untuk menyimpan data permainan dan proses yang terjadi di
dalam permainan, seperti record score user, perpindahan bidak, informasi
server dan room yang digunakan untuk permainan.
3. trFriend : untuk menyimpan data pertemanan user. Entiti ini akan
memfasilitasi fungsi yang berkaitan dengan pertemanan, seperti add friend
dan unfriend.
4. trMessage : untuk menyimpan data mengenai pesan pribadi. Entiti ini
memungkinkan user menggunakan fasilitas pesan pribadi di dalam website.
5. trChat : untuk menyimpan data aktivitas chat. Entiti ini memungkinan user
untuk menggunakan fasilitas chat.

Kedua adalah menentukan data atribut dari tiap entiti. Data atribut yang
dimaksud antara lain berupa deskripsi fungsi atribut, tipe data atribut, length, dan
status null atribut. Tipe data yang biasa digunakan antara lain tipe data character
(char, varchar) dan numeric (int, bigint, float). Length menunjukkan banyaknya
82

digit angka yang mampu ditampung oleh atribut tersebut. Status null
menunjukkan apakah atribut tersebut dapat diberikan nilai null atau tidak.
Berikut adalah kamus data atribut dari entiti yang telah didefinisikan:

3.4.2.2.1. Kamus Data Atribut
Tabel 3.9. Tabel Kamus Data Atribut
Nama Entiti Atribut Deskripsi
Tipe Data
dan Length Nulls
trGame gameID
atribut yang digunakan
untuk membuat setiap
transaksi unik int(255) No
roomID
kode ruangan yang
digunakan untuk permainan int(3) No
serverID
kode server yang digunakan
untuk permainan varchar(15) No
userID kode unik identitas user bigint No
move
history langkah user dalam
permainan int(3) No
grid koordinat bidak catur cina varchar(255) No
movingPawn
bidak catur cina yang
sedang digerakkan varchar(15) No
destination
koordinat posisi akhir bidak
yang dituju varchar(15) No
score
skor yang didapat player
dalam langkah terakhir int(10) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
trMemberActivity memberActivityID
kode unik untuk setiap
transaksi int(255) No
serverName
nama server yang digunakan
user varchar(20) No
83

roomName
nama ruangan yang
digunakan user varchar(20) No
serverID
kode server yang digunakan
untuk permainan varchar(20) Yes
status
keadaan user pada saat itu
(offline atau online) varchar(3) No
room
kode ruangan yang
digunakan untuk permainan varchar(3) Yes
loginTime
waktu terakhir user
melakukan aktifitas login varchar(20) No
logoutTime
waktu terakhir user
melakukan aktifitas logout varchar(20) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
trFriend friendID
kode unik user yang ada di
dalam daftar teman varchar(255) No
userID1
kode user yang
mengirimkan friend request varchar(20) No
userID2
kode user yang merespon
friend request varchar(20) No
status
keadaan friend request dari
teman (request atau
approve) varchar(20) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
trMessage messageID
kode unik yang dimiliki
setiap pesan pribadi varchar(255) No
userID1
kode user yang
mengirimkan pesan pribadi varchar(20) No
userID2
kode user yang menjadi
penerima pesan pribadi varchar(20) No
messageText
isi pesan pribadi yang
dikirimkan varchar(500) No
84

messageTime
waktu pesan pribadi
dikirimkan oleh user varchar(20) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
trChat chatID kode unik untuk setiap chat int(255) No
userID
kode user yang terlibat di
dalam chat bigint No
type
jenis chat (server chat atau
room chat varchar(10) No
text
isi pesan yang diketik di
dalam window chat varchar(50) No
time
waktu pesan dikirimkan
lewat window chat varchar(20) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
trRoom roomID kode unik setiap ruangan int(255) No
roomName nama ruangan permainan int(3) No
serverID
kode server yang digunakan
untuk permainan int(20) No
userID1
kode unik identitas user
pemain pertama varchar(20) No
userID2
kode unik identitas user
pemain kedua varchar(20) No
viewer
kode user yang menjadi
penonton di ruangan
permainan varchar(255) No
status
keadaan ruangan pada saat
itu (waiting dan playing) varchar(10) No
auditor
user yang mengeksekusi
data varchar(20) No
trType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
85

lastModified
waktu terakhir data
dieksekusi varchar(20) No
msServer serverID
kode server yang dapat
digunakan varchar(20) No
auditor
user yang mengeksekusi
data varchar(20) No
msType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No
msUser userID
kode unik yang digunakan
untuk membedakan setiap
user bigint No
password
kode rahasia yang
digunakan user untuk login varchar(20) No
fullName nama lengkap user varchar(30) No
email alamat email user varchar(30) No
birthDate
tanggal lahir user (dd-mm-
yyyy) varchar(20) No
gender jenis kelamin user varchar(20) No
location lokasi user varchar(20) Yes
profilePicture gambar profil user varchar(50) Yes
auditor
user yang mengeksekusi
data varchar(20) No
msType
informasi mengenai tipe
data yang dieksekusi (insert,
update, delete) varchar(1) No
lastModified
waktu terakhir data
dieksekusi varchar(20) No

3.4.2.2.2. Mengidentifikasi candidate key dan primary key
Langkah berikutnya adalah mengidentifikasi candidate key
dan primary key dari tiap entiti. Candidate key adalah atribut yang
berpotensi untuk menjadi primary key, sedangkan primary key adalah
atribut unik yang digunakan sebagai pembeda tiap proses di entiti
tersebut. Identifikasi dilakukan terhadap kamus data atribut yang
terdapat pada bagian 3.4.2.2.1.
86

Tabel 3.10. Tabel Candidate Key dan Primary Key
Nama Entiti Candidate Key Primary Key
msUser userID, email, profilePicture userID
trMemberActivity memberActivityID memberLogID
msServer serverID serverID
trRoom roomID roomID
trGame gameID, roomID gameID
trFriend friendID friendID
trMessage messageID messageID
trChat chatID chatID
historyLog historyID historyID

Beberapa entiti yang hanya memiliki satu candidate key
sehingga candidate key tersebut secara otomatis menjadi primary key
entiti tersebut. Entiti yang hanya memiliki satu candidate key antara lain
trMemberActivity, msServer, trRoom, trFriend, trMessage, trChat dan
historyLog. Terdapat dua (2) entiti lain yang memiliki lebih dari satu
candidate key. Entiti tersebut adalah msUser dan trGame. Pemilihan
primary key berdasarkan dari dua kriteria, yaitu atribut harus unik dan
tidak null.





87

Berikut adalah analisa pemilihan primary key dari sejumlah candidate

key:

1. Entiti: msUser
Candidate Key: userID, email, profilePicture
Analisa:
Atribut email merupakan atribut yang berasal dari luar website.
Email dibuat di website lain sehingga otoritas email tidak terdapat
di dalam website catur china. Atribut yang berada di luar otoritas
website akan sulit untuk dikendalikan apabila ada sesuatu yang
terjadi, misalnya penghapusan email. Primary key yang ideal adalah
primary key yang berasal dari internal website, karena primary key
itu dapat dikontrol lebih mudah dan apabila ada error yang terjadi,
error handling dapat dilakukan langsung dari dalam website.
Atribut profilePicture merupakan atribut yang menyimpan
foto user. Atribut ini dapat berisi null atau tidak diisi oleh user,
sehingga atribut ini tidak dapat dijadikan primary key , walaupun
atribut ini termasuk atribut yang unik.
Atribut userID merupakan atribut yang berisi kode unik
untuk membedakan tiap user. Atribut ini akan digunakan sebagai
nama user selama di dalam website. Setiap user harus
menggunakan userID yang berbeda dengan user yang lain. Atribut
ini juga dibuat oleh user di dalam website pada saat mereka
mendaftarkan diri sebagai member sehingga atribut ini merupakan
88

atribut yang berasal dari dalam website dan hanya terpengaruh oleh
faktor-faktor internal website. Ini membuat atribut userID akan
lebih mudah untuk diatur dan dijamin ketersediaannya, dan
menjadikannya atribut yang paling cocok untuk menjadi primary
key dari entiti msUser.

2. Entiti: trGame
Candidate Key: gameID, roomID
Analisa:
Atribut roomID merupakan atribut yang menjadi primary key di
dalam entiti trRoom, sehingga menjadikan atribut ini berperan
sebagai foreign key di dalam entiti trGame. Atribut gameID juga
merupakan atribut yang unik di dalam entiti trGame, karena
fungsinya yang membedakan setiap game yang ada. Atribut
gameID belum primary key di entiti yang lain, sehingga atribut ini
dapat dijadikan primary key entiti trGame.

3.4.2.2.3. Menentukan hubungan relasional antar entiti
Hubungan relasional antar entiti penting untuk diidentifikasi
sebelum kita membuat diagram hubungan database logikal. J enis-jenis
hubungan relasional antar entiti ada empat (4), yaitu one-to-one (1..1),
one-to-many (1..*), zero-to-many (0..*), dan many-to-many (*..*).
Berikut adalah tabel hubungan relasional antar entiti yang terjadi di
dalam database:
89

Tabel 3.11. Tabel Hubungan Relasional Antar Entiti

Entiti 1 Entiti 2
Hubungan
Relasional Keterangan
msUser
trMemberActivity 1..1 terdapat hanya satu memberlog pada satu user
trFriend 1..* terdapat satu atau lebih teman pada satu user
trMessage 1..* terdapat satu atau lebih pesan pada satu user
trChat 1..* terdapat satu atau lebih chat pada satu user
trRoom 1..1
terdapat hanya satu ruangan yang ditempati
satu user
trMember
Activity msUser 1..1
terdapat hanya satu user dalam setiap
memberactivity
msServer
trGame 1..*
terdapat satu atau lebih game di dalam satu
server
trRoom 1..*
terdapat satu atau lebih ruangan di dalam satu
server
trRoom
trGame 1..1
terdapat hanya satu game di dalam satu
ruangan
msServer 1..1
terdapat hanya satu server di dalam satu
ruangan
msUser 1..*
terdapat satu atau lebih user di dalam satu
ruangan
trGame
trRoom 1..1
terdapat hanya satu ruangan di dalam satu
game
msServer 1..1
terdapat hanya satu server di dalam satu
keseluruhan game
trFriend
msUser 1..1
komunikasi satu orang teman dapat dilakukan
kepada satu user (one-to-one communication)
trMessage
msUser 1..*
terdapat satu atau lebih user di dalam satu
pesan
trChat msUser 1..* terdapat satu atau lebih user di dalam satu chat

Dari analisa terhadap rancangan database konseptual di atas, maka didapatkan
rancangan database logikal seperti diagram di bawah ini:
90

Gambar 3.28. Diagram Database - Logikal

91

3.4.2.3.Perancangan Basis Data Fisikal

Gambar 3.29. Entity Relationship Diagram

Tabel database fisikal ini merupakan tabel database yang akan
digunakan untuk menjalankan fungsi-fungsi di dalam website. Penambahan entiti
historyLog dan penghilangan hubungan relasional dari entiti trFriend menuju
msUser merupakan perubahan yang dilakukan dari tabel database logikal menuju
92

tabel database fisikal. Berikut merupakan penjelasan terjadinya kedua perubahan

tersebut:

1. Penambahan entiti historyLog
Pada tabel database logikal, tidak terdapat entiti yang menyimpan data
histori transaksi aktivitas yang dilakukan oleh user. Entiti yang menyimpan
data histori tersebut sangat penting untuk mencari tahu aktivitas para user,
waktu aktivitas dilakukan, dan apakah aktivitas tersebut dilakukan atas
otorisasi user sendiri. Data histori ini dapat digunakan untuk melakukan
cross-check apabila ada perubahan data pada user yang nampak
mencurigakan, seperti yang mungkin terjadi ketika akun user dibajak
(hacked).

2. Penghilangan hubungan relasional dari trFriend ke msUser
Penghilangan hubungan relasional dari trFriend ke msUser karena
hubungan antara trFriend ke msUser hanya bersifat satu arah, yaitu dari
msUser ke trFriend. Hubungan satu arah ini terjadi karena user dapat melihat
siapa saja friend yang mereka miliki, tetapi sebaliknya friend dalam hal ini
bukanlah aktor aktif yang dapat melihat user, melainkan berperan sebagai
objek. Friend dari user di proses yang terpisah akan berperan sebagai user
untuk melihat friend yang mereka miliki.

93

3.4.3. Aliran Aplikasi (Application Flow)

Pada subbab ini, akan digambarkan State Transition Diagram (STD)
untuk sistem rancangan yang dibuat.

3.4.3.1. State Transition Diagram Index

Gambar 3.30. State Transition Diagram - Index

94

3.4.3.2. State Transition Diagram Home

Gambar 3.31. State Transition Diagram - Home

95

3.4.3.3.State Transition Diagram Server

Gambar 3.32. State Transition Diagram - Server



96

3.4.3.4.State Transition Diagram Lobby

Gambar 3.33. State Transition Diagram - Lobby


97

3.4.3.5.State Transition Diagram Room

Gambar 3.34. State Transition Diagram - Room



98

3.4.3.6.State Transition Diagram Profile

Gambar 3.35. State Transition Diagram - Profile