1
MEMBUAT APLIKASI PERMAINAN MENYUSUN GAMBAR DENGAN JAVAFX
Naskah Publikasi
disusun oleh
Firdaus Bahan (07.01.2293)
Joko Wijaksono (07.01.2302)
JURUSAN TEKNIK INFORMATIKA
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM
YOGYAKARTA 2011
3
CREATING APPLICATION PUZZLE GAMES WITH JAVAFX
MEMBUAT APLIKASI PERMAINAN MENYUSUN GAMBAR DENGAN JAVAFX
Firdaus Bahan Joko Wijaksono Jurusan Teknik Informatika
STMIK AMIKOM YOGYAKARTA
ABSTRACT
Multimedia is the utilization of computers to create and combine multiplemedia such as text, graphics, audio, and motion pictures (animation and video) by combining links and tools that allow users to navigate, interact, creating, and communicating.
Developing Games Applications Pictures is a diversified edugames game applications, where this game can be develop imagination. This application was built using Netbeans IDE 6.8 and using the JavaFX programming language. This game is at aimed at children aged 5-12 years so that children can hone their imagination.
This application can be run in every OS that has been contained bundle of JavaFX. Obviously this game is expected to entertain and inspire makers educational games to make the game more interesting and can help anaka in the growth process.
4 1. Pendahuluan
Permainan merupakan sarana hiburan bagi setiap orang. Permainan tidak hanya dilakukan oleh anak kecil saja, namun banyak juga dilakukan oleh orang dewasa dengan tujuan menghilangkan keletihan akibat rutinitas sehari-hari. Permainan adalah suatu kegiatan untuk memuaskan seseorang/kelompok dalam mencapai target yang diinginkan. Ada banyak jenis permainan, baik permainan yang dimainkan oleh satu orang (individu) hingga permainan yang dilakukan oleh 2 orang atau lebih (grup). Selain itu permainan dapat pula dibedakan dari sifatnya seperti permainan yang melatih fisik pemainnya, permainan yang mendidik (edukasi), interaktif, hingga yang memacu adrenalin(bersifat tantangan).
Permainan dengan sentuhan teknologi menjadi sebuah industri yang besar, hal ini disebabkan oleh banyaknya jumlah gamer (user yang memainkan permainan/game) dan juga jenis-jenis permainan yang begitu banyak variasinya. Tantangan pembuat permainan bukan hanya pada rancangan yang user friendly (pengguna mudah menggunakannya), interface (antarmuka) yang menarik, resource (sumber daya) yang rendah, tetapi juga menekan cost (biaya) serendah mungkin. Dalam perancangan dan pembuatan sebuah permainan modern biaya menjadi faktor yang vital. 2. Landasan Teori
2.1 Pengertian Game
Permainan(Game) adalah suatu kegiatan untuk memuaskan
seseorang/kelompok dalam mencapai target dan tujuan yang ditetapkan. Permainan merupakan sarana hiburan bagi setiap orang, tidak hanya dilakukan oleh anak kecil saja, namun banyak juga dilakukan oleh orang dewasa dengan tujuan menghilangkan keletihan akibat rutinitas sehari-hari.
Untuk membuat sebuah game terlebih dahulu pembuat game harus membuat deskripsi menceritakan game yang dibuat. Para pengembang game komersial biasanya mempersiapkan dokumen- dokumen yang berisi
5
design game yang sangat panjang sebelum memulai pembuatan game. Namun design game yang sederhana dapat membuat pembuatan game menjadi lebih menyenangkan.
2.2 JavaFX
JavaFX merupakan sebuah bahasa pemograman yang dikenalkan di JavaOne 2007 sebagai bahasa pemograman generasi terbaru dengan platform java. Christopher Oliver dari Sun Microsystems berperan besar sebagai penggagas utama dalam pembuatan JavaFX Script. Pembuatan bahasa JavaFX dimaksudkan untuk membangun dan mengembangkan aplikasi yang kaya fitur atau disebut juga Rich Internet Applications (RIAs). 2.3 Netbeans 6.8
NetBeans adalah Integrated Development Environment (IDE) berbasiskan Java dari Sun Microsystems yang berjalan di atas Swing. Swing adalah sebuah teknologi Java untuk pengembangan aplikasi Desktop yang dapat bejalan di berbagai macam platforms seperti Windows, Linux, Mac OS X and Solaris.
Netbeans bersifat modularitas, maksudnya adalah fungsi IDE di sediakan oleh modul-modul. Tiap modul menyediakan fungsi yang didefinisikan dengan baik, seperti dukungan untuk bahasa pemrograman Java, editing, atau dukungan bagi CVS. NetBeans memuat semua modul yang diperlukan dalam pengembangan Java dalam sekali download, memungkinkan pengguna untuk memulai bekerja sesegera mungkin. Modul-modul juga mengijinkan NetBeans untuk bisa dikembangkan.
3. Analisa Dan Perancangan 3.1 Gambaran Umum
Permainan “Menyusun Gambar” atau dikenal juga dengan game puzzle adalah permainan yang dimainkan dengan cara merangkaikan
6
sebuah gambar yang telah terpecah menjadi satu gambar yang utuh. Game puzzle merupakan salah satu permainan yang bersifat edukatif, karena pemain dapat melatih imajinasi dalam memainkannya. Permainan ini sangat popular karena telah dikenal sejak lama dan sering dimainkan oleh anak kecil, namun banyak juga orang dewasa yang gemar memainkannya karena bisa menyegarkan pikiran.
Permainan Menyusun Gambar dibangun dengan berbasiskan JavaFX. JavaFX merupakan bahasa pemograman yang diperkenalkan oleh Sun Microsystems dalam membangun aplikasi yang Rich Internet Applications (RIAs). Dengan banyak fitur dan dukungan, walau termasuk dalam bahasa pemograman baru, JavaFX menjadi pilihan dalam membuat sebuah aplikasi yang handal.
Metodologi yang digunakan untuk pengembangan sistem dalam membangun aplikasi permainan menyusun gambar adalah Waterfall. Metode Waterfall dipilih karena melakukan pendekatan secara sistematis dan urut sehingga pengerjaan proyek lebih terkontrol dan terjadwal dengan baik.
7 3.2 Analisis Sistem
Analisis sistem merupakan istilah yang secara kolektif mendeskripsikan fase-fase awal pengembangan sistem. Analisis sistem adalah teknik pemecahan masalah yang menguraikan bagian-bagian komponen dengan mempelajari seberapa bagus bagian-bagian komponen tersebut bekerja dan berinteraksi untuk mencapai tujuan mereka . Analisis sistem dapat juga didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh ke dalam bagian-bagian komponennya dengan maksud untuk mengidentifikasikan dan mengevaluasi permasalahan-permasalahan, kesempatan-kesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan-perbaikan.
Tahapan analisis sistem merupakan tahap fundamental yang sangat menentukan kualitas sebuah aplikasi yang akan dibangun. Tahap analisis sistem ini akan membahas mengenai permasalahan yang dihadapi, ruang lingkup masalah, penganalisaan terhadap data, analisa terhadap perangkat lunak, perangkat keras serta user yang akan menggunakan aplikasi ini, sehingga dapat mempermudah dalam melakukan perancangan dan implementasi
3.3 Perancangan Sistem
Perancangan sistem adalah suatu proses yang menggambarkan bagaimana suatu sistem dibangun untuk memenuhi kebutuhan pada fase analisis. Perancangan sistem atau bisa juga disebut sebagai desain sistem dapat pula didefinisikan sebagai teknik pemecahan masalah yang saling melengkapi (dengan analisis sistem) yang merangkai kembali bagian-bagian komponen menjadi sistem yang lengkap-harapannya, sebuah sistem yang diperbaiki1.
1
Hanif Al Fatta, 2007,Analisis & Perancangan Sistem Informasi untuk Keunggulan bersaing Perusahaan & Organsasi modern, Andi Offset, Yogyakarta, Hal:44
8 3.3.1 Perancangan Use Case Diagram
Use Case adalah deskripsi fungsi dari sistem dari perspektif/ sudut pandang pengguna. Use case bekerja dengan cara mendeskripsikan pengguna aplikasi (user) dengan sistem melalui sebuah skenario yang memperlihatkan apa saja yang dapat dikerjakan oleh sistem tersebut.
Use Case diagram memperlihatkan fungsionalitas yang diharapkan dari sebuah sistem, dimana interaksi antara aktor dan sistem diperlihatkan dengan notasi, garis, panah, dan simbol. Pada gambar dibawah ini akan memperlihatkan sebuah Use Case diagram pada aplikasi permainan menyusun gambar.
Gambar 3.2 Use Case Diagram
3.3.2 Perancangan Activity Diagram
Activity diagram merupakan diagram yang menggambarkan berbagai alur aktifitas dalam sebuah sistem yang sedang dirancang, bagaimana masing-masing alur berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi. Activity diagram tidak menggambarkan sifat internal dari sebuah sistem dan
9
interaksi antara beberapa sub sistem secara langsung, tetapi lebih menggambarkan proses-proses dan jalur kejadian dari awal pengguna membuka aplikasi sampai akhirnya menutup aplikasi. Berikut gambar activity diagram dalam game menyusun gambar.
Gambar 3.3 Activity Diagram
3.3.3 Perancangan Clas Diagram
Class adalah sebuah spesifikasi yang jika di-instanisasi akan menghasilkan sebuah obyek dan merupakan inti dari pengembangan berorientasi objek. Class menggambarkan keadaan (attribute) suatu sistem, sekaligus menawarkan layanan untuk memanipulasi keadaan tersebut (method). Generalisasi adalah relasi pewarisan antara dua Class. Relasi jenis ini memungkinkan suatu kelas mewarisi attribute dan operasi yang dimiliki oleh base Class2. Berikut gambar class diagram dalam game menyusun gambar.
2
Sholiq, 2006, Pemodelan Sistem Informasi Berorientasi Objek dengan UML, Graha Ilmu, Yogyakarta, Hal: 142
10
11 3.3.4 Perancangan Sequence Diagram
Sequence diagram merupakan diagram yang menggambarkan interaksi antar objek di dalam dan di sekitar sistem (termasuk pengguna, display, dan sebagainya) berupa message yang digambarkan terhadap waktu. Sequence diagram terdiri antar dimensi vertikal (waktu) dan dimensi horizontal (objek-objek yang terkait).
Gambar 3.5 Sequence Diagram Memilih Gambar Puzzle 3.3.5 Perancangan Antarmuka
Perancangan antarmuka dibutuhkan untuk mendefinisikan konsep dan komponen-komponen yang ada untuk mewakili keadaan interface dari aplikasi yang akan dibangun. Berikut akan disajikan perancangan antarmuka dari aplikasi yang akan dibangun.
A. Struktur Antarmuka.
Permainan menyusun gambar memiliki satu antarmuka yang memberikan gambaran menyeluruh mengenai apa yang akan ditampilkan dimonitor komputer. Berikut rancangan antarmuka yang akan dibangun.
12
Gambar 3.9 Struktur Antarmuka Tabel 3.1 Tabel Komponen Antarmuka
No Jenis Objek Keterangan
1 Tombol Berfungsi untuk memutar musik.
2 Tombol Berfungsi untuk mematikan musik.
3 Gambar Gambar background dengan dimensi 870x653
4 Area Puzzle Tempat meletakan potongan puzzle
5 Tombol Berfungsi untuk mengacak gambar.
6 Tombol Menyusun potongan gambar menjadi utuh.
7 Tombol Menjadikan gambar thumb sebagai gambar puzzle.
8 Tombol Berfungsi untuk me-minimaze aplikasi.
9 Tombol Berfungsi untuk me-close aplikasi.
10 Tombol Tombol navigasi untuk geser gambar thumb ke kiri.
11 Tombol Tombol navigasi untuk geser gambar thumb ke kanan.
12 Gambar Gambar thumb berada di tengah.
13 Gambar Gambar thumb berada di kiri.
14 Gambar Gambar thumb berada di kanan.
B. Struktur Potongan Puzzle
Sebuah potongan puzzle dibangun dari sebuah persegi dengan memiliki tab pada sisi-sisinya. Tab hanya ada apabila pada sisi tab tersebut terdapat
13
potongan puzzle lainnya. Setiap tab terbuat dari gabungan sebuah elips, sebuah persegi panjang dan dua buah lingkaran. Tab yang berada di sisi atas dan sebelah kiri akan menjorok ke dalam persegi, sedangkan tab yang berada di sisi bawah dan sebelah kanan akan menjorok ke luar persegi. Berikut rancangan potongan puzzle pada permainan menyusun gambar.
Gambar 3.10 Rancangan Potongan Puzzle
4. Implementasi dan Pembahasan 4.1 Implementasi
Setelah sistem dianalisis dan didesain secara rinci, maka akan menuju tahap implementasi. Implementasi merupakan tahapan setelah melakukan analisis dan perancangan sistem pada siklus rekayasa perangkat lunak dimana aplikasi siap dioperasikan pada keadaan yang sebenarnya sehingga dari sini akan diketahui apakah program atau aplikasi yang telah dibuat benar-benar dapat menghasilkan keluaran yang sesuai dengan tujuan yang diinginkan. 4.1.1 Implementasi Antarmuka
Aplikasi permainan Menyusun Gambar hanya memiliki satu antarmuka yang memberikan gambaran menyeluruh mengenai apa saja yang akan diperlihatkan pada pengguna. Antarmuka utama ini menampilkan gambar
14
puzzle, gambar thumb puzzle, tombol pilih gambar, tombol acak, tombol susun, tombol navigasi kiri-kanan, tombol minimize, tombol close, gambar background, dan tombol ON dan OFF untuk fitur musik. Berikut tampilan dari antarmuka aplikasi permainan Menyusun Gambar.
Gambar 4.1 Antarmuka Permainan Menyusun Gambar
4.1.2. Pilihan Gambar Puzzle
Pada aplikasi permainan Menyusun Gambar terdapat berbagai jenis pilihan gambar yang dapat dimainkan sebagai puzzle. Gambar tersebut masing-masing memiliki dimensi 700x300 pixel. Berikut gambar-gambar dapat dimainkan.
Tabel 4.1 Tabel Gambar-Gambar Puzzle
No Nama File Gambar
1 upin.jpg
2 transformers.jpg
15 4 winnie.jpg 5 barcelona.jpg 6 hellokitty.jpg 7 trex.jpg 8 sayur.jpg 4.2 Pembahasan
Aplikasi permainan Menyusun Gambar merupakan permainan sederhana yang memiliki tujuan untuk merangkai potongan-potongan gambar yang teracak menjadi utuh atau tersusun kembali membentuk sebuah gambar.
4.2.1 Desain Background
Sasaran pengguna adalah anak berusia 6-12 tahun sehingga desain disesuaikan dengan warna yang identik atau disukai oleh anak kecil yaitu warna-warna cerah contohnya biru, hijau, putih dan orange. Warna-warna yang cenderung gelap diminimalkan atau dihindari. Berikut gambar background (latar belakang) dari aplikasi permainan Menyusun Gambar.
16 4.2.2 Memilih Gambar
Pengguna bisa memilih sebuah gambar dari beberapa pilihan gambar yang disediakan untuk menjadikan gambar tersebut sebagai gambar puzzle sehingga bisa dimainkan. Pada aplikasi permainan Menyusun Gambar terdapat dua buah tombol navigasi yang berfungsi untuk menggeser gambar ke kiri ataupun ke kanan. Setelah menentukan gambar apa yang hendak dimainkan maka pengguna dapat menekan tombol PILIH GAMBAR.
Gambar 4.3 Memilih Gambar Puzzle 4.2.3 Memainkan Puzzle
Setelah menentukan gambar apa yang dijadikan sebagai gambar puzzle, pengguna dapat memainkannya dengan menekan tombol ACAK untuk membuat gambar tersebut menjadi beberapa potongan yang terpisah.
Gambar 4.4 Potongan puzzle 4.2.4 Memutar dan Mematikan Musik
Aplikasi permainan Menyusun Gambar memiliki fitur musik untuk membuat suasana lebih riang dan gembira. Fitur musik dapat dihidupkan dengan cara
17
menekan tombol ON sedangkan bila ingin mematikan fitur musik pengguna dapat menekan tombol OFF.
Gambar 4.5 Fitur Musik 4.2.5 Kontrol Aplikasi
Aplikasi Permainan Menyusun Gambar memiliki tombol close dan tombol minimize. Tombol close berfungsi untuk keluar dari aplikasi sedangkan tombol minimize berfungsi untuk me-minimize aplikasi. Kedua tombol tersebut berada di pojok kanan atas dari aplikasi.
Gambar 4.6 Kontrol Aplikasi 4.3 Pengujian Aplikasi
Pengujian merupakan tahapan dimana dilakukan pengujian dari kasus-kasus atau permasalahan pemakaian dilihat melalui sudut pandang pengguna.
1. Memainkan Puzzle
Tabel 4.2 Pengujian Memainkan Puzzle
No. Bahan Uji Sasaran Hasil Pengamatan Kesimpulan
1 Gambar
Puzzle
Menampilkan gambar di area puzzle dengan dimensi 700x300.
Gambar ditampilkan di area puzzle dengan dimensi 700x300.
Berhasil Gambar terpotong menjadi
berbagai bagian.
Gambar dapat ditampilkan
dengan berbagai potongan. Berhasil
2 Tombol
Acak
Menampilkan efek perubahan warna tombol ketika mouse berada di area tombol.
Saat mouse berada di area tombol terjadi perubahan
warna pada tombol. Berhasil
18
pengacakan potongan gambar.
susunan gambar menjadi teracak.
Menampilkan animasi saat gambar teracak.
Ada animasi saat gambar
teracak. Berhasil
3 Tombol
Susun
Menampilkan efek perubahan warna tombol ketika mouse berada di area tombol.
Saat mouse berada di area tombol terjadi perubahan
warna pada tombol. Berhasil
Tombol berfungsi untuk pengacakan potongan gambar.
Saat tombol ditekan maka susunan gambar menjadi teracak.
Berhasil Menampilkan animasi saat
gambar teracak.
Ada animasi saat gambar
teracak. Berhasil
4 Potongan
Gambar
Potongan gambar yang tidak berada di tempat yang benar dapat digerakan.
Potongan gambar dapat digerakan bila tidak berada
di tempat yang benar. Berhasil Potongan gambar yang
berada di tempat yang benar tidak dapat digerakan.
Potongan gambar tidak dapat digerakan bila berada
di tempat yang benar. Berhasil
2. Memilih Gambar
Tabel 4.3 Tabel Pengujian Memilih Gambar
No. Bahan
Uji Sasaran Hasil Pengamatan Kesimpulan
1
Tombol Pilih Gambar
Tombol berfungsi untuk memilih gambar.
Saat tombol ditekan gambar puzzle akan terganti dengan gambar yang dipilih( gambar thumb yang berada berhasil).
Berhasil
Tombol tetap berfungsi walau potongan gambar dalam kondisi teracak.
Berhasil
2 Navigasi
Thumb
Apabila tombol navigasi kiri ditekan gambar sebelah kiri bergeser ke tengah dan gambar tengah bergeser ke kanan.
Tombol navigasi kiri ditekan gambar sebelah kiri bergeser ke tengah dan gambar tengah bergeser ke kanan.
Berhasil
Apabila tombol navigasi kanan ditekan gambar sebelah kanan bergeser ke tengah dan gambar tengah bergeser ke kiri.
Tombol navigasi kanan ditekan gambar sebelah kanan bergeser ke tengah dan gambar tengah bergeser ke kiri.
Berhasil
Menampilkan animasi saat pergantian gambar thumb.
Saat pergantian gambar
19 3. Media Musik
Tabel 4.4 Pengujian Media Musik
No Bahan Uji Sasaran Hasil Pengamatan Kesimpulan
1 Tombol
ON
Tombol ON untuk menyalakan musik.
Saat tombol ON ditekan
musik menyala. Berhasil
2 Tombol
OFF
Tombol OFF untuk mematikan musik.
Saat tombol OFF ditekan
musik berhenti. Berhasil
3 Efek
Tombol
Perubahan warna tombol ON/OFF saat mouse diarea tombol ON/OFF.
Saat mouse berada dalam area tombol ON/OFF terjadi perubahan warna.
Berhasil
4. Kontrol Aplikasi
Tabel 4.5 Pengujian Kontrol Aplikasi
No Bahan
Uji Sasaran Hasil Pengamatan Kesimpulan
1 Tombol Close Tombol Close berfungsi untuk menutup aplikasi
Keluar dari aplikasi saat
tombol close ditekan. Berhasil
2 Tombol
Minimize
Fungsi tombol Minimize untuk me-minimize
Aplikasi me-minimize saat tombol minimize ditekan.
Berhasil
4.4 Hasil Pengujian
Setelah proses pengujian dilakukan maka menghasilkan beberapa kesimpulan sebagai berikut :
a) Secara fungsional, aplikasi permainan Menyusun Gambar sudah dapat menghasilkan output yang diharapkan.
b) Proses menjalankan aplikasi dirasa cukup lambat.
c) Fitur musik, pergantian gambar puzzle, dan animasi pergerakan gambar thumb dinilai kurang responsive dan lambat.
20 5.1. Kesimpulan
Kesimpulan yang dapat diambil berdasarkan uraian pada bab sebelumnya yaitu permainan Menyusun Gambar mudah digunakan karena hanya memiliki satu tampilan utama saja yang mencakup semua fitur aplikasi sehingga bagi pemain akan mudah menggunakannya. Permainan ini cocok untuk anak berusia 5-12 tahun karena memberikan mamfaat untuk peningkatan daya imajinasi anak.
5.2 Saran
a) Pengembangan aplikasi game dengan menggunakan JavaFX
memungkinkan tampilannya akan menjadi lebih menarik.
b) Jangan menggunakan media audio dengan ukuran file yang kecil.
c) Semakin banyak pilihan gambar puzzle maka semakin berat dan lambat kinerja aplikasi yang berjalan.
d) Aplikasi dapat berjalan baik di semua Sistem Operasi Windows. DAFTAR PUSTAKA
Al Fatta, Hanif. 2007. Analisis & Perancangan Sistem Informasi untuk Keunggulan Bersaing Perusahaan & Organisasi Modern. Yogyakarta: Penerbit Andi.
Sholiq. 2006. Pemodelan Sistem Informasi Berorientasi Objek dengan UML. Yogyakarta: Graha Ilmu.
http://javafx.com/ (diakses 10 April 2011). http://jfxpedia.com/ (diakses 10 April 2011).
http://learnjavafx.typepad.com/ (diakses 10 April 2011). http://netbeans.org/(diakses 10 April 2011).
