JURNAL ILMIAH FIFO ISSN 2085 4315

Perancangan Dan Implementasi Komponen Antarmuka Pemograman Visual

Sebagai Pendukung Aplikasi Penghasil Kuis Otomatis

Afrizal Putrawan1, Anis Cherid2

Program Studi Teknik Informatika, Fakultas Ilmu Komputer, Universitas Mercu Buana
Jl. Raya Meruya Selatan, Kembangan, Jakarta 11650
E-mail: 1afrizalputrawan@gmail.com, 2cheridanis@gmail.com

ABSTRAK

Pengajar dituntut mentransfer ilmu kepada siswa dengan materi dan cara tertentu. Teknologi komunikasi dan informasi dapat
dimanfaatkan, salah satunya adalah Evaluasi pembelajaran menggunakan aplikasi penghasil kuis otomatis dengan tujuan
mendapat informasi ukuran keberhasilan proses pembelajaran. Dalam membuat aplikasi tersebut dibutuhkan sebuah antarmuka
yang membantu user membuat kode program kuis otomatis. Kesalahan dalam penulisan kode program dapat dihindari dan akan
terciptanya aplikasi yang "ramah dengan pengguna". Dalam membuat kode program, aplikasi akan memandu user dalam
membuat kode program sesuai dengan aturan kode program. Pembuatan variabel, fungsi, pertanyaan dan jawaban dikontrol ketat
agar antarmuka pemograman visual ini tidak hanya sekedar aplikasi ramah dengan pengguna saja tetapi juga aplikasi penghasil
kode program yang dapat diuji kebenaran kode programnya. Adapun tahapan–tahapan pembangunan dimulai dengan menganalisa
sistem yang akan dibangun, pengumpulan spesifikasi kebutuhan, menganalisis kekurangan dan kendala yang dihadapi dalam
sistem dan pendeskripsian perencanaan pembangunan. Aplikasi dibangun menggunakan Microsoft Visual Basic 6.0 dengan
memanfaatkan kontrol yang disediakan. Berdasarkan hasil pengujian, untuk menghasilkan aplikasi tersebut dibutuhkan
pengendalian atas masukan yang dilakukan user dalam membuat kode program meliputi pembuatan variabel, fungsi, jawaban dan
pertanyaan. Selain itu aplikasi hanya mengizinkan user membuat satu fungsi pada setiap baris program.

Kata kunci : antarmuka, kode program, pemrograman visual, penghasil kuis otomatis.

PENDAHULUAN teknik pemograman.

Dalam dunia pendidikan saat ini telah
memanfaatkan teknologi informasi dan komunikasi
untuk mendukung keberhasilan proses belajar
mengajar. Evaluasi kompetensi peserta didik adalah
cara untuk mengetahui tingkat keberhasilan sebuah
proses pembelajaran.
Metode ini sangat familiar digunakan oleh dosen
ataupun guru, sehingga kadangkala menimbulkan
berbagai masalah yang dapat menggagalkan proses
evaluasi kompetensi peserta didik seperti kecurangan
yang dilakukan oleh peserta didik dalam menjawab
kuis dan ketikdakmampuan dosen atau guru
menciptakan kuis dengan kombinasi soal yang baik.
Prototipe Aplikasi Penghasil Soal Kuis Otomatis
(Anis Cherid, 2012) memberikan solusi akan masalah
yang terjadi. Aplikasi ini menggunakan aturan-aturan
(rules) tertentu untuk menciptakan sebuah kuis dengan
soal yang otomatis, Aplikasi ini akan membantu dosen
atau guru dalam mendapatkan nilai kuis yang dapat
dipercaya dan kombinasi soal yang baik. Proses
pembuatan aturan-aturan penghasil soal masil
tergantung kepada pembuatan aturan menggunakan
teknik programming yang rumit.
Tingkat kerumitan yang cukup tinggi dalam
menuliskan kode program menjadi kendala bagi dosen
atau guru terutama bagi mereka yang baru mengenal
Hal ini yang melatarbelakangi penulis untuk
membangun antarmuka pemograman visual yang
dapat mengurangi kesalahan-kesalahan dalam
penulisan kode program menggunakan keyboard.
Selain itu aplikasi ini juga secara otomatis dapat
memandu pengajar untuk menghasilkan kode program
yang sesuai dengan aturan bahasa pemograman.
Rancangan antarmuka diharapkan dapat memberikan
kemudahan pengajar pembelajaran membuat kuis
otomatis, salah satunya adalah tersedianya Expression
Builder yang memandu dalam membuat fungsi dengan
benar.
Berdasarkan uraian yang telah disampaikan
sebelumnya, maka masalah yang akan dijawab penulis
dalam tugas akhir ini adalah:
1. Bagaimana merancang dan membangun aplikasi
yang dapat mengurangi penulisan kode program
menggunakan keyboard dan beralih menggunakan
mouse?
2. Bagaimana membangun aplikasi yang dapat
menulis kode program sesuai dengan aturan
pemograman yang digunakan pada aplikasi kuis
otomatis?
3. Bagaimana membangun aplikasi yang dapat
memandu user dalam mengurangi kesalahan dalam
penulisan kode program pada aplikasi kuis
otomatis?

Afrizal Putrawan, Anis Cherid 80

JURNAL ILMIAH FIFO
Tujuan dari penulisan tugas akhir ini adalah
merancang dan membangun antarmuka yang dapat:
1. Mengurangi penulisan kode program
menggunakan keyboard dan beralih menggunakan
mouse.
2. Menulis kode program sesuai dengan aturan
pemrograman yang digunakan pada aplikasi kuis
otomatis.
3. Memandu user dalam mengurangi kesalahan
dalam penulisan kode program yang digunakan
dalam menciptakan kuis otomatis.
Sedangkan manfaat yang bisa didapatkan dari
pembuatan komponen antarmuka pemograman visual
aplikasi penghasil kuis otomatis adalah memudahkan
user dalam menulis kode program di aplikasi
penghasil kuis otomatis.
Beberapa batasan masalah yang melandasi
penulisan ini hanya sampai dengan fitur-fitur
implementasi yang merupakan perumusan masalah
dan dapat dijabarkan sebagai berikut:
1. Antarmuka aplikasi ini tidak menerapkan
penggunaan database.
2. Aplikasi ini hanya dapat dijalankan pada sistem
operasi Windows XP dan Windows 7.
3. Kode program yang dihasilkan hanya dapat
dijalankan pada platform pemograman Visual
Basic for Application (VBA).
4. Visualisasi dan pengendalian kode program hanya
terbatas pada berbagai fungsi yang sudah
diimplementasikan pada aplikasi penghasil kuis
otomatis.
5. Kode program yang dihasilkan pada aplikasi ini di-
copy ke clipboard dan di-paste ke aplikasi
penghasil kuis otomatis
Metodologi
Dalam penyusunan tugas akhir ini diperlukan data,
informasi dan metode dalam penyelesaiannya. Dimana
metode penyelesaian yang digunakan adalah metode
waterfall. Secara keseluruhan metode ini terdiri dari :
1. Analisis dan Definisi Persyaratan
2. Perancangan Sistem dan Perangkat Lunak
3. Implementasi dan Pengujian Unit
4. Integrasi dan Pengujian Sistem
5. Operasi dan Pemeliharaan
Tetapi penelitian ini hanya sampai langkah keempat,
yaitu Integrasi dan Pengujian Perangkat Lunak atau
Sistem.Untuk langkah Operasi dan Pemeliharaan tidak
diterapkan pada penelitian ini.
LANDASAN TEORI
Teknologi Informasi dan Komunikasi
Menurut Ngainun Naim (2011. Dasar-dasar
Komunikasi Pendidikan) Teknologi informasi dan
komunikasi (TIK) merupakan gabungan dari dua
konsep, yaitu teknologi informasi dan teknologi
komunikasi. Kedua konsep ini memiliki keterkaitan
yang sangat erat. Teknologi informasi menekankan
Volume V/ No. 2/Nov/2013
ISSN 2085 4315
pada pelaksanaan dan pemrosesan data seperti
menangkap, mentransmisikan, menyimpan,
mengambil, dan memanipulasi atau menampilkan data
dengan menggunakan perangkat-perangkat teknologi
elektronik, terutama komputer. Makna teknologi
informasi tersebut belum menggambarkan secara
langsung keterkaitannya dengan sistem komunikasi,
tetapi lebih pada pengolahan data dan informasi.
Sedangkan teknologi komunikasi lebih
menekankan pada penggunaan perangkat teknologi
eletronika dan aspek ketercapaian tujuan dalam proses
komunikasi. Dengan demikian, data dan informasi
yang diolah dengan teknologi informasi harus
memenuhi kriteria komunikasi yang efektif.
Teknologi informasi dan komunikasi (TIK) tidak
sama, tetapi memiliki keterkaitan erat. Teknologi
informasi lebih berkaitan dengan sistem pengolahan
informasi. Dalam kaitannya dengan pembelajaran,
TIK di sekolah memadukan kedua unsur tersebut
dengan tujuan para siswa memiliki kompetensi untuk
memanfaatkan teknologi informasi sebagai perangkat
keras dan perangkat lunak dalam mengolah,
menganalisis, dan mentransmisikan data dengan
memerhatikan dan memanfaatkan teknologi
komunikasi untuk memperlancar komunikasi dan
produk teknologi informasi yang dihasilkan
bermanfaat sebagai alat dan bahan komunikasi yang
baik. Dengan demikian TIK merupakan suatu bentuk
paduan antara komputer dan komunikasi.
Interaksi Manusia dan Komputer
Menurut Teddy Marcus Zakaria dan Agus Projono
(2007. Perancangan Antarmuka untuk Interaksi
Manusia dan Komputer) Interaksi manusia dan
komputer adalah ilmu yang mempelajari bagaimana
mendesain, mengevaluasi dan menerapkan interaksi
antara manusia dan komputer. Fungsi ilmu ini adalah
mengoptimalisasikan performansi antara manusia
dengan komputer sebagai suatu sistem.
Berdasarkan prinsip kerja dalam sistem komputer,
manusia memberikan data masukan yang biasanya
berupa angka maupun deret karakter, yang kemudian
diolah oleh komputer menjadi keluaran yang
diinginkan atau diharapkan pengguna. Ketika
seseorang bekerja dengan sebuah komputer, ia akan
melakukan interaksi dengan komputer dengan cara-
cara tertentu. Interaksi tersebut membutuhkan sebuah
media yang dapat mempermudah langkah kerja dan
adanya keramahan system kepadanya.
Strategi Pengembangan Antarmuka
Menurut Insap Santosa (2004:8) secara garis besar,
pengembangan bagian antarmuka perlu diperhatikan
beberapa hal sebagai berikut:
1. Pengetahuan tentang mekanisme fungsi manusia
sebagai pengguna komputer. Hal ini menyangkut
antara lain psikologi kognitif, tingkat perseptual,
dan kemampuan motorik dari pengguna.
2. Berbagai informasi yang berhubungan dengan
karakteristik dialog yang cukup lebar seperti ragam
81
JURNAL ILMIAH FIFO
dialog, struktur, isi tektual dan grafis, tanggapan
waktu, dan kecepatan tampilan. Pengetahuan
umum (common sense) sering menjadi salah satu
petunjuk penting dalam pengembangan antarmuka,
tetapi perancang tidak boleh hanya mengandalkan
pada pengetahuan umum ini.
3. Penggunaan prototipe yang didasarkan pada
spesifikasi dialog formal yang disusun secara
bersama-sama antara calon pengguna dan
perancangan sistem, serta peranti bantu yang
mungkin dapat digunakan untuk mempercepat
proses pembuatan prototipe.
4. Teknik evaluasi yang digunakan untuk
mengevaluasi hasil proses prototipe yang
dilakukan yaitu secara analitis berdasarkan pada
analisis atas transaksi dialog, secara empirik
menggunakan uji coba pada sejumlah kasus,
umpan balik pengguna yang dapat dikerjakan
dengan tanya jawab maupun kuesioner, dan
beberapa analisis yang dikerjakan oleh ahli
antarmuka.
RAPTOR
RAPTOR adalah flowchart pemrograman berbasis
environment, yang dirancang khusus untuk membantu
siswa memvisualisasikan algoritma mereka dan
menghindari kesalahan sintak tertentu. Program
RAPTOR diciptakan secara visual dan dieksekusi
secara visual dengan menelusuri eksekusi melalui
flowchart. RAPTOR ditulis dalam kombinasi bahasa
pemograman Ada, C # dan C + +, dan berjalan dalam
Framework. NET. RAPTOR dimulai denganmembuka
ruang kerja kosong dengan simbol awal dan akhir.
RAPTOR memiliki lebih dari 40 fungsi dan
prosedur yang memungkinkan siswa untuk
menghasilkan angka acak, melakukan perhitungan
trigonometri, grafik dan gambar dengan penunjuk
arah.
Tahapan Perancangan Sistem Perangkat Lunak
Pada saat ini pemodelan perangkat lunak banyak
sekali, jenis pemodelan yang berbeda beda baik secara
pemahaman dan juga berbeda dari pengguna yang
mengembangkan pemodelan itu sendiri. Jenis
pemodelan yang digunakan dalam penyelesaian tugas
akhir ini menggunakan pemodelan yang secara umum
digunakan dalam rekayasa perangkat lunak yaitu
model air terjun (waterfall).
Model Software development life cycle (SDLC)
memiliki beberapa model dalam penerapan tahapan
prosesnya. Model SDLC air terjun (watefall) sering
juga disebut dengan model sekuensial linier
(sequential linier) atau alur hidup klasik (classic life
cycle). Model air terjun menyediakan pendekatan alur
hidup perangkat lunak secara sekuensial atau terurut
Afrizal Putrawan, Anis Cherid
ISSN 2085 4315
dimulai dari analisis, desain, pengodean, pengujian
dan tahapan dukungan (support).
Roger S. Pressman (2002. Software Engineering),
memecah model ini menjadi 6 tahapan meskipun
secara garis bersama dengan tahapan-tahapan model
waterfall pada umumnya. Berikut adalah penjelasan
dari tahap-tahap yang dilakukan di dalam model ini
menurut Pressman:
a. System / Information Engineering and Modeling
b. Software Requirements Analysis
c. Design
d. Coding
e. Testing / Verification
f. Maintenance
ANALISIS DAN PERANCANGAN
Prototipe Aplikasi Penghasil Soal Kuis Otomatis
Prototipe aplikasi penghasil soal kuis otomatis Adalah
prototipe aplikasi yang menghasilkan soal kuis secara
otomatis dengan menggunakan aturan-aturan (rules)
tertentu (Anis Cherid, 2012). Pada prototipe aplikasi
ini, proses pembuatan aturan-aturan penghasil soal
masih tergantung kepada pembuatan aturan
menggunakan teknik programming yang rumit.
Prototipe aplikasi penghasil soal kuis otomatis
menggunakan aplikasi Microsoft PowerPoint sebagai
media ditempatkannya kuis otomatis tersebut bersama
dengan materi pembelajaran sehingga menjadi
aplikasi yang utuh dan berdiri sendiri.
Arsitektur aplikasi penghasil soal kuis otomatis
terdiri dari sebuah interpreter yang berguna sebagai
penerjemah kode program sehingga kode program
yang baru dapat dibuat oleh sebuah aplikasi yang
sedang berjalan, kemudian kode program yang baru
tersebut dieksekusi bersama-sama dengan aplikasi
yang menghasilkan kode program tersebut.
Analisis Sistem
Antarmuka pemograman visual pada aplikasi
penghasil kuis otomatis merupakan aplikasi yang
menyediakan sebuah antarmuka yang dapat
memudahkan user dalam membuat kuis otomatis.
Pengembangan antarmuka tersebut dilakukan dengan
konsep mengurangi interaksi user dalam menulis kode
program menggunakan keyboard dan beralih kepada
mouse. Antarmuka yang disediakan memandu user
untuk menuliskan kode program dengan efisien dan
mengurangi kesalahan dalam penulisan kode program.
Penentuan variabel, pertanyaan dan jawaban dalam
kuis otomatis telah dirancang dalam sebuah antarmuka
yang secara otomatis memandu user menuliskan kode
program sesuai dengan aturan kode program yang
digunakan.
82
JURNAL ILMIAH FIFO ISSN 2085 4315

Konteks Diagram

1
Variabel

Kode Program
Fungsi Aplikasi Pengembangan
User Antarmuka
Jawaban benar + salah Kuis Otomatis

Pertanyaan +

Gambar 2. Konteks Diagram

User melihat tampilan aplikasi adalah menentukan variable

User pada aplikasi ini adalah Pengajar dan Dosen,
dimana yang dilakukan oleh user adalah membuat
variabel dan fungsi yang akan digunakan. Setelah ini
user dapat membuat pertanyaan berdasarkan variabel
yang sudah dibuat. Sama halnya dengan variabel,
pertanyaan dapat diberikan formula. Pada tahap akhir
user melakukan pembuatan jawaban benar dan salah
berdasarkan pertanyaan. Jawaban benar dan salah juga
dapat diberikan fungsi untuk pilihan jawaban yang
kombinasi.
Diagram Alir Data
Setelah perancangan proses konteks diagram
selesai dilakukan, maka breakdown selanjutnya masuk
pada diagram alir data yang semua proses nya masih
terkait dengan konteks diagram. Pada gambar 3 proses
yang pertama kali terjadi setelah user pertama kali
dan memilih fungsi-fungsi yang akan digunakan
dalam kode program. Adapun fungsi-fungsi yang
diproses oleh aplikasi adalah random char, random
number, create array, put value, display array, get
value, general dan fill array.
Jika sudah berhasil diselesaikan, user membuat
pertanyaan berdasarkan variable dan fungsi yang
sudah dibuat. Langkah selanjutnya adalah membuat
pilihan jawaban benar dan pilihan jawaban yang salah.
Kode program yang sudah dibuat juga dapat diubah
berdasarkan kebutuhan.
Input yang dilakukan oleh user akan diproses oleh
aplikasi dan menghasilkan output berupa baris-baris
kode program. Baris kode program yang diciptakan
oleh aplikasi adalah kode program variabel, pertanyaan
dan jawaban. Kode program yang dihasilkan akan
selanjutnya digunakan untuk menghasilkan kuis
otomatis pada prototipe aplikasi penghasil kuis
otomatis (Anis Cherid, 2012).

Data Fungsi CopyArray

Kode Program CopyArray
Data Fungsi RandomChar
Kode Program Variabel

Membuat Membuat Membuat

Membuat
Data Variabel Fungsi Fungsi Random Fungsi
Variabel
RandomChar Number CopyArray

Kode Program RandomNumber

Data fungsi RandomNumber

Data Fungsi CreateArray
Kode Program CreateArray
User Data Fungsi PutValue
Membuat Membuat
Kode Program Membuat
Fungsi Fungsi
PutValue Fungsi fillArray
PutValue CreateArray

Data Fungsi fillArray

Kode Program fillArray
Kode Program getValue

Data fungsi DisplayArray

Membuat Membuat
Membuat
Kode Program DisplayArray Fungsi Fungsi
Fungsi General
DisplayArray getValue

Data fungsi getValue

Data Fungsi General
Kode Program General

Membuat Membuat Membuat Ubah Kode

Data Pertanyaan Pertanyaan Jawaban benar Jawaban salah Program
Kode Program
Pertanyaan

Kode Program Jawaban benar

Data Jawaban benar
Data Jawaban salah
Kode Program Jawaban salah
Kode Update
Kode Ubah

Gambar 3. Diagram Alir Data

Volume V/ No. 2/Nov/2013 83

JURNAL ILMIAH FIFO
Pemodelan Diagram Alir
Untuk cara kerja dari aplikasi secara keseluruhan
digambarkan pada gambar 4 sampai 7. Berikut
penjelasan singkat dari sistem kerja aplikasi secara
keseluruhan.
1. Mulai, aplikasi mulai dijalankan
2. Tampilkan Menu, Aplikasi menampilkan
berbagai menu.
3. Membuat Variabel, aplikasi memberikan menu
untuk menambah variabel.
4. Klik tombol Variabel, jika ingin membuat
variabel diharuskan memilih tombol variabel.
5. For i=1 to jmlvar+1, aplikasi mulai memproses
array berdasarkan jumlah variabel yang
didefinisikan pada kode program aplikasi yaitu 0,
selanjutnya ditambah dengan 1. Pengulangan
yang terjadi berdasarkan jumlah tombol variabel
di klik.
6. Load var(i), aplikasi membuat objek variabel
berdasarkan array i .
7. Menampilkan var(i), aplikasi menampilkan objek
variabel.
8. Hapus Variabel, jika tidak ingin menggunakan
variabel maka pilihan berikutnya adalah harus n
variabel. Menu ini digunakan untuk membantu
user dalam mengatur beberapa variabel yang
telah dibuatnya.
9. Pilih Variabel, untuk menjalankan proses hapus,
user harus memilih variabel yang akan dihapus.
10. Klik Hapus, untuk memulai hapus varibel.
11. unLoad var(i), aplikasi menghapus variabel
berdasarkan perintah tombol hapus dan i sebagai
pilihan variabel yang akan dihapus. Objek
variabel tersebut akan unload pada tampilan
aplikasi.
12. andomChar, menu fungsi membuat randomChar.
13. Klik Tombol Fungsi RandomChar, untuk mulai
membuat fungsi randomchar.
14. Menampilkan Jendela Fungsi RandomChar,
jendela fungsi randomchar akan muncul.
15. Panggil Fungsi RandomChar, aplikasi akan
memanggil fungsi randomchar.
16. RandomNumber, Menu fungsi membuat
randomnumber.
17. Klik Tombol Fungsi RandomNumber, untuk
mulai membuat fungsi randomnumber.
18. Menampilkan Jendela Fungsi RandomNumber,
jendela fungsi randomnumber akan muncul.
19. Panggil Fungsi RandomNumber, aplikasi akan
memanggil fungsi randomnumber.
20. CreateArray, Menu fungsi membuat array.
21. Klik Tombol Fungsi CreateArray, untuk
memulai membuat fungsi createarray.
22. Menampilkan Jendela Fungsi CreateArray,
jendela fungsi createarray akan muncul.
23. Panggil Fungsi CreateArray, aplikasi akan
memanggil fungsi createarray.
24. PutValue, Menu fungsi membuat putvalue.
25. Klik Tombol Fungsi PutValue, untuk memulai
membuat fungsi putvalue.
Afrizal Putrawan, Anis Cherid
ISSN 2085 4315
26. Menampilkan Jendela Fungsi PutValue, jendela
fungsi putvalue akan muncul.
27. Panggil Fungsi PutValue, aplikasi akan
memanggil fungsi putValue.
28. CopyArray, Menu fungsi membuat copyarray.
29. Klik Tombol Fungsi CopyArray, untuk memulai
membuat fungsi copyarray.
30. Menampilkan Jendela Fungsi CopyArray,
jendela fungsi copyarray akan muncul.
31. Panggil Fungsi CopyArrray, aplikasi akan
memanggil fungsi copyarray.
32. FillArray, Menu fungsi membuat fillarray.
33. Klik Tombol Fungsi FillArray, untuk memulai
membuat fungsi fillarray.
34. Menampilkan Jendela Fungsi FillArray, jendela
fungsi fillarray akan muncul.
35. Panggil Fungsi FillArray, aplikasi akan
memanggil fungsi fillarray.
36. DisplayArray, Menu fungsi membuat
displayarray.
37. Klik Tombol Fungsi DisplayArray, untuk
memulai membuat fungsi displayarray.
38. Menampilkan Jendela Fungsi DisplayArray,
jendela fungsi displayarray akan muncul.
39. Panggil Fungsi DisplayArrray, aplikasi akan
memanggil fungsi displayarray.
40. GetValue, Menu fungsi membuat getvalue.
41. Klik Tombol Fungsi GetValue, untuk memulai
membuat fungsi getvalue.
42. Menampilkan Jendela Fungsi GetValue, jendela
fungsi getvalue akan muncul.
43. Panggil Fungsi GetValue, aplikasi akan
memanggil fungsi getvalue.
44. General, Menu fungsi membuat general.
45. Klik Tombol Fungsi General, untuk memulai
membuat fungsi general.
46. Menampilkan Jendela Fungsi General, jendela
fungsi general akan muncul.
47. Panggil Fungsi General, aplikasi akan
memanggil fungsi general.
48. Pertanyaan, Menu fungsi membuat pertanyaan.
49. Klik Tombol Pertanyaan, untuk memulai
membuat pertanyaan.
50. Menampilkan Jendela Pertanyaan, jendela
pertanyaan akan muncul.
51. Panggil Fungsi Membuat Pertanyaan, aplikasi
akan memanggil fungsi membuat pertanyaan.
52. Jawaban, Menu fungsi membuat jawaban.
53. Klik Tombol Jawaban, untuk memulai membuat
jawaban.
54. Menampilkan Jendela Membuat Jawaban,
jendela jawaban akan muncul.
55. Panggil Fungsi Membuat Jawaban, aplikasi akan
memanggil fungsi membuat jawaban.
56. Hapus Kode Program, menu hapus kode
program.
57. Pilih Baris Program, kemudian, memilih baris
program yang akan dihapus.
58. Klik Tombol Hapus Kode Program, untuk mulai
menghapus kode program yang sudah dipilih
sebelumnya.
84
JURNAL ILMIAH FIFO ISSN 2085 4315

59. Hapus Baris Program k, aplikasi memanggil 72. Tambah Item Tambah, aplikasi memanggil
fungsi hapus baris program. fungsi tambah untuk menambahkan kode
60. Menampilkan Perubahan, aplikasi akan program.
menampilkan kode program terbaru setelah 73. Select Kode, pilihan menu terakhir dari jendela
menjalankan proses hapus kode program. ubah kode program yaitu replace kode program.
61. Ubah Kode Program, menu ubah kode program. Untuk memulainya adalah dengan select kode.
62. Double Klik Baris Program, untuk mulai 74. Cek Aturan, aplikasi memanggil fungsi cek
mengubah kode program. aturan text atau variabel yang akan di-replace.
63. Menampilkan Jendela Ubah Kode Program, 75. Valid, fungsi cek aturan akan memeriksa apakah
aplikasi akan menampilkan jendela ubah kode text atau variabel benar atau tidak.
program berdasarkan baris program yang dipilih. 76. Pesan Error, aplikasi akan menampilkan pesan
64. Add Text, menu pilihan menambah text pada error ketika text atau variabel yang disisipkan
kode program. tidak valid.
65. Pilih Kursor Text, user memilih penempatan 77. Jendela Replace, aplikasi akan menampilkan
kursor untuk meletakkan text atau variabel akan jendela replace yang berisi variabel dan textbox
ditambahkan. yang dapat diisi dengan text.
66. Cek Aturan, aplikasi memanggil fungsi cek 78. Pilih Item Add, memilih item apa yang akan
aturan text atau variabel yang akan ditambahkan. ditambahkan pada kode program.
67. Valid, fungsi cek aturan akan memeriksa apakah 79. Menerima Item Replace, aplikasi menerima item
text atau variabel benar atau tidak. yang dipilih untuk replace kode program.
68. Pesan Error, aplikasi akan menampilkan pesan 80. Replace Kode Program, aplikasi memanggil
error ketika text atau variabel yang dimasukan fungsi merubah kode program.
tidak valid. 81. Klik Tombol Copy, menu terakhir dari aplikasi
69. Jendela Add, aplikasi akan menampilkan jendela yaitu meng-copy kode program yang dihasilkan
add yang berisi variabel dan textbox yang dapat pada clipboard.
diisi dengan text. 82. Menampilkan Jendela Kode Program Copy,
70. Pilih Item Add, memilih item apa yang akan aplikasi akan menampilkan form yang berisi
ditambahkan pada kode program. kode program yang dapat di-copy ke clipboard.
71. Menerima Item Tambah, aplikasi menerima item 83. Selesai, aplikasi selesai dijalankan.
yang telah dipilih untuk ditambahkan.

Proses akhir dari rangkaian diagram alir.

User Sistem

User Sistem
Mulai
B A
B
D
Tampilkan
Menu
PutValue
ya Menampilkan
Membuat Menerima Perintah Klik Tombol Fungsi Panggil Fungsi
ya Klik Tombol Variabel Jendela fungsi
variabel variabel, jmlvar=0 putValue putValue
tidak putValue

For i=1 to jmlvar+1

CopyArray
tidak ya Menampilkan
Klik Tombol Fungsi Panggil Fungsi
Jendela Fungsi
Pilih tidak copyArray copyArray
copyArray
variabel(i) Load var(i)
ya
FillArray
Hapus Variabel Menampilkan
ya Klik Tombol Fungsi Panggil Fungsi
Tampilkan Jendela Fungsi
Klik Hapus
fillArray fillArray
var(i) fillArray
tidak
tidak

DisplayArray
unLoad var(i)
RandomChar ya Menampilkan
Klik Tombol Fungsi Panggil Fungsi
Jendela fungsi
ya Klik Tombol Fungsi
displayArray displayArray
Menampilkan tidak displayArray
RandomChar Panggil Fungsi
tidak Jendela fungsi
RandomChar
RandomChar

Random GetValue
Number Menampilkan
ya Menampilkan ya Klik Tombol Fungsi Panggil Fungsi
Klik Tombol Fungsi Panggil Fungsi Jendela Fungsi
Jendela Fungsi getValue getValue
tidak RandomNumber RandomNumber tidak
RandomNumber getValue

CreateArray
General
ya Menampilkan
Klik Tombol Fungsi Panggil Fungsi Menampilkan
Jendela Fungsi ya Klik Tombol Fungsi Panggil Fungsi
CreateArray CreateArray Jendela Fungsi
tidak CreateArray
general general
general
A

Gambar 4. Pemodelan Diagram Alir

Gambar 5. Pemodelan Diagram Alir (lanjutan)

Volume V/ No. 2/Nov/2013 85

JURNAL ILMIAH FIFO ISSN 2085 4315

User Sistem User Sistem

C G
D E F

Pertanyaan Menerima item

Menampilkan tambah
ya Panggil Fungsi Select Kode
Klik Tombol Fungsi Jendela
Membuat
pertanyaan Membuat
tidak pertanyaan
pertanyaan
Tambah Kode
Program
Jawaban
Menampilkan
ya Klik Tombol Fungsi Jendela Panggil Fungsi
tidak Jawaban Membuat Membuat Jawaban Pesan
Cek Aturan
Jawaban error

Hapus Kode
Program Klik Tombol Hapus
ya Valid tidak
Kode Program
Menampilkan
Hapus baris
Perubahan Kode
program k
Program ya
tidak Pilih baris
program , k
Menampilikan
Pilih item replace
Jendela replace
Menampilkan
Ubah Kode Double klik baris Jendela Ubah G
ya tidak
Program program Kode program
Menerima item
replace
H
Add Text Pesan
error
tidak Cek Aturan Replace Kode
tidak
ya Program
Klik Tombol Copy
Kode Program
Pilih Kursor text
Valid tidak
H
E Menampilkan
ya Jendela Kode
Pilih item add Program copy
Jendela
add

F Selesai

Gambar 6. Pemodelan Diagram Alir (lanjutan) Gambar 7. Pemodelan Diagram Alir (lanjutan)

IMPLEMENTASI DAN PENGUJIAN penggunaanya agar pengguna yang menggunakan

aplikasi dapat berinteraksi dengan baik berdasarkan
Implementasi Antarmuka sistem yang dirancang. Berikut implementasi dari
antarmuka sistem yang telah dibangun.
Implementasi antarmuka penting untuk dirancang
karena harus dibuat menarik dan tidak sukar
Gambar 9. Tampilan Antarmuka Fungsi Random
Number

Gambar 8. Tampilan Antarmuka utama dengan Gambar 10. Tampilan Antarmuka Fungsi Create
Manajemen Variabel Array

Gambar 11. Tampilan Antarmuka Fungsi Put Value

Afrizal Putrawan, Anis Cherid 86

JURNAL ILMIAH FIFO ISSN 2085 4315

Gambar 16. Tampilan Antarmuka Fungsi General

Gambar 12. Tampilan Antarmuka Fungsi Copy

Array

Gambar 17. Tampilan Antarmuka Membuat

Pertanyaan
Gambar 13. Tampilan Antarmuka Fungsi
Display Array

Gambar 18. Tampilan Antarmuka Membuat Jawaban

Gambar 14. Tampilan Antarmuka Fungsi Get
Value

Gambar 15. Tampilan Antarmuka Fungsi Fill Array

Volume V/ No. 2/Nov/2013 87

JURNAL ILMIAH FIFO
Gambar 19. Tampilan Antarmuka Ubah Kode Program
Lingkungan Pengujian
Berikut spesifikasi kebutuhan sistem yang
merupakan komponen utama pengujian dalam
pengembangan membuat aplikasi, yang terdiri dari
perangkat keras dan perangkat lunak.
a. Perangkat Keras
Perangkat Keras merupakan komponen fisik dalam
rangkaian komputer, sedangkan spesifikasi minimal
perangkat keras yang digunakan adalah sebagai
berikut:
1. Processor Intel Pentium IV
2. Memori 1 Gb
3. Hardisk 40 Gb
4. Papan ketik (keyboard) dan tetikus (mouse)
b. Perangkat Lunak
Tanpa sebuah perangkat lunak (software),
perangkat keras bukanlah apa-apa, perangkat lunak
merupakan nyawa dari sebuah komputer. Perangkat
lunak memberikan sebuah fungsi serta menampilkan
seperti yang diinginkan. Berikut perangkat lunak yang
dibutuhkan dalam membangun aplikasi.
1. Windows Operating System
2. Visual Basic 6.0
Analisis Hasil Pengujian
Berdasarkan hasil pengujian di atas disimpulkan
bahwa pada setiap langkah aplikasi memandu user
membuat kode program, aplikasi mengendalikan
inputan user sesuai dengan aturan kode program pada
aplikasi penghasil kuis otomatis. Adapun
pengendalian tersebut dilakukan pada :
1. Membuat variabel
2. Membuat fungsi
3. Membuat pertanyaan
Afrizal Putrawan, Anis Cherid
ISSN 2085 4315
Gambar 20. Tampilan Antarmuka Hasil Kode
Program
4. Membuat jawaban
5. Ubah kode program
KESIMPULAN DAN SARAN
Ada beberapa kesimpulan yang bisa diambil oleh
penulis dalam Perancangan dan Implementasi
Komponen Antarmuka Pemograman Visual Sebagai
Pendukung Aplikasi Penghasil Kuis Otomatis yaitu:
1. Untuk menghasilkan kode program sesuai dengan
aturan, antarmuka berupa input-an user harus
dikendalikan secara ketat. Pengendalian tersebut
meliputi variabel, fungsi, pertanyaan dan jawaban.
Pengendalian ini secara tidak langsung memandu
user mengurangi kesalahan penulisan kode
program.
2. Untuk memudahkan pengendalian pada kode
program, antarmuka yang dibangun hanya
mengizinkan membuat satu fungsi pada setiap
baris kode program.
3. Berdasarkan hasil pengujian dan analisis, dapat
disimpulkan bahwa beberapa fitur aplikasi yang
telah berhasil dibuat adalah sebagai:
a. Pembuatan kode program aplikasi kuis
otomatis akan lebih mudah dilakukan karena
tersedianya aplikasi dengan antarmuka yang
memungkinkan dapat mengurangi kesalahan
dalam penulisan kode program.
b. Antarmuka penghasil kode program aplikasi
kuis otomatis menyediakan panduan mengenai
kode program yang benar.
c. Kode program yang dihasilkan dapat diubah
dan dikendalikan oleh aplikasi agar tetap
menghasilkan kode program sesuai dengan
aturan yang digunakan pada aplikasi penghasil
kuis otomatis .
88
JURNAL ILMIAH FIFO ISSN 2085 4315

d. Kode program yang dihasilkan dapat di copy

ke clipboard, sehingga akan mudah digunakan
pada aplikasi kuis otomatis.
e. Secara tidak langsung user akan mendapat
wawasan mengenai penulisan kode program
yang sesuai aturan pemograman aplikasi
penghasil kuis otomatis khususnya bagi user
yang baru mempelajari teknik pemograman.
Saran yang dapat diberikan penulis untuk aplikasi
ini adalah mensinkronisasi manajemen variabel
dengan hasil kode program agar pengendalian kode
program dapat terjaga khususnya ketika dilakukannya
penghapusan kode program.

DAFTAR PUSTAKA

[1] Al-Bahra Bin Ladjamudin. 2005. Analisis dan

Desain Sistem Informasi. Tangerang. Graha Ilmu.
[2] Anis Cherid. 2012. Pembuatan Prototipe Aplikasi
Penghasil Soal Kuis Otomatis: Studi Kasus
Kuliah Algoritma dan Struktur Data. Prosiding
Seminar Nasional Pengaplikasian Telematika.
Universitas Mercu Buana, 2012.
[3] Kenneth dan Julie. 2003. Analisis dan
Perancangan. Jakarta. Indeks.
[4] Melky Tulangow, Bobby. 2011. Sistem Ujian
Berbasis Web. Jurnal Teknologi dan Informatika
(Teknomatika). Vol. 1, No. 1.
[5] Naim Ngainum. 2011. Dasar-dasar Komunikasi
Pendidikan. Yogyakarta. Ar-Ruzz Media.
[6] P. Insap Santosa. 2004. Interaksi Manusia dan
Komputer. Yogyakarta. Andi.
[7] Pressman, R.S. 2002. Software Engineering. Andi
dan McGraw-Hill Book Company. Yogyakarta.
[8] Sulistyorini, Prastuti. 2009. Pemodelan Visual
dengan Menggunakan UML dan Rational Rose.
Jurnal Teknologi Informasi Dinamik. Vol. XIV,
No. 1.
[9] Teddy Marcus dan Agus. 2007. Perancangan
Antarmuka untuk Interaksi Manusia dan
Komputer. Bandung. Informatika Bandung.
[10] Triyulianti Agnes Heni. 2006. Panduan
Pemograman dan Referensi Kamus Visual Basic
6.0. Yogyakarta.
[11] United States Air Force Academy. 2009.
RAPTOR. Diakses pada tanggal 08/01/2013 dari
http://raptor.martincarlisle.com/
[12] Yusufhadi Miarso. 2004. Menyemai Teknologi
Pendidikan. Jakarta.Prenada Media.

Volume V/ No. 2/Nov/2013 89