Implementasi Antarmuka IMPLEMENTASI AJAX PADA APLIKASI E-LEARNING BERBASIS WEB (STUDY KASUS DI SEKOLAH TINGGI TEKNIK YPM SIDOARJO).

Halaman yang ditujukan untuk mahasiswa terdiri dari : a. Halaman awal e-learning b. Halaman utama e-learning c. Halaman perkuliahan d. Halaman Profil Halaman Forum terdiri dari : a. Halaman Utama forum b. Halaman Kategori c. Halaman Topik dan reply

4.3.1. Implementasi Halaman Administrator

1 Halaman Login Administrator Halaman login ini akan tampil ketika admin pertama kali membuka aplikasi direktori admin. Di halaman login admin memasukan username dan password untuk verifikasi data, setelah itu halaman login administrator akan memproses otentifikasinya. Berikut ini tampilan dari halaman login seperti pada gambar 4.9. Gambar 4.9 Halaman login administrator 2 Halaman Utama Administrator Setelah melalui proses login pada halaman login maka admin akan menjumpai menu utama admin. Pada halaman ini admin dapat memilih menu antara lain : a. Manajemen Mahasiswa, b. Manajemen Dosen, c. Manajemen Jurusan, d. Manajemen Mata kuliah, e. Manajemen Kuliah, f. Ubah Password, g. Logout. Berikut ini tampilan dari halaman menu admin seperti pada gambar 4.10. Gambar 4.10 Halaman utama administrator 3 Halaman Manajemen Mahasiswa Pada halaman manajemen mahasiswa, admin dapat melihat, menambahkan, mengubah serta menghapus data mahasiswa. Halaman manajemen mahasiswa dapat dilihat seperti pada gambar 4.11. Gambar 4.11 Halaman manajemen mahasiswa Untuk menambahkan data mahasiswa klik pada tombol Tambah, maka akan tampil halaman tambah data mahasiswa seperti pada gambar 4.12. Gambar 4.12 Halaman tambah data mahasiswa Untuk mengubah data mahasiswa klik pada tombol edit, maka akan tampil halaman edit data mahasiswa seperti pada gambar 4.13. Gambar 4.13 Halaman edit data mahasiswa 4 Halaman Manajemen Dosen Pada halaman manajemen dosen, admin dapat melihat, menambahkan, mengubah serta menghapus data dosen. Halaman manajemen dosen dapat dilihat seperti pada gambar 4.14. Gambar 4.14 Halaman manajemen dosen Untuk menambahkan data dosen klik pada tombol Tambah, maka akan tampil halaman tambah data dosen seperti pada gambar 4.15. Gambar 4.15 Halaman tambah data dosen Untuk mengubah data dosen klik pada tombol edit, maka akan tampil halaman edit data dosen seperti pada gambar 4.16. Gambar 4.16 Halaman edit data dosen 5 Halaman Manajemen Jurusan Pada halaman manajemen jurusan, admin dapat melihat, menambahkan, mengubah serta menghapus data jurusan. Halaman manajemen jurusan dapat dilihat seperti pada gambar 4.17. Gambar 4.17 Halaman manajemen jurusan Untuk menambahkan data jurusan klik pada tombol Tambah, maka akan tampil halaman tambah data jurusan seperti pada gambar 4.18. Gambar 4.18 Halaman tambah data jurusan Untuk mengubah data jurusan klik pada tombol edit, maka akan tampil halaman edit data jurusan seperti pada gambar 4.19. Gambar 4.19 Halaman edit data jurusan 6 Halaman Manajemen Mata Kuliah Pada halaman manajemen mata kuliah, admin dapat melihat, menambahkan, mengubah serta menghapus data mata kuliah. Halaman manajemen mata kuliah dapat dilihat seperti pada gambar 4.20. Gambar 4.20 Halaman manajemen mata kuliah Untuk menambahkan data mata kuliah klik pada tombol Tambah, maka akan tampil halaman tambah data mata kuliah seperti pada gambar 4.21. Gambar 4.21 Halaman tambah data mata kuliah Untuk mengubah data mata kuliah klik pada tombol edit, maka akan tampil halaman edit data mata kuliah seperti pada gambar 4.22. Gambar 4.22 Halaman edit data mata kuliah 7 Halaman Manajemen Kuliah Pada halaman manajemen kuliah, admin dapat melihat, menambahkan, mengubah serta menghapus data mata kuliah. Data-data yang harus dimasukkan adalah nama dosen, nama mata kuliah , tahun ajaran dan semester. Halaman manajemen kuliah dapat dilihat seperti pada gambar 4.23. Gambar 4.23 Halaman manajemen kuliah Untuk menambahkan data kuliah klik pada tombol Tambah, maka akan tampil halaman tambah data kuliah seperti pada gambar 4.24. Gambar 4.24 Halaman tambah data kuliah Untuk mengubah data kuliah klik pada tombol edit, maka akan tampil halaman edit data mata kuliah seperti pada gambar 4.25. Gambar 4.25 Halaman edit data kuliah 8 Halaman Ubah Password Pada halaman ubah password, admin dapat mengubah password dengan memasukkan password yang lama untuk pengecekannya. Halaman ubah password dapat dilihat seperti pada gambar 4.26. Gambar 4.26 Halaman ubah password

4.3.2. Implementasi Halaman Dosen

1 Halaman Selamat Datang Pada halaman selamat datang ini, ditampilkan nama-nama dosen yang ada di STT YPM Sidoarjo. Tampilan halaman ini dapat dilihat pada gambar 4.27. Gambar 4.27 Halaman selamat datang untuk dosen 2 Halaman Profil Dosen Untuk dapat mengakses halaman ini harus login sebagai dosen terlebih dahulu. Pada halaman profil dosen ini, dosen dapat melihat dan mengubah data profilnya, serta dapat mengubah password dan fotonya. Halaman profil dosen ada pada gambar 4.28. Gambar 4.28 Halaman profil dosen 3 Halaman Kuliah Untuk dapat mengakses halaman ini harus login sebagai dosen terlebih dahulu. Pada halaman kuliah ini, dosen dapat menambahkan materi pada mata kuliah yang diajarkannya. Halaman kuliah dapat dilihat pada gambar 4.29. Gambar 4.29 Halaman kuliah Untuk mengupload materi tekan tombol tambah materi, setelah tombol tambah materi diklik akan tampil form upload materi dalam bentuk thickbox, untuk form upload materi dapat dilihat pada gambar 4.30. Gambar 4.30 Tampilan form upload materi Untuk melihat dan mendownload materi, dapat dengan memilih tombol lihat materi, Jika ingin mendownload materi dapat dengan menklik nama file dari materi yang diinginkan. halaman daftar materi dapat dilihat pada gambar 4.31. Gambar 4.31 Tampilan daftar materi 4 Halaman Peserta Kuliah Untuk dapat mengakses halaman ini harus login sebagai dosen terlebih dahulu. Pada halaman ini, dosen dapat menambahkan dan menghapus peserta pada mata kuliah yang diajarkannya. Halaman peserta perkuliahan dapat dilihat pada gambar 4.32. Gambar 4.32 Halaman peserta kuliah 5 Halaman Penilaian Untuk dapat mengakses halaman ini harus login sebagai dosen terlebih dahulu. Pada halaman ini, dosen dapat memasukkan nilai uts dan nilai uas pada peserta perkuliahannya. Halaman penilaian dapat dilihat pada gambar 4.33. Gambar 4.33 Halaman penilaian 6 Halaman Penugasan Untuk dapat mengakses halaman ini harus login sebagai dosen terlebih dahulu. Pada halaman ini, dosen dapat membuat soal untuk tugas perkuliahannya. Halaman penugasan dapat dilihat pada gambar 4.34. Gambar 4.34 Halaman penugasan Untuk melihat siapa saja peserta yang sudah mengumpulkan tugas, dan untuk mendownload tugas-tugas yang sudah diupload oleh peserta tekan tombol detail tugas, maka akan muncul tampilan seperti pada gambar 4.35 Gambar 4.35 Halaman daftar jawaban tugas

4.3.3. Implementasi Halaman Mahasiswa

1 Halaman awal e-learning Gambar 4.36 Halaman awal e-learning untuk mahasiswa Pada halaman e-learning user dapat melihat materi terkini dan materi terpopuler, namun user tidak dapat men-download materi sebelum login sebagai mahasiswa. 2 Halaman utama e-learning Untuk dapat mengakses halaman utama e-learning, user harus login sebagai mahasiswa terlebih dahulu. pada halaman utama terdapat daftar perkuliahan yang diikuti, materi-materi terbaru dan terpopuler, tugas-tugas terkini, serta statistic user. Tampilan untuk halaman utama e-learning dapat dilihat pada gambar 4.37. Gambar 4.37 Halaman utama e-learning 3 Halaman Perkuliahan Untuk membuka halaman perkuliahan, mahasiswa dapat memilih mata kuliah yang ada pada kolom perkuliahan, atau untuk melihat seluruh daftar perkuliahan yang diikuti dapat dengan menklik “Lihat semua” pada kolom perkuliahan. Tampilan seluruh daftar perkuliahan dapat dilihat pada gambar 4.38. Gambar 4.38 Halaman daftar perkuliahan Untuk dapat melihat detai perkuliahan, klik pada tombol “lihat perkuliahan” yang ingin dilihat. Tampilan detail perkuliahan dapat dilihat pada gambar 4.39. Gambar 4.39 Halaman detail perkuliahan Pada halaman detail perkuliahan terdapat beberapa menu antara lain: Deskripsi, Materi, Tugas, Nilai dan Peserta. Pada halaman materi mahasiswa dapat mendownload materi yang telah diupload oleh dosen. Tampilan halaman materi pada detail perkuliahan dapat dilihat pada gambar 4.40. Gambar 4.40 Halaman detail materi perkuliahan Untuk mendownload materi itu sendiri, user memilih materi mana yang ingin di download, maka akan tampil halaman download seperti pada gambar 4.41. Gambar 4.41 Halaman download materi Jika mahasiswa ingin melihat ada tugas atau tidak dari dosen. Mahasiswa dapat membuka halaman tugas pada detail perkuliahan. Tampilan halaman tugas dapat dilihat pada gambar 4.42. Gambar 4.42 Halaman tugas Untuk melihat detail tugas, klik tombol “lihat soal” maka akan muncul tampilan dalam bentuk thickbox seperti pada gambar dibawah ini : Gambar 4.43 Halaman detail tugas Untuk menupload jawaban tugas klik tombol upload tugas, akan tampil halaman seperti pada gambar berikut ini: Gambar 4.44 Halaman upload tugas Untuk melihat peserta perkuliahan, pilih menu peserta pada halaman detail perkuliahan, maka akan tampil halaman seperti pada gambar berikut ini: Gambar 4.45 Halaman Peserta Jika ingin melihat profil dari peserta yang lain, klik tombol “lihat profil”, maka akan tampil halaman profil dari peserta yang diinginkan berupa thickbox. Tapilan lihat profil dapat dilihat pada gambar berikut : Gambar 4.46 Halaman lihat profil peserta lain 4 Halaman Pengaturan Profil Gambar 4.47 Halaman profil user

4.3.4. Implementasi Halaman Forum

1 Halaman Utama Forum Pada halaman utama forum ini ditampilkan kategori-kategori yang ada di forum e-learning ini, kategori diambil berdasarkan mata kuliah dari tiap jurusan yang ada di STT YPM. Berikut adalah gambar dari halaman utama forum : Gambar 4.48 Halaman utama forum 2 Halaman Topik Forum Pada halaman topik forum ini menampilkan topik-topik yang sudah ada berdasarkan kategori yang dipilih oleh pengguna. Kategori berdasarkan mata kuliah yang ada pada e-learning. Berikut adalah gambar dari halaman topik forum : Gambar 4.49 Halaman topik forum 3 Halaman Reply Forum Pada halaman reply forum ini menampilkan reply-reply dari forum yang dipilih. Berikut adalah gambar dari halaman reply forum : Gambar 4.50 Halaman reply forum 86 BAB V UJI COBA DAN EVALUASI PROGRAM Pada bab ini membahas tentang ujicoba dan evaluasi program yang menerangkan bagaimana jalannya program secara detail dan akan dijelaskan pada sub bab dibawah ini :

5.1. Uji Coba Sistem

Pada bagian ini akan dijelaskan mengenai proses uji coba dari aplikasi yang telah dibuat berdasarkan dari desain sistem yang telah dijelaskan sebelumnya. Uji coba ini dilakukan untuk melihat dari aplikasi yang telah dibuat sesuai dengan yang diharapkan, mulai dari awal proses input masukan data yang dilakukan oleh administrator sampai dengan hasil output keluaran. Uji coba yang akan dijalankan adalah sebagai berikut :

5.2. Uji Coba Halaman Administrator

5.2.1. Uji Coba Halaman Login Admin

Form login admin digunakan sebelum mengakses aplikasi ini. Tujuannya adalah untuk keamanan sebuah aplikasi agar tidak digunakan oleh pihak lain yang tidak berkepentingan. Untuk uji coba login admin maka harus memasukan username dan password dan diikuti dengan tombol login. Berikut ini tampilan dari halaman login admin seperti pada gambar 5.1. Gambar 5.1 Uji Coba Halaman Login Admin

5.2.2. Uji Coba Halaman Utama Admin

Setelah proses login berhasil maka akan masuk ke halaman admin. Admin yang sudah terdaftar akan terotomatis telah tersimpan ke dalam database. Berikut ini tampilan dari menu utama admin seperti pada gambar 5.2. Gambar 5.2 Uji Coba Halaman Utama Admin