aplikasi ujian mata pelajaran teknologi informasi … · 2013. 4. 24. · pengesahan ujian skripsi...

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


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


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.


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.


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 :

http://www.fixya.com/support/p163905-minolta_snappy_video_snapshot_still

http://www.fixya.com/support/p163905-minolta_snappy_video_snapshot_still

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).

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 tryout.

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 tryout. 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


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


14. data_2447

50


15. data_9370

72


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.



halaman Siswa.



halaman Soal.



halaman Nilai.


admin menuju

contenthalaman Konfigurasi.



halaman utama Home.

button pada layar aplikasi

.swf menu Home untuk user

yang ingin menuju ke menu

utama Home.


.swf menu Ujian untuk user


utama Ujian.


.swf menu Bantuan untuk

user yang ingin menuju ke

menu utama Bantuan.


.swf menu Profile untuk user


utama Profile.

button Next pada layar

aplikasi .swf menu Ujian

untuk user yang ingin

melanjutkan ke soal

berikutnya.

button Prev pada layar



kembali ke soal sebelumnya.

button Finish pada layar



Menyelesaikan Ujian.


.swf untuk user yang ingin

mengaktifkan audio.


.swf untuk user yang ingin

me-non-aktifkan audio.


.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



Menghentikan Audio dan

Video



Mempercepat Audio dan

Video



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.


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.


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


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


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


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


Soal


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


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


Nilai


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


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


Konfigurasi


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


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


3icon navigasi menu, yaitu Home, Ujian, dan Profile. Terdapat



audio.

Gambar 4.21 Halaman Profile User

Gambar 4.21 merupakan tahap perancangan halaman profile layar


3icon navigasi menu, yaitu Home, Ujian, dan Bantuan. Terdapat



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


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


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


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


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


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


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);


loadImage(path + "/data/" +

evalList[currentQst].media);


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


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


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


navigasi menu, yaitu Home, Ujian, dan Bantuan.

Terdapat juga icon audio untuk mengaktifkan dan


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



Gambar 4.79 Halaman Konfigurasi Waktu

Pada gambar 4.79 merupakan layar konfigurasi waktu

yang isinya berupa form input waktu. Terdapat button



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


Utama User (Gambar

4.52)

4. Klik „Ujian‟ Menampilkan

halaman Ujian


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


Profile(Gambar 4.60)

16. Klik „Logout‟ Menampilkan

halaman Utama


Utama (Gambar 4.52)

17. Klik „Home‟ Menampilkan

halaman Utama

Admin


Utama Admin (Gambar

4.62)

18. Klik „Admin‟ Menampilkan

Halaman Admin


Admin (Gambar 4.63)

19. Klik „Tambah

Data‟ Admin

Menampilkan

Halaman Tambah

Data Admin


Tambah Data Admin

(Gambar 4.64)

20. Klik „Edit‟

Admin

Menampilkan

Halaman Edit Data

Admin


Edit Data Admin

(Gambar 4.66)

21. Klik „Cari‟

Admin

Menampilkan

Halaman Cari Data

Admin


Cari Data Admin

(Gambar 4.65)

22. Klik „Siswa‟ Menampilkan

halaman Siswa


Siswa (Gambar 4.66)

23. Klik „Tambah

Data‟ Siswa

Menampilkan

halaman Tambah


Tambah Data Siswa

Data Siswa (Gambar 4.67)

24. Klik „Edit‟

Siswa

Menampilkan

halaman Edit Siswa


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


Soal (Gambar 4.71)

28. Klik „Tambah

Soal‟

Menampilkan

halaman Tambah

Soal


Tambah Soal (Gambar

4.72)

29. Klik „Edit‟ Soal Menampilkan

halaman Edit Soal


Edit Soal (Gambar 4.73)

30. Klik „Nilai‟ Menampilkan

halaman Nilai


Nilai (Gambar 4.74)

31. Klik „Cetak

Laporan‟ Nilai

Menampilkan

Halaman Cetak

Laporan Nilai


Cetak Data Nilai

(Gambar 4.75)

32. Klik

„Konfigurasi‟

Menampilkan

Halaman

Konfigurasi


Konfigurasi (Gambar

4.76)

33. Klik „Edit Soal‟

konfigurasi

Menampilkan

Halaman

Konfigurasi Soal


Konfigurasi Soal

(Gambar 4.77)

34. Klik „Edit

Nilai‟

konfigurasi

Menampilkan

Halaman

Konfigurasi Nilai


Konfigurasi Nilai

(Gambar 4.78)

35. Klik „Edit

Waktu‟

konfigurasi

Menampilkan

Halaman

Konfigurasi Waktu


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?



(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


Pertanyaan No.3

Bagaimana perasaan anda dalam mengisi soal dikertas?

Tabel Hasil Koesioner Awal pertanyaan No.3 Untuk Murid


(Orang)

Jumlah Penjawab

(Orang) Presentase (%)

a. Biasa Saja

132

67 51

b. Bosan 28 21

c. Lainnya 37 28


2%

65%

33%

0%

Presentase Waktu Pemberian Nilai

Saat Itu Juga Beberapa HariBeberapa Minggu Beberapa Bulan

Pertanyaan No.4

Apakah anda pernah menggunakan komputer?



Pertanyaan No.5

Jika ada metode ujian dengan menggunakan komputer, bagaimana

pendapat anda?



(Orang)

Jumlah Penjawab


a. Setuju

132

115 87

b. Tidak Setuju 11 8

c. Lainnya 6 5

95%

5% Presentase Penggunaan Komputer

Pernah Tidak Pernah


(Orang)

Jumlah Penjawab


a. Pernah 132

125 95

b. Belum 7 5

72%

13%

15%

Presentase Pendapat Ujian Menggunakan Komputer

Bagus Tidak Bagus Lainnya


Pertanyaan No.6

Apa pendapat anda mengenai ujian dengan menggunakan komputer?



87%

8%

5%

Presentase Pendapat Ujian Menggunakan Komputer

Setuju Tidak Setuju Lainnya


(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?



(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


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


(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?



(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%



3. Menurut Anda, bagaimana pemilihan warna dalam program ini ?



(Orang)

Jumlah Penjawab

(Orang)

Presentase

(%)

a. Menarik

132

81 61




4. Bagaimana kesan animasi, teks, suara dan gambar pada program ?



(Orang)

Jumlah Penjawab

(Orang)

Presentase

(%)

a. Menarik

132

73 55



55%

42%

3%


93%

7% 0%

Baik Cukup Baik Tidak Baik


5. Menurut Anda, apakah aplikasi ini dapat menampilkan soal dengan baik?



(Orang)

Jumlah Penjawab

(Orang)

Presentase

(%)

a. Baik

132

123 93

b. Cukup Baik 9 7

c. Tidak Baik 0 0


6. Menurut Anda, apakah aplikasi ini dapat menampilkan nilai?



(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


7. Menurut Anda, apakah informasi yang disediakan lengkap ?



(Orang)

Jumlah Penjawab

(Orang)

Presentase

(%)

a. Lengkap

132

95 72

b. Cukup Lengkap 33 25

c. Tidak Lengkap 4 3


8. Apakah program ini menjawab kebutuhan Anda dalam menghadapi ujian?



(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


9. Apa pendapat Anda setelah melihat program ini secara keseluruhan?



(Orang)

Jumlah Penjawab

(Orang)

Presentase

(%)

a. Bagus

132

87 72

b. Cukup Bagus 31 25

c. Kurang Bagus 4 3


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 "; echo "<a href=index.php>ULANGI LAGI</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()." <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()." <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 "Gagal menyimpan data file $multimedia[name] !!!!

Tipe file yang diperbolehkan adalah : *.jpg *.jpeg *.gif *.flv. <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 "Gagal menyimpan data file $multimedia[name] !!!! Tipe file yang diperbolehkan adalah : *.jpg *.jpeg *.gif *.flv*. <a href=javascript:history.go(-1)>Ulangi Lagi</a>"; exit; } if(!removeFile("soal", "media", $_POST[soal_id], "data/")){ echo "Gagal menghapus data file $multimedia[name] !!!! <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 "Gagal menghapus data file $multimedia[name] !!!! <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] <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()." <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()." <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()." <a href='index.php?module=$module'>kembali</a>"; break;

//jika tidak ada aksi yang tersedia default : echo "tidak ada aksi yang tersedia <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; }

} else { $__dest=$dest."/".$file; } //echo "$source/$file ||| $__dest "; $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]." "; 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); ?>

aplikasi ujian mata pelajaran teknologi informasi … · 2013. 4. 24. · pengesahan ujian skripsi...

Documents