Post on 17-Apr-2018
APLIKASI UJIAN
MATA PELAJARAN TEKNOLOGI INFORMASI DAN KOMUNIKASI
BERBASIS MULTIMEDIA
(Studi Kasus di SMA Al-Azhar BSD Serpong)
Skripsi
Sebagai Salah Satu Syarat Untuk Memperoleh Gelar
Sarjana Komputer
Fakultas sains dan teknologi
Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh :
GUNAWAN
106091002859
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS ISLAM NEGERI
SYARIF HIDAYATULLAH
JAKARTA
2011 M / 1432 H
APLIKASI UJIAN
MATA PELAJARAN TEKNOLOGI INFORMASI DAN KOMUNIKASI
BERBASIS MULTIMEDIA
(Studi Kasus di SMA Al-Azhar BSD Serpong)
Skripsi
Sebagai Salah Satu Syarat Untuk Memperoleh Gelar Sarjana Komputer
Fakultas sains dan teknologi
Universitas Islam Negeri Syarif Hidayatullah Jakarta
Oleh :
Gunawan
106091002859
Menyetujui,
Pembimbing I Pembimbing II
Viva Arifin, MMSI Yusuf Durrachman M.Sc, MIT
NIP. 19730810 200604 2 001 NIP. 19710522 200604 1 002
Mengetahui,
Ketua Program Studi Teknik Informatika
Yusuf Durrachman M.Sc, MIT
NIP. 19710522 200604 1 002
PENGESAHAN UJIAN
Skripsi yang berjudul “Aplikasi Ujian Mata Pelajaran Teknologi Informasi
dan Komunikasi Berbasis Multimedia (Studi Kasus Di SMA Al-Azhar BSD)”
yang ditulis oleh Gunawan 106091002859, telah diuji dan dinyatakan lulus
dalam Sidang Munaqosah Fakultas Sains dan Teknologi Universitas Islam Negeri
Syarif Hidayatullah Jakarta, pada hari kamis tanggal 24 November 2011. Skripsi
ini telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana
Komputer pada Program Teknik Informatika.
Jakarta, 24 November 2011
Tim Penguji,
Tim Pembimbing,
Mengetahui,
Penguji II
Ria Hari Gusmita, M.Kom
NIP. 19820817 200912 2 002
Penguji I
Arini, M.T
NIP. 19760131 200901 2 001
Pembimbing I
Viva Arifin, MMSI
NIP. 19730810 200604 2 001
Pembimbing II
Yusuf Durrachman M.Sc, MIT
NIP. 19710522 200604 1 002
Dekan
Fakultas Sains Dan Teknologi
DR. Syopiansyah Jaya Putra, M.Sis
NIP. 19680117 200112 1 001
Ketua Program Studi
Teknik Informatika
Yusuf Durrachman M.Sc, MIT
NIP. 19710522 200604 1 002
PERNYATAAN
DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI BENAR-
BENAR HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN
SEBAGAI SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI
ATAU LEMBAGA MANAPUN.
Jakarta, 24 November 2011
Gunawan
106091002859
ABSTRAK
Gunawan (106091002859), Aplikasi Ujian Mata Pelajaran Teknologi Informasi
Dan Komunikasi Berbasis Multimedia (Studi Kasus di SMA Al-Azhar BSD),
Dibimbing Oleh Viva Arifin, MMSI dan Yusuf Durrachman, M.Sc, MIT
Ujian adalah salah satu bentuk evaluasi belajar yang wajib dilaksanakan untuk
mengukur kemampuan siswa, baik untuk jenjang SD, SMP, SMA, maupun
Mahasiswa. SMA Al-Azhar dalam melaksanakan ujian menggunakan Kertas dan
Ballpoint. Hal ini berdampak tingginya biaya dan waktu dalam pembuatan soal
dan pemberian nilai, tingkat kejenuhan siswa, serta tingkat kecurangan siswa. Dari
hasil penyebaran kuesioner sebanyak 136 orang yang dilakukan di SMA Al-
Azhar, 62% menyatakan nilai ujian keluar beberapa hari dan 31% menyatakan
nilai ujian keluar beberapa minggu. Maka untuk mengetahui hasil ujian tersebut
93% siswa harus menunggu hasil ujian dalam jangka waktu yang relativ lama.
SMA Al-Azhar BSD ini sudah mempunyai Laboratorium Komputer yang telah
terhubung LAN(Local Are Networking). Namun pada pelaksanaan ujian, SMA Al-
Zahar tidak memanfaatkan failitas yang ada. Menurut hasil wawancara dengan
guru bidang TIK yaitu bapak Asep Kurniawan, S.Kom yang menyatakan bahwa
dengan perkembangan teknologi yang sangat maju seperti saat ini dan dengan
fasilitas komputer yang ada, sistem ujian dengan proses manual ini dianggap
belum maksimal. Oleh karena itu untuk meningkatkan kualitas dan mutu
pendidikan terutama mata pelajaran Teknolgi Informasi Dan Komunikasi, Sekolah
SMA Al-Azhar memiliki keinginan dan harapan untuk dapat mengatasi
permasalahan ujian. Dari permasalahan tersebut penulis mencoba untuk membuat
sebuah aplikasi ujian berbasis multimedia. Metode pengembangan sistem yang
dibuat pada aplikasi ini yaitu interactive Multimedia System and Design
Development (IMSDD). Dalam penggunaannya aplikasi ini menggunakan
jaringan lokal LAN yang sudah ada di SMA Al-Azhar BSD. Pada akhirnya
aplikasi ini dapat membantu SMA Al-Azhar dalam proses ujian mata pelajaran
Teknologi Informasi Dan Komunikasi.
Kata Kunci : Ujian, Teknologi Informasi Dan Komunikasi, Multimedia,
IMSDD, SMA Al-Azhar
KATA PENGANTAR
Alhamdulillah, puji dan syukur penulis panjatkan kehadirat Allah SWT
atas segala rahmat dan karunia-Nya. Shalawat dan salam selalu dilimpahkan
kepada Nabi Muhammad SAW, keluarga, sahabat-sahabatnya dan para
pengikutnya.
Skripsi ini dengan judul “APLIKASI UJIAN MATA PELAJARAN
TEKNOLOGI INFORMASI DAN KOMUNIKASI BERBASIS
MULTIMEDIA (Studi Kasus Di SMA Al-Azhar BSD)” sebagai salah satu
syarat yang harus ditempuh untuk mendapatkan gelar Sarjana Komputer pada
Program Studi Teknik Informatika Fakultas Sains dan Teknologi Universitas Islam
Negeri (UIN) Syarif Hidayatullah Jakarta.
Pada kesempatan yang berbahagia ini penulis ingin mengucapkan terima
kasih yang sebesar-besarnya kepada :
1. Dr. Syopiansyah Jaya Putra,M.Si, selaku Dekan Fakultas Sains dan
Teknologi, Universitas Islam Negeri Syarif Hidayatullah Jakarta.
2. Bapak Yusuf Durachman, M.Sc selaku Ketua Program Studi Teknik
Informatika sekaligus Dosen Pembimbing 2 yang telah memberikan suatu
bimbingan, komitmen, dorongan, dan program pendidikan sesuai
kebutuhan mahasiswanya.
3. Ibu Viva Arifin, MMSI selaku Sekretaris Program Studi Teknik
Informatika sekaligus Dosen Pembimbing 1 yang telah meluangkan
waktunya ditengah-tengah berbagai kesibukannya untuk membimbing
penulis dalam proses penyusunan skripsi.
4. Bapak Drs. H. Y Hermawan Mustafa selaku kabag SDM yang telah
memberikan Izin untuk melaksanakan Penelitian di Yayasan Muslim Al-
Azhar BSD.
5. Bapak Asep Kurniawan, S.Kom Selaku Guru Mata Pelajaran TIK yang
telah membantu dalam penelitian skripsi ini serta segenap dewan guru
SMA Al-Azhar yang tidak dapat disebutkan satu persatu.
6. Kawan-kawan tercinta KKN 15 yang selalu memberikan motivasi demi
terselesaikannya skripsi ini.
7. Kawan-kawan TI Multimedia dan Prodi TI-SI angkatan 2006, yang sama-
sama berjuang dalam masa perkuliahan ini.
8. Kawan-kawan Gerakan Mahasiswa Nasional Indonesia (GMNI) Banten
Bung Yusri, Bung Muhamad, Bung Kori, Bung Dziky, Bung Taufik, Bung
Husein Mubarok dan seluruh anggota GMNI Se-Banten yang selalu
mendorong jiwa dan ragaku untuk selalu berjuang-berfikir dan berfikir-
berjuang dalam penyelesaian skripsi ini. Semoga kalian menjadi Pejuang
pemikir – pemikir pejuang yang sejati.
9. Seluruh pihak yang telah membantu dan namanya tidak dapat disebutkan
satu persatu. Terima kasih atas dukungan dan motivasinya, Semoga Allah
SWT membalas segala kebaikan yang telah diberikan kepada penulis.
Penulis juga ingin menyampaikan permohonan maaf yang sebesar-
besarnya apabila selama ini ada hal-hal yang kurang berkenan baik dari kata
maupun perbuatan. Kritik dan saran yang sifatnya membangun akan penulis
terima guna meningkatkan penulisan yang akan datang.
Akhir kata, penulis berharap semoga skripsi ini dapat bermanfaat dalam
pengembangan Ilmu pengetahuan khususnya dalam bidang sains dan teknologi.
Amin.
Jakarta, 24 November 2011
Gunawan
LEMBAR PERSEMBAHAN
Skripsi ini terkhusus penulis persembahkan kepada mereka yang telah
mendukung, baik moril maupun materil, baik melalui doa ataupun semangat
dalam menyelesaikan skripsi ini. Saya persembahkan skripsi ini kepada :
1. Kedua Orang Tuaku, Ibunda Tercinta Hj. Komariah dan Ayahanda
Tercinta H.Abubakar yang senantiasa memberikan motivasi, dukungan
berupa moril dan materil. Semoga Allah senantiasa selalu memberikan
Rahmat, Rahim, Umur yang panjang dan rezeki yang berlimpah.
2. Kakanda Aang Kunaefi, dan isterinya Novitasari, Adinda Tercinta Abdul
Wadud dan Khoerunnisa yang selalu memberikan motivasi dan
mengingatkan penulis demi terselesaikannya skripsi ini.
3. Kawanku A.Zuhri Utama, Wahyu (Bewok) serta kawan-kawan KKN 15
dan TI Angkatan 2006. Terima kasih atas ilmu dan waktu luangnya yang
telah diberikan.
4. Kawan satu perjuangan satu ideologi Bung Tenjo, Bung Sutrisno, serta
seluruh pengurus DPC GMNI Tangsel, dan Seluruh Kader GMNI Tangsel.
Terima kasih atas motivasinya dan sukarelanya dalam penggunaan
sekretariat untuk penyelesaian skripsi.
5. Dan seluruh pihak yang telah membantu baik secara langsung maupun
tidak langsung.
DAFTAR ISI
Halaman
HALAMAN JUDUL ..................................................................................... i
PERSETUJUAN PEMBIMBING ............................................................... ii
HALAMAN PENGESAHAN ....................................................................... iii
HALAMAN PERNYATAAN ....................................................................... iv
ABSTRAK ..................................................................................................... v
KATA PENGANTAR ................................................................................... vi
LEMBAR PERSEMBAHAN ....................................................................... ix
DAFTAR ISI .................................................................................................. x
DAFTAR GAMBAR ..................................................................................... xvi
DAFTAR TABEL ......................................................................................... xxi
DAFTAR LAMPIRAN ................................................................................. xxii
BAB I PENDAHULUAN
1.1 Latar Belakang ......................................................................................... 1
1.2 Rumusan Masalah .................................................................................... 3
1.3 Batasan Masalah ....................................................................................... 3
1.4 Tujuan Dan Manfaat ................................................................................. 4
1.5 Metode Penelitian ..................................................................................... 6
1.5.1 Metode Pengumpulan Data ............................................................ 6
1.5.2 Metode Pengembangan .................................................................. 7
1.6 Sistematika Penulisan .............................................................................. 7
BAB II LANDASAN TEORI DAN GAMBARAN UMUM
2.1 Ujian Sekolah ........................................................................................... 9
2.2 Multimedia ............................................................................................... 9
2.2.1 Pengertian Multimedia ................................................................... 9
2.2.2 Pengertian Multimedia Interaktif .................................................... 10
2.2.3 Elemen Multimedia ......................................................................... 11
2.2.4 Storyboard ....................................................................................... 20
2.3 Interaksi Manusia Dan Komputer ............................................................ 20
2.3.1 Antarmuka Pemakai ........................................................................ 20
2.3.2 Tujuan Perancangan Antarmuka Pemakai ...................................... 23
2.3.3 Prinsip Perancangan Antarmuka Pemakai ...................................... 24
2.4 Pengertian IMSDD ................................................................................... 26
2.5 Model Perancangan Sistem ...................................................................... 30
2.5.1 State Transition Diagram (STD) ..................................................... 30
2.5.2 Flowchart ........................................................................................ 31
2.5.2 Data Flow Diagram (DFD) ............................................................ 34
2.6 Perangkat Lunak....................................................................................... 37
2.6.1 Adobe Photoshop CS3 .................................................................... 37
2.6.2 Macromedia Flash MX 2004 .......................................................... 38
2.6.2.1 Action Script Versi 2 .......................................................... 40
2.6.2.2 Flash Player ........................................................................ 41
2.6.3 XML ................................................................................................ 42
2.6.3.1 Syntax XML ....................................................................... 43
2.6.4 Apache ............................................................................................ 45
2.6.5 Xampp ............................................................................................. 47
2.6.6 PHP ................................................................................................. 48
2.6.7 CSS ................................................................................................. 49
2.6.8 MySQL ........................................................................................... 50
2.6.10 Cool Edit ....................................................................................... 51
2.6.10.1 Fasiltas Pada Cool Edit ................................................... 51
2.7 Studi Literatur .......................................................................................... 52
BAB III METODE PENELITIAN
3.1 Metode Pengumpulan Data ...................................................................... 61
3.1.1 Studi Pustaka .................................................................................. 61
3.1.2 Wawancara ..................................................................................... 62
3.1.3 Koesioner ....................................................................................... 62
3.1.4 Studi Literatur ................................................................................ 65
3.2 Metode Pengembangan Aplikasi Multimedia .......................................... 76
3.2.1 Kebutuhan Sistem (System Requirments) ...................................... 77
3.2.2 Pertimbangan Perancangan (Desain Consideration) ..................... 78
3.2.3 Implementasi (Implementation) ..................................................... 80
3.2.4 Evaluasi (Evaluation) ..................................................................... 80
3.3 Bahan Dan Peralatan ................................................................................ 81
3.3.1 Bahan ............................................................................................. 82
3.3.2 Peralatan ......................................................................................... 82
BAB IV HASIL DAN PEMBAHASAN
4.1 Profile Yayasan Muslim Al-Azhar BSD .................................................. 83
4.1.1 Sejarah Yayasan Muslim Al-Azhar BSD....................................... 83
4.1.2 Visi Dan Misi Yayasan Muslim Al-Azhar BSD ............................ 86
4.1.2.1 Visi Yayasan Muslim Al-Azhar BSD ............................... 86
4.1.2.2 Misi Yayasan Muslim Al-Azhar BSD ............................... 87
4.1.3 Struktur Organisasi ........................................................................ 87
4.2 Analisis Sistem ......................................................................................... 88
4.2.1 Analisis Sistem Berjalan ................................................................ 88
4.2.2 Analisis Permasalahan ................................................................... 89
4.2.3 Solusi Pemecahan Masalah ............................................................ 90
4.3 Kebutuhan Sistem .................................................................................... 93
4.3.1 Pendefenisikan Sistem ................................................................... 93
4.3.2 Kebutuhan Dan Profil Pengguna .................................................... 94
4.3.3 Pertimbangan Perangkat Keras Dan Perangkat Lunak .................. 95
4.3.4 Pertimbangan Pendistribusian Sistem (Delivery Consideration) ... 99
4.4 Perencanaan Perancangan ........................................................................ 100
4.4.1 Desain Metaphor ............................................................................ 100
4.4.2 Format Dan Tipe Informasi ............................................................ 100
4.4.3 Struktur Navigasi ........................................................................... 102
4.4.3.1 Struktur Navigasi Frontend............................................... 103
4.4.3.2 Struktur Navigasi Backend ................................................ 104
4.4.4 Masalah Integrasi dan Persiapan Media (Media Preparation
and Integration Issues) ..................................................................
105
4.4.5 Perancangan Flowchart ................................................................. 111
4.4.5.1 Flowchart Menu Frontend ............................................... 111
4.4.5.1 Flowchart Menu Backend ................................................. 115
4.4.6 Storyboard ...................................................................................... 122
4.4.6.1 Perancangan Layar Frontend ............................................ 122
4.4.6.1 Perancangan Layar Backend ............................................. 127
4.4.7 Perancangan STD (State Transition Diagram) .............................. 136
4.4.7.1 Perancangan STD Frontend .............................................. 136
4.4.7.2 Perancangan STD Backend ............................................... 137
4.4.8 Perancangan DFD .......................................................................... 138
4.4.8.1 DFD Level 0 ...................................................................... 138
4.4.8.2 DFD Level 1 ...................................................................... 138
4.4.9 Perancangan Database .................................................................... 139
4.4.9.1 Spesifikasi Database.......................................................... 139
4.5 Implementasi ............................................................................................. 141
4.5.1 Lingkungan Implementasi .............................................................. 141
4.5.2 Prototyping ..................................................................................... 143
4.5.2.1 Implementasi Media .......................................................... 144
4.5.2.2 Implementasi Sistem ......................................................... 151
4.5.3 Hasil Implementasi ........................................................................ 155
4.5.5.1 Hasil Implementasi Frontend ........................................... 155
4.5.5.2 Hasil Implementasi Backend ............................................ 160
4.5.4 Beta Testing ................................................................................... 171
4.6 Evaluasi ..................................................................................................... 174
BAB V KESIMPULAN DAN SARAN
5.1 Kesimpulan ............................................................................................... 178
5.2 Saran ......................................................................................................... 179
DAFTAR PUSTAKA
DAFTAR LAMPIRAN
DAFTAR GAMBAR
2.1 Contoh Electronic Text Yang Dibuat Pada Microsoft Word ................ 12
2.2 Contoh Hypertext Pada Facebook ( Printscreen facebook ) ................ 12
2.3 Gambar Format Vector ......................................................................... 13
2.4 Gambar Format Bitmap ........................................................................ 14
2.5 Contoh Snappy Video Napshot ............................................................. 14
2.6 Contoh Animasi Frame ........................................................................ 16
2.7 Informasi Linier .................................................................................... 19
2.8 Informasi Non-Linier ............................................................................ 19
2.9 Siklus Pengembangan Aplikasi Multimedia ........................................ 27
2.10 Gambar Sederhana STD ....................................................................... 31
2.11 Tampilan Area kerja Adobe Photoshop CS3 ........................................ 38
2.12 Ruang Kerja Macromedia Flash MX 2004 .......................................... 40
2.13 Syntax Dokumen XML ........................................................................ 43
2.14 Tampilan awal jendela XAMPP ........................................................... 47
4.1 Struktur Organisasi Yayasan Muslim Al-azhar ................................... 88
4.2 Flowchart sistem Berjalan ................................................................... 89
4.3 Flowchart aplikasi yang diusulkan ...................................................... 92
4.4 Struktur Navigasi Frontend.................................................................. 103
4.5 Struktur Navigasi Backend ................................................................... 104
4.6 Perancangan Flowchart Halaman Frontend User Home ..................... 111
4.7 Perancangan Flowchart Halaman Frontend User Ujian ...................... 112
4.8 Perancangan Flowchart Halaman Frontend User Bantuan ................. 113
4.9 Perancangan Flowchart Halaman Frontend User Profile ................... 114
4.10 Perancangan Flowchart Halaman Backend Admin Home................... 115
4.11 Perancangan Flowchart Halaman Backend Admin ............................ 117
4.12 Perancangan Flowchart Halaman Backend Admin Siswa ................... 118
4.13 Perancangan Flowchart Halaman Backend Admin Soal ..................... 119
4.14 Perancangan Flowchart Halaman Backend Admin Nilai .................... 120
4.15 Perancangan Flowchart Halaman Backend Admin Konfigurasi ......... 121
4.16 Halaman login User ............................................................................. 122
4.17 Halaman Home User ............................................................................ 123
4.18 Halaman Ujian User ............................................................................. 124
4.19 Halaman Bantuan User ........................................................................ 125
4.20 Halaman Profile User .......................................................................... 126
4.21 Halaman Login Admin ......................................................................... 127
4.22 Halaman Home Admin ......................................................................... 127
4.23 Halaman Admin Layar Tambah Data Admin ...................................... 128
4.24 Halaman Admin Layar Update Data Admin ....................................... 129
4.25 Halaman Siswa Admin ......................................................................... 129
4.26 Halaman Siswa layar tambah data siswa Admin ................................. 130
4.27 Halaman Admin Layar Update Data Siswa ......................................... 131
4.28 Halaman Soal ...................................................................................... 132
4.29 Halaman Soal layar tambah data soal ................................................. 133
4.30 Halaman Nilai Admin .......................................................................... 134
4.31 Halaman Nilai Layar Cetak Nilai ........................................................ 134
4.32 Halaman Konfigurasi ........................................................................... 135
4.33 Perancangan STD Halaman User ........................................................ 136
4.34 Perancangan STD Halaman Admin ...................................................... 137
4.35 DFD Level 0 Aplikasi Ujian Sekolah .................................................. 138
4.36 DFD Level 1 Aplikasi Ujian Sekolah .................................................. 138
4.37 Tools Filter Artistic Plastic Wrap ........................................................ 145
4.38 Logo Al-azhar ...................................................................................... 145
4.39 Mouse ................................................................................................... 146
4.40 Editing Audio Soundtrack .................................................................... 147
4.41 Dubbing Audio ..................................................................................... 147
4.42 Editing Video ....................................................................................... 148
4.43 Animasi spot movie clip....................................................................... 149
4.44 Animasi Frame Spot ............................................................................. 149
4.45 Animasi Frame teks ............................................................................. 150
4.46 Layer Animasi transisi ......................................................................... 150
4.47 Animasi transisi .................................................................................... 150
4.48 Background Frontend .......................................................................... 151
4.49 Interface Ujian ..................................................................................... 152
4.50 Alert nilai ujian ..................................................................................... 155
4.51 Halaman Home ..................................................................................... 155
4.52 Halaman Awal Ujian ............................................................................ 156
4.53 Halaman Ujian Tipe Soal Teks ............................................................ 157
4.54 Halaman Ujian Tipe Soal Audio .......................................................... 157
4.55 Halaman Ujian Tipe Soal Gambar ....................................................... 158
4.55 Halaman Ujian Tipe Soal Video .......................................................... 158
4.55 Halaman Informasi Hasil Ujian ........................................................... 159
4.58 Halaman Bantuan ................................................................................. 159
4.59 Halaman Profile ................................................................................... 160
4.60 Halaman login ...................................................................................... 161
4.61 Halaman Home admin .......................................................................... 161
4.62 Halaman Data admin ........................................................................... 162
4.63 Halaman Input data admin ................................................................... 162
4.64 Halaman Cari data admin .................................................................... 163
4.65 Halaman Edit data admin..................................................................... 163
4.66 Halaman Siswa ..................................................................................... 164
4.67 Halaman Input Siswa ........................................................................... 164
4.68 Halaman Edit Siswa ............................................................................. 165
4.69 Halaman Cetak Data Siswa .................................................................. 165
4.70 Halaman Soal ....................................................................................... 166
4.71 Halaman Input Soal .............................................................................. 167
4.72 Halaman Edit Soal................................................................................ 167
4.73 Halaman Nilai ...................................................................................... 168
4.74 Halaman Cetak Nilai ............................................................................ 169
4.75 Halaman Konfigurasi ........................................................................... 169
4.76 Halaman Kofigurasi soal ...................................................................... 170
4.77 Halaman Kofigurasi nilai ..................................................................... 170
4.78 Halaman Kofigurasi waktu .................................................................. 171
DAFTAR TABEL
2.1 Simbol Flowchart ..................................................................................... 32
2.2 Spesifikasi Macromedia Flash MX 2004 ................................................ 40
3.1 Krejcie - Morgan ..................................................................................... 63
4.1 Jumlah Siswa Kelas XI SMA .................................................................. 88
4.2 Format Dan Tipe Informasi ..................................................................... 101
4.3 Kontrol Navigasi ..................................................................................... 106
4.4 Button ...................................................................................................... 109
4.5 Tabel User ............................................................................................... 139
4.6 Tabel Soal................................................................................................ 140
4.7 Tabel Konfigurasi.................................................................................... 140
4.8 Tabel Nilai ............................................................................................... 141
4.9 Implementasi Image ................................................................................ 144
4.10 Implementasi Audio ................................................................................ 147
4.11 Implementasi Video ................................................................................ 148
4.12 Implementasi Animasi ............................................................................ 149
4.13 Pembuatan Aplikasi Frontend................................................................. 151
4.14 Beta Testing ............................................................................................ 172
DAFTAR LAMPIRAN
Surat Keterangan Dosen Pembimbing ............................................................. A-1
Surat Izin Penelitian ......................................................................................... B-1
Surat Keterangan Penelitian ............................................................................. C-1
Hasil Wawancara ............................................................................................. D-1
Hasil Koesioner ................................................................................................ E-1
Script ................................................................................................................ F-1
BAB I
PENDAHULUAN
1.1 Latar Belakang
Ujian adalah salah satu bentuk evaluasi belajar yang wajib
dilaksanakan untuk mengukur kemampuan siswa, baik untuk jenjang SD,
SMP, SMA, maupun Mahasiswa. Dalam menghadapi ujian, umumnya para
pesertasering merasa tegang karena harus menjawab pertanyaan diatas
kertas dengan menggunakan ballpoint atau pensil. Belum lagi kemungkinan
terjadinya kecurangan atau penipuan yang dilakukan oleh para peserta
dalam mengerjakan soal-soal seperti mencontek teman atau menggunakan
kertas catatan yang dibuat sekecil mungkin. Kemudian dari hasil penyebaran
kuesioner sebanyak 132 orang yang dilakukan di SMA Al-Azhar, 62%
menyatakan nilai ujian keluar beberapa hari dan 31% menyatakan nilai ujian
keluar beberapa minggu. Maka untuk mengetahui hasil ujian tersebut 93%
siswa harus menunggu hasil ujian dalam jangka waktu yang relativ lama.
Hal ini diketahui pula dari hasil wawancara dengan bapak Asep Kurniawan,
S.Kom guru TIK yang menyatakan proses pengoreksian ujian yang
dilakukan oleh dewan guru adalah proses manual.
SMA AL-Azhar BSD masih menerapkan ujian secara manual.
Apalagi SMA Al-Azhar BSD ini sudah mempunyai 2 Laboratorium
Komputer yang telah terhubung LAN(Local Are Networking). Menurut hasil
wawancara dengan guru bidang TIK yaitu bapak Asep Kurniawan, S.Kom
yang menyatakan bahwa dengan perkembangan teknologi yang sangat maju
seperti saat ini dan dengan fasilitas komputer yang ada, sistem ujian dengan
proses manual ini dianggap belum maksimal. Oleh karena itu untuk
meningkatkan kualitas dan mutu pendidikan terutama mata pelajaran
Teknolgi Informasi Dan Komunikasi, Sekolah SMA Al-Azhar memiliki
keinginan dan harapan untuk dapat mengatasi permasalahan ujian.
Dengan permasalahan diatas maka penulis mencoba untuk membuat
aplikasi ujian berbasis multimedia yang memiliki teknologi teks, suara,
gambar dan animasi. Maka siswa tidak lagi mempunyai rasa tegang dalam
mengahadapi ujian nanti, meminimalisir masalah kecurangan dalam
menjawab soal, Siswa tidak harus menunggu lama hasil ujiannya, dan
dewan guru pun tidak menyita waktu yang terlalu lama untuk mengoreksi
ujian.
Banyakguru, murid serta yang bertanya apakah Aplikasi Ujian
Sekolah berbasis multimedia dapat mendidik? Apakah Metode Ujian dapat
lebih efektif dengan menggunakan Aplikasi Ujian Sekolah Berbasis
Multimedia?
Pada penulisan skripsi ini penulis mencoba membangun sebuah
aplikasi dengan judul“Aplikasi Ujian Mata Pelajaran Teknologi
Informasi Dan Komunikasi Berbasis Multimedia (Studi Kasus Di SMA
AL-AZHAR BSD)”.
1.2 Rumusan Masalah
Berdasarkan latar belakang masalah di atas, masalah pokok yang akan
dibahas penulis adalah:
1. Bagaimana siswa dapat mengisi soal ujian dan dapat melihat
langsung nilai hasil ujian dengan aplikasi ujian berbasis
multimedia?
2. Bagaimana guru dapat melihat dan mencetak langsung nilai siswa
secara keseluruhan dengan aplikasi ujian berbasis multimedia yang
tersimpan dalam database?
3. Bagaimanaaplikasiinidapatmenampilkansoalberupateks, gambar,
audio dan video?
4. Bagaimana aplikasi ini dibuat menggunakan animasi frame2
dimensi dengan teknik motion tween dan movie clip.
1.3 Batasan Masalah
Dalam batasan masalah ini, penulis membatasi pembatasan hanya
pada :
1. Aplikasi ujian sekolah berbasis multimedia dimaksud disini adalah
sebuah aplikasi yang dikemas dalam bentuk file swf
2. Soal yang diuji dalam aplikasi ini hanya mata pelajaran TIK
(Teknologi Informasi dan Komunikasi) kelas 2 SMA Al-Azhar.
3. Soal yang diuji sebanyak 20 soal dengan durasi ujian selama 45
menit dan 5 point untuk setiap jawaban yang benar.
4. Dalam penggunaan aplikasi siswadan guru diberikan user name
dan password yang terhubung dalamdatabase.
5. Pembangunan Aplikasi ini menggunakan metode IMSDD sebagai
metode pengembangan multimedia. Dan tidak dilakukan
perbandingan antara metode ini dengan metode lainnya.
6. Dalam pembuatan aplikasinya penulis akan menggunakan
softwareMacromedia Flash MX 2004, Adobe Photoshop CS3,
Xampp, PHP, My SQL, Ulead Visual Studio, Cool Editdan
program/aplikasi pendukung seperti Xilisoft Video Converter
Ultimatedan Flash Player.
1.4 Tujuan Dan Manfaat
1.4.1 Tujuan
Tujuan yang ingin dicapai dari penulisan skripsi ini adalah:
1. Menghasilkan Aplikasi ujian berbasis multimedia
2. Menghasilkan Aplikasi ujian yang mempunyai database
nilai siswa
1.4.2 Manfaat
Bagi Penulis :
1. Mengetahui lebih mendalam tentang Animasi Frame 2
dimensi dengan teknik motion tween dan movie clip dalam
aplikasi flash.
2. Dapat menyumbangkan pengetahuan tentang pembuatan
aplikasidengan menggunakan Flash.
3. Sebagai syarat kelulusan menjadi Sarjana Komputer
Jurusan Teknik Informatika Fakultas Sains dan Teknologi.
4. Menerapkan ilmu yang diperoleh di bangku kuliah.
5. Dapat membandingkan teori-teori yang didapat pada
kenyataan sebenarnya.
6. Memperoleh sebuah aplikasi ujian sekolah yang berbasis
multimedia
Bagi Pengguna :
1. Meningkatkan kemampuan belajar mandiri dalam
menjawab soal
2. Mengurangi kejenuhan dan ketegangan dalam menghadapi
ujian
3. Efisiensi waktu dalam memberikan nilai
4. Meningkatkan kualitas pendidikan dalam menyesuaikan
perkembangan teknologi informasi.
5. Meningkatkan kemampuan menampilkan informasi dengan
perangkat teknologi informasi.
6. Untuk mengantisipasi adanya kesenjangan teknologi
komputer dalam masyarakat Indonesia.
Bagi Universitas :
1. Mengetahui seberapa jauh mahasiswa menguasai materi
yang diberikan khususnya pada mata kuliah Desain Grafis,
Desain Komunikasi Visual dan Multimedia.
2. Sebagai bahan acuan untuk angkatan-angkatan berikutnya.
1.5 Metode Penelitian
1.5.1 Metode pengumpulan data
Merupakan metode yang digunakan penulis dalam melakukan
analisis data dan menjadikannya informasi yang akan digunakan
untuk mengetahui permasalahan yang dihadapi.MetodePengumpulan
data initerdiridari :
1. Studi Pustaka
Merupakan pengumpulan bahan-bahan yang berkaitan dengan
judul skripsi melalui membaca buku-buku dariperpustakaan dan
mencari referensi artikel dari internet.
2. Wawancara
Merupakan pengumpulan data dan informasi dengan cara
wawancara atau berdiskusi dengan pengajar mata pelajaran
teknologi informasi dan komunikasi yang mengajar di Kelas 2
SMA Al-Azhar BSD.
3. Koesioner
Penulis akan membagikan kuesioner kepada siswa dan
guru/instansi pendidikan, untuk diambil hasil-hasil pendapatnya
sebagai bahan dalam analisis.
4. StudiLiteratur
Penulis mencari Skripsi/Jurnal/penelitian yang berkaitan dengan
judul skripsi, yang kemudian dijadikan bahan referensi juga
bahan pengembangan.
1.5.2 Metode Pengembangan
Peneliti menggunakan Interactive Multimedia System and
Design Development (Dastbaz, 2003) yang terdiri dari empat tahap
yaitu System Requirements, Design Considerations, Implementation
dan Evaluation. Ke empat tahap tersebut tersusun dalam sebuah
siklus.
1) KebutuhanSistem (System Requirements)
2) PerencanaanPerancangan (Design Consideration)
3) Implementasi (Implementation)
4) Evaluasi (Evaluation)
1.6 Sistematika Penulisan
Sistematika penulisan skripsi ini adalah sebagai berikut :
BAB I PENDAHULUAN
Pada bab inimenerangkan latar belakang pemilihan judul skripsi,
maksud dan tujuan penelitian, pembatasan masalah, metodologi
penelitian dan sistematika penulisan.
BAB II LANDASAN TEORI
Pada bab inimembahas teori tentangAplikasi, ujian, Multimedia,
Konsep Desain, dan software yang menjadi dasar dalam
pembuatan aplikasi ini. Juga menjabarkan hal-hal yang
berhubungan dengan sistem basis data yang mengelompokkan
atribut serta entitas dari sebuah aplikasi multimedia.
BAB III METODE PENELITIAN
Pada bab ini dibahas mengenai metode penelitian yang digunakan
dalam mengembangkan aplikasi multimedia berdasarkan metode
pengembangan aplikasi multimedia.
BAB IV ANALISA, PERANCANGAN DAN IMPLEMENTASI
Pada bab ini membahas mengenai hasil dari analisa, perancangan,
implementasi sesuai dengan metode yang dilakukan pada sistem
yang dibuat.
BAB V PENUTUP
Bab ini berisi kesimpulan dari hasil penelitian yang dilakukan, dan
juga berisi saran-saran perbaikan yang berhubungan dengan masalah
yang dibahas.
BAB II
LANDASAN TEORI
2.1 Ujian
Pada saat ini, penulis belum menemukan satu literatur pun yang
membahas dan mengkaji istilah ujian secara teoritis atau ilmiah. Sehingga
dalam penulisan ini penulis hanya dapat membahas tentang perkembangan
metode ujian sekolah.
Ujian merupakan salah satu cara yang lazim digunakan untuk
mengetahui tingkat kemampuan siswa. Akan tetapi sistem ujian yang
digunakan di dalam dunia pendidikan khususnya Pendidikan di Indonesia
masih dilakukan secara manual yakni siswa mengisi lembar jawaban
menggunakan alat tulis (Balpoin, pensil dan sebagainya).(sumber : http://pas-
web.com/layanan/jenis-paket-penawaran.html)
2.2 Multimedia
2.2.1 Pengertian Multimedia
Multimedia terdiri dari dua kata yaitu multi dan media. Multi
berarti banyak, sedangkan media berarti alat perantara untuk
menyampaikan sesuatu.
Suyanto dalam bukunya Multimedia Alat untuk Keunggulan
Bersaing, menyebutkan beberapa definisi multimedia yaitu
Multimedia adalah kombinasi dari paling sedikit dua media input atau
output dari data, media ini dapat audio (suara, musik), animasi, video,
teks, grafik dan gambar (Turban dkk,2002) atau Multimedia
merupakan alat yang dapat menciptakan presentasi yang dinamis dan
interaktif yang mengkombinasikan teks, grafik, animasi, audio dan
gambar video (Robin dan Linda,2001).
Definisi yang lain dari multimedia, yaitu dengan
menempatkannya dalam konteks, seperti yang dilakukan oleh
Hofstetter (2001), multimedia adalah pemanfaatan komputer untuk
membuat dan dan menggabungkan teks, grafik, audio, gambar
bergerak (video dan animasi) dengan menggabungkan links dan tools
yang memungkinkan pemakai melakukan navigasi, berinteraksi,
berkreasi dan berkomunikasi. (Suyanto,2003)
Pengkombinasian yang tepat dari elemen-elemen media yang
terdiri dari unsur gambar, animasi, suara, video serta informasi
menjadi sebuah proyek multimedia akan mampu menjadi sarana
penyampaian dan penyebaran informasi yang sangat efektif, karena
mampu menarik lebih banyak perhatian dari para penggunanya.
2.2.2 Pengertian Multimedia Interaktif
Satu hal berikutnya yang akan menambah daya tarik multimedia
adalah unsur interaktifitas. Multimedia yang mengandung
interaktifitas biasa disebut sebagai multimedia interaktif.
Pengembangan definisi dari multimedia yang muncul berikutnya
adalah multimedia interaktif, yang berarti bahwa pengguna aplikasi
multimedia tersebut dapat mengontrol apa saja elemen-elemen yang
ingin disajikan, serta kapan elemen-elemen tersebut akan disajikan.
(Vaughan,2004)
2.2.3 Elemen Multimedia
Menurut Suyanto, untuk membuat aplikasi multimedia diperlukan
penggabungkan dari beberapa elemen, yaitu :
1. Teks
Teks adalah elemen dasar yang paling sederhana dalam
penyampaian informasi yang membutuhkan ruang penyimpanan
yang kecil. Dengan penggunaan teks, informasi lebih mudah
dijelaskan secara akurat dan tepat. Meskipun mungkin saja ada
multimedia tanpa teks, kebanyakan sistem multimedia
menggunakan teks sebagai cara efektif untuk menyampaikan ide
serta memberikan panduan kepada pengguna.
Adapun jenis teks yang penulis gunakan adalah :
a. Electronic text
Electronic text yaitu teks dalam bentuk digital atau bentuk
yang bisa dibaca oleh komputer dan dikirim secara elektronis
melalui jaringan.
Gambar 2.1 Contoh ElectronicText Yang Dibuat Pada
Microsoft Word
b. Hypertext
Awalan hyper mengacu pada proses linksing, yang membuat
multimedia menjadi interaktif. Hypertext mengacu pada teks
yang sudah di-links.Ketika kita melihat hypertext dan
mengklik kata yang sudah di-links, maka komputer kita dapat
membuka objek yang di-linkstersebut.
Linkstersebutmemberikan dimensi tambahan pada teks, itulah
sebabnya disebut hyper. (Suyanto,2003)
Gambar 2.2 Contoh Hypertext Pada Facebook (Printscreen
facebook)
2. Gambar/grafik
Penggunaan gambar sangat bermanfaat untuk
mengilustrasikan informasi yang akan disampaikan. Dengan
menggunakan gambar lebih mudah menggambarkan beberapa hal
yang mungkin kurang dapat dimengerti jika hanya dituangkan
dalam teks.
Adapun jenis gambar yang penulis gunakan adalah :
a. Gambar vektor (Vector Images)
Vector images disimpan sebagai kumpulan persamaan
matematika yang disebut algoritma, yang menentukan bentuk
kurva, garis, dan berbagai bentuk pada gambar. Vector image
memiliki kelebihan yaitu bersifat scalable, artinya
memperbesar atau memperkecil ukuran image grafik vektor
tidak akan mengurangi kehalusan gambar yang ditampilkan.
Gambar 2.3 Gambar Format Vector
Sumber : www.linuxgraphic.org/images/vector.jpg, 10 Februari
2007, Pkl 15:45 WIB 14
b. Gambar bitmap (raster)
Gambar bitmap merupakan rekonstruksi dari gambar asli.
Gambar bitmap adalah gambar yang tersimpan sebagai
rangkaian pixel (titik-titik) yang memenuhi bidang titik-titik
dilayar komputer. Resolusinya bergantung pada gambar asli.
Gambar bitmap bila dikompresi, kualitasnya akan turun.
Bitmap dapat dibuat dengan menggunakan berbagai grafik
editor, seperti Paint, Adobe Photoshop atau Coreldraw.
Gambar 2.4 GambarFormat Bitmap
Sumber :www.prepressure.com/image/formatbitmap.jpg,
c. Digitized Picture
Digitized picture adalah gambar yang diperoleh melalui
proses penangkapan gambar dari kamera video yang
terhubung ke komputer.
Gambar 2.5 Contoh Snappy Video Napshot
(Sumber: http://www.fixya.com/support/p163905-
minolta_snappy_video_snapshot_still) 3. Suara (Audio)
Suara termasuk salah satu elemen yang sangat penting dalam
multimedia. Jenis formatsuara yang penulisgunakan pada aplikasi
ini adalah :
a. MP3 (MPEG Audio Layer 3)
MPEG Audio Layer 3 biasa disebut juga dengan MP3
merupakan fileformat menggunakan MPEG audio codec
untuk kompresi dan dekompresi musik atau suara yang sudah
direkam. MP3 dapat memadatkan sebuah track audio CD
menjadi ukuran yang lebih kecil, yang memerlukan
bandwidth lebih sedikit untuk mentransmisikan suara pada
internet. (Suyanto,2003)
4. Animasi
Animasi merupakan suatu teknik pergerakan dari serentetan
gambar yang dihasilkan oleh komputer.(Suyanto,2003)
Teknik Animasi yang penulis gunakan adalah :
a. Animasi Frame (Frame animation), yaitu suatu animasi yang
membuat objek-objek bergerak dengan menampilkan
serentetan gambar yang disebut dengan Frame, dimana
objek-objek tersebut muncul di tempat yang berbeda-beda di
dalam layer.
Gambar 2.6 Contoh Animasi Frame
(Sumber:http://opalanimation.blogspot.com/2008/06/pola-
animasi-Frame-by-Frame.html)
5. Video
Menurut Suyanto (2003: 279), video merupakan elemen
multimedia paling kompleks karena penyampaian informasi yang
lebih komunikatif dibandingkan gambar biasa. Walaupun terdiri
dari elemen-elemen yang sama seperti grafik, suara dan teks,
namun bentuk video berbeda dengan animasi.
Perbedaan terletak pada penyajiannya. Dalam video,
informasi disajikan dalam kesatuan utuh dari objek yang
dimodifikasi sehingga terlihat saling mendukung penggambaran
yang seakan terlihat hidup.
Ada 4 jenis video yang dapat digunakan sebagai obyek
hubungan pada aplikasi multimedia, yakni :
a. Live Video Feeds
Live Video Feeds menyediakan obyek-obyek realtime yang
menarik dari sistem multimedia. Beberapa channel TV atau
live camera feed dapat menjadi obyek suatu links.
b. Videotape
Videotape merupakan media video yang paling tersebar luas.
Hampir semua orang memiliki sebuah VCR (Video
Cinematic Recording) dan hampir disetiap pusat perbelanjaan
terdapat toko video yang menyewakan film dalam bentuk
videotape.
c. Videodisc
Ada 2 format untuk videodisc, yakni CAV (Cinematic
Average Video) dan CLV (Cinematic Long Video). CAV disc
dapat menyimpan hingga 54000 Frame. Sedangkan CLV
disc dapat menyimpan video dua kali lebih besar dari pada
CAV disc.
d. Digital Video
Digital video adalah media penyimpanan yang paling
menarik dan menjanjikan. Digital video disimpan dalam
bentuk file pada hard disc, CD-ROM atau DVD.
e. DVD
Merupakan singkatan dari Digital Versatile Disc. Gambarnya
ditampilkan dengan baik, dengan suara surround dan full
color video. Pada DVD selalu ditawarkan pilihan bahasa
yang diinginkan pemakainya, dengan atau tanpa teks, dan
kadang-kadang pemakai dapat melihat alternatif dari akhir
sebuah film.
f. Hypervideo
Hypervideo merupakan video yang digunakan untuk
menggerakkan obyek multimedia lainnya.
5. InteractiveLinks
Menurut Sutopo (2002: 220), sebagian dari multimedia adalah
interaktif, dimana pengguna dapat menekan mouse atau objek pada
screen seperti button atau teks dan menyebabkan program
melakukan perintah tertentu.
Interactive links dengan informasi yang dihubungkannya sering
kali dihubungkan secara keseluruhan sebagai hypermedia. Secara
spesifik, dalam hal ini termasuk hypertext (hotword),
hypergraphics dan hypersound Menjelaskan jenis informasi yang
dihubungkan.
Gambar 2.7 Informasi Linier
5
________
________
_
________
________
____4_
________
________
_
_______
________
_____3_
________
________
_
________
______
______2_
________
________
_
________
________
____1
Interactive links diperlukan bila pengguna menunjuk pada suatu
objek atau button agar dapat mengakses program tertentu.
Interactive links diperlukan untuk menggabungkan beberapa
elemen multimedia sehingga menjadi informasi yang terpadu. Cara
peng-aksesan informasi pada multimedia terdapat dua macam,
yaitu linier dan non-linier. Informasilinier adalah informasi yang
ditampilkan secara sekuansial, yaitu dari atas ke bawah atau
halaman demi halaman, sedangkan pada informasiNon-linier
(seperti pada Gambar 2.5) dapat ditampilkan langsung sesuai
dengan kehendak pengguna.
Gambar 2.8 InformasiNon-Linier
2.2.4 Storyboard
Storyboard merupakan serangkaian sketsa (gambaran kartun) dibuat
berbentuk persegi panjang yang menggambarkan suatu urutan (alur
cerita) elemen-elemen yang diusulkan untuk aplikasi multimedia.
(Suyanto,2003)
_____
_
_____
_____
_____
_
_____
_____
_____
_____
__ ______
_____
_____
_____
__ _____
_____
_____
_____
2.3 Interaksi Manusia Dan Komputer
Istilah interaksi manusia dan komputer muncul pada sekitar pertengahan
tahun 1980. Menurut Card (Dix et al,1998), interaksi manusia dan komputer
adalah disiplin ilmu yang berhubungan dengan perancangan, evaluasi,
implementasi sistem komputer interaktif untuk digunakan oleh manusia, serta
studi fenomena-fenomena besar yang berhubungan
dengannya.(Dastbaz,2003)
2.3.1 Antarmuka Pemakai
Antarmuka pemakai dapat didefinisikan sebagai interface antara
pengguna dan komputer dan termasuk didalamnya perangkat keras
dan perangkat lunak (Johnson,1992). Pemahaman antarmuka pemakai,
didalamnya termasuk juga semua jalur informasi yang memungkinkan
manusia dan komputer berkomunikasi. (Dastbaz,2003)
Sebagian besar lingkungan untuk komputer interaktif merupakan
contoh dari interface WIMP, atau biasa disebut juga sistem window
sederhana. WIMP singkatan dari windows, icons, menus, dan pointers.
Selain itu masih ada banyak objek interaksi tambahan dan teknik
umum yang digunakan di tampilan WIMP, misalnya buttons,
toolsbars, dan dialog boxes. Contoh tampilan WIMP adalah Microsoft
Windows untuk PC IBM, MacOS untuk Machintos dan beberapa X
Windows untuk UNIX.
1. Windows
Windows adalah area dari layar yang bertindak seolah-olah
berdiri sendiri.Sebuah window pada umumnya berisi teks atau
grafik yang dapat dipindahkan, dirubah ukurannya, ataupun
ditutup.
2. Icon
Icon adalah gambar kecil untuk merepresentasikan jendela yang
tertutup. Dengan menggunakan icon banyak jendela dapat
berada di satu layar pada saat yang bersamaan, sehingga lebih
menghemat tempat. Icon dapat merepresentasikan aspek lain
dari sebuah sistem. Contohnya: iconbergambar tong sampah
untuk menampung file-file yang sudah tidak diinginkan.
3. Pointers
Pointer digunakan sebagai cara untuk merepresentasikan
interaksi nyata antar manusia dan computer. Kursor pointer
yang berbeda berfungsi untuk menunjukkan fungsi yang berbeda
pula. Contohnya: kursor pointer dalam keadaan normal
bergambar panah, berubah menjadi jam pasir untuk
menampilkan bahwa sistem sedang sibuk bekerja.
4. Menu
Menu merepresentasikan pilihan dari sekelompok operasi yang
dapat diberikan oleh sistem pada saat tertentu. Main menu dapat
dilihat oleh user sepanjang waktu. Penyusunan item-item di
dalam menu berdasarkan tingkat kepentingan informasi,
frekuensi penggunaan dan fungsi yang saling bertolak belakang
harus berjauhan untuk menghindari adanya kesalahan (seperti
menu „save‟ dan „delete‟).
5. Buttons
Buttondaerah individual dan terisolasi di sebuah tampilan yang
dapat dipilih oleh user untuk menjalankan operasi tertentu.
Buttonbisa ditampilkan dalam bentuk label teks ataupun icon
teks. Buttondapat juga digunakan sebagai toggle antara dua
keadaan yang berbeda, menampilkan status informasi seperti
apakah suatu huruf dicetak tebal atau dicetak miring. Toggle
button yang digunakan untuk melakukan beberapa pilihan
keadaan yang ada disebut check boxes. Sedangkan radio button
hanya mengijinkan pengguna untuk memilih salah satu dari
sejumlah kadaan yang ada.
6. Toolsbars
Banyak sistem memiliki kumpulan tombol-tombol kecil,
masing-masing dilambangkan dengan icon yang ditempatkan di
atas ataupun di samping jendela, menawarkan sejumlah fungsi
yang sering digunakan. Inilah yang kita sebut sebagai toolsbars.
7. Dialog boxes
Dialog boxes adalah jendela informasi yang digunakan oleh
sistem untuk menarik perhatian user atas informasi penting,
misalnya pesan kesalahan karena menjalankan suatu fungsi.
Selain itu dialog boxes juga digunakan untuk manampilkan
subdialog antara userdengan sistem untuk proses tertentu.
Misalnya: ketika user ingin menyimpan file, maka dialog boxes
akan muncul untuk menanyakan file tersebut ingin disimpan
dengan nama dan format apa. (Dix,2004)
2.3.2 Tujuan Perancangan Antarmuka Pemakai
Tujuan perancangan antarmuka pemakai :
a. Penentuan sasaran masyarakat pemakai dan tugas-tugasnya yang
sangat penting.
b. Faktor-faktor manusia terukur yang menjadi pusat evaluasi :
1. Waktu belajar (Time to learn)
Berapa lama orang dapat mempelajari cara relevan untuk
melakukan suatu tugas.
2. Kecepatan kinerja (speed of performance)
Berapa lama waktu yang dibutuhkan hingga tugas diselesaikan.
3. Kesalahan yang dilakukan oleh pengguna (rate of errors by
user). Berapa bayak kesalahan dan kesalahan-kesalahan apa
saja yang di buat pemakai.
4. Daya ingat (retention overtime)
Bagaimana kemampuan pemakai mempertahankan
pengetahuannya setelah jangka waktu tertentu.
5. Kepuasan subjektif (subjective satisfAction)
Bagaimana kesukaan pemakai terhadap berbagai aspek
sistem.(Shneiderman,1998)
2.3.3 Prinsip Perancangan Antarmuka Pemakai
Delapan aturan emas perancangan antarmuka pemakai :
1. Berusaha keras untuk konsisten
Yang termasuk di dalam aturan ini antara lain adalah konsisten
dalam penggunaan font, baik bentuk maupun ukurannya, konsisten
dalam penggunaan warna pada tulisan dan latar belakang, serta
konsisten dalam pembuatan layout dan penggunaan terminologi.
2. Memungkinkan pengguna mahir (frequent user) untuk
menggunakan shortcut untuk aksi-aksi yang sering dilakukan,
pengguna biasanya inginagar jumlah perintah yang harus dilakukan
dikurangi, untuk menghemat waktu dan menigkatkan kepraktisan.
3. Memberikan umpan balik yang informatif.
Umpan balik berupa isyarat seperti suara atau tampilan visual yang
menunjukan aksi yang dilakukan pengguna diterima dan direspon
oleh program.
4. Merancang dialog untuk menghasilkan keadaan akhir.
Pengguna membutuhkan konfirmasi bahwa rangkaian aksi yang
telah dilakukannya adalah benar dan dapat diterima serta diproses
oleh program tersebut. Untuk itu diperlukan adanya dialog yang
memberitahu bahwa pengguna telah berhasil melakukan
serangkaian aksi tertentu.
5. Memberikan penanganan kesalahan yang sederhana.
Diusahakan perancangan sistem tidak memungkinkan pengguna
melakukan kesalahan yang fatal. Jika terjadi kesalahan, program
atau sistem harus bisa mendeteksi kesalahan dan menawarkan
penanganan masalah yang sederhana, membangun dan mudah
dimengerti.
6. Mengizinkan pengembalian aksi (undo) dengan mudah.
Diusahakan setiap aksi yang dilakukan oleh pemakai dapat
dilakukan pembalikan aksi (undo). Hal ini dapat menimbulkan
keberanian pengguna untuk menggunakan dan bereksperimen
dengan program tersebut.
7. Mendukung tempat kontrol internal
Pengguna harus menduduki posisi inisiator, bukan responden.
Pengguna harus dapat menggunakan program dan program
mengikuti perintahnya.
8. Mengurangi beban ingatan jangka pendek
Tampilan yang ada hendaknya dibuat sederhana, untuk mengurangi
beban pengguna untuk menghafalkan pemakaian program,
sehingga pengguna dapat memfokuskan pada pendayagunaan
program tersebut.(Shneiderman,1998).
2.4 Pengertian IMSDD
Hampir seluruh model desain mulai dari model life cycle hingga prototyping,
atau bahkan beberapa dari pendekatan desain berbasis orientasi objek
memiliki tahap yang mirip yaitu identifikasi kebutuhan sistem, identifikasi
desain, implementasi, tes dan evaluasi. Tahap-tahap tersebut sudah cukup
membantu memulai suatu projek, tetapi belum cukup membimbing desainer
untuk menghadapi proses desain dan pengembangan sistem multimedia
interaktif yang kompleks. Sebuah sistem multimedia interaktif membutuhkan
pendekatan integrasi media yang terperinci dan terencana. Pengaturan media
seperti audio, video, animasi, teks, dan grafik memberikan tantangan
tersendiri kepada desainer dalam manajemen dan sinkronisasinya.(Dastbaz,
2003)
Menurut Dastbaz, Pengembangan aplikasi multimedia memiliki 4 tahap, yaitu
Kebutuhan Sistem (System Requirement), Pertimbangan Perancangan (Design
Consideration), Implementasi (Implementation) dan Evaluasi (Evaluation)
seperti pada Gambar 2.14.
Gambar 2.9Siklus Pengembangan Aplikasi Multimedia (Dastbaz:2003)
1. Kebutuhan Sistem (System Requirement)
Pada tahap ini suatu definisi umum dari IMS (Interactive Multimedia
System) dan lingkungannya ditentukan.Tahap ini memiliki fungsi-fungsi
kunci sebagai berikut:
a. Untuk menyediakan definisi sistem seperti pembuatan outline
mengenai tujuan dan sasarandari sistem yang akan dibuat.
b. Untuk memastikan siapakah user dari sistem yang akan dibuat dan
jika ada kebutuhan spesifik lain yang perlu dipertimbangkan.
Sebagai contoh jika kita merancang sebuah paket pembelajaran
untuk mengajarkan kepada user yang sulit mendengar maka
menggunakan audio sebagai media pemberi informasiadalah sangat
tidak cocok.
c. Evaluasi hardware, software, dan authoring tools yang dibutuhkan
lalu pilih secara tepat.
d. Pertimbangkan secara tepat delivery platform yang dibutuhkan oleh
sistem. Jika system multimedia interaktif berjalan pada sebuah
jaringan (WAN, LAN) maka kita membutuhkanpendekatan yang
berbeda dalam mendesain dan membangun sistem dibandingkan jika
kitamenggunakan sistem yang bertipe CD-ROM.
2. Pertimbangan Desain
Tujuan dari langkah ini adalah untuk menggambarkan secara jelas
panduan tentang detaildesain. Langkah ini mencakup:
a. Metafora Desain
Memilih sebuah model nyata untuk digunakan sebagai solusi kunci
desain interface bagi sistem contohnya film, buku, game, dll.
b. Format dan tipe informasi, yaitu untuk mendefinisikan tipe informasi
yang dibutuhkan untuk diintegrasikan ke dalam sistem tersebut,
seperti teks, grafik, suara, video, dan animasi.
c. Struktur navigasi, yaitu untuk menyatakan suatu strategi navigasi
yang jelas,termasuk fitur dan struktur link yang akan menghindari
masalah-masalah yang berkaitan dengan sistem hypermedia,
misalnya „disorientasi‟.
d. Perancangan database
Pada tahap ini dilakukan perancangan database yang menyangkut
proses dari sistem yangdibuat.
e. Perancangan flowchart
f. Perancangan STD (State Transition Diagram
g. Kontrol sistem, yaitu untuk tipe dan fitur kontrol dan tool yang
dibutuhkan sistem tersebut.
3. Implementasi (Implementation)
Tahap implementasi terdiri dari:
a. Membuat prototype sistem, dan
b. Melakukan tes beta terhadap prototype untuk kemungkinan masalah-
masalah perancangan dan kontrol.
4. Evaluasi (Evaluation)
Pada tahap ini sistem dievaluasi dengan membagikan kuesioner kepada
user untuk mendapatkan hasil dari sistem yang dibuat.
2.5 Model Perancangan Sistem
Pada tahap perancangan sistem ini akan dirancang suatu sistem dalam suatu
bagan yang menunjukan prosedur-prosedur dari sistem tersebut. Alat-alat
yang digunakan untuk perancangan sistem diantaranya :
2.5.1 State Transition Diagram
STD adalah kumpulan keadaan atau atribut yang mencirikan
seseorang atau suatu benda pada waktu tertentu, bentuk keberadaan
ataupun kondisi tertentu, misalkan menunggu intruksi berikutnya,
menunggu mengisi password, dll.
Menurut Kowal James (1998,p331) STD merupakan suatu modeling
tools yang menggambarkan sifat ketergantungan pada waktu dari
suatu sistem. Pada mulanya hanya digunakan untuk menggambarkan
suatu sistem yang memiliki sifat real-time, seperti :
a. Process control
b. Telephone switching system
c. High speed data acquisition system
d. Military command and control system
State disimbolkan dengan segiempat ( ) dan transisi state atau
perubahan state disimbolkan dengan ( ) . Ada dua macam state yaitu
state awal (initial state ) dan state akhir ( final state ). Final state bisa
bisa berupa beberapa state, tetapi initial state tidak boleh lebih dari
satu.
Transisi state disimbolkan dengan panah berarah. Setiap panah
berarah diberi label yang menunjukkan kejadian yang menjelaskan
transisi tersebut.
Gambar 2.10 Gambar Sederhana STD
2.5.2 Flowchart
Berdasarkan spesifikasi kebutuhan aplikasi yang ada, maka dibuat
flowchart yang bertujuan untuk mempermudah pengembangan
aplikasi yang sedang di bangun (Suyoto, 2005).
Pengertian flowchartadalah penggambaran secara grafik dari langkah-
langkah dan urut-urutan prosedur dari suatu program. Flowchart
menolong analis dan programmerp untuk memecahkan masalah
kedalam segmen-segmen yang lebih kecil dan menolong dalam
menganalisis alternatif-alternatif lain dalam pengoperasian (Suyoto,
2005). Flowchart biasanya mempermudah penyelesaian suatu masalah
khususnya masalah yang perlu dipelajari dan dievaluasi lebih lanjut.
Simbol-simbol flowchart yang biasanya dipakai adalah symbol-simbol
flowchart standard yang dikeluarkan oleh ANSI dan ISO. Simbol-
simbol yang dipakai antara lain :
Tabel 2.1 Simbol Flowchart
Flow Direction Symbol
Yaitu simbol yang digunakan untuk menghubungkan
antara symbol yang satu dengan symbol yang lain. Simbol
ini disebut juga connecting line.
Terminator Symbol
Yaitu simbol untuk permulaan (start) atau akhir (stop)
dari suatu kegiatan.
On Page connector Symbol
Yaitu symbol untuk keluar masuk atau penyambungan
proses dalam lembar atau halaman yang sama.
\Off PageConnector Symbol
Yaitu symbol untuk keluar – masuk atau penyambungan
proses pada lembar atau halaman yang berbeda.
Processing Symbol
Simbol yang menunjukan pengolahan yang dilakukan
oleh komputer.
Simbol Manual Operation
Simbol yang menunjukan pengolahan yang tidak
dilakukan oleh komputer.
Simbol Decision
Simbol pemilihan proses berdasarkan kondisi yang ada.
Simbol Input-Output
Simbol yang menyatakan proses input dan output tanpa
tergantung dengan jenis peralatannya.
Simbol Manual Input
Simbol untuk pemasukan data secara manual on-line
keyboard.
Simbol Preparation
Simbol untuk mempersiapkan penyimpanan yang akan
digunakan sebagai tempat pengolahan di dalam storage
Simbol Predefine proses
Simbol untuk pelaksanaan suatu bagian (sub-program)
Simbol Display
Simbol yang menyatakan peralatan output yang
digunakan yaitu layer, plotter, printer dan sebagainya.
Simbol disk and On-line Storage
Simbol yang menyatakan input yang berasal dari disk atau
disimpan ke disk.
Simbol magnetic tape Unit
Simbol yang menyatakan input berasal dari pita magnetik
atau output disimpen ke pita magnetik.
Simbol Punch card
Simbol yang menyatakan bahwa input berasal dari kartu
atau output ditulis ke kartu.
2.5.3 DataFlow Diagram (DFD)
Data Flow Diagram (DFD) adalah alat bantu pembuatan model sistem
yang digunakan untuk menggambarkan suatu sistem yang telah ada
atau sistem baru yang akan dikembangkan secara logika tanpa
mempertimbangkan lingkungan fisik dimana data tersebut mengalir
atau lingkungan fisik dimana data tersebut disimpan. Data Flow
Diagram juga merupakan alat yang cukup populer karena dapat
menggambarkan arus data di dalam sistem dengan terstruktur, jelas
dan merupakan dokumentasi dari sistem yang baik. Untuk
memudahkan pembacaan DFD, maka penggambaran DFD disusun
berdasarkan tingkatan atau level dari atas ke bawah.
Adapun tingkatan dalam DFD diantaranya:
1. Diagram konteks (Context Diagram level 0)
Merupakan diagram paling atas yang terdiri dari suatu proses dan
menggambarkan ruang lingkup proses. Hal yang digambarkan
dalam diagram konteks adalah hubungan terminator dengan
sistem dan juga sistem dalam suatu proses. Sedangkan hal yang
tidak digambarkan dalam diagram konteks adalah hubungan antar
terminator dan data store.
Simbol dokumen
Simbol yang menyatakan input berasal dari dokumen
dalam bentuk kertas atau output dicetak ke kertas.
2. Diagram Zero (Level 1)
Merupakan diagram yang berada diantara diagram konteks dan
diagram detail serta menggambarkan proses utama dari DFD. Hal
yang digambarkan dalam diagram Zero adalah proses utama dari
sistem serta hubungan entity, process, alur data dan data store.
3. Diagram Detail (primitif)
Merupakan penguraian dalam proses yang ada dalam diagram
Zero. Diagram yang paling rendah yang tidak dapat diuraikan
lagi.(Jogiyanto,2001)
Simbol atau gambar yang digunakan dalam membuat Data Flow
Diagram (DFD) ada 4 yaitu :
External Entity
Simbol ini untuk menggambarkan asal
atau tujuan.
Proses
Simbol ini untuk menggambarkan proses
pengolahan atau transformasi.
Data Flow
Simbol ini untuk menggambarkan aliran
data yang berjalan.
Data Store
Simbol ini menggambarkan data flow
yang sudah di simpan atau diarsipkan.
2.6 Perangkat Lunak
2.6.1 Adobe Photoshop CS3
Adobe Photoshop atau biasa disebut Photoshop, merupakan
perangkat lunak editor citra buatan Adobe Systems
yangdikhususkan untuk pengeditan foto atau gambar dan
pembuatan efek. Perangkat lunak ini banyak digunakan oleh
Fotographer digitaldan perusahaan iklan sehingga dianggap
sebagai pemimpin pasar (market leader) untuk perangkat lunak
pengolah gambar dan bersama Adobe Acrobat dianggap sebagai
produk terbaik yang pernah diproduksi oleh Adobe Systems.Versi
kedelapan aplikasi ini disebut dengan nama Photoshop CS
(Creative Suite), versi sembilan disebut Photoshop CS2, versi
kesepuluh Photoshop CS3, dan versi yang terakhir (kesebelas)
adalah Adobe Photoshop CS4. Photoshop tersedia untuk Microsoft
Windows, Mac OS X, dan Mac OS. Versi sembilan keatas juga
dapat digunakan oleh sistem operasi lain seperti Linux dengan
bantuan perangkat lunak tertentu CrossOver.(Hakim. 2009)
Gambar 2.11TampilanArea kerja Adobe Photoshop CS3
(Sumber :Printscreen)
Keterangan gambar 2.15 adalah :
a. Menu Bar, berisi perintah utama untuk membuka file, save,
mengubah ukuran gambar, filter dan lain-lain. Juga
ditampilkan keyboard shortcuts seperti: New (Ctrl+N),
(Ctrlp+O), dan lain-lain Option, berisi pilihan dari tools yang
Anda pilih. Misalnya dipilih kuas/brush, maka
ukuran/diameter juga opacity brush ada di sini.
b. Windowssize, menampilkan besar kanvas atau gambar yang
sedang dibuka, diedit atau dibuat.
c. Toolsbox, tools untuk menyeleksi dan memodifikasi
gambar.Palette, berisi jendela-jendela kecil yang di dalamnya
terdapat perintah dan pilihan untuk dokumen yang sedang
dikerjakan. Anda dapat meletakkan palet yang sering
Menu Bar
Palette Window
Image
Toolbox
Option
digunakan sekaligus menutup palet lain yang tidak digunakan.
Panggil palet melalui menu utama window.
2.6.2 Macromedia Flash MX 2004
Flash merupakan program animasi professional yang mudah
digunakan dan sangat berdaya guna untuk membuat animasi
sederhana sampai animasi kompleks. Animasi atau MovieFlash
terdiri dari grafik, teks, animasi dan aplikasi untuk situs web.
Semuanya tetap mengutamakan grafik berbasis vektor, jadi
aksesnya lebih cepat dan terlihat halus pada skala resolusi layar
berapa pun, selain juga mempunyai kemampuan untuk mengimpor
video, gambar, dan suara dari aplikasi diluarnya.
MovieFlash juga bisa memasukkan unsur interaktif dalam Movie-
nya dengan Actionscript (bahasa pemrograman di Flash) sehingga
user bisa berinteraksi dengan Movie dengan keyboard atau mouse
untuk berpindah ke bagian-bagian yang berbeda dari sebuah Movie,
mengontrolMovie, memindahkan objek-objek, memasukkan
informasi melalui form, dan operasi-operasi lainnya. (Hakim,2004).
Macromedia Flash MX 2004 merupakan alat yang sangat bagus
untuk desainer web, praktisi media interaktif, atau praktisi
multimedia. Kemampuannya ditekankan pada pembuatan (kreasi)
animasi, serta mengimpor dan memanipulasi berbagai tipe media
(audio, video, bitmap, vektor, teks, grafik, dan data).
(Hakim,2004).
Gambar 2.12Ruang Kerja Macromedia Flash MX 2004
(Sumber : Printscreen)
Untuk dapat menjalankan program Macromedia Flash MX 2004
dibutuhkan sistem minimum sebagai berikut :
Tabel 2.2Spesifikasi Macromedia Flash MX 2004
Windows Machintos
Prosesor Intel Pentium III 600
MHz atau diatasnya dengan
sistem operasi Microsoft
Windows 98 SE, Windows 2000,
atau Windows XP.
Prosesor PowerPC G3 500
MHz dengan sistem operasi
Mac OS X 10.2.6.
RAM 128 MB (disarankan 256
MB)
RAM 128 MB (disarankan 256
MB)
Kapasitas harddisk kosong
sebesar 190 MB
Kapasitas harddisk kosong
sebesar 130 MB
2.6.2.1 Action Script Versi 2
Macromedia Flash MX 2004 menggunakan Actionscript
versi 2.Pada Actionscript 2.0 ini telah ditambahkan
fungsi-fungsi yang sangat kompleks dan berdaya guna,
dukungan penuh terhadap OOP (Object Oriented
Programming) atau pemrograman berorientasi objek,
dan pemrograman standar ECMA (European Computer
Manufacturers Association).(Hakim,2004)
Actionscript adalah kumpulan perintah-perintah
(statement) untuk membuat Movie clip (animasi) menjadi
lebih interaktif. Dengan adanya Action script, pengguna
dapat berperan lebih aktif menggunakan keyboardmouse
untuk melompat ke Movielain yang diinginkan,
memindah objek, memasukkan informasi pada form dan
lain-lain.
Actionscript dibagi menjadi dua, yaitu :
1. ActionFrame, yaitu Action yang diberikan pada
Frame. Frame yang berisi Actionscript terdapat
tanda a pada Frame-nya.
2. Action Objek, yaitu Action yang diberikan pada
objek baik berupa tombol maupun
Movieclip(http://www.babaFlash.com,2007).
2.6.2.2 FlashPlayer
FlashPlayeradalah Player/plug-in yang disertakan pada
browserdengan tujuan agar browser (Internet Explorer)
dapat memainkan MovieFlash.FlashPlayer juga bisa
berjalan pada komputer lokal sehingga kita bisa
memainkan Movie di browser atau sebagai aplikasi yang
berdiri sendiri.Macromedia Flash MX 2004
menggunakan plug-in FlashPlayer 7 yang telah
ditingkatkan kecepatannya 2 hingga 10 kali lipat untuk
menjalankan aplikasi-aplikasi yang umum.Perbaikannya
meliputi kemampuan dalam menampilkan grafik dengan
lebih cepat, memainkan video, menginisialisasi
komponen, dan parsing XML (Hakim,2004).
2.6.3 XML
XML (Extensible Markup Language) banyak digunakan sebagai
format penyimpanan data.Banyak pakar berpendapat bahwa XML
adalah standar format data masa depan, yang bisa mendukung dan
menyatukan semua sistem operasi komputer. XML sendiri bukan
merupakan bahasa pemrograman.
Keunggulan XML :
1. Exstensible, kebebasan mendefinisikan tag-tag sendiri, sesuai
pada kebutuhan kita.
<?xml version=”1.0” encoding “iso-8859-1”?>
<note>
<to> Tove </to>
<from> Jani </from>
<heading> Reminder </heading>
<body> Don‟t forget me this weekend </body>
</note>
2. XML bersifat free.
3. XML bisa digunakan dalam berbagai platform/sistem operasi.
4. XML mudah dimerngerti. Dengan menggunakan tag yang bisa
disesuaikan dengan bahasa kita, maka kita bisa membuat XML
dengan bahasa yang mudah dimengerti.
XML dapat dibuat dengan text editor biasa, seperti Notepad.
(Wijaya,2003)
2.6.3.1 Syntax XML
Aturan syntax XML sangat sederhana dan sangat ketat.
Aturannya sangat mudah untuk dipelajari dan digunakan,
oleh karena itu perangkat lunak dapat membaca dan
memanipulasi XML dengan mudah. Sebuah contoh
dokumen XML :
Gambar 2.13Syntax Dokumen XML
Sumber :The Magic Of Flash MX 2004, B.Hartanto &
F.Wijaya, 2004
Pada baris pertama dokumen XML, didefinisikan versi
XML dan encoding karakter yang terdapat dalam dokumen
tersebut. Dalam hal ini, digunakan versi XML 1.0 dan ISO-
8859-1 (Latin-1/West European).
Baris berikutnya mendeskripsikan root dokumen (seperti
mengatakan dokumen ini ialah dokumen note/catatan).
Empat baris berikutnya mendeskripsikan 4 elemen child
dari root (to, from, heading, dan body) dan pada diakhir
baris didefinisikan akhir elemen root </note>.
Berikut aturan singkat mengenai syntax XML :
1. Semua elemen XML harus mempunyai tag penutup.
2. Tag XML bersifat case sensitive. Dengan XML, tag
<Letter> berbeda dengan tag <letter>.
3. Semua elemen XML harus mempunyai properti yang
bersarang. Tag elemen bersarang yang tidak sesuai
tidak digunakan dalam XML. Sebagai contoh:
<note><to>Tarzan</note></to> merupakan tag yang
ilegal. tetapi tag <note><to>Tarzan</to></note> adalah
tag yang valid.
4. Semua dokumen XMK harus mempunyai sebuah
elemen root dan harus mempunyai satu pasang tag yang
mendefinisikan elemen root.
5. Semua elemen dapat mempunyai subelemen (child
elemen). Sub elemen harus mempunyai sarang yang
benar dalam elemen atasnya (parent elemen). Sebagai
contoh :
<root><child><subchild>...</subchild></child></root>
6. Semua elemen dapat memiliki atribut. Setiap nilai
atribut harus berada dalam tanda kutip. Sebagai contoh
:
<root><childattr=”X”><subchild></subchild></child>
</root>
7. Dengan XML, spasi tidak dapat dipotong, tidak seperti
pada HTML yang memungkinkannya.
8. Komentar dalam XML.<!--- komentar xml ---
>(Hartanto,2004)
2.6.4 Apache
Apache merupakan server web yang digunakan dalam pemrograman
berbasis server. Pemrograman web terbagi menjadi dua bagian
(Sukarno, 2006) :
a. Web Client Programming,
Pemrograman web yang ditentukan pada sisi client. Yang
termasuk pada web client programming yaitu HTML, JavaScript
dan VBScript.
b. Web Server Programming,
Pemrograman web yang ditentukan pada sisi server. Yang
temasuk ke dalam kategori ini adalah PHP, ASP, JSP,
ColdFusion dan ASP.NET.
Apache merupakan server web yang bersifat Open source
sehingga menjadikan apache sebagai server web alternative dari
Netscape (sekarang dikenal sebagai Sun java System Web
Server).
Asal mula nama Apache terdapat dua versi istilah yang berbeda,
yaitu dari sebuah server web NCSA dan suku asli Indian Amerika
(Sukarno, 2006) :
a. Dari sudut sebuah server web NCSA
Nama Apache berasal ketika server web populer yang
dikembangkan pada awal tahun 1995, yaitu NCSA HTTPd 1.3
mengalami sejumlah perubahan besar terhadap kode sumbernya
(patch). Begitu banyak patch pada perangkat lunak tersebut
sehingga disebut server yang memiliki banyak patch.
b. Dari sudut suku asli Indian Amerika
Menurut halaman FAQ yang berasal dari situs resminya, bahwa
nama “Apache” dipilih untuk menghormati suku asli Indian
Amerika Apache yang dikenal karena keahlian dan strategi
perangnya.
Namun pada versi kedua, Apache ditulis dari awal tanpa
mengandung kode sumber dari NCSA. Pada awalnya Apache
digunakan dalam operating Linux yang sering disebut LAMP
(Linux, Apache, MySQL, PHP atau Perl atau Phyton).
2.6.5 Xampp
Dari pengalaman banyak orang, diketahui bahwa tidak mudah untuk
menginstall sebuah web server apache dan juga akan berusaha lebih
keras lagi apalagi ingin menambahkan MySQL, PHP dan Perl.
Xampp Merupakan paket yang terdiri dari Apache, MySQL, PHP
dan Perl.
Xampp dikembangkan oleh apache friends yang merupakan sebuah
website non komersial yang bertujuan untuk mempromosikan web
server apache. Xampp ditemnukan pada musim semi tahun 2001
oleh kai „oswald‟ seidler dank ay vogelgesang.
Xampp adalah salah satu paket software web server yang terdiri dari
Apache, MySQL, PHP dan PHP MyAdmin. Xampp adalah
perangkat lunak bebas, yang mendukung banyak system operasi,
merupakan kompilasi dari beberapa program. (Madcoms, 2009)
Gambar 2.14Tampilan awal jendela XAMP
(Sumber :Printscreen)
2.6.6 PHP
PHP merupakan hasil kerja seorang bernama Rasmus Lerdorf pada
1995. Namun kemudian PHP berkembang dan tidak hanya
merupakan proyek pribadi Rasmus. PHP ditulis ulang dan dengan
banyak menambahkan fungsi-fungsi baru oleh Zeev Suraski dan
Andi Gutmants (disingkat Zend) dan lahirlah PHP 3 pada 1998
(Astamal, 2006:ix).
PHP adalah bahasa server-side scripting yang didesain khusus untuk
web.Pada halaman HTML dapat ditempelkan (embed) kode PHP.
Kode PHP dieksekusi di sisi server bukan di komputer klien. Dan
hasil yang ditampilkan adalah kode HTML (Astamal, 2006:ix).
Maksud dari server-side scripting adalah sintaks dan perintah-
perintah yang di berikan akan sepenuhnya dijalankan di server tetapi
disertakan pada dokumen HTML biasa. Pembuatan web ini
merupakan kombinasi antara PHP sendiri sebagai bahasa
pemrograman dan HTML sebagai pembangun halaman web. PHP
dikenal sebagai bahasa scripting yang menyatu dengan tag HTML,
dieksekusi di server dan digunakan untuk membuat halaman web
yang dinamis. PHP adalah merupakan softwareyang Open Source
dan mampu lintas platform.(Astamal, 2006:ix)
PHP mampu berjalan di Windows NT dan beberapa versi UNIX, dan
PHP dapat dibangun sebagai modul pada web server Apache. PHP
dapat mengirim HTTP header, dapat mengeset cookies, mengatur
authentication dan redirect users. PHP menawarkan konektifitas
yang baik dengan beberapa basis data antara lain Oracle, Sybase,
mSQL, MySQL, Solid, PostgreSQL, Adabas, FilePro,Velocis,
dBase, Unix dbm dan tak terkecuali semua database berinterface
ODBC. Dan juga integrasi dengan beberapa library eksternal yang
dapat membuat programmer melakukan segalanya dari dokumen
PDF hingga mem-parse XML. PHP juga mendukung komunikasi
dengan layanan lain melalui protokol IMAP, SNMP, NNTP, POP3
atau bahkan HTTP.(Astamal, 2006:ix).
Konsep kerja PHP hanya perlu penterjemahan khusus untuk kode-
kode PHP yang nantinya akan diterjemahkan oleh mesin PHP ke
kode HTML terlebih dahulu sebelum diterjemahkan browser untuk
ditampilkan di layar klien.(Astamal, 2006:ix).
2.6.7 CSS
CSS atau Cascading Style Sheet saat ini adalah sebuah elemen
penting dalam pembuatan sebuah website.Sama pentingnya saat
mendesain bentuk web pada Photoshop.Dengan CSS dapat
mendesign sejumlah halaman dengan aturan yang sama tanpa
mengubah halaman-halaman dengan aturan yang sama tanpa
mengubah halaman satu persatu. Dengan membuat sebuah file CSS
kemudian meng-importnya ke dalam file halaman web yang dapat
memformat style semua halaman web yang dibuat.
Saat ini CSS merupakan aturan style yang banyak digunakan
dikarenakan fleksibilitas dari tag, kemudahan dan lengkapnya atribut
yang dimilikinya. Penggunaan CSS dalam web akan lebih efisien
dikarenakan CSS dapat digunakan secara berulang pada tag-tag
tertentu, sehingga kita tidak usah mengetikkan ulang seluruh
perintah pemformatan desain seperti halnya dalam HTML klasik.
(Wismakarma, 2009).
2.6.8 My SQL
Menurut Sidik (2005:1), MySQL merupakan softwaresistem
manajemen database (database Management System – DBMS) yang
sangat popular dikalangan pemrograman web, terutama di
lingkungan linux dengan menggunkan script PHP dan Perl.
MySQL merupakan database yang paling popular digunakan untuk
membangun aplikasi web yang menggunakan database sebagai
sumber dan pengelola datanya. Hal itu dimungkinkan karena
MySQL mudah untuk digunakan, cepat secara kinerja query, dan
mencukupi untuk kebutuhan database perusahaan-perusahaan skala
menengah kecil.
Database MySQl tersedia secara cuma-cuma dan boleh digunakan
oleh setiap orang, dengan lisensi Open source GNU General Public
License (GPL) atau pun lisensi komersial non GPL. Database
MySQL merupakan database yang menjanjikan sebagai alternatif
pilihan database yang dapat digunakan untuk sistem database
personal atau organisasi (Sidik, 2005:2)
2.6.9 Cool Edit
CoolEdit merupakan perangkat lunak audio yang paling populer
karena memiliki fasilitas filter. Dengan filter ini kualitas suara dan
rekaman digital dapat diolah dengan nuansa yang baru. Dalam
CoolEdit anda dapat menambah efek ke dalam data audio, dengan
efek yang telah dikenal dalam dunia musik. Selain itu Anda dapat
pula menambah dan mengurangi frequency equalizer yang tersedia
dalam program CoolEdit.
2.6.9.1 Fasilitas pada CoolEdit
CoolEdit memiliki beragam fasilitas yang diperlukan untuk
melakukan editing audio. Beberapa diantaranya seperti
fasilitas Edit view menjadikan CoolEdit sebagai alat editing
yang lebih powerfull, lebih user-friendly dan sebagai
analisis tools, mencakup fase real-time dan analisis
frekuensi, filtering tingkat lanjut serta efek-efek dinamis.
Fasilitas Parametric EQ merupakan equalizer parametric
lengkap 5-band yang terkenal, memungkinkan Anda
memilih lebar/konstanta Q, tambahan high & low shelving
yang dapat di setting sebelumnya untuk awal dan
mempunyai kemampuan untuk digunakan sebagai stand
alone EQ atau dalam lingkungan Real-Time Multitrack.
Selain itu CoolEdit juga dilengkapi dengan mixer yang
dapat mengubah level, menggunakan real-time track EQ,
menambah efek-efek lain secara real-time mencakup efek
DirectX, Bus track dan sebagainya. Sehingga Anda
mempunyai kemampuan untuk melakukan mixing
audio.(Suyanto,2003)
2.7 Studi Literatur
Aplikasi Ujian Madrasah Berbasis Local Area Network (LAN) studi kasus
pada Madrasah Tsanawiyah Al-Muawanah Curug Tangerang, Skripsi
disusun oleh Ali Yahya 10309102959, dari Universitas Islam Negeri (UIN)
Jakarta, tahun 2010. Aplikasi yang dibuat menggunakan bahasa
pemrograman PHP, Database Mysql, Server Apache dan didukung oleh
program lainnya seperti notepad++, PhotoshopCS dan macromedia
dreamweaver dan peneliti menggunakan metode Rapid Application
Development (RAD). Aplikasi yang dibangun berjalan pada jaringan local
LAN. Untuk memasuki halaman ujian user harus login terlebih dahulu.
Urutan soal yang ditampilkan pada aplikasi bersifat Random (Acak).
Rancang Bangun Perangkat LunakSistem Ujian On-Line Terpadu
BerbasisJaringan, skripsi ditulis oleh Rizki Harris E (5102 100 067)dari
Institut Teknologi Sepuluh NopemberSurabaya tahun 2007. Sistem Ujian
On-line Banyak digunakan dalam penyelenggaraan ujian saat ini. Ujian
Tersebut pada Umumnya Berbasis Web,Kontrol yang dilakukan oleh
penyelenggara terhadap ujian masih berbasis waktu.pada rancang bangun
sistem ujian on-line terpadu ini digunakan beberapa metode ujian yaitu ujian
dilakuka secara directeddan undirected. disetiap jenis ujian tersebut, jenis
kontrol yang dilakukan oleh penyelenggara berbeda-beda.rancang bangun
perangkat lunak sistem ujian on-line terpadu ini digunakan beberapa metode
ujian, yaitu ujian dapat menggunakan pemrograman socket yang
memanfaatkan bahasa pemrograman C NET 2005. ujian on-line ini
menggunakan arsitektur client server dengan koneksi yang
bersifatconnection oriented atai IP Protokol TCP. untuk memfasilitasi
komunikasi antara client dan server yang berkaitandengan sistem ujian on-
line terpadu. maka diperlukan pemodelan pesan kontrol yang
digunakan.pengujian yang dilakukan pada rancang bangun perangkat lunak
ini adalah pengujian performa terhadap penambahan. jumlah user dan
pengujian fungsionalitas perangkat lunak. dari uji coba terlihat bahwa
penambahan jumlah client memoengaruhi kinerja perangkat lunak.
Sistem Tryout Online Untuk Ujian Masuk Perguruan Tinggi Dengan
Asp.Net, Skripsi ditulis oleh Dian Nashirah (5107 100 520) dari Institut
Teknologi Sepuluh Nopember Surabaya, tahun 2009. Aplikasi Tryout
Online yang dibangun menggunakanASP.NET ini ditujukan untuk
memberikan kemudahan bagi siswa dalam berlatih mengerjakan soal try out
secara online dan mandiri.Tryout bisa dilakukan secara individu maupun
grup yang terdiri dari bidang minat IPA, IPS dan IPC. Selain itu, siswa akan
mendapatkan informasi jurusan yang sesuai dengan nilai tryout yang telah
mereka peroleh. Hal ini diharapkan mampu membantu siswa dalam
mengatasi kebingungan dalam menentukan jurusan apa yang sesuai dengan
kemampuannya. Dengan adanya Tryout Online ini diharapkan peluang
diterimanya calon mahasiswa di Perguruan Tinggi semakin besar.
Rancang Bangun Aplikasi Try Out SNMPTN Berbasis Web, Skripsi ditulis
oleh Fidiani Fauzia (95410104284) dari Sekolah Tinggi Ilmu Komputer
(STIKOM)Surabaya, tahun 2009. Seleksi Nasional Masuk Perguruan Tiggi
Negeri (SNMPTN) merupakan suatu ajang seleksi bagi siswa lulus SMU
untuk masukke perguruan tinggi negeri sesuai dengan jurusan yang
diinginkan. Namun, ada beberapa permasalahan yang sering dihadapi
siswapeminat PTN seperti kurangnya latihan try out karena terbatasnya
waktu dan tempat untuk mengikuti try out, serta mahalnya biaya try- out.
Hal ini membuat banyak peminat PTN gagal masuk ke universitas yang
menjadi pilihan.Untuk menanggulangi hal tersebut, maka perlu adanya
Aplikasi Try Out SNMPTN Berbasis Web. Aplikasi Try Out SNMPTN
Berbasis Webmemiliki kelebihan dapat digunakan dan diakses oleh siswa di
berbagai tempat dan kapan pun dengan menggunakan jaringan internet.
Aplikasi ini menyajikan soal secara acak berdasarkan tingkat kesulitan dan
memberikan sistem penilaian dan soal yang sesuai dengan sistem SNMPTN
sesungguhnya. Aplikasi Try Out SNMPTN berbasis Web ini merupakan
pengembangan denganpenambahan fasilitas yaitu soal bersifat dinamis,
karena ditampilkan secara acak, serta perhitungan nilainya dapat dikelola
untuk disesuaikan dengan standar nilai SNMPTN sebenarnya. Aplikasi Try
Out SNMPTN ini meliputi dua jurusan yaitu IPA dan IPS dan menyajikan
soal berdasar tingkat kesulitannya secara acak. Aplikasi Try Out SNMPTN
berbasis web ini melakukan perhitungan penilaian sesuai standar penilaian
dari SNMPTN yang sebenarnya.
Perancangan Sistem Evaluasi Belajar Online (Studi Kasus: Mata Kuliah
Pemrograman Basis Data II Di Stikom), Skripsi ditulis oleh Indriya Kalana
(03410100074) dari Sekolah Tinggi Ilmu Komputer (STIKOM)Surabaya,
tahun 2009. Pemrograman Basis Data II merupakan salah satu mata kuliah
di STIKOMSurabaya yang memberikan sertifikasi internasional
denganmateri mengenai Procedural Language/Structure Query Language
(PL/SQL). PL/SQL merupakan salah satu materi di dalam ujian sertifikasi
internasional dari Oracle.Saat ini pelaksanaan evaluasi mata kuliah
Pemrograman Basis Data II telah dilaksanakan seperti model pelaksanaan
ujian sertifikasi Oracle. Tetapi dalam pelaksanaan tersebut masih terdapat
beberapa kelemahan sistem.Guna menutup kelemahan yang ada pada sistem
sebelumnya maka perlu dibuat sistem evaluasi belajar online yang baru.
Sistem yang baru ini selain menutup kelemahan sistem sebelumnya, juga
akan mempermudah tugas dosen saat melakukan evaluasi kelas yang
dibinanya karena sistem dapat menghasilkan laporan penilaian secara
otomatis. Berdasarkan serangkaian ujicoba yang telah dilakukan maka dapat
disimpulkan bahwa sistem yang dibuat merupakan salah satu solusi terhadap
permasalahan yang ada pada proses evaluasi mata kuliah Pemrograman
Basis Data II. Hal ini disebabkan sistem yang baru mampu menutupi
kelemahan-kelemahan sistem sebelumnya. Sistem yang baru ini juga
merupakan sistem yang mempermudah tugas dosen dalam pelaksanaan
evaluasi untuk meraih hasil evaluasi yang optimal dan efektif.
Aplikasi Ujian Online Di SMA KATOLIK FRATERAN Surabaya, Skripsi
ditulis oleh Yohanes Budi Hartoyo ( 05410100274) dari Sekolah Tinggi
Ilmu Komputer (STIKOM)Surabaya, tahun 2011. Seiring dengan
meningkatnya kebutuhan akan teknologi informasi, telah menimbulkan
dampak besar bagi kehidupan manusia. Dalam persaingan yang sangat ketat
terutama di bidang industri dan perdagangan, sangat dibutuhkan tenaga ?
tenaga ahli yang mengerti akan teknologi informasi, untuk dapat
meningkatkan daya industri dan daya saing perusahaan mereka.Dengan
adanya ilmu pendidikan yang mencukupi dan didukung dengan teknologi
lang memadahi, telah membuat sekolah tersebut memasuki suatu era baru
yaitu era informasi, yang menuntut segala sesuatunya berjalan dengan cepat
dan efektif. Dengan kemajuan teknologi saat ini diharapkan dapat
menjadikan anak didik menadi lebih kritis dan memiliki kualitas diri yang
dapat diperjuangkan.Kurangnya pemakaian teknologi informasi pada SMA
Katolik Frateran Surabaya, sehingga memiliki dampak pada terhambatnya /
lambatnya proses penilaian dan pengkoreksian suatu ujian, ditamah
banyaknya jumlah siswa yang ditanganioleh setiap guru. Aplikasi SMA
Katolik Frateran Surabaya ini sangatlah dibutuhkan untuk melakukan
penyusunan soal ujian, pengarsipan ujian dan soal ? soal, melakukan
penilaian yang cepat, siswa dapat langsung tahu nilai yang telah dicapai
setelah melakukan ujian, membuat soal yang berbeda antara siswa yang satu
dengan siswa yang lain. Aplikasi SMA Katolik Frateran Surabaya ini juga
membantu pihak sekolah untuk mengurangi jumlah pemakaian kertas
ulangan, juga mempermudahkan guru untuk mencari soal yang tepat untuk
ujian karena telah tersedia dalam bank soal. Dengan demikian diharapkan
aplikasi ini dapat digunakan untuk meningkatkan kualitas siswa, dan
memperingan pekerjaan guru dalam hal mengkoreksi ujian dan perhitungan
nilai akhir ujian siswa tersebut.
Rancang Bangun Sistem Informasi Ujian Online (Studi Kasus : Di SMU 1
Kediri), skripsi ditulis oleh Suhud Arianto (01410100304) dari Sekolah
Tinggi Ilmu Komputer (STIKOM)SURABAYA, tahun 2008. Penerapan
sebuah sistem evaluasi ujian online merupakan salah satu cara bagi sekolah
menengah umum untuk meningkatkan kualitas pendidikan dan pengajaran
yang dimiliki sekolah menengah umum saat ini beserta mutu pengajaran di
masa mendatang. Selama ini, penerapan sistem koreksi ujian masih dengan
cara manual sehingga guru biasanya harus menambah jam kerja untuk
menilai soal ujian para siswa. Dalam kemajuan teknologi yang kian
pesat,tolak ukur tersebut tidak dapat dijadikan sebagai satu-satunya acuan.
Untuk itu dibutuhkan sebuah sistem evaluasi ujian online yang meliputi
tolak ukur finansial maupun non finansial. Sistem evaluasi tersebut adalah
sistem evaluasi ujian online.SMU 1 Kediri adalah salah satu SMU di Kediri
yang mempunyai sistem informasi akademik yang cukup memadai yang
berkeinginan untuk merancang suatu sistem evaluasi ujian online yang dapat
memudahkan guru untuk memberikan nilai serta mengurangi penggunaan
kertas ujian. Ujian online dipakai sebagai kerangka dalam penilaian evaluasi
mata pelajaran yang akan digunakan sebagai bahan ujian.Dengan adanya
sistem evaluasi ujian online proses penilaian ujain dapat dilakukan dengan
efektif dan efisien karena proses penilaian diberikan langsung pada saat
siswa selesai mengerjakan ujian, sehingga siswa dapat mengetahui secara
langsung nilai ujian berupa angka dan huruf.
Pengembangan aplikasi bank soal elektronik untuk mendukung proses
pembuatan soal ujian berkala nasional, skripsi yang ditulis oleh Irpan
Maulana dari Universitas Indonesia Fakultas Ilmu Komputer Jurusan
Teknik Informatika. Aplikasi yang dibangun hanya untuk pembuatan soal
ujian.
Pengembangan prototipe sistem bank soal dan online test, skripsi yang
ditulis oleh Hardi Kusumawijaya dari Universitas Indonesia Fakultas Ilmu
Komputer Jurusan Teknik Informatika.Sistem yang dibangun berupa sistem
bank soal online test.
Rancang Bangun Sistem Informasi Penerimaan siswa Baru Online, Modul:
Rekomendasi yang ditulis oleh pusparani sholikhah, Khokim Ghazali dari
Jurusan Sistem Informasi, Fakultas Teknologi Informasi, Institut Teknologi
Sepuluh Nopember. Mereka membangun sistem informasi ujian untuk
penerimaan siswa baru.
Pembuatan dan Penerapan E-Examination Penerimaan Mahasiswa Baru
Universitas Gunadarma yang ditulis oleh Jesiati dari Universitas
Gunadarma. Aplikasi yang dibangun untuk Penerimaan Mahasiswa Baru.
Penulis membuat aplikasi ini untuk mempermudah pengawasan ujian serta
mempermudah proses penyeleksian mahasiswa baru.
Pembuatan Aplikasi Pembelajaran Online (E-Learning) Untuk Sekolah
Menengah Dan Sederajat yang ditulis oleh Arga Arjana dari Universitas
Sebelas Maret. Metode analisis yang digunakan dalam perancangan dan
pembangunan aplikasi iniadalah metode perancangan berbasis object
oriented melalui tahapan pembuatan UML yang mencakup Use case ,Class
,Sequence dan Activity diagram, pembuatan rancangan basis data, dan
pembuatan rancangan layar. Aplikasi yang dibangun dapat berfungsi
sebagai media komunikasi antara guru dengan murid, pemberian materi
pelajaran, pemberian dan pengumpulan tugas, dan menambah fasilitas
dalam pemberian informasi nilai.
Aplikasi Soal Ujian Pilihan Ganda Dengan Menggunakan Turbo Pascal 7.0
yang ditulis oleh Nur Fauzi Rochim. Merancang suatu aplikasi dalam
penangganan ujian, yang berguna untuk mempermudah pemeriksaan dan
penilaian ujian dibidang akademis dan membuat penangganannya dapat
lebih terorganisir. Penulisan ilmiah ini akan menguraikan tentang
pembuatan aplikasi pemrograman ujian tersebut dan dalam pembuatan
aplikasi ini penulis mengunakan bahasa pemrograman Turbo Pascal 7.0.
Pembuatan Aplikasi Simulasi Ujian Akhir Nasional Untuk smk Dengan
Menggunakan Swish Max yang ditulis oleh Bayu Suwardani Wariin dari
Universitas Gunadarma. Tujuan dari penulisan ini adalah untuk membantu
para siswa mengukur kemampuan dalam melaksanakan Ujian Akhir
Nasional yang sesungguhnya, sehingga bisa mendapatkan hasil yang
maksimal. Penulis berharap apabila dalam desain suatu Ujian Akhir
Nasional dengan menggunakan Swish Max yang menarik sehingga dapat
dinikmati oleh semua siswa SMK yang akan menghadapi Ujian Akhir
Nasional dan dapat dimainkan secara stand-alone, artinya disimpan di dalam
media CD dan diputar di komputer manapun.
Aplikasi Php Pada Website Online Examination yang ditulis oleh Dilar
Darmawan. Internet sebagai salah satu hasil dari kemajuan teknologi
komputer yang telah memberikan dampak transformasional (perubahan
yang sesuai) pada beberapa aspek kehidupan, termasuk di dalamnya dunia
bisnis. Saat ini banyak ditemukan adanya istilah-istilah yang merupakan
dampak dari perkembangan teknologi informasi, antara lain: e-business, e-
commerce, e-service, e-tailing, dan beberapa istilah sejenis. Dari tugas akhir
ini penulis mencoba membuat aplikasi salah satu aplikasi e-service (jasa di
Internet) yaitu situs ujian online, dengan menggunakan PHP sebagai
program aplikasi dan MySQL sebagai server basis data. Pada perancangan
basis data, digunakan teknik normalisasi untuk mendapatkan basis data yang
optimal. Sedangkan pada Data Flow Diagram, digambarkan sistem sebagai
kerja antar fungsi yang berhubungan satu sama lain dengan aliran dan
penyimpanan data.
BAB III
METODE PENELITIAN
Dalam melakukan penelitian, peneliti menggunakan dua metode penelitian
yaitu, metode pengumpulan data dan metode pengembangan sistem. Metode-
metode tersebut diuraikan pada bab ini.
3.1 MetodePengumpulan Data
Dalam rangka menyusun skripsi ini, diperlukan data-data serta
informasi yang relatif lengkap sebagai bahan yang dapat mendukung
kebenaran materi uraian dan pembahasan. Oleh karena itu sebelum
menyusun skripsi ini, dalam persiapannya terlebih dahulu dilakukan riset
atau penelitian untuk menjaring data serta informasi atau bahan materi yang
diperlukan. Metode pengumpulan data yang digunakan meliputi dua
metode, yaitu studi kepustakaan dan kuesioner.
3.1.1 Studi Pustaka
Dalam melakukan pengumpulan data, penulis menggunakan
teknik studi pustaka. Pada tahapan pengumpulan data dengan cara
studi pustaka, penulis mencari referensi-referensi yang relevan
sesuai skripsi yang dibuat. Pencarian referensi dilakukan di
perpustakaan, maupun secara online melalui internet. Setelah
mendapatkan referensi-referensi yang relevan tersebut, penulis lalu
mencari informasi-informasi yang dibutuhkan dalam penelitian ini
dari referensi-referensi tersebut. Informasi yang didapatkan
digunakan dalam penyusunan landasan teori, metode penelitian serta
pengembangan aplikasinya secara langsung. Pustaka-pustaka yang
dijadikan acuan dapat dilihat di Daftar Pustaka.
3.1.2 Wawancara
Pada tahapan ini penulis melakukan wawancara kepada
gurumata pelajaran teknologi informasi dan komunikasi untuk
mendapatkan data yang dibutuhkan terkait dengan penelitian ini.
Wawancara dilakukan 2 tahap. Tahap pertama dilakukan pada
tanggal 16 Mei 2011, tahap kedua dilakukan pada tanggal 20 mei
2011 berlokasi di ruang Laboratorium komputer SMA Al-Azhar
BSD.
Metode wawancara digunakan karena mudah dalam
pengaplikasiannya, penerapannya, murah, dan dapat mengetahui
informasi yang dibutuhkan secara langsung.
Hasil wawancara dengan Bapak Asep Kurniawan, S.Kom, Guru
mata pelajaran teknologi informasi dan komunikasi SMA Al-Azhar
BSD terlampir pada lampiran.
3.1.3 Kuesioner
Penyebaran kuesioner dilakukan dengan menggunakan teknik
Purposive Sampling yang termasuk ke dalam Non Probability
Sampling.Purposive Sampling sendiri menurut Nasution (2003)
adalah pengambilan sampel dilakukan hanya atas dasar
pertimbangan peneliti saja yang menganggap unsur-unsur yang
dikehendaki telah ada dalam anggota sampel yang diambil.
Pada teknik purposive sampling penulis mengggunakan jenis
judgment sampling, yaitu sampel dipilih berdasarkan penilaian
peneliti bahwa dia adalah pihak yang paling baik untuk dijadikan
sampel penelitiannya atau memilih sesuatu atau seseorang menjadi
sampel karena mereka mempunyai “information rich”.
Pada penelitian yang dilakukan di SMA AL-AZHAR jumlah
populasi murid kelas 2 SMA yang diteliti adalah 200 orang. Dengan
menggunakan table krejcie – morgan dengan tingkat kesalahan 5%.
Dengan demikian, jumlah sampel dalam penelitian ini adalah 132
orang (iskandar,2009).
Tabel 4.1 Tabel Krejcie - Morgan
Populasi
(N)
Sampel
(n)
Populasi
(N)
Sampel
(n)
Populasi
(N)
Sampel
(n)
10 10 220 140 1200 291
15 14 230 144 1300 297
20 19 240 148 1400 302
25 24 250 152 1500 306
30 28 260 155 1600 310
35 32 270 159 1700 313
40 36 280 162 1800 317
45 40 290 165 1900 320
50 44 300 169 2000 322
55 48 320 175 2200 327
60 52 340 181 2400 331
65 56 360 186 2600 335
70 59 380 191 2800 338
75 63 400 196 3000 341
80 66 420 201 3500 346
85 70 440 205 4000 351
90 73 460 210 4500 354
95 76 480 214 5000 357
100 80 500 217 6000 361
110 86 550 226 7000 364
120 92 600 234 8000 367
130 97 650 242 9000 368
140 103 700 248 10000 370
150 108 750 254 15000 375
160 113 800 260 20000 377
170 118 850 265 30000 379
180 123 900 269 40000 380
190 127 950 274 50000 381
200 132 1000 278 75000 382
210 136 1100 285 1000000 384
Pada tahap ini penyebaran kuesioner dibagi menjadi 2 tahap.
Yang pertama penyebaran kuesioner dilakukan untuk mengetahui
informasi apa saja yang dibutuhkan oleh user mengenai ujian. dan
yang kedua penyebaran kuesioner dilakukan untuk mengetahui
sejauh mana Aplikasi yang dirancang dapat bermanfaat bagi
pengguna. Penyebaran kuesioner dilakukan pada tanggal 16-20 Mei
2010 berlokasi di gedung SMA Al-Azhar BSD.
Pada tahap penyebaran kuesioner awal, pembagian kuesioner
dilakukan kepada 130 murid kelas 2 SMA Al-Azhar. Dari
penyebaran kuesioner awal yang dilakukan pada tanggal 16 Mei
dapat disimpulkan sebagai berikut :
1. Ujian yang dilakukan masih manual (menggunakan kertas,
ballpoint)
2. Nilai ujian yang diberikan kepada siswa relatif lama
3. Proses pengkopian soal dan pengkoreksian jawaban yang
dilakukan guru menyita waktu
4. Siswa dan guru membutuhkan aplikasi ujian berbasis
multimedia ( soal berupa teks, gambar, audio dan video)
Adapun hasil dari penyebaran Koesioner awal lebih rinci
terlampir pada halaman lampiran.
3.1.4 Studi Literatur
Aplikasi Ujian Madrasah Berbasis Local Area Network (LAN)
studi kasus pada Madrasah Tsanawiyah Al-Muawanah Curug
Tangerang, Skripsi disusun oleh Ali Yahya 10309102959, dari
Universitas Islam Negeri (UIN) Jakarta, tahun 2010. Aplikasi yang
dibuat menggunakan bahasa pemrograman PHP, Database Mysql,
Server Apache dan didukung oleh program lainnya seperti
notepad++, PhotoshopCS dan macromedia dreamweaver dan peneliti
menggunakan metode Rapid Application Development (RAD).
Aplikasi yang dibangun berjalan pada jaringan local LAN. Untuk
memasuki halaman ujian user harus login terlebih dahulu. Urutan
soal yang ditampilkan pada aplikasi bersifat Random
(Acak).Kelebihan : Durasi waktu ujian, Random Soal, Cetak data
siswa, cetak nilai. Kekurangan : Aplikasi ini hanya menampilkan
Teks dan Gambar saja. Tidak adanya random jawaban. Kontribusi :
Durasi waktu ujian,Soal berbasis teks dan gambar, Random Soal,
Cetak data siswa, Cetak Nilai, Pendistribusian sistem pada jaringa
LAN.
Rancang Bangun Perangkat LunakSistem Ujian On-Line
Terpadu BerbasisJaringan, skripsi ditulis oleh Rizki Harris E (5102
100 067) dari Jurusan Teknik InformatikaFakultas Teknologi
InformasiInstitut Teknologi Sepuluh NopemberSurabaya tahun
2007. Sistem Ujian On-line Banyak digunakan dalam
penyelenggaraan ujian saat ini. Ujian Tersebut pada Umumnya
Berbasis Web,Kontrol yang dilakukan oleh penyelenggara terhadap
ujian masih berbasis waktu.pada rancang bangun sistem ujian on-line
terpadu ini digunakan beberapa metode ujian yaitu ujian dilakukan
secara directeddan undirected. disetiap jenis ujian tersebut, jenis
kontrol yang dilakukan oleh penyelenggara berbeda-beda.rancang
bangun perangkat lunak sistem ujian on-line terpadu ini digunakan
beberapa metode ujian, yaitu ujian dapat menggunakanpemrograman
socket yang memanfaatkan bahasa pemrograman C NET 2005. ujian
on-line ini menggunakan arsitektur client server dengan koneksi
yang bersifatconnection oriented atai IP Protokol TCP. untuk
memfasilitasi komunikasi antara client dan server yang
berkaitandengan sistem ujian on-line terpadu. maka diperlukan
pemodelan pesan kontrol yang digunakan.pengujian yang dilakukan
pada rancang bangun perangkat lunak ini adalah pengujian performa
terhadap penambahan. jumlah user dan pengujian fungsionalitas
perangkat lunak.dari uji coba terlihat bahwa penambahan jumlah
client memoengaruhi kinerja perangkat lunak.Kelebihan : Random
Soal. Kekurangan : Soal yang ditampilkan hanya teks saja. Tidak
adanya random jawaban. Kontribusi : Random Soal
Sistem Tryout Online Untuk Ujian Masuk Perguruan Tinggi
Dengan Asp.Net, Skripsi ditulis oleh Dian Nashirah (5107 100 520)
dari Jurusan Teknik InformatikaFakultas Teknologi InformasiInstitut
Teknologi Sepuluh NopemberSurabaya, tahun 2009. Aplikasi Tryout
Online yang dibangun menggunakanASP.NET ini ditujukan untuk
memberikan kemudahan bagi siswadalam berlatih mengerjakan soal
try out secara online dan mandiri.Tryout bisa dilakukan secara
individu maupun grup yang terdiri daribidang minat IPA, IPS dan
IPC. Selain itu, siswa akan mendapatkaninformasi jurusan yang
sesuai dengan nilai tryout yang telah merekaperoleh. Hal ini
diharapkan mampu membantu siswa dalammengatasi kebingungan
dalam menentukan jurusan apa yang sesuaidengan
kemampuannya.Dengan adanya Tryout Online ini diharapkan
peluangditerimanya calon mahasiswa di Perguruan Tinggi semakin
besar.Kelebihan : Random Soal, Hasil dapat menetukan kesesuaian
peminatan. Kekurangan : Aplikasi ini berjalan pada media CD,
sehingga soal tidak dapat diupdate.Kontribusi : Random Soal,
Pendistribusian sistem pada jaringan LAN.
Rancang Bangun Aplikasi Try Out SNMPTN Berbasis Web,
Skripsi ditulis oleh Fidiani Fauzia (95410104284) dari Sekolah
Tinggi Ilmu Komputer (STIKOM)Surabaya, tahun 2009. Seleksi
Nasional Masuk Perguruan Tiggi Negeri (SNMPTN) merupakan
suatu ajang seleksi bagi siswa lulus SMU untuk masukke perguruan
tinggi negeri sesuai dengan jurusan yang diinginkan. Namun, ada
beberapa permasalahan yang sering dihadapi siswapeminat PTN
seperti kurangnya latihan try out karena terbatasnya waktu dan
tempat untuk mengikuti try out, serta mahalnya biaya try- out. Hal
ini membuat banyak peminat PTN gagal masuk ke universitas yang
menjadi pilihan.Untuk menanggulangi hal tersebut, maka perlu
adanya Aplikasi Try Out SNMPTN Berbasis Web. Aplikasi Try Out
SNMPTN Berbasis Webmemiliki kelebihan dapat digunakan dan
diakses oleh siswa di berbagai tempat dan kapan pun dengan
menggunakan jaringan internet. Aplikasi ini menyajikan soal secara
acak berdasarkan tingkat kesulitan dan memberikan sistem penilaian
dan soal yang sesuai dengan sistem SNMPTN sesungguhnya.
Aplikasi Try Out SNMPTN berbasis Web ini merupakan
pengembangan denganpenambahan fasilitas yaitu soal bersifat
dinamis, karena ditampilkan secara acak, serta perhitungan nilainya
dapat dikelola untuk disesuaikan dengan standar nilai SNMPTN
sebenarnya. Aplikasi Try Out SNMPTN ini meliputi dua jurusan
yaitu IPA dan IPS dan menyajikan soal berdasar tingkat kesulitannya
secara acak. Aplikasi Try Out SNMPTN berbasis web ini melakukan
perhitungan penilaian sesuai standar penilaian dari SNMPTN yang
sebenarnya.Kelebihan : pengkategorian soal berdasarkan jurusan.
Kekurangan : Aplikasi ini hanya menampilkan soal berbasis teks,
tidak adanya random jawaban.Kontribusi : Random Soal
Perancangan Sistem Evaluasi Belajar Online (Studi Kasus:
Mata Kuliah Pemrograman Basis Data II Di Stikom), Skripsi ditulis
oleh Indriya Kalana (03410100074) dari Sekolah Tinggi Ilmu
Komputer (STIKOM)Surabaya, tahun 2009. Pemrograman Basis
Data II merupakan salah satu mata kuliah di STIKOM SURABAYA
yang memberikan sertifikasi internasional denganmateri mengenai
Procedural Language/Structure Query Language (PL/SQL). PL/SQL
merupakan salah satu materi di dalam ujian sertifikasi internasional
dari Oracle.Saat ini pelaksanaan evaluasi mata kuliah Pemrograman
Basis Data II telah dilaksanakan seperti model pelaksanaan ujian
sertifikasi Oracle. Tetapi dalam pelaksanaan tersebut masih terdapat
beberapa kelemahan sistem.Guna menutup kelemahan yang ada pada
sistem sebelumnya maka perlu dibuat sistem evaluasi belajar online
yang baru. Sistem yang baru ini selain menutup kelemahan sistem
sebelumnya, juga akan mempermudah tugas dosen saat melakukan
evaluasi kelas yang dibinanya karena sistem dapat menghasilkan
laporan penilaian secara otomatis.Berdasarkan serangkaian ujicoba
yang telah dilakukan maka dapat disimpulkan bahwa sistem yang
dibuat merupakan salah satu solusi terhadap permasalahan yang ada
pada proses evaluasi mata kuliah Pemrograman Basis Data II. Hal ini
disebabkan sistem yang baru mampu menutupi kelemahan-
kelemahan sistem sebelumnya. Sistem yang baru ini juga merupakan
sistem yang mempermudah tugas dosen dalam pelaksanaan evaluasi
untuk meraih hasil evaluasi yang optimal dan efektif.Kekurangan
:Aplikasi ini hanya menampilkan soal berbasis teks, tidak adanya
random soal.Kontribusi :Random Soal
Aplikasi Ujian Online Di SMA KATOLIK FRATERAN
Surabaya, Skripsi ditulis oleh Yohanes Budi Hartoyo (
05410100274) dari Sekolah Tinggi Ilmu Komputer
(STIKOM)Surabaya, tahun 2011. Seiring dengan meningkatnya
kebutuhan akan teknologi informasi, telah menimbulkan dampak
besar bagi kehidupan manusia. Dalam persaingan yang sangat ketat
terutama di bidang industri dan perdagangan, sangat dibutuhkan
tenaga ? tenaga ahli yang mengerti akan teknologi informasi, untuk
dapat meningkatkan daya industri dan daya saing perusahaan
mereka.Dengan adanya ilmu pendidikan yang mencukupi dan
didukung dengan teknologi lang memadahi, telah membuat sekolah
tersebut memasuki suatu era baru yaitu era informasi, yang menuntut
segala sesuatunya berjalan dengan cepat dan efektif. Dengan
kemajuan teknologi saat ini diharapkan dapat menjadikan anak didik
menadi lebih kritis dan memiliki kualitas diri yang dapat
diperjuangkan.Kurangnya pemakaian teknologi informasi pada SMA
Katolik Frateran Surabaya, sehingga memiliki dampak pada
terhambatnya / lambatnya proses penilaian dan pengkoreksian suatu
ujian, ditambah banyaknya jumlah siswa yang ditanganioleh setiap
guru. Aplikasi SMA Katolik Frateran Surabaya ini sangatlah
dibutuhkan untuk melakukan penyusunan soal ujian, pengarsipan
ujian dan soal? melakukan penilaian yang cepat, siswa dapat
langsung tahu nilai yang telah dicapai setelah melakukan ujian,
membuat soal yang berbeda antara siswa yang satu dengan siswa
yang lain.Aplikasi SMA Katolik Frateran Surabaya ini juga
membantu pihak sekolah untuk mengurangi jumlah pemakaian
kertas ulangan, juga mempermudahkan guru untuk mencari soal
yang tepat untuk ujian karena telah tersedia dalam bank soal.Dengan
demikian diharapkan aplikasi ini dapat digunakan untuk
meningkatkan kualitas siswa, dan memperingan pekerjaan guru
dalam hal mengkoreksi ujian dan perhitungan nilai akhir ujian siswa
tersebut. Kekurangan : Aplikasi ini hanya menampilkan soal
berbasis teks, tidak adanya random soal. Kontribusi : Random Soal
Rancang Bangun Sistem Informasi Ujian Online (Studi Kasus :
Di SMU 1 Kediri), skripsi ditulis oleh Suhud Arianto (01410100304)
dari Sekolah Tinggi Ilmu Komputer (STIKOM) SURABAYA,
tahun 2008. Penerapan sebuah sistem evaluasi ujian online
merupakan salah satu cara bagi sekolah menengah umum untuk
meningkatkan kualitas pendidikan dan pengajaran yang dimiliki
sekolah menengah umum saat ini beserta mutu pengajaran di masa
mendatang. Selama ini, penerapan sistem koreksi ujian masih
dengan cara manual sehingga guru biasanya harus menambah jam
kerja untuk menilai soal ujian para siswa. Dalam kemajuan teknologi
yang kian pesat,tolak ukur tersebut tidak dapat dijadikan sebagai
satu-satunya acuan. Untuk itu dibutuhkan sebuah sistem evaluasi
ujian online yang meliputi tolak ukur finansial maupun non finansial.
Sistem evaluasi tersebut adalah sistem evaluasi ujian online.SMU 1
Kediri adalah salah satu SMU di Kediri yang mempunyai sistem
informasi akademik yang cukup memadai yang berkeinginan untuk
merancang suatu sistem evaluasi ujian online yang dapat
memudahkan guru untuk memberikan nilai serta mengurangi
penggunaan kertas ujian. Ujian online dipakai sebagai kerangka
dalam penilaian evaluasi mata pelajaran yang akan digunakan
sebagai bahan ujian.Dengan adanya sistem evaluasi ujian online
proses penilaian ujain dapat dilakukan dengan efektif dan efisien
karena proses penilaian diberikan langsung pada saat siswa selesai
mengerjakan ujian, sehingga siswa dapat mengetahui secara
langsung nilai ujian berupa angka dan huruf. Kekurangan :Aplikasi
ini hanya menampilkan soal berbasis teks. Kontribusi :Random
Soal
Pengembangan aplikasi bank soal elektronik untuk mendukung
proses pembuatan soal ujian berkala nasional, skripsi yang ditulis
oleh Irpan Maulana dari Fakultas Ilmu Komputer Jurusan Teknik
Informatika. Aplikasi yang dibangunhanyauntukpembuatansoalujian.
Pengembangan prototipe sistem bank soal dan online test,
skripsi yang ditulis oleh Hardi Kusumawijaya dari Fakultas Ilmu
Komputer Jurusan Teknik Informatika.Sistem yang
dibangunberupasistem bank soal online test. Kelebihan : Random
Soal, Sistem test online, Soalberbasisteksdangambar. Kekurangan :
Tidak berbasis multimedia. Kontribusi : Random Soal, Soal
berbasis teks dan gambar
Rancang Bangun Sistem Informasi Penerimaan siswa Baru
Online, Modul: Rekomendasi yang ditulis oleh pusparani sholikhah,
Khokim Ghazali dari Jurusan Sistem Informasi, Fakultas Teknologi
Informasi, Institut Teknologi Sepuluh Nopember. Mereka
membangun sistem informasi ujian untuk penerimaan siswa baru.
Kelebihan : sistem ini sudah terintegrasi dengan database, data yang
lulus atau tidaknya dapat diprint out. Kekurangan : sistem ini tidak
berbasis multimedia. Soal yang disajikan tidak dapat dirandom.
Peserta ujianpun tidak dapat melihat nilai secara langsung.
Pembuatan dan Penerapan E-Examination Penerimaan
Mahasiswa Baru Universitas Gunadarma yang ditulis oleh Jesiati
dari Universitas Gunadarma. Aplikasi yang dibangun untuk
Penerimaan Mahasiswa Baru. Penulis membuat aplikasi ini untuk
mempermudah pengawasan ujian serta mempermudah proses
penyeleksian mahasiswa baru. Kelebihan : dapat terhubung dengan
website Universitas Gunadarma, dapat menampilkan informasi yang
update. Kekurangan : Ujian ini hanya berbentuk file yang
didownload oleh mahasiswa yang kemudian diisi dirumah.
Pembuatan Aplikasi Pembelajaran Online (E-Learning) Untuk
Sekolah Menengah Dan Sederajat yang ditulis oleh Arga Arjana dari
Universitas Sebelas Maret. Metode analisis yang digunakan dalam
perancangan dan pembangunan aplikasi iniadalah metode
perancangan berbasis object oriented melalui tahapan pembuatan
UML yang mencakup Use case ,Class ,Sequence dan Activity
diagram, pembuatan rancangan basis data, dan pembuatan rancangan
layar. Aplikasi yang dibangun dapat berfungsi sebagai media
komunikasi antara guru dengan murid, pemberian materi pelajaran,
pemberian dan pengumpulan tugas, dan menambah fasilitas dalam
pemberian informasi nilai. Kelebihan : sebagai media komunikasi
antara guru dengan murid, pemberian materi pelajaran, pemberian
dan pengumpulan tugas, dan menambah fasilitas dalam pemberian
informasi nilai. Kekurangan : Aplikasi ini tidak menampilkan Ujian
secara langsung.
Pembuatan Aplikasi Simulasi Ujian Akhir Nasional Untuk smk
Dengan Menggunakan Swish Max yang ditulis oleh Bayu Suwardani
Wariin dari Universitas Gunadarma. Tujuan dari penulisan ini adalah
untuk membantu para siswa mengukur kemampuan dalam
melaksanakan Ujian Akhir Nasional yang sesungguhnya, sehingga
bisa mendapatkan hasil yang maksimal. Penulis berharap apabila
dalam desain suatu Ujian Akhir Nasional dengan menggunakan
Swish Max yang menarik sehingga dapat dinikmati oleh semua
siswa SMK yang akan menghadapi Ujian Akhir Nasional dan dapat
dimainkan secara stand-alone, artinya disimpan di dalam media CD
dan diputar di komputer manapun. Kekurangan : Aplikasi ini tidak
terintegrasi oleh jaringan dan tidak mempunyai data base. Aplikasi
ini juga tidak berbasis multimedia.
Dari studi literatur di atas didapatkan kontribusi untuk pembuatan
aplikasi ujian yang memiliki fitur sebagai berikut :
1. Durasi waktu ujian, yaitu waktu ujian yang dapat ditentukan. Ketika
waktu ujian telah selesai, maka secara otomatis ujian selesai dan sistem
akan memproses jawaban.
2. Random Soal, yaitu soal yang diacak berdasarkan urutan soal, sehingga
siswa akan menghadapi urutan soal yang berbeda-beda.
3. Tampilan soal berupa gambar, aplikasi tidak hanya dapat menmpilkan
soal berupa teks, namun dapat menampilkan soal berupa gambar.
4. Aplikasi yang dapat menampilkan nilai secara langsung. Nilai akan
diproses dan ditampilkan secara langsung kepada siswa pada saat itu
juga.
5. Cetak data siswa dan data nilai siswa. Guru dapat melakukan cetak data
siswa dan data nilai siswa yang tersimpan dalam database.
6. Pendistribusian sistem pada jaringan LAN. Aplikasi yang akan
dijalankan pada jaringan LAN. Sehingga ujian dilakukan secara
bersama-sama dan dapat dilihat serta dikontrol oleh guru secara
langsung.
3.2 Metode Pengembangan Aplikasi Multimedia
Metode penelitian yang digunakan oleh penulis dalam pembuatan
aplikasi ini yaitu menggunakan metode Interactive Multimedia System
Design & Development Cycle (Siklus Perancangan dan Pengembangan
Sistem Multimedia Interaktif) atau IMSDD Cycle.(Dastbaz,2003)
Menurut Dasbaz tahapan dari siklus perancangan dan pengembangan
sistem multimedia interaktif ini terdiri 4 tahap yakni :
3.2.1 Kebutuhan Sistem (System Requirement)
Tahap ini adalah bagian definisi umum dari IMSDD dan
lingkungannya berikut dengan alat-alat pengembangan sistem. Tahap
ini memiliki beberapa fungsi utama sebagai berikut:
A. Pendefenisian Sistem (System Defenition)
Pada tahap ini dilakukan pendefinisian sistem dengan
merencanakan secara garis besar tujuan dan objektifitas sistem.
Sistem yang dibangun yaitu sebuah sistem multimedia interaktif
yang akan menampilkan soal-soal yang kemudian diisi oleh user.
Tujuan dibangunnya sistem ini adalah untuk merancang sistem
berbasis multimedia yang dapat menyajikan tampilan soal yang
menarik juga sistem penilain yang keluar saat itu juga dengan
melalui database.
B. Kebutuhan Dan ProfilPengguna (User’s Profile And Needs)
Pada tahap ini dijelaskan pengguna yang potensial dari
sistem yang dibangun dan jika terdapat kebutuhan khusus yang
harus diambil dari pengguna dapat digunakan sebagai bahan
pertimbangan. Untuk mengetahui kebutuhan dari pengguna
potensial sistem, penulis melakukan penyebaran kuesioner
dilakukan pada 130 siswa kelas 2 SMA dan 6 guru untuk
mengetahui informasi apa saja yang dibutuhkan oleh user.
C. Pertimbangan Perangkat Keras Dan Perangkat Lunak (Hardware
and Software Consideration)
Tahap ini dilakukan evaluasi kebutuhan terhadap perangkat
keras maupun perangkat lunak dan membuat pilihan yang tepat
terhadap perangkat-perangkat tersebut. Pemilihan authoring
tools yang akan digunakan guna mengintegrasikan elemen-
elemen multimedia juga termasuk dalam tahap pertimbangan
perangkat lunak.
D. Pertimbangan Penyebaran Sistem (Delivery Consideration)
Setelah kebutuhan akan hardware, software, dan authoring
tools telah ditentukan. Pada tahap ini dilakukan pertimbangan
mengenai penyebaran sistem yang akan digunakan. Dalam
perancangan dan pengembangan sistem multimedia penulis
menggunakan media Jaringan berupa Localhost.
3.2.2 PertimbanganPerancangan (Design Consideration)
Tujuan dari tahap ini adalah untuk memberi gambaran yang jelas dari
rincian desain. Tahap ini bermaksud untuk menjelaskan hal-hal
berikut:
A. Desain Metaphor
Menentukan sebuah pemodelan dari dunia nyata (real world
mental model) yang digunakan sebagai kunci dalam solusi
perancangan antarmuka sistem. Pemodelan dari dunia nyata yang
dijadikan design metaphor dalam perancangan sistem ini adalah
beberapa buku/lks yang menjadi rujukan.
B. Tipe Informasi
Mendefinisikan tipe-tipe informasi yang perlu diintegrasikan
kedalam sistem seperti teks, gambar berformat JPEG dan PNG,
suara berformat MP3, video berformat FLV dan animasi
berformat SWF.
C. Struktur Navigasi
Untuk menjelaskan strategi navigasi, termasuk didalamnya
struktur link dan fitur-fitur yang akan mencegah terjadinya
masalah yang berhubungan dengan sistem hypermedia seperti
disorientasi dalam menjelajahi sistem.
D. MasalahIntegrasidanPersiapan Media (Media Preparation and
Integration Issues)
Memperhatikan media lain yang mungkin dapat terintegrasi
dalam pembangunan sistem, seperti hubungan multimedia
authoring tools dengan database, media untuk melakukan
rekaman suara maupun media untuk mentransfer video analog
menjadi format digital. Hasil dari tahapan ini dapat berupa bagan
storyboard. Storyboard akan memperlihatkan tampilan seperti
apa yang akan dibangun nantinya pada tahap implementasi, juga
akan ditunjukan elemen multimedia apa saja yang akan diikut
sertakan dalam tiap layarnya.
3.2.3 Implementasi (Implementation)
Setelah melakukan pendefinisian masalah dan perancangan sistem,
tahap yang selanjutnya dilakukan adalah implementasi, dimana
sistem mulai dibangun. Tahap implementasi terdiri dari :
A. Prototyping
Pada tahap prototyping dibuat sebuah visualisasi awal dari sistem
yang dibangun, berupa user interface, testing program untuk
mendapatkan feedback dari pengguna potensial.
B. Beta Testing
Setelah tahap prototyping menghasilkan blue print, maka system
dapat dibangun sesuai dengan kebutuhan sesungguhnya dan
rancangan yang telah di tentukan pada tahap awal.Tahap ini pula
sistem dibangun secara keseluruhan dan selanjutnya dilakukan
mekanisme pengujian.
3.2.4 Evaluasi (Evaluation)
Pada tahap ini dilakukan pengujian terhadap sistem yang dibangun.
Fungsi dari evaluasi adalah untuk memastikan bahwa sistem
multimedia yang dibangun sesuai dengan tujuan yang direncanakan
diawal. Tahap evaluasi dapat dilakukan salah satunya dengan
menyebarkan kuesioner evaluasi pada pengguna potensial. Dari sana
akan didapatkan feedback langsung tentang sistem yang dibangun
secara keseluruhan.
3.3 Bahan dan Peralatan
Adapun bahan atau peralatan yang akan digunakan dalam perancangan
sistem ini adalah sebagai berikut:
3.3.1 Bahan
Bahan yang digunakan penelitian ini adalah hasil dari kuesioner
yang disebarkan kepada responden untuk mendapatkan informasi
mengenai kebutuhan akan keberadaan sistem yang akan dibangun
dan infornasi yang diharapkan oleh user dari sistem.
3.3.2 Peralatan
Peralatan penelitian yang digunakan terbagi menjadi dua bagian,
yaitu perangkat keras dan perangkat lunak.
1. PerangkatKeras
a. Processor Intel Pentium IV 1.80GHz
b. Monitor LG Studioworks 505G 15”
c. RAM DDR 512MB
d. Harddisk Maxtor 30GB
e. Graphic card 64MB,NVIDIA GeForce2 MX/MX 400
f. DVD-RW Lite-On 18x
g. Sound Card
h. Speaker Active
i. Keyboard Standart
j. Optical Mouse Mediatech
2. PerangkatLunak
Dalam penelitian ini digunakan perangkat lunak :
a. Package Program (Application)
1. Macromedia Flash MX 2004
2. Adobe Photoshop CS3
3. Apache
4. Xampp
5. PHP
6. My SQL
7. Ulead Visual Studio
8. CoolEdit
b. Script Program
1. ActionScript 2.0
2. PHP
3. Program pendukung
a. Xilisof Video Converter Ultimate
b. Flash Player
BAB IV
HASIL DAN PEMBAHASAN
4.1 Profile Sekolah
4.1.1 Sejarah Yayasan Muslim Al-Azhar BSD
Dalam rangka mencerdaskan kehidupan bangsa seperti yang
diamanatkan dalam pembukaan UUD 1945, dewan pendiri Yayasan
Muslim Al-Azhar BSD Serpong telah berinisiatof membangun
perguruan islam Al-Azhar BSD Serpong yang tercermin dalam akta
notaris pembangunan fisik sekolah TK, SD, SMP, dan SMU Islam Al-
Azhar BSD Serpong serta masjid As-Syarif merupakan wujud nyata
dalam upaya tersebut.
Penyelenggara pendidikan di perguruan islam Al-Azhar BSD
Serpong diarahkan pada terbentuknya kualitas generasi muda yang
berilmu pengetahuan, berwawasan luas, memiliki kepribadian dan
mental spiritual yang tinggi. Untuk tujuan tersebut, secara teknis pada
awal penyelenggaran sekolah, Yayasan Muslim Al-Azhar BSD Serpong
bekerjasama dengan Yayasan Syifa Budi pengelola Perguruan Islam Al-
Azhar Kemang Jakarta Pimpinan Bapak. H. Maulwi Saelan.
Pada tanggal 23 Juni 1992 bertempat di Hotel Horison Jakarta,
kedua Yayasan mendatangani surat perjanjian kesepakatan dan
kesepahaman kerjasama antara Yayasan Muslim Al-Azhar BSD
Serpong dengan Yayasan Syifa Budi dalam penandatanganan.
Dengan bekal semangat dan dukungan dewan pendiri Yayasan
Muslim Al-Azhar Bsd Serpong serta PT. BUMI SERPONG DAMAI
dibawah bimbingan A-Azhar kemang pada tanggal 20 Juli 1992
diresmikan pembukaan sekolah Taman Kanak-kanak dan Sekolah
Dasar Islam Al-Azhar BSD Serpong filial Al-Azhar Kemang Jakarta.
Pada periode berikutnya seiring dengan selesainya siswa TK
untuk menyelesaikan pendidikannya, maka dimnulai berdirinya SD
Islam Al-Azhar BSD Serpong menggunakan 3 kurikulum yaitu :
Kurikulum Dikbud, Depag, dan Al-Azhar sendiri. Dari 3 pijakan ini
kemnudian dikaji secara mendalam, maka lahirlah kurikulum yang
dipakai Al-Azhar BSD Serpong.
Ketika pemerintahan mencoba membuat perubahan pendidikan,
khususnya kurikulum KBK, tepatnya tahun 2001. SD Islam Al-Azhar
BSD Serpong ditunjuk oleh pusat kurikulum untuk menerapkan
kurikulum 2004, sebagai mini piloting sampai sekarang. Sekolah Dasar
Islam Al-Azhar BSD Serpong sebagai lembaga pendidikan formal
terobsesi berupaya mendekati dan menjawab harapan diatas, karenanya
lembaga ini selalu merespon dan menyikapi perubahan-perubahan
social atau perkembangan pendidikan, untuk meningkatkan mutu dan
kualitas pendidikan. Secara aplikatif sikap yang diterapkan SD Al-
Azhar BSD Serpong ialah memberdayakan kelas secara maksimal,
sehingga mengedepankan interaksi guru dan murid yang bermutu
menjadi perhatian utama, disamping pembinaan SDM secara
terprogram dan kelengakapan alat-alat KBM.
Dalam kesempatan berikutnya, berdasarkan Surat Keputusan
Kepala Kantor Wilayah Departemen Pendidikan dan Kebudayaan
Provinsi Jawa Barat No : 862/102/Kep/E/94 tertanggal 09 November
1994, SMP Islam Al-Azhar BSD Serpong mulai menyelenggarakan
pendidikannya pada tahun pelajaran 1993/1994. Dan pada tahun
pelajaran 1996/1997 SMP Islam Al-Azhar BSD telah terakreditasi oleh
kanwil. Depdikbud Provinsi Jawa Barat dengan hasil nilai penyetaraan
“DISAMAKAN”.
SMA Islam Al-Azhar BSD Serpong didirikan oleh Yayasan
Muslim Al-Azhar BSD Serpong dengan Surat Keputusan, nomor : SK-
05/YMBSD/VI/1996, tanggal 15 Juni 1996; dan melalui Surat
Keputusan Kepala Kantor Wilayah Departemen Pendidikan dan
Kebudayaan Jawa Barat nomor : 34/102.1/Kep/OT/1998, 15 Januari
1998. Dengan dibukanya SMA Islam Al-Azhar BSD Serpong, maka
Yayasan Muslim Al-Azhar BSD Serpong genap menyelenggarakan
pekat pendidikan mulai dari Pra Sekolah, Pendidikan Dasar dan
Pendidikan Menengah.
Pada tahun 2000 dengan dikeluarkannya SK kanwil Diknas Jawa
Barat No. 27/102.7g/MN/2000 tanggal 26 januari 2000, lembaga
dibawah Depdiknas tersebut member status DISAMAKAN pada
sekolah ini, dan pada periode berikutnya, SMA Islam Al-Azhar BSD
Serpong menambah kualifikasinya dengan terakreditasinya lembaga ini
oleh Badan Akreditasi Sekolah Provinsi Banten, Berdasarkan Surat
Keputusan N0. 02/BAS/MN/IV/2005 dengan hasil “TERAKREDITASI
A”, dalam akreditasi tahap kedua tanggal 18 April 2005.
Dengan masing-masing unit TK, SD, SMP, SMA mendapatkan
kualifikasi terbaik pada jenjang dan tingkatannya, maka akan menjadi
modal sekaligus tantangan untuk menghasilkan implikasi pendidikan,
social kemasyarakatan serta tujuan lain yang diharapkan bagi sebuah
lembaga pendidikan, seperti Al-Azhar BSD.
4.1.2 Visi dan Misi Yayasan Muslim Al-Azhar BSD
4.1.2.1 Visi Yayasan Muslim Al-Azhar BSD
1. Menjadikan Perguruan Islam Al-Azhar BSD
Serpong sebagai pusat pengembangan pendidikan.
2. Menghasilkan kader pemimpin dan intelektual
muslim yang berwawasan luas, tanggap terhadap
lingkungan dan siap bersaing dalam era globalisasi
sehingga mampu memperbaiki kualitas hidup bangsa
Indonesia.
4.1.2.2 Misi Yayasan Muslim Al-Azhar BSD
a. Menyelengarakan Pendidikan umum yang
bernafaskan Islam.
b. Menyelengarakan Pendidikan yang menumbuh
kembangkan potensi siswa untuk menjadi manusia
seutuhnya.
c. Menghasilkan lulusan yang kompeten, trampil dan
bermutu.
d. Menghasilkan sumber daya manusia yang berguna
bagi dirinya, bangsa dan agama.
e. Menjadi lembaga pendidikan yang terunggul.
4.1.3 Struktur Organisasi
Di dalam suatu perusahaan atau organisasi, struktur
organisasi merupakan elemen yang sangat penting. Karena
struktur organisasi yang baik, maka fungsi dan manajemen
organisasi tersebut akan baik pula. Berikut struktur organisasi
lembaga pendidikan Yayasan Muslim Al-Azhar BSD.
Gambar 4.1 Struktur Organisasi Yayasan Muslim Al-azhar
Jumlah siswa kelas XI SMA pada tahun ajaran 2010/2011 adalah
200 orang dengan rincian sebagai berikut :
TABEL 4.1 Jumlah Siswa Kelas XI SMA (Sumber : SMA Al-
Azhar)
IPA 1 IPA 2 IPS 1 IPS 2 IPS 3 IPS 4 JUMLAH KETERANGAN
L
P
34 35 34 33 31 34 200 90 110
Analisis Sistem
Uraian Sistem Berjalan
Pelaksanaan ujian mata pelajaran teknologi informasi dan
komunikasi yang berlangsung di SMA Al-Azhar antara lain sebagai
berikut :
SISWA DAN SISWI AL-AZHAR BSD
YAYASAN
PELAKSANA HARIAN
BAGIAN SDM & KUR BAGIAN
UMUM
BAGIAN
KEUANGAN
MAJELIS
SD TK SMA SMP
1. Proses ujian yang dilakukan oleh guru mata pelajaran teknologi
informasi dan komunikasi berbasis kertas
2. Proses pengoreksian jawaban siswa secara manual dengan
mengoreksi sattu persatu peserta ujian
3. Informasi hasil ujian siswa didapat melalui wali kelas
mulai
Guru
membuat
soal
Guru
Mengcopy
soal
Guru
Memberikan
soal kepada
siswa
Siswa
mengisi
soal
Siswa
menyerahkan
hasil jawaban
Kepada guru
Guru
mengoreksi
jawabn siswa
Guru
memberikan
hasil nilai
ujian kepada
wali kelas
Wali kelas
memberikan
informasi
hasil ujian
kepada siswa
Selesai
Gambar 4.2 Flowchart sistem berjalan
Analisis Permasalahan
Dari uraian sistem yang berjalan, penulis memaparkan
beberapa permasalahan yang terjadi pada sistem ujian di SMA Al-
Azhar yaitu sebagai berikut :
1. Belum adanya sistem ujian yang baik sehingga kecurangan
siswa dalam menghadapi ujian sangat mudah dilakukan
2. Proses terbentuknya soal ujian masih bersifat manual dan
belum ada sistem ujian terkomputerisasi yang dapat
memudahkan siswa dan guru dalam ujian
3. Proses penyampaian hasil ujian kepada siswa secara manual
dengan pengoreksian jawaban setiap siswa.
Dengan melihat permasalahan yang terjadi pada sistem ujian
di SMA Al-Azhar, maka penulis mengusulkan solusi pemecahan
masalah tersebut. Sehingga diharapkan sistem ini nantinya akan
dapat membantu sekolah dalam ujian. Solusi yang penulis usulkan
adalah dengan merancang aplikasi ujian mata pelajaran teknologi
informasi dan komunikasi berbasis multimedia. Aplikasi ini
dirancang dengan menggunakan Flash pada tampilan aplikasi dan
didikung oleh PHP pada tampilan aplikasi backend.
Solusi Pemecahan Masalah
Adapun usulan berdasarkan analisis sistem yang sudah ada
sebagai berikut :
1. Didalam sistem ujian ini terdapat 2 pengguna yaitu guru
sebagai admin dan siswa sebagai user atau pengguna
2. Guru melakukan input siswa yang akan melakukan ujian, input
soal berupa teks, gambar, audio dan video. Kemudian guru
melakukan konfigurasi waktu ujian yang diberikan,
konfigurasi soal yang akan diuji dan konfigurasi point tiap
jawaban yang benar
3. Guru dapat melakukan edit admin, edit soal dan edit
konfigurasi
4. Selanjutnya siswa harus login sesuai dengan nama dan
password yang telah diberikan oleh guru untuk dapat
melakukan ujian
5. Dalam proses ujian tiap siswa akan mengalami urutan soal dan
jawaban yang berbeda-beda karena sistem yang akan dibangun
menggunakan Random soal dan Random Jawaban.
6. Setelah siswa selesai melakukan ujian dan memproses hasil
jawaban yang telah di isi, maka secara otomatis sistem akan
memproses jawaban dan menampilkan nilai ujian yang
diperoleh siswa saat itu juga.
7. Setelah proses ujian dilakukan guru dapat melihat data siswa
yang melakukan ujian dan data nilai siswa secara keselurahan.
8. Kemudian guru dapat melakukan proses cetak siswa dan cetak
nilai siswa sebagai bentuk laporan hasil ujian yang telah
dilaksanakan.
Kebutuhan Sistem
Menganalisis kebutuhan aplikasi dari medefenisikan sistem, profil
pengguna, kebutuhan perangkat baik hardware, software maupun perangkat
lain yang dapat membantu dalam membangun Aplikasi Ujian Mata
Pelajaran TIK Berbasis Multimedia.
Pendefenisian Sistem
Aplikasi Ujian Mata Pelajaran TIK Berbasis Multimedia
adalah sebuah aplikasi yang menampilkan ujian untuk siswa kelas
XI SMA. Aplikasi ini dikemas dengan multimedia agar soal yang
disajikan menjadi lebih menarik dan mudah dipahami oleh
pengguna. Selain membantu murid dalam mendapatkan nilai secara
langsung. Aplikasi ini juga membantu guru dalam pengoreksian
soal dan pemberian nilai kepada seluruh siswa SMA.
Aplikasi yang dibangun terdiri dari dua bagian, yaitu aplikasi
frontend dan aplikasi backend.
1. Aplikasi Frontend
Frontend merupakan aplikasi utama yang akan
digunakan user (siswa) untuk menghadapi ujian yaitu
menjawab soal, dan menampilkan hasil kepada user berupa
nilai. Dalam penggunaan aplikasi ini setiap siswa harus login
terlebih dahulu. Aplikasi yang dibangun menggunakan
animasi frame 2 dimensi dengan teknik animasi motion tween
dan movie clip. Animasi ini berjalan ketika user mengklik
menu.
2. Aplikasi Backend
Merupakan aplikasi pendukung dari aplikasi frontend,
yang digunakan untuk memproses login admin (guru) dan
user(siswa), melakukan update dan menambahkan data agar
informasi berupa soal dan user yang ada nantinya dapat terus
di update, memproses nilai, melakukan cetak data siswa dan
cetak nilai siswa. Aplikasi ini hanya akan dijalankan oleh
admin, Aplikasi Backend dibangun menggunakan PHP yang
telah terkoneksi database dengan aplikasi frontend. File yang
telah diupdate akan tersimpan dalam bentuk database yaitu
.sql.
Kebutuhan Dan Profil Pengguna
Berdasarkan hasil wawancara dan kuesioner pada lampiran 1
dan 2. peneliti mendapatkan informasi kebutuhan pengguna
aplikasi dan profil pengguna yang akan menggunakan aplikasi ini,
yaitu:
Pengguna membutuhkan aplikasi multimedia yang dapat
menampilkan soal berupa teks, gambar, audio dan video serta dapat
memproses nilai dan menampilkan nilai secara langsung. Jika
pengguna dapat ujian dan dapat melihat nilai secara langsung maka
pengguna dapat menghemat waktu dalam proses ujian.
Profil pengguna aplikasi adalah user yang memiliki
pengetahuan dan kemampuan komputer rendah atau sedang (belum
pernah atau pernah mengoperasikan aplikasi komputer
menggunakan mouse), tidak cacat penglihatan, pendengaran dan
tidak buta dan tidak cacat tangan.
Pertimbangan Perangkat Keras Dan Perangkat Lunak
Berdasarkan tahap pendefinisian sistem yang penulis
lakukan, adapun pertimbangan terhadap kebutuhan perangkat baik
hardware, software komputer maupun perangkat pendukung lain
untuk membangun aplikasi ujian mata pelajaran TIK berbasis
multimedia adalah sebagai berikut :
1. Kebutuhan perangkat keras
Merupakan kebutuhan hardware komputer yang akan
digunakan untukmembangun aplikasi ujian sekolah berbasis
multimedia. Hardware komputer yangperlu disiapkan adalah :
a. Monitor Komputer sebagai layar display.
b. CPU lengkap dengan spesifikasi minimal Processor
Pentium 1.6 GHz,Memori 256 MB dan Harddisk 10GB.
c. Graphic card dengan spesifikasi minimal 64MB.
d. Speaker atau Headset.
e. Keyboard dan Mouse.
f. Jaringan LAN
2. Kebutuhan Perangkat Lunak
Merupakan kebutuhan software komputer yang akan
digunakan untuk membangun Aplikasi Ujian Mata Pelajaran
TIK Berbasis Multimedia. Software komputer yang perlu
disiapkan adalah :
a. Sistem Operasi Windows XP Professional Edition. Versi
windows dari microsoft ini merupakan versi windows yang
cukup baik untuk pengembangan aplikasi multimedia.
b. Software pengolah image untuk memanipulasi still image.
c. sound editor untuk pengolahan audio
d. video editor untuk pengolahan video
e. Programmming tools untuk mengolah web pages
berbentuk PHP dan mengolahdatabase.
3. Kebutuhan Fungsionalitas
Kebutuhan Fungsionalitas untuk aplikasi ini adalah :
a. Fitur online test, dimana user dapat melakukan tes secara
online menggunakan komputer secara langsung dalam
menjawab soal-soal ujian
b. Fitur autentikasi user untuk mengakses sistem.
c. Fitur untuk penambahan, penghapusan soal dan modifikasi
soal
d. Fitur random soal dan jawaban
e. Fitur soal berupa gambar, audio dan video
f. Fitur untuk memberikan nilai kepada user yang telah
mengisi soal
g. Fitur untuk penambahan dan penghapusan account user.
h. Fitur untur mengatur jumlah soal yang diuji
i. Fitur untuk mengatur waktu ujian
j. Fitur untuk mengatur nilai ujian
Fitur untuk mencetak jumlah siswa dan nilai
4. Kebutuhan Material
a. Teks
Jenis fonts yang akan penulis gunakan yaitu : Arial, Times
News Roman dan Tahoma. Alasan penulis menggunakan
fonts ini yaitu agar siswa mudah membaca, karena fonts
yang digunakan adalah jenis fonts standard yang sering
digunakan oleh setiap orang.
b. Warna
Pada warna aplikasi yang akan penulis gunakan yaitu :
1. Merah, penggunaan warna ini agar siswa ketika
menghadapi ujian dapat semangat. Karena warna merah
itu mengartikan semangat.
2. Crem, penggunaan warna ini agar siswa dapar tenang
dan santai ketika menghadapi ujian
3. Hitam, penggunaan warna ini adalah sebagai pelengkap,
penjelas juga sebagai penyatu dari warna merah dan
crem.
c. Layout
1. Header and footer
Pada header terdapat logo al-azhar dan teks header yang
bertuliskan ”Aplikasi Ujian Mata Pelajaran Teknologi
Informasi Berbasis Multimedia, SMA Al-Azhar BSD”.
2. Menu ujian
1. Soal gambar, audio dan video
Pada layout ini ditampilkan sebelah kiri aplikasi
ujian dengan alasan agar dapat dilihat secara
langsung. Karena pandangan pertama mata orang
indonesia dalam membaca dan melihat suatu bacaan
selalu diposisi kiri terlebih dahulu.
2. Pertanyaan
Pertanyaan ujian diletakkan pada sisi atas agar
mudah dibaca oleh siswa.
3. Pilihan ganda
Pada pilihan ganda diletakkan dibawah pertanyaan
dengan bentuk hyperteks. Jika siswa menjawab
salah satu jawaban maka jawaban yang dipilih akan
berubah warnanya dari warna hitam menjadi warna
merah. Ujian yang ditampilkan akan berbentuk
seperti slide yaitu soal akan muncul satu persatu.
Pertimbangan Pendistribusian Sistem
Penyebaran aplikasi ini melalui media Jaringan LAN (File
swf yang tersimpan dalam localhost).Beberapa hal yang perlu
dipertimbangkan dengan penyebaran informasi melalui media ini
lebih cepat dalam penyebaran informasi serta data-data dapat
diperbarui kapanpun dan dari manapun.
Pada aplikasi ujian mata pelajaran TIK berbasis multimedia
yang dibuat berbasiskan jaringan LAN bertujuan agar siswa dalam
dalam menghadapi ujian secara langsung dan bersama sehingga
guru masih dapat mengontrol proses ujian. Kemudian dengan
media jaringan LAN dapat mempercepat penyebaran soal,
pemberian nilai kepada siswa tanpa datang ke guru untuk meminta
file dan meminta nilai.Aplikasi ini terdapat menu pembuatan soal
dan mencetak nilai, sehingga guru dapat secara langsung membuat
soal, mencetak data siswa dan nilai siswa.
Perencanaan Perancangan
Merupakan tahap menggambarkan panduan yang jelas serta detail
mengenaisegala sesuatu tentang sistem. Perancangan yang dibuat
meliputiperancanganaplikasi frontend dan aplikasi backend. Aplikasi
frontend merupakan aplikasi utama yang merupakan tujuan dari tugas akhir
ini, sehingga uraian perancanganaplikasi frontend akan lebih detail dan
diutamakan.
Desain Metaphor
Design metaphor merupakan bagian dari tahap perancangan
yang bertujuan untuk mengadopsi fakta dari dunia nyata kedalam
aplikasi yang akan dibangun.
Pada perancangan pembangunan aplikasi Ujian Mata
Pelajaran TIK Berbasis Multimedia, penulis menggunakan desain
metaphor dari materi Buku dan LKS Mata Pelajaran TIK untuk
kelas XI SMA. Referensi ini membantu untuk menampilkan soal
pada aplikasi yang sesuai dengan pengguna.
Format dan Tipe Informasi
Format dan tipe informasi yang digunakan dalam aplikasi
ini adalah :
a. File format SWF (Shockwave Flash Object),
kemampuannya dalam menampilkan aplikasi dan
animasi di internet atau intranet berupa localhost.
b. File format FLV (Flash Video File) merupakan format
file video yang mampu berintegerasi dalam flash.
c. File format MP3 (MPEG Layer-3) merupakan format
yang sangat popular untuk penyimpanan musik dan
mempunyai kualitas audio yang baik.
d. File format PNG (Portabel Network Graphics)
merupakan format File yang yang baik unruk
pengeditan gambar yang bersifat gratis dan open
source.
e. File format JPEG (Joint Photo Graphic Expert Group),
merupakan format yang baik untuk pendistribusian hasil
fotografi dan mempunyai format yang lebih kecil
dibanding PNG.
Berikut ini adalah tipe informasi yang digunakan dalam
aplikasi yang kemudian diintegrasikan ke dalam aplikasi ini :
Tabel 4.2 Format dan Tipe Informasi
No Nama File Jenis Format Keterangan Size
1. Ujian Animasi SWF Shockwave Flash
Object
1.19 Mb
2. Mouse Gambar PNG Portabel Network
Graphics
304 Kb
3. data_3356
01
Audio MP3 MPEG Layer-3 8.42 Kb
4. data_8013
9
Video FLV Flash Video File 4.30 Kb
5. data_1399 Gambar JPEG Joint Photo Graphic 69.1 Kb
53 Expert Group
6. data_3356
01
Audio MP3 MPEG Layer-3 8.42 Kb
7. data_5668
02
Video FLV Flash Video File 7.59 Kb
8. data_6645
20
Audio MP3 MPEG Layer-3 145 Kb
9. data_9500
73
Audio MP3 MPEG Layer-3 172 Kb
10. data_9570
61
Gambar JPEG Joint Photo Graphic
Expert Group
25.7 Kb
11. Effect Audio MP3 MPEG Layer-3 20.3 Kb
12. Bgsong Audio MP3 MPEG Layer-3 4.32 Kb
13. data_2420
95
Video FLV Flash Video File 8.163 Kb
14. data_2447
50
Video FLV Flash Video File 6.678 Kb
15. data_9370
72
Video FLV Flash Video File 14.1 Kb
Struktur Navigasi
Perancangan aplikasi ujian sekolah berbasis multimedia ini
diawali dengan perancangan struktur navigasi Frontend dan
Backend.
4.3.3.1 Struktur Navigasi Frontend
Gambar 4.5 Struktur Navigasi Frontend
Gambat 4.5 adalah struktur navigasi frontend dengan model
struktur menu. Dalam aplikasi frontend, Saat ingin masuk kedalam
aplikasi ini, user diharuskan login terlebih dahulu. Setelah login
maka user berada dalam home atau halaman utama yang dapat
menuju ke lima menu utama lainnya yaitu halaman Ujian,
Bantuan, Profile dan Logout. Jika user berada pada halaman
Bantuan dan Profile, user dapat menuju home atau halaman utama
juga. Namun pada Pada halaman Ujian, user tidak dapat menuju
halaman yang lainnya sebelum menyelesaikan ujian. Pada menu
Ujian user tidak hanya menjawab pertanyaan saja, user dapat
melihat hasil ujian setelah user mengklik button finish.
Login
User
Home Profile Bantuan Ujian Log Out
Gambar 4.6 adalah strukturnavigasi dari aplikasi backend
yang hanya digunakan dan dikelola oleh admin adalah model
struktur menu. Saat ingin masuk kedalam aplikasi ini, admin
diharuskan login terlebih dahulu. Setelah login maka akan masuk
ke dalam halaman admin home yang mempunyai lima menu,
diantaranya admin, siswa, soal, nilai, konfigurasi, dan logout.
Masalah Integrasi dan Persiapan Media (Media Preparation and
Integration Issues)
Merupakan tahap perancangan dengan memperhatikan
media lain yang mungkin dapat terintegrasi dalam pembangunan
sistem menjadi satu kesatuan dengan tahap persiapan media dan
tahap masalah integrasi.
a. Persiapan Media (Media Preparation)
Pada tahap persiapan media ini yaitu dengan membuat
dan men-download gambar-gambar yang diperlukan untuk
melengkapi pembuatan tampilan (interface) pada website.
b. Masalah Integrasi (Integration Issues)
Pada tahap ini merupakan tahap dimana file yang telah
dipersiapkan kemudian diintegrasikan atau disatukan diantara
file yang satu dengan fileyang lainnya menjadi sebuah control
content.
c. PerancanganKontrol Content
Kontrol content merupakan button yang digunakan untuk
mengontrol content. Jenis-jenis Kontrol content adalah :
1. Kontrol Navigasi merupakan control terdiri dari button
hypermedia, hyperpicture dan hypertext yang digunakan
untuk menghubungkan dari satu lokasi content ke content
yang lainnya yang berkaitan dengan navigasi content.
Tabel 4.2Kontrol Navigasi
VISUAL KETERANGAN
Hypertext yang membawa
admin menuju content
halaman utama Home.
Hypertext yang membawa
admin menuju content
halaman Siswa.
Hypertext yang membawa
admin menuju content
halaman Soal.
Hypertext yang membawa
admin menuju content
halaman Nilai.
Hypertext yang membawa
admin menuju
contenthalaman Konfigurasi.
Hypertext yang membawa
admin menuju content
halaman utama Home.
button pada layar aplikasi
.swf menu Home untuk user
yang ingin menuju ke menu
utama Home.
button pada layar aplikasi
.swf menu Ujian untuk user
yang ingin menuju ke menu
utama Ujian.
button pada layar aplikasi
.swf menu Bantuan untuk
user yang ingin menuju ke
menu utama Bantuan.
button pada layar aplikasi
.swf menu Profile untuk user
yang ingin menuju ke menu
utama Profile.
button Next pada layar
aplikasi .swf menu Ujian
untuk user yang ingin
melanjutkan ke soal
berikutnya.
button Prev pada layar
aplikasi .swf menu Ujian
untuk user yang ingin
kembali ke soal sebelumnya.
button Finish pada layar
aplikasi .swf menu Ujian
untuk user yang ingin
Menyelesaikan Ujian.
button pada layar aplikasi
.swf untuk user yang ingin
mengaktifkan audio.
button pada layar aplikasi
.swf untuk user yang ingin
me-non-aktifkan audio.
button pada layar aplikasi
.swf menu ujian untuk user
yang ingin mengikuti ujian.
Buttonyang membawa
adminuntuk mencetak
laporan.
2. Button lain
Tabel 4.3 Button
VISUAL KETERANGAN
Login
Pada Halaman Utama untuk
masuk ke layar frontend dan
backend.
Cancel
Pada Halaman Utama untuk
membatalkan proses.
Tambah Data Siswa
Pada Halaman Siswa untuk
menambah User.
Tambah Data Soal
Pada Halaman Siswa untuk
menambah Soal.
Button pada layar halaman
ujian untuk user yang ingin
Memainkan Audio dan Video
Button pada layar halaman
ujian untuk user yang ingin
Menghentikan Audio dan
Video
Button pada layar halaman
ujian untuk user yang ingin
Mempercepat Audio dan
Video
Button pada layar halaman
ujian untuk user yang ingin
Memainkan volume Audio
dan Video
Button pada layar admin
untuk admin yang ingin
Mengedit data siswa dan soal
Button pada layar admin
untuk admin yang ingin
Menghapus data siswa, soal
dan nilai
Perancangan Flowchart
Dibawah ini akan diuraikan flowchart dari aplikasi frontenddan
backend.
4.3.5.1 Flowchart Menu Frontend
Gambar 4.7 Perancangan Flowchart Halaman FrontendUser
Home
Mulai
Login
Cek Basis
Data User
Valid
Tidak
Pilih Menu
Ujian
Pilih Menu
Bantuan
Pilih Menu
Profile
Halaman
Home User
Ya
Ya
Pilih Menu
Logout
Selesai
Ya
Tidak
Tidak
Ya
Tidak
Tidak
Tidak
A
B
C
Keterangan:
A : Halaman Ujian
B : Halaman Bantuan
C : Halaman Profile
Flowchart pada Gambar 4.7 menjelaskan tentang halaman User.
Jika seorang user ingin masuk ke dalam halaman user maka admin
harus login terlebih dahulu dengan cara menginput username dan
password yang sesuai dengan database. jika valid, maka user dapat
masuk ke dalam halaman user. Pada halaman user home terdapat
tiga menu yang dapat digunakan untuk ujian, melihat bantuan,
melihat profile. Dan bila proses selesai pilih menu logout dan
tampilan user akan kembali ke halaman login.
Gambar 4.8 Perancangan Flowchart Halaman Frontend
User Ujian
Pilih Menu Bantuan
Pilih Menu Profile
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
B
C
A
Pilih Menu UjianYa
Ujian
Halaman Home User
Tidak
Keterangan:
A : Halaman Ujian
B : Halaman Bantuan
C : Halaman Profile
Keterangan:
A : Halaman Ujian
B : Halaman Bantuan
C : Halaman Profile
Flowchart pada Gambar 4.8 menjelaskan tentang halaman
User. Jika seorang user ingin mengikuti ujian maka user
harus mengklik OK.Ketika User sedang menghadapai ujian
user tidak dapat menuju kemenu lainnya selain menu
logout.
Gambar 4.9 Perancangan Flowchart Halaman Frontend
User Bantuan
Flowchart pada Gambar 4.9 menjelaskan tentang halaman User
Bantuan. Pada halaman userbantuan terdapat tiga menu yang dapat
digunakan untuk ujian, melihat melihat profile. Dan bila proses
Pilih Menu Ujian
Pilih Menu Profile
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
A
C
B
Halaman Home User
Halaman Menu
Bantuan
Tidak
Keterangan:
A : Halaman Ujian
B : Halaman Bantuan
C : Halaman Profile
selesai pilih menu logout dan tampilan user akan kembali ke
halaman login.
Gambar 4.10 Perancangan Flowchart Halaman Frontend
User Profile
Flowchart pada Gambar 4.10 menjelaskan tentang halaman User
Profile. Pada halaman userprofile terdapat tiga menu yang dapat
digunakan untuk ujian, melihat melihat bantuan. Dan bila proses
selesai pilih menu logout dan tampilan user akan kembali ke
halaman login.
Pilih Menu Ujian
Pilih Menu Bantuan
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
A
B
C
Halaman Home User
Halaman Menu
Profile
Tidak
Keterangan:
A : Halaman Ujian
B : Halaman Bantuan
C : Halaman Profile
4.3.5.2 Flowchart Menu Backend
Mulai
Login
Cek Basis
Data Admin
Valid
Tidak
Halaman
Home Admin
Ya
Ya
Selesai
Ya
Tidak
Tidak
Ya
Tidak
Tidak
Tidak
D
E
Pilih Menu
Konfigurasi
Pilih Menu
Nilai
Pilih Menu
Soal
Pilih Menu
Siswa
Pilih Menu
Admin
Pilih Menu
Logout
F
G
H
Tidak
Ya
Ya
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Gambar 4.11 Perancangan Flowchart Halaman BackendAdmin
Home
Flowchart pada Gambar 4.11 menjelaskan tentang halaman admin.
Jika seorang admin ingin masuk ke dalam halaman administrator
maka admin harus login terlebih dahulu dengan cara menginput
username dan password yang sesuai dengan database. jika valid,
maka admin dapat masuk ke dalam halaman administrator. Pada
halaman admin home terdapat tiga menu yang dapat digunakan
untuk melihat data, menginput data, memperbaharui data serta
menghapus data. Dan bila proses selesai pilih menu logout dan
tampilan admin akan kembali ke halaman login.
Pilih Menu Siswa
Pilih Menu Soal
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
E
F
D
Pilih Menu AdminYa
Lihat, Edit,
Tambah,
Hapus,
Pencarian,
Cetak Admin
Halaman Home
Admin
Tidak
Pilih Menu Nilai
Pilih Menu
Konfigurasi
G
H
Ya
Ya
Tidak
Tidak
Gambar 4.12 Perancangan Flowchart Halaman BackendAdmin
Flowchart pada Gambar 4.12 menjelaskan tentang halaman
administrator pada menu Admin. Terdapat halaman lihat admin
pada Menu Admin yang terdapat proses tambah, edit dan hapus
admin.
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Pilih Menu Soal
Pilih Menu Nila
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
F
G
E
Pilih Menu SiswaYa
Lihat, Edit,
Tambah,
Hapus,
Pencarian,
Cetak Siswa
Halaman Home
Admin
Tidak
Pilih Menu
Konfigurasi
Pilih Menu Admin
H
D
Ya
Ya
Tidak
Tidak
Gambar 4.13 Perancangan Flowchart Halaman Backend Admin
Siswa
Flowchart pada Gambar 4.13menjelaskan tentang halaman
administrator pada menu Siswa. Terdapat halaman lihat siswa pada
Menu Siswa yang terdapat proses tambah, edit dan hapus, cari dan
cetak siswa.
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Pilih Menu Soal
Pilih Menu Nila
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
G
H
F
Pilih Menu SoalYa
Lihat, Edit,
Tambah,
Hapus Soal
Halaman Home
Admin
Tidak
Pilih Menu
Konfigurasi
Pilih Menu Admin
D
E
Ya
Ya
Tidak
Tidak
Gambar 4.14 Perancangan Flowchart Halaman Backend Admin
Soal
Flowchart pada Gambar 4.14 menjelaskan tentang halaman
administrator pada menu Soal. Terdapat halaman lihat Soal pada
Menu Soal yang terdapat proses tambah, edit dan hapus soal.
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Pilih Menu
Konfigurasi
Pilih Menu Admin
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
H
D
G
Pilih Menu NilaiYa Lihat, Cari,
Cetak Nilai
Halaman Home
Admin
Tidak
Pilih Menu Siswa
Pilih Menu Soal
E
F
Ya
Ya
Tidak
Tidak
Gambar 4.15 Perancangan Flowchart Halaman Backend Admin
Nilai
Flowchart pada Gambar 4.15 menjelaskan tentang halaman
administrator pada menu Nilai. Terdapat halaman lihat Nilai pada
Menu Nilai yang terdapat proses Cari dan Cetak Nilai.
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Pilih Menu
Konfigurasi
Pilih Menu Admin
Ya
Pilih Menu Logout
Ya
Tidak
Ya
Tidak
D
E
H
Pilih Menu
Konfigurasi
Ya
Konfigurasi
Waktu,
Jumlah
Soal, Nilai
Halaman Home
Admin
Tidak
Pilih Menu Siswa
Pilih Menu Soal
F
G
Ya
Ya
Tidak
Tidak
Gambar 4.16 Perancangan Flowchart Halaman Backend Admin
Konfigurasi
Flowchart pada Gambar 4.16 menjelaskan tentang halaman
administrator pada menu Konfigurasi. Terdapat halaman lihat pada
Menu Konfigurasi yang terdapat proses Konfigurasi Waktu,
Jumlah Soal dan Nilai.
Keterangan:
D: Halaman Admin
E : Halaman Siswa
F : Halaman Soal
G : Halaman Nilai
H : Halaman Konfigurasi
Storyboard
4.3.6.1 Perancangan Layar Frontend
Gambar 4.17 Halaman login User
Gambar 4.17 merupakan rancangan layar Login User yang
diatasnya terdapat Header (kepala judul), logo sekolah dan
dibawah terdapat Footer (kaki judul). Ditengah terdapat gambar
login, form input username dan password serta tombol Login untuk
dapat masuk dan mengakses halaman user.
Gambar 4.18 Halaman Home User
Gambar 4.18 merupakan tahap perancangan halaman home layar
Frontend yang terdapat 2 menu, yaitu Home dan Logout serta 4
icon navigasi menu, yaitu Home, Ujian, Bantuan dan Profile.
Terdapat juga Header (Kepala Judul), logo sekolah dan dibawah
ada Footer (Kaki Judul), serta icon audio untuk mengaktifkan dan
menonaktifkan audio.
Gambar 4.19 Halaman Ujian User
Gambar 4.19 merupakan tahap perancangan halaman ujian layar
Frontend yang terdapat 2 menu, yaitu Home dan Logout serta
3icon navigasi menu, yaitu Home, Bantuan dan Profile. Terdapat
juga Header (Kepala Judul), logo sekolah dan dibawah ada Footer
(Kaki Judul), icon audio untuk mengaktifkan dan menonaktifkan
audio. Serta button berupa Next untuk menuju soal berikutnya,
button Prev untuk kembali ke soal sebelumnya, button finish
untuk menyelesaikan ujian, icon play, stop dan volume untuk
memainkan dan menghentikan soal berupa audio dan video.
Gambar 4.20 Halaman BantuanUser
Gambar 4.20 merupakan tahap perancangan halaman bantuan layar
Frontend yang terdapat 2 menu, yaitu Home dan Logout serta
3icon navigasi menu, yaitu Home, Ujian, dan Profile. Terdapat
juga Header (Kepala Judul), logo sekolah dan dibawah ada Footer
(Kaki Judul), icon audio untuk mengaktifkan dan menonaktifkan
audio.
Gambar 4.21 Halaman Profile User
Gambar 4.21 merupakan tahap perancangan halaman profile layar
Frontend yang terdapat 2 menu, yaitu Home dan Logout serta
3icon navigasi menu, yaitu Home, Ujian, dan Bantuan. Terdapat
juga Header (Kepala Judul), logo sekolah dan dibawah ada Footer
(Kaki Judul), icon audio untuk mengaktifkan dan menonaktifkan
audio.
4.4.6.2 Perancangan Layar Backend
Gambar 4.22 Halaman Login Admin
Gambar 4.22 merupakan rancangan layar Login Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah dan
dibawah terdapat Footer (kaki judul). Ditengah terdapat gambar
login, form input username dan password serta tombol Login untuk
dapat masuk dan mengakses halaman admin.
Gambar 4.23 Halaman Home Admin
Gambar 4.23 merupakan rancangan layar Home Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah, teks berupa
tulisan “welcome to aplikasi ujian sekolah” dan dibawah terdapat
Footer (kaki judul). terdapat 6 menu yaitu, admin, siswa, soal,
nilai, konfigurasi dan logout.
Gambar 4.24 Halaman Admin Layar Tambah Data Admin
Gambar 4.24 merupakan rancangan layar Tambah Data Admin
yang diatasnya terdapat Header (kepala judul), logo sekolah, form
input data admin dan dibawah terdapat Footer (kaki judul).
terdapat 6 menu yaitu, menu home, siswa, soal, nilai, konfigurasi
dan logout.
Gambar 4.25 Halaman Admin Layar Update Data Admin
Gambar 4.25 merupakan rancangan layar Update Data Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah, form
update data admin dan dibawah terdapat Footer (kaki judul).
terdapat 6 menu yaitu, menu home, siswa, soal, nilai, konfigurasi
dan logout.
Gambar 4.26 Halaman Siswa Admin
Gambar 4.26 merupakan rancangan layar Siswa Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah, teks berupa
tulisan “data siswa” dan dibawah terdapat Footer (kaki judul).
terdapat 4 menu yaitu, menu home, soal, nilai dan logout, ditengah
terdapat tabel data siswa, button tambah data siswa, serta tulisan
berupa perintah edit dan hapus.
Gambar 4.27 Halaman Siswa layar tambah data siswa Admin
Gambar 4.27 merupakan rancangan layar tambah data siswa
Admin yang diatasnya terdapat Header (kepala judul), logo
sekolah, teks berupa tulisan “input siswa”, ditengah terdapat
forminput NIS, Nama, dan Password. Serta button berupa Ok dan
Batal.dibawah terdapat Footer (kaki judul). terdapat 6 menu lain
yaitu, menu home, admin, soal, nilai, konfigurasi dan logout,
button tambah data siswa, serta tulisan berupa perintah edit dan
hapus.
Gambar 4.28 Halaman Admin Layar Update Data Siswa
Gambar 4.28 merupakan rancangan layar Update data siswa
Admin yang diatasnya terdapat Header (kepala judul), logo
sekolah, teks berupa tulisan “input siswa”, ditengah terdapat
formupdate berupa NIS, Nama, kelas, jenis kelamin dan Password.
Serta button berupa update dan Batal. dibawah terdapat Footer
(kaki judul). terdapat 6 menu lain yaitu, menu home, admin, soal,
nilai, konfigurasi dan logout, button tambah data siswa, serta
tulisan berupa perintah edit dan hapus.
Gambar 4.29 Halaman Soal
Gambar 4.29 merupakan rancangan layar Siswa Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah, teks berupa
tulisan “data soal”, dibawah terdapat Footer (kaki judul). Terdapat
6 menu lain yaitu, menu home, admin, siswa, nilai, konfigurasi dan
logout,ditengah terdapat tabel data soal, button tambah data soal,
serta tulisan berupa perintah edit dan hapus.
Gambar 4.30 Halaman Soal layar tambah data soal
Gambar 4.30 merupakan rancangan layar tambah data soal Admin
yang diatasnya terdapat Header (kepala judul), logo sekolah, teks
berupa tulisan “input soal”, ditengah terdapat forminput Type Soal,
Pertanyaan, Pilihan A,B,C,D,E, Jawaban, Multimedia yang
disampingnya terdapat button berupa browse, dibawah form input
terdapat button insert dan batal, dibawah terdapat Footer (kaki
judul). terdapat 6 menu lain yaitu, menu home, admin, siswa, nilai,
konfigurasi dan logout.
Gambar 4.31 Halaman Nilai Admin
Gambar 4.31 merupakan rancangan layar Nilai Admin yang
diatasnya terdapat Header (kepala judul), logo sekolah, teks berupa
tulisan “data soal”, dibawah terdapat Footer (kaki judul). terdapat 6
menu lain yaitu, menu home, admin, siswa, soal, konfigurasi dan
logout.ditengah terdapat tabel nilai siswa, button cetak laporan,
serta tulisan berupa perintah hapus.
Gambar 4.32Halaman Nilai Layar Cetak Nilai
Gambar 4.32 merupakan rancangan layar Cetak Nilai yangberupa
table dan tersimpan pada file pdf. Table nilai terdiri dari No, NIS,
Nama, Nilai, Waktu dan Keterangan.terdapat 6 menu lain yaitu,
menu home, admin, siswa, soal, konfigurasi dan logout.
Gambar 4.33 Halaman Konfigurasi
Gambar 4.33 merupakan rancangan layar Konfigurasi yang terdiri
dari konfigurasi durasi waktu ujian, konfigurasi jumlah soal yang
akan diuji dan konfigurasi nilai ujian yang diberikan tiap soal.
terdapat 6 menu lain yaitu, menu home, admin, siswa, soal, nilai
dan logout.
Perancangan STD(State Transition Diagram)
4.3.7.1 Perancangan STD Frontend
Home
Halaman
Utama
Ujian Bantuanl
LogoutProfile
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Ujian”
Tampilkan
Halaman Ujian
Klik “Bantuan”
Tampilkan
Halaman Bantuan
Klik “Logout”
Keluar AplikasiKlik “Profile”
Tampilkan
Halaman Profile
Gambar 4.34 Perancangan STD Halaman User
Pada halaman User Home terdapat 4 navigasi yaitu user
home halaman utama, ujian, bantuan, Profile dan logout untuk
keluar aplikasi.
4.3.7.2 Perancangan STD Backend
Home
Halaman
Utama
Admin
Siswa
LogoutNilai
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Home”
Tampilkan
Halaman Home
Klik “Admin”
Tampilkan
Halaman Admin
Klik “Siswa”
Tampilkan
Halaman Siswa
Klik “Logout”
Keluar Aplikasi
Klik “Nilai”
Tampilkan
Halaman Nilai
Soal
Konfigurasi
Klik “Home”
Tampilkan
Halaman Home
Klik “Soal”
Tampilkan
Halaman SoalKlik “Home”
Tampilkan
Halaman Home
Klik “Konfigurasi”
Tampilkan
Halaman Bantuan
Gambar 4.35 Perancangan STD Halaman Admin
Pada halaman AdminHometerdapat6 navigasi yaitu admin
home halaman admin, siswa, soal, nilai, Konfigurasi dan logout
untuk keluar aplikasi.
Perancangan DFD(Data Flow Diagram)
4.3.8.1 DFD Level 0
Aplikasi Ujian
SekolahAdmin User
Username, Password,
Siswa, Soal
Info Siswa, Soal,
Nilai
Username,
Password, Ujian
Info Ujian, Nilai
Gambar 4.36 DFD Level 0 Aplikasi Ujian Sekolah
Diagram konteks pada gambar 4.36menggambarkan proses
aplikasi yaitu admin dapat memasukkan username, password,
Siwa, Soal dan aplikasi mengolah database menghasilkan output
berupa Username dan password user, Soal, dan Nilai. User dapat
menjawab soal dan dapat melihat nilai setelah proses ujian selesai.
4.3.8.2 DFD Level 1
Admin
User
1.0
LoginLogin
1.1
Mengisi Data
1.2
Ujian
Username, Password
Username, Password
Siswa, Soal
Jawaban Ujian
Siswa
Soal
Info Soal, Nilai
Gambar 4.37 DFD Level 1 Aplikasi Ujian Sekolah
Diagram konteks pada gambar 4.37terjadi proses login pada
admindan user berupa username dan password. Admin melakukan
proses inputSiwa, Soal dan aplikasi mengolah database
menghasilkan output berupa Username dan password user, Soal,
dan Nilai. User dapat menjawab soal dan dapat melihat nilai
setelah proses ujian selesai.
Perancangan Database
Pada tahap ini dilakukan perancangan database dengan merancang
spesifikasi database yang digunakan dalam membangun suatu
sistem.
4.3.9.1 Spesifikasi Database
1. Tabel User
Nama Tabel : user
Primary Key : user_id
Foreign Key : -
Tabel 4.4 Tabel User
Nama Field Tipe Data Ukuran Keterangan
user_id int 11 NIS
user_code varchar 255 Username
user_pass varchar 255 Password
level varchar 2 level
jenis_kelamin varchar 1 Jenis Kelamin
kelas varchar 5 Kelas
2. Tabel Soal
Nama Tabel : soal
Primary Key : soal_id
Foreign Key : -
Tabel 4.5 Tabel Soal
Nama Field Tipe Data Ukuran Keterangan
soal_id int 11 Id soal
soal_text varchar 255 Soal
pilihan_a varchar 255 Pilihan a
pilihan_b varchar 255 Pilihan b
pilihan_c varchar 255 Pilihan c
pilihan_d varchar 255 Pilihan d
pilihan_e varchar 255 Pilihan e
jawaban varchar 2 Jawaban soal
type varchar 2 Type soal
media varchar 255 Media soal
3. Tabel Konfigurasi
Nama Tabel : config
Primary Key : config_id
Foreign Key : -
Tabel 4.6 Tabel Konfigurasi
Nama Field Tipe Data Ukuran Keterangan
config_id int 11 Id config
nama varchar 50 Type konfigurasi
nilai int 10 Type konfigurasi
deskripsi varchar 255 Penjelasan fungsi nama
4. Tabel Nilai
Nama Tabel : nilai
Primary Key : nilai_id
Foreign Key : -
Tabel 4.7 Tabel Nilai
Nama Field Tipe Data Ukuran Keterangan
nilai_id Int 11 Id nilai
user_id Int 11 Id user
tanggal_ujian Date - Tanggal ujian
lama_ujian Int 11 Lama ujian
total Int 11 Hasil ujian
Implementasi
Implementasi merupakan tahap penerapan hasil perancangan
menggunakan alat bantu yang telah direncanakan.
Lingkungan Implementasi
Menjelaskan lingkungan perangkat implementasi yang
digunakan pada saat pembangunan aplikasi Frontend dan aplikasi
Backend.
A. Software Komputer
1. Macromedia Flash MX 2004
Merupakan software authoring tool yang digunakan untuk
mengintegrasikan media-media yang telah disiapkan untuk
membangun aplikasi ujian sekolah.
2. Adobe Photoshop CS3
Sebagai painting software untuk memanipulasi still image
sehingga hasilnya layak untuk diintegrasikan ke dalam
aplikasi ujian sekolah.
3. Xampp
Merupakan software untuk membuat aplikasi backend.
menjalankan sebuah aplikasi dalam locahost.
4. PHP
Merupakan software untuk membangun aplikasi backend,
Serta melakukan koneksi ke database.
5. My SQL
Merupakan software untuk penyimpan data dan
memberikan antar muka kepada user untuk memelihara
data, baik data siswa, soal, maupun data nilai.
6. Adobe Premier CS3
Merupakan Software untuk mengedit sebuah video yang
diexport dalam bentuk file berupa avi.
7. CoolEdit
Sebagai sound editor software.Melakukan pengeditan
sinyal digital audio seperti pemotongan dan pemberian
efek.
B. Hardware Komputer
1. Processor Intel Pentium IV 1.80GHz
2. Monitor LG Studioworks 505G 15”
3. RAM DDR 512MB
4. Harddisk Maxtor 30GB
5. Graphic card 64MB,NVIDIA GeForce2 MX/MX 400
6. DVD-RW Lite-On 18x
7. Sound Card
8. Speaker Active
9. Keyboard Standart
Prototyping
Pada tahap prototyping sistem ini menjelaskan tentang
implementasi sistem yang dibuat berupa penjelasan dari
pembangunan sistem sebagai visualisasi awal dari sistem yang
dibuat, berupa frontenduser interface sebagai tampilan utama dan
backend administrator sebagai aplikasi penunjang.
Implementasi Media
Adalah proses pembuatan serta persiapan media-media
yang nantinya akan diintegrasikan kedalam aplikasi USB
Multimedia. Berikut adalah media-media yang perlu
dipersiapkan dan proses-proses yang dilalui sehingga
media tersebut siap untuk diintegrasikan pada aplikasi
USB Multimedia.
1. Implementasi Data Soal
Soal diambil dari LKS Siswa dan buku pelajaran TIK
Kelas XI SMA, Data Soal Terlampir pada lampiran
soal.
2. Implementasi Image
Pada aplikasi ujian TIK berbasis Multimedia ini
tidak terlalu banyak menggunakan Image. Berikut
adalah rincian dan langkah-langkah mempersiapkan
Image :
Tabel 4.8 Implementasi Image
No Langkah Pembuatan Image
1 Logo.jpeg
Pada gambar 4.36 adalah merupakan logo dari
sekolah al-azhar. Gambar ini diolah dengan
adobe photoshop. Pada gambar ini terdapat
proses resizing image berupa :
1. Transparansi image dengan menggunakan
Magic Wand Tool.
2. Filterisasi image dengan menggunakan
Filter Artistic Plastic Wrap
Gambar 4.38 Tools Filter Artistic Plastic
Wrap
Gambar 4.39 Logo Al-azhar
2. Mouse.png
Pada gambar 4.39 adalah merupakan gambar
untuk soal aplikasi USB Multimedia. Gambar
ini diolah dengan adobe photoshop. Pada
gambar ini terdapat proses resizing image
berupa :
1. Transparansi image dengan menggunakan
Magic Wand Tool.
2. Pengolahan warna gambar berupa
Adjusment Image
Gambar 4.40 Mouse
3. Implementasi Audio
Menjelaskan langkah-langkah pembuatan
multimedia soundtrack yang terdri dari musik dan
soal berupa audio. Soundtrack berasal dari musik
yang telah ada untuk kemudian diedit
seperlunya.Soal audio berupa dubbing yang dibuat
dengan menggunakan aplikasi ulead visual
studio.Berikut merupakan proses sound editing:
Tabel 4.9Implementasi Audio
No Langkah Sound Editing
1 Bgsong.mp3
Pemberian effect agar sound dapat terdengar
sesuai dengan apa yang diinginkan.
Effectyang diimplementasikan adalah fade in.
effect ini berfungsi mengecilkan volume
diawal.
Gambar 4.41 Gambar Editing Audio
Soundtrack
2 data_666870.mp3
Pembuatan sound audio pada soal yang diuji
pada aplikasi ini terdiri dari 5 file. Pada
implementasi audio ini penulis hanya
menampilkan data_666870 .mp3. berikut
adalah gambar lembar kerja proses pembuatan
dubbing.
Gambar 4.42 Dubbing Audio
4. Implementasi Video
Menjelaskan langkah-langkah pembuatan
multimedia Video. Video berasal dari yang telah ada
untuk kemudian diedit seperlunya. Berikut
merupakan proses video editing :
Tabel 4.10 Implementasi Video
No Langkah Video Editing
1 data_242095.flv
Pada implementasi video ini memberikan
editing video berupa animasi transisi,
pemotongan video dan penggabungan dengan
video lain. Proses video editing ini dengan
menggunakan Ulead Visual Studio. Setelah itu
hasilnya diconvert dengan menggunakan
software xilisoft video converter ultimate
dalam bentuk file berupa flv. Video ini di
convert kedalam bentuk flv dikarenakan format
video untuk aplikasi swf hanya mampu
membaca file berupa flv.
Berikut adalah gambar proses editing video.
Gambar 4.43 Editing Video
5. Implementasi Animasi
Menjelaskan langkah-langkah pembuatan Animasi.
Berikut merupakan proses pembuatan animasi:
Tabel 4.11 Implementasi Animasi
No Langkah Animasi
1 Animasi frame spot
Animasi frame spot disini maksudnya adalah
sebuah animasi spot berjalan. Animasi ini
dibuat dengan menggunakan teknik motion
tween dan movie clip. Berikut merupakan
proses pembuatan animasi frame spot dengan
menggunakan Flash CS3:
1. membuat spot berupa movie clip nyala dan
lama kemudian menjadi redup. Berikut
adalah gambar pembuatan spot movie clip.
Gambar 4.44 Animasi spot movie clip
2. setelah itu maka dibuat movie clip baru
berupa frame dimana spot akan berjalan.
Pada tahap ini dibuat dengan teknik motion
tween.Berikut gambar pembuatan frame
spot movie clip :
Gambar 4.45 Animasi Frame Spot
2 Animasi frame teks
Animasi teks disini berupa teks yang berada
pada button yang dibuat menjadi movie clip.
Animasi ini dibuat dengan teknik motion tween
dan movie clip.Berikut gambar pembuatan
animasi teks :
Gambar 4.46 Animasi Frame teks
3 Animasi frame transisi
Pada animasi transisi ini penulis membuat
transisi berupa fuzzle. Animasi ini muncul
ketika mengklik menu-menu pada aplikasi.
Animasi ini dibuat dengan teknik movie clip.
Berikut adalah gambar pembuatan animasi
frame transisi :
Gambar 4.47 Layer animasi transisi
Gambar 4.48 Animasi Transisi
Implementasi Sistem
Pada tahap implementasi sistem, ditampilkan hasil akhir
pembuatan dari tahap sebelumnya yaitu semua elemen-
lemen dibangun dan disatukan sehingga menjadi sebuah
aplikasi USB Multimedia.
Tabel 4.12 Pembuatan Aplikasi Frontend
No PembangunanAplikasi Frontend
1 Membuat background aplikasi frontend pada flash
Pada gambar 4.35 Merupakan background aplikasi
frontend dengan resolusi 800 x 600 pixel.
Gambar 4.49 Background Frontend
2 Membuat interface ujian pada Flash
Pada gambar 4.49 merupakan interface ujian
dengan resolusi 779.8 x 412.9 Pixel. Untuk soal
berupa media gambar dan video diberikan size
dengan resolusi 390 x 390 pixel, dan untuk media
sound dengan resolusi 390 x 132 pixel.
Gambar 4.50 Interface Ujian
Adapun script untuk me-load soal sebagai berikut :
function loadSoal(i:int) {
currentQst=soalTeracak[i];
setupView();
trace(evalList[currentQst].type);
eval_mc.no_txt.text="Pertanyaan ke-
"+(index+1).toString();
eval_mc.soal_txt.text=evalList[currentQst].perta
nyaan;
eval_mc.pilaTeks.text=evalList[currentQst].pil_a
;
eval_mc.pilbTeks.text=evalList[currentQst].pil_b
;
eval_mc.pilcTeks.text=evalList[currentQst].pil_c
;
eval_mc.pildTeks.text=evalList[currentQst].pil_d
;
eval_mc.pileTeks.text=evalList[currentQst].pil_e
;
jawaban[index]=evalList[currentQst].jawaban;
if(evalList[currentQst].type=="3")
loadVideo(path+"/data/"+evalList[currentQst].m
edia);
if(evalList[currentQst].type=="2")
loadImage(path + "/data/" +
evalList[currentQst].media);
if(evalList[currentQst].type=="4")
loadAudio(path+"/data/"+evalList[currentQst].m
edia);
resetColor();
if(soal[index]=="a")
eval_mc.pilaTeks.textColor=0xff0000;
if(soal[index]=="b")
eval_mc.pilbTeks.textColor=0xff0000;
if(soal[index]=="c")
eval_mc.pilcTeks.textColor=0xff0000;
if(soal[index]=="d")
eval_mc.pildTeks.textColor=0xff0000;
if(soal[index]=="e")
eval_mc.pileTeks.textColor=0xff0000;
}
3 Membuat script random soal
Berikut adalah script function acak soal :
function acak() {
var i:int;
var total:int = 0;
if(evalList.length()>20)
total=20;
else
total=evalList.length();
for (i=0; i<total; i++) {
soal.push(i);
}
while (soal.length>0) {
var
r:int=Math.floor(Math.random()*soal.length);
soalTeracak.push(soal[r]);
soal.splice(r,1);
}
trace(soalTeracak);
}
4 Membuat script durasi waktu ujian
countTime=7200; //2 jam
var myTimer:Timer = new
Timer(1000,countTime);
myTimer.addEventListener(TimerEvent.TIMER,co
untDown);
5 Menampilkan nilai hasil ujian
Pada gambar 4.37 Merupakan alert yang
menampilkan nilai hasil ujian dengan script
sebagai berikut :
function countScore(){
setupView();
trace(soal);
trace(jawaban);
var i:int;
//var score:int=0;
for(i=0;i<soal.length;i++){
if(soal[i]==jawaban[i]){
trace("benar");
score+=5;
}else{
trace("salah");
//score-=5;
}
}
eval_mc.alert_mc.alert_txt.text+="\n Score Anda
"+score + ". data sedang dikirim ke server";
kirimData();
}
Gambar 4.51 Alert nilai ujian
Hasil Implementasi
4.5.3.1 Hasil ImplementasiFrontend
Gambar berikut ini merupakan hasil halaman frontend
(user interface) yang telah diintegrasikan dengan
elemen-elemen yang telah dibangun.
Gambar 4.52 Halaman Home
Halaman Home pada gambar 4.52 merupakan halaman
utama layar Frontend yang terdapat 2 menu, yaitu Home
dan Logout serta 4icon navigasi menu, yaitu Home,
Ujian, Bantuan dan Profile. Terdapat juga Header
(Kepala Judul), logo sekolah dan dibawah ada Footer
(Kaki Judul), serta icon audio untuk mengaktifkan dan
menonaktifkan audio.
Gambar 4.53Halaman Awal Ujian
Pada gambar 4.53 merupakan halaman ujian yang
terdapat 2 menu, yaitu Home dan Logout serta 3icon
navigasi menu, yaitu Home, Bantuan dan
Profile.Terdapat juga icon audio untuk mengaktifkan
dan menonaktifkan audio.
Gambar 4.54Halaman Ujian Tipe Soal Teks
Gambar 4.55Halaman Ujian Tipe Soal Audio
Gambar 4.56Halaman Ujian Tipe Soal Gambar
Gambar 4.57Halaman Ujian Tipe Soal Video
Gambar 4.58Halaman Informasi Hasil Ujian
Gambar 4.59Halaman Bantuan
Pada gambar 4.59 merupakan halaman bantuan yang
terdapat 2 menu, yaitu Home dan Logout serta 3icon
navigasi menu, yaitu Home, Ujian, dan Profile. Terdapat
juga icon audio untuk mengaktifkan dan menonaktifkan
audio.
Gambar 4.60Halaman Profile
Pada gambar 4.60 merupakan halaman profile yang
terdapat 2 menu, yaitu Home dan Logout serta 3icon
navigasi menu, yaitu Home, Ujian, dan Bantuan.
Terdapat juga icon audio untuk mengaktifkan dan
menonaktifkan audio.
4.5.3.2 Hasil Implementasi Backend
Gambar berikut ini merupakan hasil halaman backend
(admin interface) yang telah diintegrasikan dengan
elemen-elemen yang telah dibangun.
Gambar 4.61Halaman login
Pada gambar 4.61 merupakan layar Login Admin untuk
dapat masuk dan mengakses halaman admin.
Gambar 4.62Halaman Home admin
Pada gambar 4.62 merupakan layar Home Admin yang
terdapat 6 menu yaitu, menu admin, siswa, soal, nilai,
konfigurasi dan logout.
Gambar 4.63Halaman Data Admin
Pada gambar 4.63 merupakan layar Data Admin untuk
melihat data admin. Pada layar ini terdapat proses berupa
tambah data admin, edit admin dan cari data admin.
Gambar 4.64 Halaman Input Data Admin
Pada gambar 4.64 merupakan layar InputData Admin
untuk menginput data admin. Terdapat 3 form input data
admin berupa nama, jenis kelamin dan password.
Gambar 4.65Halaman Cari Data Admin
Pada gambar 4.65 merupakan layar Cari Data Admin
untuk mencari data admin. Table yang ditampilkan berisi
No, Nama, Jenis Kelamin, Password dan Aksi. Ada
perintah 2 aksi pada layar ini berupa tampilkan semua,
edit dan hapus.
Gambar 4.66Halaman Edit Data Admin
Pada gambar 4.66 merupakan layar Edit Data
Adminmengedit data admin. Terdapat 3 form edit data
admin berupa nama, jenis kelamin dan new password
serta 2 button berupa update dan batal.
Gambar 4.67Halaman Siswa
Pada gambar 4.67 merupakanSiswa Admin yang terdapat
6 menu yaitu, menu home, admin, soal, nilai, konfigurasi
dan logout, ditengah terdapat tabel data siswa, button
tambah data siswa, serta tulisan berupa perintah edit dan
hapus.
Gambar 4.68Halaman InputSiswa
Pada gambar 4.68 merupakan layar input siswa
yangditengah terdapat forminput NIS, Nama, dan
Password. Serta button berupa Ok dan Batal. Terdapat 4
menu yaitu, menu home, soal, nilai dan logout, button
tambah data siswa, serta tulisan berupa perintah edit dan
hapus.
Gambar 4.69Halaman Edit Siswa
Pada gambar 4.69 merupakan layar edit siswa
yangditengah layar terdapat forminput NIS, Nama, dan
Password. Serta button berupa Ok dan Batal.
Gambar 4.70Halaman Cetak Data Siswa
Pada gambar 4.70 merupakan layar Cetak Data Siswa.
Pada layar ini data siswa yang tersimpan pada database
akan diproses dan disimpan dalam bentuk pdf. file ini
terdapat tabel yang berupa No. NIS, Nama, Jenis
Kelamin dan Keterangan. Serta diatasnya terdiri dari
tulisan ”data siswa” dan keterangan berupa kelas dan
jumlah data siswa.
Gambar 4.71Halaman Soal
Pada gambar 4.71 merupakan layar soal yang terdapat 6
menu yaitu, menu home, admin, siswa, nilai, konfigurasi
dan logout, ditengah terdapat tabel data soal, button
tambah data soal, serta tulisan berupa perintah edit dan
hapus.
Gambar 4.72Halaman Input Soal
Pada gambar 4.72 merupakan layar tambah data soal
Admin yangditengahnya terdapat forminput Type Soal,
Pertanyaan, Pilihan A,B,C,D,E, Jawaban, Multimedia
yang disampingnya terdapat button berupa browse,
dibawah form input terdapat button insert dan batal,
dibawah terdapat Footer (kaki judul). terdapat 6 menu
yaitu, menu home, admin, siswa, nilai, konfigurasi dan
logout.
Gambar 4.73Halaman Edit Soal
Pada gambar 4.73 merupakan layar edit soal
yangditengahnya terdapat forminput Type Soal,
Pertanyaan, Pilihan A,B,C,D,E, Jawaban, Multimedia
yang disampingnya terdapat button berupa browse,
dibawah form input terdapat button insert dan batal,
dibawah terdapat Footer (kaki judul). terdapat 6 menu
yaitu, menu home, admin, siswa, nilai, konfigurasi dan
logout.
Gambar 4.74Halaman Nilai
Pada gambar 4.74 merupakan layar Nilai yang terdapat 6
menu yaitu, menu home, admin, siswa, soal, konfigurasi
dan logout, ditengah terdapat tabel nilai siswa, button
tampilkan, cetak, dan cari serta tulisan berupa perintah
hapus.
Gambar 4.75 Halaman Cetak Nilai
pada gambar 4.75 merupakan layar cetak nilai yang
berupa file format pdf. pada layar ini terdiri dari tulisan
berupa keterangan mata pelajaran, kelas, nama, nilai
waktu dan jumlah. Ditengah terdapat tabel data nilai
siswa yang terdiri dari field No, NIS, Nama, Nilai,
Waktu dan Keterangan.
Gambar 4.76 Halaman Konfigurasi
Pada gambar 4.76 merupakan halaman konfigurasi yang
terdiri dari konfigurasi soal, waktu dan nilai. Pada
halaman ini terdiri dari 6 menu yaitu menu home, admin,
siswa, soal, nilai dan logout.
Gambar 4.77 Halaman Konfigurasi Soal
Pada gambar 4.77 merupakan layar konfigurasi soal
yang isinya berupa form input waktu. Terdapat button
update dan batal. Pada halaman ini terdiri dari 6 menu
yaitu menu home, admin, siswa, soal, nilai dan logout.
Gambar 4.78 Halaman Konfigurasi Nilai
Pada gambar 4.78 merupakan layar konfigurasi nilai
yang isinya berupa form input nilai. Terdapat button
update dan batal. Pada halaman ini terdiri dari 6 menu
yaitu menu home, admin, siswa, soal, nilai dan logout.
Gambar 4.79 Halaman Konfigurasi Waktu
Pada gambar 4.79 merupakan layar konfigurasi waktu
yang isinya berupa form input waktu. Terdapat button
update dan batal. Pada halaman ini terdiri dari 6 menu
yaitu menu home, admin, siswa, soal, nilai dan logout.
4.5.4 Beta Testing
Pada tahap ini dilakukan pengujian (testing) terhadap aplikasi
yang telah dibuat. Pengujian aplikasi menggunakan metode
pengujian black-box, pengujian yang diterapkan adalah variasi
input yang diberikan kepada aplikasi dengan penilaian hasil uji
adalah kesesuaian output aplikasi dengan input yang diterima
aplikasi.
Alasan penulis menggunakan metode pengujian black-box
karena berdasarkan kebutuhan sistem yang telah dijelaskan
dihalaman sebelumnya, bahwa user hanya menginginkan suatu
aplikasi ketika user meng-input variabel maka akan menghasilkan
output yang diharapkan dengan tampilan yang user friendly tanpa
menguji lebih dalam logika dari proses aplikasi tersebut.
Berikut ini adalah hasil pengujian black-box terhadap aplikasi
yang dibangun.
Tabel 4.13 Pengujian Black-box
No. Rancangan
Proses
Hasil Yang
Diharapkan
Hasil Keterangan
1. Klik „Login‟ Menampilkan
halaman Utama
admin atau user
Ok Menampilkan halaman
Utama admin (Gambar
4.62)atau user.(Gambar
4.52)
2. Klik „Sound‟ Mengaktifkan atau
menon-aktikfkan
suara
Ok Mengaktifkan atau
menon-aktikfkan suara
3. Klik „Home‟ Menampilkan
halaman Utama User
Ok Menampilkan halaman
Utama User (Gambar
4.52)
4. Klik „Ujian‟ Menampilkan
halaman Ujian
Ok Menampilkan halaman
Ujian(Gambar 4.53)
5. Klik „Next‟
Ujian
Menampilkan Soal
berikutnya
Ok Menampilkan Soal
berikutnya
6. Klik „Previous‟
Ujian
Menampilkan Soal
sebelumnya
Ok Menampilkan Soal
sebelumnya
7. Klik „Play‟
Audio soal
Ujian
Memainkan Audio Ok Memainkan Audio
8. Klik „Stop‟
Audio soal
Ujian
Menghentikan Audio Ok Menghentikan Audio
10 Klik „Forward‟
Audio soal
Ujian
Memempercepat
Audio
Ok Memempercepat Audio
9. Klik „Play‟
Video soal
Ujian
Memainkan Video Ok Memainkan Video
10 Klik „Stop‟
Video soal
Ujian
Menghentikan Video Ok Menghentikan Video
11. Klik „Zoom‟
Soal
Memperbesar
Gambar Soal
Ok Memperbesar Gambar
Soal
12. Klik „Zoom
Out‟ Soal
Memperkecil
Gambar Soal
Ok Memperkecil Gambar
Soal
13. Klik „Finish‟
Ujian
Menyelesaikan ujian
dan menampilkan
nilai ujian
Ok Menyelesaikan ujian dan
menampilkan nilai ujian
(Gambar 4.58)
14. Klik „Bantuan‟ Menampilkan
Halaman Bantuan
Ok Menampilkan Halaman
Bantuan(Gambar 4.59)
15. Klik „Profile‟ Menampilkan
halaman Profile
Ok Menampilkan halaman
Profile(Gambar 4.60)
16. Klik „Logout‟ Menampilkan
halaman Utama
Ok Menampilkan halaman
Utama (Gambar 4.52)
17. Klik „Home‟ Menampilkan
halaman Utama
Admin
Ok Menampilkan halaman
Utama Admin (Gambar
4.62)
18. Klik „Admin‟ Menampilkan
Halaman Admin
Ok Menampilkan Halaman
Admin (Gambar 4.63)
19. Klik „Tambah
Data‟ Admin
Menampilkan
Halaman Tambah
Data Admin
Ok Menampilkan Halaman
Tambah Data Admin
(Gambar 4.64)
20. Klik „Edit‟
Admin
Menampilkan
Halaman Edit Data
Admin
Ok Menampilkan Halaman
Edit Data Admin
(Gambar 4.66)
21. Klik „Cari‟
Admin
Menampilkan
Halaman Cari Data
Admin
Ok Menampilkan Halaman
Cari Data Admin
(Gambar 4.65)
22. Klik „Siswa‟ Menampilkan
halaman Siswa
Ok Menampilkan halaman
Siswa (Gambar 4.66)
23. Klik „Tambah
Data‟ Siswa
Menampilkan
halaman Tambah
Ok Menampilkan halaman
Tambah Data Siswa
Data Siswa (Gambar 4.67)
24. Klik „Edit‟
Siswa
Menampilkan
halaman Edit Siswa
Ok Menampilkan halaman
Edit Siswa(Gambar
4.68)
25. Klik „Hapus‟
Siswa
Menghapus Data
Siswa
Ok Menghapus Data Siswa
(Gambar 4.69)
26. Klik „Cetak‟
Siswa
Menampilkan Cetak
Data Siswa
Ok Menampilkan Cetak
Data Siswa (Gambar
4.70)
27. Klik „Soal‟ Menampilkan
halaman Soal
Ok Menampilkan halaman
Soal (Gambar 4.71)
28. Klik „Tambah
Soal‟
Menampilkan
halaman Tambah
Soal
Ok Menampilkan halaman
Tambah Soal (Gambar
4.72)
29. Klik „Edit‟ Soal Menampilkan
halaman Edit Soal
Ok Menampilkan halaman
Edit Soal (Gambar 4.73)
30. Klik „Nilai‟ Menampilkan
halaman Nilai
Ok Menampilkan halaman
Nilai (Gambar 4.74)
31. Klik „Cetak
Laporan‟ Nilai
Menampilkan
Halaman Cetak
Laporan Nilai
Ok Menampilkan Halaman
Cetak Data Nilai
(Gambar 4.75)
32. Klik
„Konfigurasi‟
Menampilkan
Halaman
Konfigurasi
Ok Menampilkan Halaman
Konfigurasi (Gambar
4.76)
33. Klik „Edit Soal‟
konfigurasi
Menampilkan
Halaman
Konfigurasi Soal
Ok Menampilkan Halaman
Konfigurasi Soal
(Gambar 4.77)
34. Klik „Edit
Nilai‟
konfigurasi
Menampilkan
Halaman
Konfigurasi Nilai
Ok Menampilkan Halaman
Konfigurasi Nilai
(Gambar 4.78)
35. Klik „Edit
Waktu‟
konfigurasi
Menampilkan
Halaman
Konfigurasi Waktu
Ok Menampilkan Halaman
Konfigurasi Waktu
(Gambar 4.79)
4.6 Evaluasi
Setelah aplikasi Ujian Sekolah dicoba oleh Siswa Kelas 2 SMA Al-Azhar
BSD dan sebagian guru maka dilakukan evaluasi. Evaluasi berupa
wawancara dan kuesioner. Wawancara dilakukan pada tanggal 20 Mei 2011,
berlokasi di ruang Laboratorium Komputer pada gedung SMA Al-Azhar
BSD. Dari hasil wawancara yang dilakukan kepada Bapak Asep Kurniawan,
S.Kom selaku Guru Mata Pelajaran Teknologi Informasi Dan Komunikasi,
maka dapat disimpulkan:
1. Aplikasi ini sangat simple tetapi sudah mencakup soal ujian pada
Buku Materi dan LKS TIK untuk kelas 2 SMA.
2. Aplikasi ini mudah digunakan.
3. Aplikasi ini dapat membantu Guru dalam meng-copy soal, mengoreksi
jawaban dan memberikan nilai.
4. Aplikasi ini dapat membantu Murid dalam melihat nilai secara
langsung.
Hasil wawancara secara lebih rinci dapat dilihat pada lampiran.
Penyebaran kuesioner menggunakan teknik sampling stratified random
sampling yaitu suatu metode pengambilan sampel, dimana sampel penelitian
atau responden ditentukan menggunakan strata keluarga. Penyebaran
Kuesioner dilakukan pada tanggal 16-20 Mei 2010 dengan hasil dapat
disimpulkan sebagai berikut :
1. Aplikasi ini menarik dalam segi kesederhanaannya dan animasinya.
2. Aplikasi ini mudah digunakan (user friendly).
3. Informasi yang disajikan sesuai dengan materi dan lks TIK kelas 2
SMA Al-Azhar.
4. Aplikasi ini dapat menampilkan soal dan nilai dengan baik
5. Aplikasi ini dapat membantu kebutuhan Guru dan Siswa dalam ujian.
Untuk hasil lebih rinci dapat dilihat pada lampiran 4.
Selain itu dalam proses pembuatan aplikasi, penulis juga
memperhatikan prinsip-prinsip perancangan antarmuka, namun tidak semua
prinsip dapat diterapkan dalam sebuah sistem. Adapun prinsip perancangan
yang penulis terapkan dalam aplikasi Ini adalah 7 dari 8 aturan emas
perancangan antarmuka. Berikut penerapan antarmuka yang penulis
terapkan :
1. Berusaha keras untuk konsisten
Penulis berusaha untuk konsisten dalam penggunaan jenis font, warna
pada aplikasi, serta layout terutama pada bagian isi. Layout bagian isi
aplikasi ini terdiri atas header yang berisi navigasi menu utama, content.
area untuk menampilkan isi dari menu utama terpilih,
2. Memberikan umpan balik yang informatif
Di menu utama penulis menampilkan aplikasi yang sederhana. Namun
ketika user masuk ke menu ujian tampilan aplikasi berbeda dengan
adanya tombol sound on/off, dengan tujuan untuk memberikan respon
oleh program atas aksi yang diberikan pengguna.
3. Merancang dialog untuk menghasilkan keadaan akhir
Konfirmasi terhadap user dirancang ketika menjalankan menu ujian dan
mengklik menu finish. Pada kotak dialog terdapat pertanyaan “Apakah
anda sudah yakin ingin memproses hasil ujian yang telah anda isi?” Jika
User memilih “YA” maka aplikasi ini akan memproses hasil ujian yang
telah diisi. Tapi jika User memilih “TIDAK” maka menu ujian tetap
berjalan.
4. Memberikan penanganan kesalahan yang sederhana
Aplikasi yang dibangun dibuat sesederhana mungkin dalam proses
pengoperasiannya dengan tujuan agar mengurangi resiko kesalahan fatal
yang dilakukan oleh user dalam melakukan navigasi atau menjelajah
aplikasi.
5. Mengizinkan pengembalian aksi (undo) dengan mudah
Pada saat menghadapi ujian. Penulis memberikan tombol undo kepada
user untuk dapat mengulangi jawaban yang sekiranya ragu dan dapat
diisi atau diganti jawabannya.
6. Mendukung tempat kontrol internal
User harus melakukan serangkaian aksi untuk dapat mengetahui isi dari
aplikasi ini, maka user akan melakukan penjelajahan melalui kontrol
navigasi yang ada. Dari hal ini dapat dilihat bahwa pengguna menduduki
posisi inisiator.
7. Mengurangi beban ingatan jangka pendek
Dengan berusaha konsisten dalam merancang interface pada aplikasi,
hal ini dapat membantu user untuk mempermudah dalam menghafal
pemakaian program.
Penjelasan di atas merupakan acuan yang digunakan dalam
mengimplementasikan aplikasi yang dibuat, yaitu berdasarkan delapan
aturan emas yang dipakai bahwa dalam membuat interaksi manusia
komputer telah memenuhi delapan syarat interaksi manusia komputer.
BAB V
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dari hasil penelitian pembuatan aplikasi ujian mata pelajaran teknologi
informasi dan komunikasi berbasis multimedia dapat diambil beberapa
kesimpulan sebagai berikut :
1. Terciptanya suatu aplikasi ujian mata pelajaran tenologi informasi dan
komunikasi berbasis multimedia dengan ukuran file 65.5 MB. Aplikasi
ini dibangun berdasarkan tahapan-tahapan dari metode pengembangan
aplikasi multimedia yang dipakai yaitu metode IMSDD.
2. Berdasarkan Beta testing, aplikasi ini sudah memenuhi tujuan dari
rumusan masalah yang ingin dicapai oleh penulis. Diantaranya adalah :
a. Aplikasi ini dapat menamplikan soal berupa teks (gambar 4.54),
gambar (gambar 4.56), audio (gambar 4.55) video (gambar 4.57)
dan menampilkan hasil ujian secara langsung (gambar 4.58).
b. Aplikasi ini dapat menampilkan nilai siswa secara keseluruhan
(gambar 4.74) dan mencetak nilai siswa (gambar 4.75).
c. Aplikasi ini dapat menampilkan animasi frame 2 dimensi dengan
teknik motion tween dan movie clip dengan baik.
3. Mengacu pada wawancara dan kuesioner disimpulkan bahwa aplikasi
ini membantu memudahkan siswa dan guru saat ujian berlangsung.
Berdasarkan hasil wawancara dengan pak Asep Kurniawan, S.Kom
pada tanggal 20 Mei 2011 di gedung Laboratorium Komputer yaitu
”aplikasi ini sangat membantu, saya tidak perlu lagi repot2 mengkopi
banyak soal sesuai dengan jumlah siswa, mengoreksi nilai siswa.
dengan aplikasi ini akan menghemat waktu dan biaya”. Berdasarkan
kuesioner akhir sebanyak 80% responden membantu, 13% kurang
membantu dan 7% tidak membantu.
5.2 Saran
1. Pada fitur ujian tambahkan soal berupa essay, jawaban berupa audio
recording dan tampilan pilihan ganda berupa image, audio dan video.
2. Pengembangan aplikasi sebaiknya ditambahkan : fitur ujian untuk mata
pelajaran lain, fitur registrasi siswa.
LAMPIRAN
SURAT KETERANGAN
LAMPIRAN
HASIL WAWANCARA
LAMPIRAN WAWANCARA AWAL
Wawancara awal dengan Guru Mata Pelajaran Teknologi Informasi Dan
Komunikasi, SMA Al-Azhar BSD.
Nama : Asep Kurniawan, S.Kom
Jabatan : Guru
Tempat : Ruang Laboratorium Komputer
Tanggal : 16 Mei 2011
1. Tanya : Dengan metode apakah siswa ujian disekolah bapak?
Jawab : siswa ujian seperti biasa menjawab soal dikertas dengan ballpoint
atau pensil.
2. Tanya : Dengan proses ujian yang bapak berikan, apakah ada kecurangan
dari siswa dalam melaksanakan ujian?
Jawab : kecurangan selalu ada, siswa mencontek keteman yang duduk
dekatnya. dan ada juga yang membuat catatan kecil. Itu semua tergantung tiap
individu dari siswa tersebut dalam menghadapi ujian.
3. Tanya : Bagaimana ekspresi siswa dalam menghadapi ujian?
Jawab : ekspresi siswa bermacam-macam. ada yang serius, biasa saja,
bahkan ada yang tegang. klo diambil kesimpulan semuanya hampir merasa
tegang.
4. Tanya : seberapa lama kah bapak memberikan hasil ujian?
Jawab : paling lama 1 minggu setelah ujian. karena saya harus mengoreksi
jawaban siswa, setelah itu saya tulis nilai siswa dan baru saya kasih tahu
kepada siswa. itupun setelah saya berikan nilainya ke kepala sekolah terlebih
dulu.
5. Tanya : Apakah ada kendala dalam proses ujian yang sering bapak
laksanakan?
Jawab : Kendalanya semua guru pasti mengalami ini. kendala ketika
pengkopian soal yang banyak sesuai jumlah siswa, setalah itu pengoreksian
hasil ujian siswa dan pemberian nilai
6. Tanya : Apakah bapak setuju mengenai ujian sekolah dengan menggunakan
aplikasi komputer, berikan alasannya?
Jawab : sangat setuju, karena menghemat waktu dalam pembuatan soal dan
pemberian nilai, mengurangi tingkat kecurangan dan yang penting
menigkatkan kualitas dan mutu pendidikan serta apalagi ini untuk mata
pelajaran TIK, memang sudah seharusnya ujian harus dengan aplikasi
komputer untuk mengikjuti perkembangan teknologi informasi.
LAMPIRAN WAWANCARA AKHIR
Wawancara awal dengan Guru Mata Pelajaran Teknologi Informasi Dan
Komunikasi, SMA Al-Azhar BSD.
Nama : Asep Kurniawan, S.Kom
Jabatan : Guru
Tempat : Ruang Laboratorium Komputer
Tanggal : 20 Mei 2011
1. Tanya : Bagaimana pendapat bapak mengenai aplikasi ini?
Jawab : bagus, aplikasi ini sangat simpel dan menjawab kebutuhan
2. Tanya : Apakah aplikasi ini mudah digunakan?
Jawab : ketika saya coba mainkan aplikasi ini, saya rasa sangat mudah. tidak
ada kesulitan
3. Tanya : Apakah soal aplikasi ini sesuai dengan ujian yang bapak berikan?
Jawab : soal2 yang diberikan sesuai dengan materi dan ujian yang saya
berikan
4. Tanya : apakah aplikasi ini membantu siswa dalam ujian?
Jawab : saya pikir aplikasi ini membantu siswa dalam hal kemandirian siswa
dalam menjawab soal dan siswa dapat melihat nilai saat itu juga
5. Tanya : apakah aplikasi ini membantu guru dalam ujian?
Jawab : aplikasi ini sangat membantu, saya tidak perlu lagi repot2 mengkopi
banyak soal sesuai dengan jumlah siswa, mengoreksi nilai siswa. dengan
aplikasi ini akan menghemat waktu dan biaya.
6. Tanya : Apakah aplikasi ini dapat menampilkan soal?
Jawab : Iya, aplikasi ini dapat menampilkan soal dengan baik
7. Tanya : Apakah aplikasi ini dapat menampilkan nilai dan mencetak
nilai?
Jawab : iya, aplikasi ini dapat menampilkan nilai serta dapat mencetaknya.
8. Tanya : apa saran bapak untuk aplikasi ini?
Jawab : 1. jangan terlalu berat, takut lemot.
2. tampilan aplikasi ditingkatkan supaya lebih menarik
3. ada menu untuk registrasi siswa, kedepannya guru tidak lagi
mengetik username n password untuk siswa.
4. ada soal berupa essay
LAMPIRAN KUESIONER PENELITIAN
LAMPIRAN HASIL KOESIONER AWAL
Pertanyaan No.1 :
Bagaimana metode ujian disekolah anda?
Tabel Hasil Koesioner Awal pertanyaan No.1
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Menggunakan
Kertas/pensil/Ballpoint
132
123 93
b. Menggunakan
Komputer 6 5
c. Lainnya 3 2
Gambar Grafik Hasil Koesioner Awal pertanyaan No.1
Pertanyaan No.2
Setelah Ujian berlangsung, berapa lama nilai ujian keluar?
Tabel Hasil Koesioner Awal pertanyaan No.2
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Saat itu juga
132
3 2
b. Beberapa Hari 86 65
c. Beberapa Minggu 43 33
d. Beberapa Bulan 0 0
93%
5% 2%
Presentase Metode Ujian
Manual Menggunakan Komputer Lainnya
51%
21%
28%
Presentase Pendapat Ujian Manual
Biasa Saja Bosan Lainnya
Gambar Grafik Hasil Koesioner Awal pertanyaan No.2
Pertanyaan No.3
Bagaimana perasaan anda dalam mengisi soal dikertas?
Tabel Hasil Koesioner Awal pertanyaan No.3 Untuk Murid
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang) Presentase (%)
a. Biasa Saja
132
67 51
b. Bosan 28 21
c. Lainnya 37 28
Gambar Grafik Hasil Koesioner Awal pertanyaan No.3
2%
65%
33%
0%
Presentase Waktu Pemberian Nilai
Saat Itu Juga Beberapa HariBeberapa Minggu Beberapa Bulan
Pertanyaan No.4
Apakah anda pernah menggunakan komputer?
Tabel Hasil Koesioner Awal pertanyaan No.4
Gambar Grafik Hasil Koesioner Awal pertanyaan No.4
Pertanyaan No.5
Jika ada metode ujian dengan menggunakan komputer, bagaimana
pendapat anda?
Tabel Hasil Koesioner Awal pertanyaan No.5
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang) Presentase (%)
a. Setuju
132
115 87
b. Tidak Setuju 11 8
c. Lainnya 6 5
95%
5% Presentase Penggunaan Komputer
Pernah Tidak Pernah
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang) Presentase (%)
a. Pernah 132
125 95
b. Belum 7 5
72%
13%
15%
Presentase Pendapat Ujian Menggunakan Komputer
Bagus Tidak Bagus Lainnya
Gambar Grafik Hasil Koesioner Awal pertanyaan No.5
Pertanyaan No.6
Apa pendapat anda mengenai ujian dengan menggunakan komputer?
Tabel Hasil Koesioner Awal pertanyaan No.6
Gambar Grafik Hasil Koesioner Awal pertanyaan No.6
87%
8%
5%
Presentase Pendapat Ujian Menggunakan Komputer
Setuju Tidak Setuju Lainnya
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Bagus, nilai keluar
saat itu juga dan
menghemat waktu 132
95 72
b. Tidak Bagus,
merusak pemikiran 17 13
c. Lainnya 20 15
Pertanyaan No.7
Aplikasi seperti apa yang anda inginkan untuk ujian?
Tabel Hasil Koesioner Awal pertanyaan No.7
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Aplikasi yang
menampilkan teks
saja
132
6 5
b. Aplikasi yang
menampilkan teks &
gambar
15 11
c. Aplikasi Berbasis
Multimedia (teks,
gambar, audio,
video)
111 84
d. Lainnya 0 0
Gambar Grafik Hasil Koesioner Awal pertanyaan No.7
5%
11%
84%
0%
Presentase Pemilihan Aplikasi Ujian Sekolah
Teks Teks Dan Gambar Multimedia Lainnya
85%
11% 4%
Mudah Cukup Mudah Kurang Mudah
LAMPIRAN HASIL KOESIONER AKHIR
1. Apakah program ini mudah dijalankan (user friendly)?
Tabel Hasil Koesioner Akhir Pertanyaan No.1
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
d. Mudah
132
112 85
e. Cukup Mudah 14 11
f. Kurang Mudah 6 4
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.1
2. Menurut Anda, bagaimana tampilan program secara keseluruhan?
Tabel Hasil Koesioner Akhir Pertanyaan No.2
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Menarik
132
104 79
b. Cukup Menarik 25 19
c. Tidak Menarik 3 2
61%
26% 13%
Menarik Cukup Menarik Tidak Menarik
79%
19% 2%
Menarik Cukup Menarik Tidak Menarik
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.2
3. Menurut Anda, bagaimana pemilihan warna dalam program ini ?
Tabel Hasil Koesioner Akhir Pertanyaan No.3
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Menarik
132
81 61
b. Cukup Menarik 34 26
c. Tidak Menarik 17 13
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.3
4. Bagaimana kesan animasi, teks, suara dan gambar pada program ?
Tabel Hasil Koesioner Akhir Pertanyaan No.4
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Menarik
132
73 55
b. Cukup Menarik 55 42
c. Tidak Menarik 4 3
55%
42%
3%
Menarik Cukup Menarik Tidak Menarik
93%
7% 0%
Baik Cukup Baik Tidak Baik
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.4
5. Menurut Anda, apakah aplikasi ini dapat menampilkan soal dengan baik?
Tabel Hasil Koesioner Akhir Pertanyaan No.5
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Baik
132
123 93
b. Cukup Baik 9 7
c. Tidak Baik 0 0
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.5
6. Menurut Anda, apakah aplikasi ini dapat menampilkan nilai?
Tabel Hasil Koesioner Akhir Pertanyaan No.6
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Iya
132
113 86
b. Kurang 11 8
c. Tidak 8 6
72%
25%
3%
Lengkap Cukup Lengkap Tidak Lengkap
86%
8%
6%
Ya Kurang Tidak
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.6
7. Menurut Anda, apakah informasi yang disediakan lengkap ?
Tabel Hasil Koesioner Akhir Pertanyaan No.7
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Lengkap
132
95 72
b. Cukup Lengkap 33 25
c. Tidak Lengkap 4 3
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.7
8. Apakah program ini menjawab kebutuhan Anda dalam menghadapi ujian?
Tabel Hasil Koesioner Akhir Pertanyaan No.8
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Ya
132
97 80
b. Kurang 17 13
c. Tidak 8 7
80%
13% 7%
Ya Kurang Tidak
72%
25%
3%
Bagus Cukup Bagus Kurang Bagus
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.8
9. Apa pendapat Anda setelah melihat program ini secara keseluruhan?
Tabel Hasil Koesioner Akhir Pertanyaan No.9
Jawaban Responden Jumlah Responden
(Orang)
Jumlah Penjawab
(Orang)
Presentase
(%)
a. Bagus
132
87 72
b. Cukup Bagus 31 25
c. Kurang Bagus 4 3
Gambar Grafik Hasil Akhir Koesioner Pertanyaan No.9
LAMPIRAN SCRIPT
SCRIPT AKSI.PHP <?php session_start(); include_once "config.php"; include_once "fungsi_upload.php"; include_once "PDF.php"; $module=$_GET["module"]; $act=$_GET["act"]; switch($module){ case 'validation': if(!$_SESSION[user_id]) echo "&valid=0"; else echo "&valid=1"; break; case 'user': if($act=='login'){ $pass=md5($_POST[password]); $login=mysql_query("SELECT * FROM user WHERE user_code='$_POST[username]' AND user_pass='$pass'"); $ketemu=mysql_num_rows($login); $r=mysql_fetch_array($login); // Apabila username dan password ditemukan if ($ketemu > 0){ session_start(); session_register("kode_user"); session_register("user_id"); session_register("user_level"); $_SESSION[kode_user] = $r[user_code];
$_SESSION[user_id] = $r[user_id]; $_SESSION[user_level] = $r[user_level]; header('location:index.php?module=home'); } else{ echo "<center>Login gagal! username & password tidak benar<br>"; echo "<a href=index.php><b>ULANGI LAGI</b></a></center>"; } }else if($act=='logout'){ session_destroy(); header('location:index.php'); } break; case 'admin': if($act=='insert'){ $pass=md5($_POST[user_pass]); $sql="INSERT INTO user(user_id, user_code, user_pass, user_level, jenis_kelamin) VALUES('$_POST[user_id]','$_POST[user_code]','$pass','$_POST[user_level]','$_POST[jenis_kelamin]')"; }else if($act=='update'){ $pass=md5($_POST[user_pass]); if(empty($_POST['user_pass'])) $sql="UPDATE user SET user_id='".$_POST[user_id]."',user_code='".$_POST[user_code]."',jenis_kelamin='".$_POST[jenis_ke
lamin]."' WHERE user_id='".$_POST[user_id]."'"; else $sql="UPDATE user SET user_id='".$_POST[user_id]."',user_code='".$_POST[user_code]."',user_pass='$pass',jenis_kelamin='".$_POST[jenis_kelamin]."' WHERE user_id='$_POST[user_id]'"; }else if($act=='delete'){ $sql="DELETE FROM user WHERE user_id='$_GET[id]'"; } $result=mysql_query($sql); if($result) header("location:index.php?module=$module"); else echo "gagal $act data : ".mysql_error()."<br/><a href='index.php?module=$module'>kembali</a>"; break; case 'siswa': if($act=='report'){ //Column titles $headerWidth = array(30,70,30,50); $header = array('nis'=>'NIS','nama'=>'Nama','jenis_kelamin'=>'Jenis Kelamin','ket'=>'Keterangan'); //Data loading $kelas = $_POST['kelas']==''?'Seluruh Kelas':$_POST['kelas']; $where = $_POST['kelas']==''?"":" and kelas='$kelas'"; $result = mysql_query("SELECT
user_id as nis, user_code as nama, case jenis_kelamin when 'L' then 'Laki-laki' else 'Perempuan' end as jenis_kelamin, '' as ket from user where user_level='1'".$where); $jmlData = mysql_num_rows($result); $pdf=new PDF(); $pdf->SetFont('Arial','',14); $pdf->AddPage(); //header //Colors, line width and bold font $pdf->SetTextColor(0); $pdf->SetDrawColor(128,0,0); $pdf->SetLineWidth(.3); $pdf->Cell(190,7,'DATA SISWA',0,0,'C',false); $pdf->Ln(); $pdf->SetFont('Arial','',10); $pdf->Cell(30,7,'Kelas',0,0,'L',false); $pdf->Cell(100,7,': '.$kelas,0,0,'L',false); $pdf->Cell(30,7,'Jumlah',0,0,'L',false); $pdf->Cell(50,7,': '.$jmlData,0,0,'L',false); $pdf->Ln(); //table $pdf->FancyTable($headerWidth,$header,$result); $pdf->Ln(); //footer $pdf->Cell(180,7,'Mengetahui :',0,true,'R',false); $pdf->Cell(180,7,'Guru
Bidang',0,true,'R',false); $pdf->Ln(); $pdf->Ln(); $pdf->Cell(180,7,'(..................)',0,true,'R',false); $pdf->Output(); }else if($act=='insert'){ $pass=md5($_POST[user_pass]); $sql="INSERT INTO user(user_id, user_code, user_pass, user_level, jenis_kelamin,kelas) VALUES('$_POST[user_id]','$_POST[user_code]','$pass','$_POST[user_level]','$_POST[jenis_kelamin]','$_POST[kelas]')"; }else if($act=='update'){ $pass=md5($_POST[user_pass]); if(empty($_POST['user_pass'])) $sql="UPDATE user SET user_id='".$_POST[user_id]."',user_code='".$_POST[user_code]."',jenis_kelamin='".$_POST[jenis_kelamin]."',kelas='".$_POST[kelas]."' WHERE user_id='".$_POST[user_id]."'"; else $sql="UPDATE user SET user_id='".$_POST[user_id]."',user_code='".$_POST[user_code]."',user_pass='$pass',jenis_kelamin='".$_POST[jenis_kelamin]."',kelas='".$_POST[kelas]."' WHERE user_id='$_POST[user_id]'"; }else if($act=='delete'){
$sql="DELETE FROM user WHERE user_id='$_GET[id]'"; } $result=mysql_query($sql); if($result) header("location:index.php?module=$module"); else echo "gagal $act data : ".mysql_error()."<br/><a href='index.php?module=$module'>kembali</a>"; break; case 'soal': if($act=='insert'){ $type=$_POST['type']; $multimedia = $_FILES['multimedia']; $namafile=""; if($type!='1' && !empty($multimedia['tmp_name'])){ if($type=='2') $allowedExt='.jpg'; else if($type=='3') $allowedExt='.flv'; else if($type=='4') $allowedExt='.mp3'; $ext=strtolower(substr($multimedia['name'],-4)); $namafile = "data_".rand(000000,999999).$allowedExt; if(!uploadFile($namafile, $multimedia,$allowedExt,"data/")){ echo "<b>Gagal menyimpan data file $multimedia[name] !!!!</b><br>
Tipe file yang diperbolehkan adalah : <b>*.jpg *.jpeg *.gif *.flv</b>.<br> <a href=javascript:history.go(-1)>Ulangi Lagi</a>"; exit; } } $sql = "INSERT INTO soal (soal_text, pil_a, pil_b, pil_c, pil_d, pil_e, jawaban, type, media) VALUES('$_POST[soal_text]','$_POST[pil_a]','$_POST[pil_b]','$_POST[pil_c]','$_POST[pil_d]','$_POST[pil_e]','$_POST[jawaban]','$type','$namafile');"; }else if($act=='update'){ $type=$_POST['type']; $multimedia = $_FILES['multimedia']; $namafile=""; if($type!='1' && !empty($multimedia['tmp_name'])){ if($type=='2') $allowedExt='.jpg'; else if($type=='3') $allowedExt='.flv'; else if($type=='4') $allowedExt='.mp3'; $ext=strtolower(substr($multimedia['name'],-4)); $namafile = "data_".rand(000000,999999).$allowedExt; if(!uploadFile($namafile,
$multimedia,$allowedExt,"data/")){ echo "<b>Gagal menyimpan data file $multimedia[name] !!!!</b><br> Tipe file yang diperbolehkan adalah : <b>*.jpg *.jpeg *.gif *.flv*</b>.<br> <a href=javascript:history.go(-1)>Ulangi Lagi</a>"; exit; } if(!removeFile("soal", "media", $_POST[soal_id], "data/")){ echo "<b>Gagal menghapus data file $multimedia[name] !!!!</b><br> <a href=javascript:history.go(-1)>Ulangi Lagi</a>"; exit; } $sql = "UPDATE soal SET soal_text='$_POST[soal_text]', pil_a='$_POST[pil_a]', pil_b='$_POST[pil_b]', pil_c='$_POST[pil_c]', pil_d='$_POST[pil_d]', pil_e='$_POST[pil_e]', jawaban='$_POST[jawaban]', type='$type',
media='$namafile' WHERE soal_id='$_POST[soal_id]';"; }else{ if(!removeFile("soal", "media", $_POST[soal_id], "data/")){ echo "<b>Gagal menghapus data file $multimedia[name] !!!!</b><br> <a href=javascript:history.go(-1)>Ulangi Lagi</a>"; exit; } $sql = "UPDATE soal SET soal_text='$_POST[soal_text]', pil_a='$_POST[pil_a]', pil_b='$_POST[pil_b]', pil_c='$_POST[pil_c]', pil_d='$_POST[pil_d]', pil_e='$_POST[pil_e]', type='$type', jawaban='$_POST[jawaban]' WHERE soal_id='$_POST[soal_id]';"; } }else if($act=='delete'){ if(!removeFile("soal", "media", $_GET[id], "data/")){
echo "Failed Remove File $r[media] <br/><a href='index.php?module=$modul'>kembali</a>"; exit; } $sql="DELETE FROM soal WHERE soal_id='$_GET[id]'"; } $result=mysql_query($sql); if($result) header("location:index.php?module=$module"); else echo "gagal $act data : ".mysql_error()."<br/><a href='index.php?module=$modul'>kembali</a>"; break; //nilai case 'nilai': if($act=='delete'){ $sql="DELETE FROM nilai WHERE nilai_id='$_GET[id]'"; $result=mysql_query($sql); if($result) header("location:index.php?module=$module"); else echo "gagal $act data : ".mysql_error()."<br/><a href='index.php?module=$modul'>kembali</a>"; }else if($act=='report'){ $today = date('Y-m-j'); //Column titles $headerWidth = array(30,70,10,20,50); $header = array('nis'=>'NIS','nama'=>'Nama','nilai'=>'Nila
i','waktu'=>'Waktu',''=>'Keterangan'); //Data loading $kelas = $_POST['kelas']==''?'Seluruh Kelas':$_POST['kelas']; $where = $_POST['kelas']==''?'':" where b.kelas='$kelas'"; $result = mysql_query("SELECT b.user_id as nis, b.user_code as nama, a.total as nilai, a.lama_ujian as waktu FROM nilai a join user b on a.user_id=b.user_id $where order by a.tgl_ujian desc, a.total desc"); $jmlData = mysql_num_rows($result); $pdf=new PDF(); $pdf->SetFont('Arial','',14); $pdf->AddPage(); //header //Colors, line width and bold font $pdf->SetTextColor(0); $pdf->SetDrawColor(128,0,0); $pdf->SetLineWidth(.3); $pdf->Cell(190,7,'DATA NILAI SISWA',0,0,'C',false); $pdf->Ln(); $pdf->SetFont('Arial','',10); $pdf->Cell(30,7,'Mata Pelajaran',0,0,'L',false); $pdf->Cell(100,7,': Teknologi Informasi Dan Komunikasi (TIK)',0,0,'L',false); $pdf->Cell(30,7,'Tanggal',0,0,'L',false);
$pdf->Cell(50,7,': '.convertDate($today),0,0,'L',false); $pdf->Ln(); $pdf->SetFont('Arial','',10); $pdf->Cell(30,7,'Kelas',0,0,'L',false); $pdf->Cell(100,7,': '.$kelas,0,0,'L',false); $pdf->Cell(30,7,'Jumlah',0,0,'L',false); $pdf->Cell(50,7,': '.$jmlData,0,0,'L',false); $pdf->Ln(); //table $pdf->FancyTable($headerWidth,$header,$result); $pdf->Ln(); //footer $pdf->Cell(180,7,'Mengetahui :',0,true,'R',false); $pdf->Cell(180,7,'Guru Bidang',0,true,'R',false); $pdf->Ln(); $pdf->Ln(); $pdf->Cell(180,7,'(..................)',0,true,'R',false); $pdf->Output(); }else{ header("location:index.php?module=$module"); } break; case 'config': if($act=='update'){ $sql="UPDATE config SET nilai=$_POST[nilai] WHERE config_id='$_POST[config_id]'"; }
$result=mysql_query($sql); if($result) header("location:index.php?module=$module"); else echo "gagal $act data : ".mysql_error()."<br/><a href='index.php?module=$module'>kembali</a>"; break;
//jika tidak ada aksi yang tersedia default : echo "tidak ada aksi yang tersedia<br/> <a href='index.php'>kembali</a>"; } ?>
SCRIPT FUNGSI UPLOAD.PHP
<?php function uploadFile($namafile, $file, $ext, $dest){ $lokasi = $file['tmp_name']; $upload=false; if(!empty($lokasi)){ $tipe=strtolower(substr($namafile,-4)); $arrayExt=explode(",",$ext); foreach($arrayExt as $a){ if($a==$tipe){ $upload=true; break; } $upload=false; } if($upload){ if(!move_uploaded_file($lokasi,$dest.$namafile)){ return false; }else{ return true; } }else{ return false; } } } function removeFile($table, $field, $id, $path){ //baca data
$query="SELECT $field FROM $table WHERE ".$table."_id='$id'"; $result=mysql_query($query); $data=mysql_fetch_array($result); //jika ada file, hapus if(!empty($data[$field]) and file_exists($path.$data[$field])){ $hapus=unlink(realpath($path.$data[$field])); }else{ $hapus=true; } if($hapus){ return true; }else{ return false; } } function copyfile($file1,$file2){ $contentx =@file_get_contents($file1); $openedfile = fopen($file2, "w"); fwrite($openedfile, $contentx); fclose($openedfile); if ($contentx === FALSE) { $status=false; }else $status=true; return $status; }
function smartCopy($source, $dest, $options=array('folderPermission'=>0755,'filePermission'=>0755)) { $result=false; if (is_file($source)) { if ($dest[strlen($dest)-1]=='/') { if (!file_exists($dest)) { cmfcDirectory::makeAll($dest,$options['folderPermission'],true); } $__dest=$dest."/".basename($source); } else { $__dest=$dest; } $result=copy($source, $__dest); chmod($__dest,$options['filePermission']); } elseif(is_dir($source)) { if ($dest[strlen($dest)-1]=='/') { if ($source[strlen($source)-1]=='/') { //Copy only contents } else { //Change parent itself and its contents
$dest=$dest.basename($source); @mkdir($dest); chmod($dest,$options['filePermission']); } } else { if ($source[strlen($source)-1]=='/') { //Copy parent directory with new name and all its content @mkdir($dest,$options['folderPermission']); chmod($dest,$options['filePermission']); } else { //Copy parent directory with new name and all its content @mkdir($dest,$options['folderPermission']); chmod($dest,$options['filePermission']); } } $dirHandle=opendir($source); while($file=readdir($dirHandle)) { if($file!="." && $file!="..") { if(!is_dir($source."/".$file)) { $__dest=$dest."/".$file;
} else { $__dest=$dest."/".$file; } //echo "$source/$file ||| $__dest<br />"; $result=smartCopy($source."/".$file, $__dest, $options); } } closedir($dirHandle); } else { $result=false; } return $result; } /* * function to convert date from database * input $tanggal is formatted based on SQL. example : 2010-12-29 * output as 29 Desember 2010 */ function convertDate($tanggal){ $listbulan=array("januari","februari","maret","april","mei","juni","juli","agustus","september","oktober","november","desember"); $listhari=array("minggu","senin","selasa","rabu","kamis","jumat","sabtu"); $tanggal2=explode("-",$tanggal); $tahun=$tanggal2[0]; $bulan=$tanggal2[1]-1;
$hari=date("w",mktime(0,0,0,$tanggal2[1],$tanggal2[2],$tanggal2[0])); for($i=0;$i<12;$i++){ if($bulan==$i){ $hasilbln=$listbulan[$i]; break; } } for($i=0;$i<7;$i++){ if($hari==$i){ $hasilhari=$listhari[$i]; break; } } $hasil="$tanggal2[2] $hasilbln $tahun"; return $hasil; } function convertTime($detik) { $jam = round($detik/3600); $jam = $jam>0?$jam:0; $menit = round(($detik/60)-($jam*60)); $menit = $menit>0?$menit:0; $detik = round($detik-($jam*60)-($menit*60)); $format = "$jam : $menit"; return $format; } function acakJawaban($listJawaban, $jawaban){ $listKunci = array("a","b","c","d","e"); $limit = 5;
for($i=0;$i<$limit;$i++){ if($listKunci[$i]==$jawaban) $key=$listJawaban[$i]; } shuffle($listJawaban); for($i=0;$i<$limit;$i++){ if($listJawaban[$i]==$key) $newJawaban=$listKunci[$i]; } $jawabanTeracak=$listJawaban; $jawabanTeracak[$limit]=$newJawaban; return $jawabanTeracak; /* for($i=0;$i<$limit;$i++) echo $listKunci[$i].". ".$jawabanTeracak[$i]."<br/>"; echo "jawaban yang benar : ".$jawabanTeracak[$limit]; */ } function listKelas($kelas){ $lists = array('XI A','XI B','XI C'); $value = "<select name='kelas'>"; $value .= "<option value=''>All</option>"; foreach($lists as $list)
$value .= $list==$kelas?"<option value='$list' selected=selected>$list</option>":"<option value='$list'>$list</option>"; $value .= "</select>"; return $value; } ?>
236
DATA.PHP
<?php session_start(); include_once("class/XML.php"); include_once("config.php"); include_once("fungsi_upload.php"); $path = "http://192.168.43.8/app"; $limit=5; $pilihan = array("pil_a","pil_b","pil_c","pil_d","pil_e","jawaban"); $prefix = array("A. ","B. ","C. ","D. ","E. ",""); $config_result=mysql_query("SELECT nilai FROM config where nama='soal'"); $configRow=mysql_fetch_row($config_result); $limitSoal = $configRow[0]; $config_result=mysql_query("SELECT nilai FROM config where nama='waktu'"); $configRow=mysql_fetch_row($config_result); $limitWaktu = $configRow[0]; $config_result=mysql_query("SELECT nilai FROM config where nama='nilai'"); $configRow=mysql_fetch_row($config_result); $point = $configRow[0]; //$id=$_SESSION[id_modul]; $id=$_GET[id]; $soal_result=mysql_query("SELECT * FROM soal order by rand() limit $limitSoal"); $jmlsoal=mysql_num_rows($soal_result); //create object xml $xml = new XML(); //buat node pertama $r = $xml->createRoot("ujian"); //Konfigurasi Batas Waktu $config = $r->addChild("konfigurasi"); $config->addAttribute("waktu",$limitWaktu, false); $config->addAttribute("point",$point, false); $config->addAttribute("path",$path, false); //membuat node evaluasi modul $evaluasi = $r->addChild("evaluasi"); if($jmlsoal>0){
237
while($row=mysql_fetch_array($soal_result)){ $soal= $evaluasi->addChild("soal"); $soal->addAttribute("pertanyaan","<![CDATA[$row[soal_text]]]>", false); $jawabanTeracak = acakJawaban(array($row[pil_a],$row[pil_b],$row[pil_c],$row[pil_d],$row[pil_e]),$row[jawaban]); for($i=0;$i<=$limit;$i++){ $soal->addAttribute($pilihan[$i],$prefix[$i].$jawabanTeracak[$i], false); } $soal->addAttribute("type","$row[type]", false); $soal->addAttribute("media","$row[media]", false); } }else{ $evaluasi->addAttribute("soal","kosong", false); } echo $xml->toString(true); ?>