Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer Vol. 1, No. 12, Desember 2017, hlm. 1493-1499
e-ISSN: 2548-964X http://j-ptiik.ub.ac.id
Pengembangan Sistem Pembelajaran Pemrograman Java yang Atraktif Berbasis Website Dhanuari Indra Bastari1, Fajar Pradana2, Bayu Priyambadha3 Program Studi Sistem Informasi, Fakultas Ilmu Komputer, Universitas Brawijaya Email:
[email protected],
[email protected],
[email protected] Abstrak Pemrograman dasar merupakan ilmu yang wajib dikuasai oleh setiap mahasiswa FILKOM, namun berdasarkan hasil kuesioner didapatkan bahwa 76% mahasiswa FILKOM lebih tertarik pada mata kuliah selain pemrograman dasar. Terdapat beberapa hal yang menyebabkan mahasiswa menjadi kurang tertarik pada mata kuliah pemrograman dasar, terbatasnya sumber materi yang bisa diperoleh dan teknik pembelajaran yang kurang bervariasi. Maka pada penelitian ini akan mengembangkan sebuah sistem pembelajaran pemrograman java yang atraktif berbasis website dengan mengadaptasi metode gamification dan IOE-Behavior. Metode gamification diterapkan pada sistem pembelajaran ini melalui beberapa fitur yaitu, fitur yang memungkinkan pengguna satu menantang pengguna lain (challenge), fitur penghargaan bagi pengguna yang mencapai kondisi tertentu, fitur level dan experience point. Sedangkan metode IOE-Behavior diterapkan pada fitur pemeriksaan kode java yang memungkinkan sistem untuk memeriksa kode java secara otomatis dengan membandingkan input yang dimasukan dan output yang dihasilkan. Sistem ini dikembangkan dengan menggunakan metode SDLC dengan model waterfall. Pada tahap akhir sistem ini diuji dengan menggunakan metode black-box testing dan whitebox testing dengan hasil pengujian sebesar 100% valid. Kata kunci: sistem pembelajaran, gamification, ioe-behavior, waterfall, pemrograman java Abstract Basic programming is a knowledge that must be mastered by every FILKOM student, but based on the result of the questionnaire found that 76% of FILKOM students are more interested in other subject. There are several things that cause students to be less interested in the basic programming courses, the limited source of material that can be obtained and learning techniques that are less varied. Therefore, this research will develop an attractive web-based java learning system by adapting the gamification and IOE-Behavior methods. Gamification method wass applied to this learning system through several features, feature that allows user one challenge other user (challenge), reward feature for user reaching certain condition, level feature and experience point. While the IOE-Behavior method was applied to the java code check feature that allows the system to check the java code automatically by comparing input and output results. This system was developed using SDLC method with waterfall model. In the final stages the system was tested using black-box testing and white-box testing methods with 100% valid test results. Keywords: learning management system, gamification ioe-behavior, waterfall, java programming pemrograman dasar, bahasa pemrograman yang wajib untuk dikuasai adalah pemrograman java. Namun dari hasil pengamatan yang dilakukan terdapat banyak mahasiswa yang kurang minat pada mata kuliah pemrograman dasar. Pemrograman merupakan ilmu yang penting untuk dikuasai bagi setiap mahasiswa di Fakultas Ilmu Komputer (FILKOM) Universitas Brawijaya, karena salah satu kompetensi yang harus dimiliki oleh mahasiswa lulusan FILKOM adalah menciptakan perangkat lunak. Saat ini terdapat beberapa mata kuliah bersifat wajib
1. PENDAHULUAN Pemrograman merupakan ilmu yang penting untuk dikuasai bagi setiap mahasiswa di Fakultas Ilmu Komputer (FILKOM) Universitas Brawijaya, karena salah satu kompetensi yang harus dimiliki oleh mahasiswa lulusan FILKOM adalah menciptakan perangkat lunak. Saat ini terdapat beberapa mata kuliah bersifat wajib yang mengharuskan mahasiswa menggunakan bahasa pemrograman salah satunya adalah mata kuliah pemrograman dasar. Pada mata kuliah 1493
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer
yang mengharuskan mahasiswa menggunakan bahasa pemrograman salah satunya adalah mata kuliah pemrograman dasar. Pada mata kuliah pemrograman dasar, bahasa pemrograman yang wajib untuk dikuasai adalah pemrograman java. Namun dari hasil pengamatan yang dilakukan terdapat banyak mahasiswa yang kurang minat pada mata kuliah pemrograman dasar. Faktor lain yang menjadikan mata kuliah pemrograman dasar kurang diminati oleh mahasiswa ialah, banyaknya mahasiswa berlatar belakang pendidikan Sekolah Menengah Atas (SMA) yang tidak memiliki pengetahuan dasar mengenai pemrograman java. Dari beberapa hal yang diuraikan diatas, melalui penelitian ini penulis akan mengembangkan sistem pembelajaran pemrograman java yang disajikan dalam bentuk permainan simulasi dengan menerapkan metode gamification dan IOE-Behavior. Kemudian fakta lain yang dapat diambil pada survei dilapangan yaitu sebanyak 94% responden menyatakan bahwa dengan menggunakan metode pembelajaran permainan simulasi akan memudahkan dalam memahami serta meningkatkan minat terhadap materi pemrograman java. Metode gamification digunakan untuk menerapkan sebuah konsep game yang tepat sehingga dapat memberikan proses yang menyenangkan serta bermanfaat bagi setiap pihak yang terlibat. Sedangkan metode IOE-Behavior digunakan untuk melakukan pemeriksaan terhadap kode sumber java secara semantik dengan mempertimbangkan masukan, keluaran, serta efek yang dihasilkan dari kode sumber java tersebut. 2. TEORI 2.1. IOE Behavior Input, Output and Effects Behavior merupakan sebuah metode yang digunakan dalam mendeteksi kloning kode secara semantik. IOE Behavior terbagi dalam 4 proses, yaitu abstraction, filtering, testing, dan collection (Elva, 2012). Metode ini digunakan sebagai dasar dalam melakukan pemeriksaan antara dua source code java. Pemeriksaan source code tersebut dilakukan dengan cara membandingkan keluaran (output) yang dihasilkan oleh masingmasing source code dengan masukan (input) yang sama sebanyak lima (5) kali pemeriksaan.
Fakultas Ilmu Komputer, Universitas Brawijaya
1494
2.2. Gamification Gamification merupakan suatu proses penggunaan teknik desain dan mekanisme game dalam aplikasi non-game guna mengikat pengguna dalam mencapai tujuan. Pengertian lain dari gamification yaitu sebuah upaya dalam mengimplmentasikan sebuah konsep game yang tepat sehingga dapat memberikan proses yang menyenangkan serta bermanfaat bagi setiap pihak yang terlibat (Romdhoni & Wibowo, 2014). Dalam gamification terdapat beberapa mekanisme game yang akan diterapkan pada aplikasi pembelajaran pemrograman java yaitu point, level user, achievement, dan challenge. 2.3. Waterfall Dalam pengembangan perangkat lunak pada penelitian ini menggunakan model waterfall yang merupakan salah satu model dari metode System Development Life Cycle (SDLC). Model Waterfall ini merupakan contoh dari sebuah proses yang bersifat plan-driven dimana semua aktivitas yang akan dilakukan harus direncanakan terlebih dahulu sebelum mengerjakannya (Sommerville, 2011). Tahapan pada model waterfall dilakukan secara berurutan yakni analisis kebutuhan, perancangan sistem, implementasi sistem, pengujian sistem dan pemeliharaan sistem. 3. HASIL DAN PEMBAHASAN 3.1. Analisis Kebutuhan Pada penelitian ini dibangun sebuah sistem pembelajaran pemrograman java yang atraktif berbasis website. Sistem pembelajaran tersebut dikembangkan dengan tujuan dapat meningkatkan minat dan memudahkan pemahaman mahasiswa FILKOM UB terhadap materi pemrograman java. Mahasiswa dapat mempelajari materi pemrograman java berupa teks, gambar, atau video, kemudian mahasiswa dapat mengerjakan latihan soal dari setiap materi, selain itu sistem pembelajaran ini juga menyediakan sebuah fitur yang memungkinkan mahasiswa untuk menantang mahasiswa lain dalam keahlian pemrograman java. Dalam mendeteksi kebenaran dari kode yang dimasukan oleh pengguna, sistem pembelajaran ini menggunakan metode IOE-Behavior. Sistem pembelajaran ini menggunakan metode gamification untuk menyediakan sistem
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer
1495
pembelajaran yang atraktif, yakni dengan menerapkan sistem point. Pada tahap identifikasi aktor dilakukan pengidentifikasian aktor beserta deskripsi singkat tentang perlakuan yang dapat dilakukan oleh masing-masing aktor. Rincian identifikasi aktor sistem pembelajaran pemrograman java yang akan dibangun dapat dilihat pada Tabel 1. Tabel 1. Identifikasi Aktor Aktor Pengguna
Admin
Member
Deskripsi Dalam sistem ini pengguna harus melakukan login untuk proses autentifikasi terhadap pengguna tersebut ketika ingin menggunakan sistem. Dalam sistem ini admin bertugas untuk mengelola data dari member, materi, penghargaan dan soal. Dalam sistem ini member dapat melihat materi, melihat penghargaan yang pernah diraih, mengerjakan pertanyaan latihan, serta mencari member lain, menambahkan member lain ke daftar teman dan melakukan tantangan kepada member lain.
Diagram use case digunakan untuk memodelkan semua proses bisnis berdasarkan perspektif pengguna sistem yang terdiri dari perilaku dan aktor yang bertindak pada sistem, diagram use case ini dibuat berdasarkan pada kebutuhan fungsional sistem yang telah dibuat sebelumnya. Kemudian digambarkan diagram berdasarkan aktor yang bertindak pada fungsionalitas tersebut. Berikut ini merupakan diagram usecase dari sistem pembelajaran pemrograman java beserta aktor yang dapat berinteraksi dengan perangkat lunak pada Gambar 1 dan Gambar 2.
Gambar 2. Diagram Use Case Member dan Pengguna
3.2. Perancangan Pada tahap perancangan dilakukan beberapa hal yang akan digunakan sebagai acuan dalam proses implementasi, yakni pembuatan diagram-diagram perancangan perangkat lunak yang meliputi diagram sequence, diagram class, relational data model, perancangan komponen sistem dan perancangan antarmuka pengguna. 3.2.1. Perancangan Komponen Perancangan komponen merupakan dekomposisi sub-sistem menjadi komponen detail. Perancangan komponen menjelaskan atribut dan algoritma method dalam sebuah class yang telah dimodelkan sebelumnya pada pemodelan class diagram. Tabel 2 merupakan algoritma dari method test_java() yang berfungsi untuk melakukan pemeriksaan terhadap kode java. Tabel 2. Algoritma method test_java()
Gambar 1. Diagram Use Case Admin Fakultas Ilmu Komputer, Universitas Brawijaya
BEGIN test_java(id_question, id_exercise) SESSION get uid DB get question by id_question as question data as new array with exercise_id, member_id, param_case, result, error, answer, param_count IF (question.param_type not random) test_case as new array explode question.param_case as param FOREACH param as p
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer IF p not null temp_case as new array explode p as case FOREACH case as c IF c not null push c to array temp_case END IF END FOREACH push temp_case to array test_case END IF END FOREACH data.param_case = question.param_case END IF key_out as string user_out as string FOR i=0 until 5 randoming as new array key_proc = proc_open java key_file with key_pipes as pipe IF is_resource = key_proc IF question.param_type is random FOR j=0 until question.param_count fwrite key_pipes.0 with test_case.i.j END FOR ELSE FOR j=0 until question.param_count CALL FUNCTION random_value as randomval push randomval to array randoming fwrite key_pipes.0 with randomval END FOR END IF fclose keypipes.0 key_out = stream_get_contents from key_pipes.1 delete white spaces on key_out fclcose key_pipes.1 END IF user_proc = proc_open java user_file with user_pipes as pipe IF is_resource = user_proc IF question.param_type is random FOR j=0 until question.param_count fwrite user_pipes.0 with test_case.i.j END FOR ELSE FOR j=0 until question.param_count fwrite user_pipes.0 with randoming.j END FOR END IF fclose user_pipes.0 user_out = stream_get_contents from user_pipes.1 user_error = stream_get_contents from user_pipes.2 delete white spaces on user_out fclcose user_pipes.1 END IF add user_out to data.result add user_error to data.error PRINT user_out and key_out IF key_out = user_out add "True" to data.answer ELSE add "False" to data.answer END IF END FOR DB insert to exercise with array data END test_java
3.2.2. Perancangan Antarmuka
Perancangan antarmuka pengguna merupakan proses pembuatan rancangan tampilan sistem yang akan dibangun agar pengguna dapat berinteraksi dengan sistem pembelajaran. Gambar 3 merupakan rancangan antarmuka pengguna untuk halaman menambah pertanyaan, pada halaman ini pengguna dapat melakukan penambahan pertanyaan baru untuk sistem pembelajaran, selain itu pengguna juga dapat melakukan proses percobaan kode java. Fakultas Ilmu Komputer, Universitas Brawijaya
1496
Gambar 3. Rancangan Antarmuka Menambah Pertanyaan
Rancangan antarmuka pengguna untuk halaman mengajukan tantangan dapat dilihat melalui Gambar 4, halaman tersebut meminta konfirmasi pengguna dalam mengajukan tantangan kepada pengguna lain.
Gambar 4. Rancangan Antarmuka Halaman Mengajukan Tantangan
Halaman mengerjakan latihan materi yang terdapat pada Gambar 5 menampilkan penjelasan soal beserta form source code yang akan dimasukkan oleh aktor yang digunakan untuk menjawab dan tombol “submit answer” digunakan untuk memastikan jawaban yang dimasukkan dengan benar.
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer
1497
}else{ for($j=0; $j<$question['param_count'];$j++){ $randoming = $this->random_value(); fwrite($key_pipes[0], $randoming."\n"); echo $randoming; $data['param_case'] .= $randoming . "!!**??CASE??**!!"; if (($j+1)==$question['param_count']) { echo "
"; }else{ echo "
"; } } } $data['param_case'] .= "!!**??PARAM??**!!"; fclose($key_pipes[0]); $key_out = stream_get_contents($key_pipes[1]); $error = stream_get_contents($key_pipes[2]); echo $key_out."
"; echo $error."
"; $data['result'] .= $key_out . "!!**??RESULT??**!!"; $data['error'] .= $error . "!!**??ERROR??**!!"; fclose($key_pipes[2]); fclose($key_pipes[1]); } } $this->m_question->add_log($data); }
Gambar 5. Rancangan Antarmuka Halaman Mengerjakan Latihan Materi
3.3. Implementasi Tahapan implementasi yang dilakukan terdiri dari penjelasan tentang spesifikasi lingkungan pengembangan sistem, batasanbatasan implementasi, implementasi algoritma, implementasi basis data dan implementasi antarmuka pengguna.
3.3.2. Implementasi Antarmuka Berikut ini adalah hasil implementasi dari perancangan antarmuka yang telah dilakukan pada tahap sebelumnya. Gambar 6 merupakan implementasi antarmuka pada halaman menambah pertanyaan, Gambar 7 adalah hasil implementasi antarmuka pada halaman mengajukan tantangan, sedangkan Gambar 8 adalah hasil implementasi antarmuka pada halaman mengerjakan latihan materi.
3.3.1. Implementasi Algoritma Tabel 3 merupakan hasil implementasi dari algoritma method test_java() yang telah dirancang pada tahapan perancangan komponen sebelumnya. Tabel 3. Implementasi Algoritma test_java() public function test_java(){ $key = $_GET['key']; $param_count = $_GET['param_count']; $param_case = $_GET['param']; $question = array( 'key' => $key, 'param_count' => $param_count, 'param_case' => $param_case); if (isset($_GET['param_type'])) { $question['param_type']='random';} $test_case = $question['param_case']; $data['question_id'] = $_GET['id']; $data['param_count'] = $_GET['param_count']; $data['param_case'] = ""; $data['result'] = ""; $data['error'] = ""; $options = ["bypass_shell" => true]; $key_out = ""; $user_out = ""; $return = true; for($i=0; $i<5; $i++){ $key_proc=proc_open("java -classpath ./java/test test_compile", array( array("pipe","r"), array("pipe","w"), array("pipe","w")), $key_pipes,NULL,NULL,$options); if (is_resource($key_proc)) { if(!isset($_GET['param_type'])){ for($j=0; $j<$question['param_count'];$j++){ fwrite($key_pipes[0], $test_case[$i][$j]."\n"); echo $test_case[$i][$j]; $data['param_case'] .= $test_case[$i][$j] . "!!**??CASE??**!!"; if (($j+1)==$question['param_count']) { echo "
"; }else{ echo "
"; } }
Fakultas Ilmu Komputer, Universitas Brawijaya
Gambar 6. Implementasi Antarmuka Menambah Pertanyaan
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer
Gambar 7. Implementasi Antarmuka Mengajukan Tantangan
1498
Tabel 4. Penjelasan Persamaan Kompleksitas Siklomatis Simbol Arti Jumlah kompleksitas siklomatis V(G) Sisi atau edge E Simpul atau node N Predictate node P Region R
Tabel 5 merupakan hasil dari pengujian unit yang telah dilakukan pada 3 method sistem pembelajaran ini yaitu method melakukan percobaan kode java, menjalankan compile kode java, dan mengerjakan latihan materi. Tabel 5. Hasil Pengujian Unit Method
R
N
E
P
V(G)
Melakukan percobaan kode java
16
51
65
15
16
Menjalankan compile kode java
2
7
7
1
2
Mengerjakan latihan materi
7
24
29
6
7
3.4.2. Pengujian Validasi
Gambar 8. Implementasi Antarmuka Mengerjakan Latihan Materi
Pengujian validasi dilakukan untuk memastikan bahwa seluruh kebutuhan fungsional dari sistem berjalan sesuai dengan yang diharapkan menggunakan metode black box. Tabel 6 merupakan hasil pengujian validasi dari 3 method di dalam sistem pembelajaran ini.
3.4. Pengujian
Tahapan selanjutnya ialah pengujian terhadap sistem yang telah diimplementasi, pada penelitian ini dilakukan 2 pengujian yaitu pengujian unit dan pengujian validasi. 3.4.1. Pengujian Unit Pengujian ini dilakukan untuk menentukan jumlah cyclomatic complexity (kompleksitas siklomatis) dan menentukan jalur independen dari pseudocode method dalam system yang telah diubah menjadi flow graph. Jumlah kompleksitas siklomatis diperoleh dengan menggunakan persamaan (1), (2) dan (3), kemudian disertai dengan penjelasan pada Tabel 4. V(G) = E-N+2 V(G) = P+1 V(G) = R
(1) (2) (3)
Fakultas Ilmu Komputer, Universitas Brawijaya
Tabel 6. Hasil Pengujian Validasi Kasus Uji
Hasil Yang Diharapkan
Status
Melakukan percobaan kode java
Sistem menampilkan dialog pesan yang berisi masukan secara random serta keluaran yang dihasilkan oleh kode sumber java sebanyak 5 kasus.
Valid
Menjalankan compile kode java
Sistem menampilkan informasi bahwa compile kode sumber telah berhasil dan sistem menampilkan tombol “Test Code” untuk melakukan percobaan kode sumber
Valid
Mengerjakan latihan materi
Sistem menampilkan halaman riwayat latihan dan data latihan bertambah.
Valid
Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer
4. KESIMPULAN Kesimpulan yang dapat diambil dari seluruh proses yang telah dilakukan dalam penelitian ini adalah sebagai berikut: 1. Hasil perancangan dari penelitian yang dilakukan adalah sebuah website yang menerapkan metode gamification dan IOEBehavior dengan hasil pengujian black-box dan white-box 100% valid. 2. Hasil penerapan metode gamification pada sistem yaitu fitur level setiap member yang akan bertambah sesuai dengan meningkatnya exp, penghargaan yang diberikan kepada member ketika mencapai kondisi tertentu, serta fitur yang memungkinkan member untuk menantang member lain di dalam sistem pembelajaran pemrograman java. 3. Hasil penerapan metode IOE-Behavior pada sistem pembelajaran pemrograman java adalah sistem dapat memeriksa kode sumber java yang dimasukan oleh member dibandingkan dengan kunci kode sumber java yang telah tersedia didalam sistem. 5. DAFTAR PUSTAKA SOMMERVILE, IAN. 2011. Software Engineering. Ninth Edition. New York: Addison – Wesley. ELVA, ROCHELLA. 2012. ”Semantic Clone Detection Method IOE-Behavior”. Department of EECS, University of Central Florida. ROMDHONI, WIBOWO. 2014. Penerapan Gamification Pada Aplikasi Interaktif Pembelajaran SQL Berbasis Web. Institut Teknologi Sepuluh November . Surabaya.
Fakultas Ilmu Komputer, Universitas Brawijaya
1499