DESAIN DAN IMPLEMENTASI WEB UNTUK SISTEM UJIAN
ONLINE MAHASISWA
(Studi Kasus Program Studi Teknik Telekomunikasi Jurusan
Teknik Elektro Politeknik Negeri Bandung)
Web Design and Implementation for Student Online Test System
(Study Case of Telecommunication Engineering Study Program Electronical
Engineering Major Politeknik Negeri Bandung)
Tugas Akhir untuk memenuhi sebagai persyaratan menyelesaikan pendidikan Diploma IV
Progam Diploma IV Teknik Telekomunikasi Wireless Jurusan Teknik Elektro
diajukan oleh: MOCHAMAD IKRAR FAHREZA 08334017
POLITEKNIK NEGERI BANDUNG 2012
DAFTAR RIWAYAT HIDUP
Nama
: MOCHAMAD IKRAR FAHREZA
NIM
: 08334017
Tempat/Tanggal lahir : Bandung/28 Oktober 1990
SD lulus tahun
: 2001/2002
di SDN Cibeureum 2, Sumedang
SLTP lulus tahun
: 2004/2005 di SMPN 2 Cimalaka, Sumedang
SLTA lulus tahun
: 2007/2008 di SMAN 1 Cimalaka, Sumedang
Prestasi yang pernah dicapai: 1. Koordinator
Lapangan
kaderisasi
Himpunan
Mahasiswa
Teknik
Telekomunikasi tahun 2009 2. Peserta Olimpiade Informatika SMA tingkat Kabupaten Sumedang tahun 2008 3. Peserta Olimpiade Matematika SMP tingkat Kabupaten Sumedang tahun 2005 4. Peserta Lomba Cepat Tepat Matematika tingkat Kabupatan Sumedang dan Bandung Timur tahun 2005 5. Juara 1 Lomba Baris Berbaris PASKIBRA SMP se Pulau Jawa dan Bali tahun 2004 6. Juara 3 Lomba Baris Berbaris dan Pengibaran Bendera PASKIBRA SMP tingkat Kabupaten Sumedang tahun 2004 7. Peserta Lomba Mengarang bebas (essay) SD tingkat Provinsi Jawa Barat tahun 2002
Hai orang-orang beriman apabila dikatakan kepadamu: "Berlapang-lapanglah majlis", maka lapangkanlah niscaya Allah akan memberi kelapangan dalam untukmu. Dan apabila dikatakan: "Berdirilah kamu", maka berdirilah, niscaya Allah akan meninggikan orang-orang yang beriman di antaramu dan orangorang yang diberi ilmu pengetahuan beberapa derajat. Dan Allah Maha Mengetahui apa yang kamu kerjakan. QS. Al-Mujaadilah: 11
Semua pencapaian ini untuk kalian yang kucintai . . .
Teruntuk ibu..ibu..dan ibu terima kasih aa ucapakan untuk semua yang
telah kau berikan kepada kami, anak-anakmu. Semoga Allah SWT selalu
memberikan kesehatan dan limpahan rezeki untukmu. Amin . . Meskipun hanya 17 tahun ayah berada di dunia ini sejak aa dilahirkan tetapi begitu banyak pelajaran yang ayah berikan. Semua kenangan bersama ayah akan tetap aa simpan selamanya. Terima kasih ayah, kau lelaki terhebat yang pernah aa temui. Semoga kau tenang di sisi-Nya. Hanya do’a yang bisa kami berikan. Salam rindu dari kami untukmu. Untuk kedua adikku Kania Noor Fazriani dan Ayumi Rahmah Fauziah. Aa harap pencapaian kalian nanti harus bisa lebih dari ini. Buatlah orangorang disekitar kita, keluarga, terutama ibu kita mengeluarkan air mata bahagia karena prestasi kita. Semua keluarga besar pak aki & mamah nini (alm), pak adi dan anggota keluarga besar lainnya saya ucapkan terima kasih. I love you all . . . Juga tentunya untuk semua NK 2008. Senang rasanya mengenal orangorang hebat seperti kalian. Memori kebersamaan kita selama 4 tahun ini akan tetap hidup. Sukses untuk kita semua. Salam titik dua bintang :*
KATA PENGANTAR
Puji dan syukur kehadirat Allah SWT, karena hanya dengan rahmat dan
karunia-Nya sehingga penulis dapat menyelesaikan Laporan Tugas Akhir ini tepat
pada waktunya. Penyusunan laporan Tugas Akhir ini dimaksudkan untuk
melengkapi salah satu syarat menyelesaikan pendidikan di program studi Teknik
Telekomunikasi Nirkabel, jurusan Teknik Elektro, Politeknik Negeri Bandung.
Penulis menyadari bahwa dalam penyusunan Laporan Tugas Akhir ini masih terdapat banyak kekurangan dalam penyajian dan pembahasan materi maupun susunan kalimatnya sebagai suatu bentuk laporan yang baik. Hal ini disebabkan
karena keterbatasan yang ada pada penulis. Pada kesempatan ini, penulis tidak
lupa mengucapkan terima kasih kepada Allah SWT dan pihak-pihak yang telah memberikan bantuan, bimbingan dan semua fasilitas serta pengarahan-pengarahan yang telah diberikan kepada penulis selama penulisan Laporan Tugas Akhir ini. Ucapan terima kasih penulis tujukan kepada: 1. Ibunda tercinta Susi Rosdiana beserta adinda Kania Noor Fazriani dan Ayumi Rahmah Fauziah yang telah memberi dukungan berupa materi, semangat, dan juga do’a yang tiada henti 2. Bapak Tata Supriyadi selaku dosen pembimbing I dan Bapak Eril Mozef Selaku dosen pembimbing II 3. Teman-teman seperjuangan Nirkabel 2008 yang telah berbagi suka dan duka 4. Seluruh keluarga besar penulis yang berada di Bandung maupun di Sumedang 5. Seluruh anggota HIMATEL 6. Pihak-pihak lain yang tidak dapat disebutkan satu persatu. Penulisan Laporan Proyek Akhir ini masih jauh dari sempurna, oleh sebab itu penulis mengharapkan kritik dan saran untuk menyempurnakan laporan ini dan semoga dapat bermanfaat bagi rekan-rekan dan pembaca. . Bandung, Juli 2012
Penulis
ABSTRAK
Perkembangan teknologi informasi dibarengi dengan makin meluasnya jaringan internet memudahkan kita untuk bisa akses ke internet. Kondisi ini bisa dimanfaatkan untuk memfasilitasi proses belajar mengajar. Salah satunya adalah ujian secara online. Pada tugas akhir ini, didesain dan diimplementasikan sebuah prototipe sistem ujian secara online yang diperuntukan dosen dan mahasiswa Program Studi Teknik Telekomunikasi Politeknik Negeri Bandung. Dalam sistem ini terdapat tiga buah user yaitu administrator, dosen, dan mahasiswa dengan hak akses berbeda untuk setiap user. Administrator diberi hak untuk mengelola data dosen, mahasiswa dan matakuliah. Dosen dapat memasukkan soal pilihan ganda, isian singkat serta menjodohkan yang ditampilkan secara acak. Mahasiswa dapat mengerjakan soal yang diberikan dosennya sekaligus bisa juga melihat hasilnya langsung setelah selesai mengerjakan ujian. Perancangan sistem menggunakan metode Unified Modelling Language (UML). Untuk implementasinya menggunakan bahasa pemrograman PHP dan Javascript. Dari pengujian secara online telah berhasil diujicoba beberapa contoh soal dari beberapa matakuliah untuk ketiga jenis soal tersebut. Kata Kunci: ujian online, pilihan ganda, essay, menjodohkan, soal acak
ABSTRACT The development of information technology and the vast internet network made internet access easier for us. This condition can be used to faclitate learning procces. Online exam is one of them. In this final project, an prototype of exam system was designed and implemented where can be accessed online by lecturer and student majoring in telecommunication engineering of Politeknik Negeri Bandung. This system contain three users which is administrator, lecturer, and student each with different access for every user. Administrator is given the right to add, change, or delete students and lecturers data, and subject. Lecturer can entering multiple choice, essay, match question with random order for every exam participant. Student can answer the question given by the lecturer, the student also capable to know their score after finishing the exam. The design of the system using Unified Modelling Language (UML) method. PHP and Javascript programming language is used in the implemetation. The three kind of questions from several lecture has been succesfully tested in online testing. Keyword: online exam, multiple choice, essay, matching question, random quetions
DAFTAR ISI
ABSTRAK .......................................................................................................... vii DAFTAR GAMBAR .......................................................................................... x DAFTAR TABEL ............................................................................................... xiv
BAB I ..................................................................................................................1 PENDAHULUAN...............................................................................................1 1.1 Latar Belakang Masalah ........................................................................1 1.2 Perumusan Masalah ..............................................................................1 1.3 Pemecahan Masalah ..............................................................................2
1.4 Tujuan Tugas Akhir ..............................................................................2 1.5 Metodologi ............................................................................................2 1.6 Batasan Masalah....................................................................................3 1.7 Manfaat yang Diharapkan .....................................................................3 BAB 2 .................................................................................................................4 LANDASAN TEORI ..........................................................................................4 2.1 Tinjauan Pustaka ....................................................................................4 2.2 Arsitektur Aplikasi Berbasis Web ..........................................................5 2.3 Tinjauan Software yang Digunakan .......................................................7 2.3.1 PHP ...............................................................................................7 2.3.2 MySQL..........................................................................................10 BAB 3 .................................................................................................................14 ANALISA DAN PERANCANGAN SISTEM ...................................................14 3.1 Analisa Kebutuhan Sistem .....................................................................14 3.1.1 Analisa Bisnis ................................................................................14 3.1.2 Analisa Pengguna ...........................................................................15 3.1.3 Analisa Fungsi ................................................................................16 3.1.4 Analisa Basis Data .........................................................................17 3.1.5 Analisa Antarmuka ........................................................................17 3.1.6 Analisa Pengkodean .......................................................................18 3.2 Perancangan Sistem ...............................................................................20 3.2.1 Lingkup Batasan Perancangan .......................................................20
3.2.2 Perancangan ERD (Entity Relation Diagram) ..............................20
3.2.3 Perancangan UML (Unified Modelling Language) ......................21 3.2.4 Perancangan Database ...................................................................31
3.2.5 Perancangan Antarmuka ...............................................................33
BAB 4 .................................................................................................................39
IMPLEMENTASI DAN PENGUJIAN SISTEM ...............................................39 4.1 Lingkungan Implementasi Sistem ..........................................................39
4.1.1 Spesifikasi Perangkat Keras ..........................................................39
4.1.2 Spesifikasi Perangkat Lunak .........................................................39
4.2 Implementasi Graphical User Interface (GUI) .......................................40
4.2.1 Antarmuka Laman Utama (Beranda) ............................................40 4.2.2 Antarmuka Pengguna ....................................................................40 4.3 Pengujian Sistem ....................................................................................57 4.3.1 Pengujian Soal Pilihan Ganda .......................................................57 4.3.2 Pengujian Soal Isian Singkat .........................................................59 4.3.3 Penguijan Soal Menjodohkan .......................................................62 4.4 Pembahasan Hasil Pengujian .................................................................64 BAB 5 .................................................................................................................65 PENUTUP ...........................................................................................................65 5.1 Kesimpulan ............................................................................................65 5.2 Saran .......................................................................................................65 DAFTAR PUSTAKA .........................................................................................66 DAFTAR ISTILAH
DAFTAR GAMBAR
Gambar 1. 1 Langkah-Langkah Pengerjaan Sistem ............................................3 Gambar 2. 1 Topologi star pada jaringan LAN [1] .............................................4 Gambar 2. 2 Prosedur Transfer Script pada Aplikasi Web [6] ...........................7
Gambar 3. 1 ERD Aplikasi Ujian Online Teknik Telekomunikasi POLBAN ...21 Gambar 3. 2 Use Case Diagram Administrator ..................................................22 Gambar 3. 3 Use Case Diagram Dosen ...............................................................23 Gambar 3. 4 Use Case Diagram mahasiswa .......................................................23
Gambar 3. 5 Class Diagram Menu Administrator ..............................................24
Gambar 3. 7 Sequence Diagram memasukkan data dosen .................................25 Gambar 3. 8 Sequence Diagram mengubah/menghapus data dosen...................26 Gambar 3. 9 Sequence Diagram menampilkan daftar dosen ..............................26 Gambar 3. 10 Sequence Diagram memasukkan data mahasiswa .......................26 Gambar 3. 11 Sequence Diagram mengubah/menghapus data mahasiswa ........27 Gambar 3. 12 Sequence Diagram menampilkan daftar mahasiswa ....................27 Gambar 3. 13 Sequence Diagram memasukkan data mata kuliah ......................27 Gambar 3. 14 Sequence Diagram mengubah/menghapus data mata kuliah .......28 Gambar 3. 15 Sequence Diagram menampilkan daftar mata kuliah ...................28 Gambar 3. 16 Sequence Diagram menampilkan daftar hasil ujian .....................28 Gambar 3. 17 Sequence Diagram memasukkan soal ..........................................29 Gambar 3. 18 Sequence Diagram mengubah/menghapus soal ...........................29 Gambar 3. 19 Sequence Diagram menampilkan soal .........................................29 Gambar 3. 20 Sequence Diagram menampilkan nilai ujian ................................30 Gambar 3. 21 Sequence Diagram ujian...............................................................30 Gambar 3. 22 Sequence Diagram melihat nilai hasil ujian .................................30 Gambar 3. 23 Rancangan antarmuka halaman menu administrator ...................33 Gambar 3. 24 Rancangan antarmuka halaman menu dosen ...............................34 Gambar 3. 25 Rancangan antarmuka halaman menu mahasiswa .......................34 Gambar 3. 26 Rancangan antarmuka untuk login pengguna ..............................34 Gambar 3. 27 Rancangan antarmuka form pengisian data dosen untuk administrator ...............................................................................35
Gambar 3. 28 Rancangan antarmuka form ubah data dosen untuk administrator
.....................................................................................................35
Gambar 3. 29 Rancangan antarmuka form hapus data dosen untuk administrator
.....................................................................................................35
Gambar 3. 30 Rancangan antarmuka form isian data mahasiswa untuk
administrator ................................................................................35 Gambar 3. 31 Rancangan antarmuka form ubah data mahasiswa untuk
administrator ................................................................................36 Gambar 3. 32 Rancangan antarmuka form hapus data mahasiswa untuk
administrator ................................................................................36
Gambar 3. 33 Rancangan antarmuka form isian data mata kuliah untuk administrator ................................................................................36 Gambar 3. 34 Rancangan antarmuka form ubah data mata kuliah untuk administrator ................................................................................37 Gambar 3. 35 Rancangan antarmuka form hapus data mata kuliah untuk administrator ................................................................................37 Gambar 3. 36 Rancangan antarmuka tampilan daftar dosen untuk administrator .....................................................................................................37 Gambar 3. 37 Rancangan antarmuka tampilan daftar mahasiswa untuk administrator ................................................................................37 Gambar 3. 38 Rancangan antarmuka tampilan daftar mata kuliah untuk administrator ................................................................................38 Gambar 3. 39 Rancangan antarmuka tampilan daftar nilai untuk dosen ............38 Gambar 3. 40 Rancangan antarmuka tampilan daftar nilai untuk mahasiswa ....38 Gambar 4. 1 Antarmuka Laman Menu Utama (Beranda) ...................................40 Gambar 4. 2 Antarmuka Login Administrator ....................................................41 Gambar 4. 3 Antarmuka Menu Administrator ....................................................41 Gambar 4. 4 Antarmuka Form Pengisian Mahasiswa .........................................42 Gambar 4. 5 Antarmuka Ubah/Hapus Mahasiswa ..............................................42 Gambar 4. 6 Antarmuka Tampil Daftar Mahasiswa ...........................................43 Gambar 4. 7 Antarmuka Form Pengisian Dosen ................................................43 Gambar 4. 8 Antarmuka Ubah/Hapus Dosen ......................................................44
Gambar 4. 9 Antarmuka Tampil Daftar Dosen ...................................................44
Gambar 4. 10 Antarmuka Form Pengisian Mata Kuliah.....................................45
Gambar 4. 11 Antarmuka Ubah/Hapus Mata Kuliah ..........................................45 Gambar 4. 12 Antarmuka Tampil Daftar Mata Kuliah .......................................46 Gambar 4. 13 Antarmuka Form Pengisian Data Soal .........................................46
Gambar 4. 14 Form Ubah/Hapus Data Soal........................................................47 Gambar 4. 15 Antarmuka Daftar Data Soal ........................................................47 Gambar 4. 16 Antarmuka Login Dosen ..............................................................48 Gambar 4. 17 Antarmuka Menu Dosen ..............................................................48
Gambar 4.18 Antarmuka Form Pengisian Jumlah Soal ......................................49
Gambar 4. 19 Antarmuka Form Pengisian Soal Pilihan Ganda ..........................49 Gambar 4. 20 Antarmuka Form Pengisian Soal Uraian Singkat ........................49 Gambar 4. 21 Antarmuka Form Pengisian Soal Menjodohkan ..........................50 Gambar 4. 22 Antarmuka Ubah/Hapus Soal .......................................................50 Gambar 4. 23 Tampil Soal Pilihan Ganda Untuk Dosen ....................................51 Gambar 4. 24 Tampil Soal Isian Singkat Untuk Dosen ......................................51 Gambar 4. 25 Tampil Soal Menjodohkan Untuk Dosen .....................................52 Gambar 4. 26 Antarmuka Tampil Nilai Mahasiswa Untuk Dosen .....................52 Gambar 4. 28 Antarmuka Lihat/Hapus File ........................................................53 Gambar 4. 27 Antarmuka Unggah File ...............................................................53 Gambar 4. 29 Antarmuka Login Mahasiswa ......................................................54 Gambar 4. 30 Antarmuka Menu Mahasiswa.......................................................54 Gambar 4. 31 Antarmuka Form Pengerjaan Soal Pilihan Ganda Untuk Mahasiswa ...................................................................................55 Gambar 4. 32 Antarmuka Form Pengerjaan Soal Isian Singkat Untuk Mahasiswa ...................................................................................55 Gambar 4. 33 Antarmuka Form Pengisian Soal Menjodohkan Untuk Mahasiswa ...................................................................................56 Gambar 4. 34 Antarmuka Melihat Nilai Untuk Mahasiswa ...............................56 Gambar 4. 35 Antarmuka Mengunduh File Untuk Mahasiswa ..........................56 Gambar 4. 36 Soal nomor 1 untuk peserta pertama ............................................58 Gambar 4. 37 Soal nomor 1 untuk peserta kedua ...............................................58
Gambar 4. 38 Soal nomor 1 untuk peserta ketiga ...............................................59
Gambar 4. 39 Semua jawaban benar pada soal uraian singkat ...........................60
Gambar 4. 40 Hasil jika semua jawaban benar pada soal uraian singkat ...........61 Gambar 4. 41 Kesalahan penulisan pada soal uraian singkat .............................61 Gambar 4. 42 Hasil jika terdapat satu kesalahan pengetikan ..............................62
Gambar 4. 43 Semua soal dijawab dengan benar ...............................................62 Gambar 4. 44 Hasil jika semua soal dijawab dengan benar ................................63 Gambar 4. 45 Memasukkan jawaban yang salah pada soal menjodohkan .........63 Gambar 4. 46 Hasil jika terdapat satu jawaban yang salah pada soal
menjodohkan ..............................................................................64
DAFTAR TABEL
Tabel 3. 1 Analisa Pengkodean ID Dosen ............................................................ 18 3. 2 Analisa Pengkodean ID Mahasiswa ..................................................... 19 Tabel 3. 3 Analisa Pengkodean ID Soal................................................................ 19 Tabel
Tabel 3. 4 Analisa pengkodean ID Administrator ................................................ 20
Tabel 3. 5 Struktur Tabel daftar_admin ............................................................... 31 3. 6 Struktur Tabel daftar_dosen ................................................................. 31 Tabel Tabel 3. 7 Struktur Tabel daftar_mahasiswa......................................................... 31
Tabel 3. 8 Struktur Tabel daftar_mata_kuliah ...................................................... 32 Tabel 3. 9 Struktur Tabel daftar_data_soal ........................................................... 32 Tabel 3. 10 Struktur Tabel hasil_ujian .................................................................. 32
DAFTAR PUSTAKA
[1] Chandra, Ivanho. 2011. Desain dan Implementasi Sistem Pra-Ujian Berbasis Komputer Pada Jaringan LAN Jurusan Teknik Elektro Polbam. Bandung
[2] Kadir, Abdul. 2008. Dasar Pemrograman Web Dinamis Mengguanakan PHP. Yogyakarta: Andi [3] Andriana, Dian, (2010), Sistem manajemen basis data relasional, (Mar 2012).http://id.wikipedia.org/wiki/Sistem_manajemen_basis_data_relasional. [4] Nugroho, Bunafit, (2004), Aplikasi Pemograman Web Dinamis dengan PHP dan MYSQL , Gava Media,Yogyakarta
[5] Bunafit KomputerTRIK PEMROGRAMAN PHP: Script PHP untuk Membuat Soal Ujian Pilihan GandaTampil Acak. Available: http://www.scribd.com/35824032[14 Juni 2012] [6] Materi PHP.http://pusdatin.deptan.go.id/admin /Materi%20PHP.pdf (April 2012) [7]
/RB
/Programming
Konsep Pemrograman Internet. http://wa2n.staff.uns.ac.id/files/2009/02/01konseppemrogramaninternet.pdf( April 2012)
DAFTAR ISTILAH
HTML
PHP
: Personal Home Page adalah bahasa pemograman berbasis web
FI
: Form Interpreted adalah nama PHP pada awal diremukan
SQL
: Structured Query Language. adalah sebuah konsep pengoperasian
basisdata, terutama untuk pemilihan atau seleksi dan pemasukan data, yang memungkinkan pengoperasian data dikerjakan dengan mudah secara otomatis
RDBMS
: Relational Data Base Management System
GPL
: General Public License
ERD
: Entity Relational Diagram.
UML
hanya dimengerti oleh web browser
yang memiliki kemampuan untuk memproses data dinamis
: Hypertext Markup Language adalah bahasa atau script yang
: Unified Modelling Language
