Implementasi Sistem Implementasi Perancangan Antarmuka

BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM

Bab ini akan membahas tentang implementasi gamification pada m-learning, serta penjelasan mengenai pengujian sistem yang telah dibangun.

4.1. Implementasi Sistem

4.1.1. Lingkungan Implementasi Lingkungan implementasi yang dimaksud adalah spesifikasi perangkat keras dan perangkat lunak yang digunakan pada saat pengimplementasian sistem. Berikut ini merupakan spesifikasi perangkat keras dan perangkat lunak yang digunakan. 1. Perangkat Keras Hardware Perangkat keras yang digunakan oleh peneliti pada tahap pengimplementasian sistem adalah sebagai berikut : 1. Laptop - Prosesor Intel® Core™ i3 – 2350M 2.30 GHz 2CPUs - 6 GB RAM 2. VPS - Prosesor IntelR XeonR CPU E5-2630L v2 2.40GHz, 1 cores - 512 MB RAM - 20 GB SSD - 1 Gbps network port. 2. Perangkat Lunak Software Perangkat lunak yang digunakan dalam pembagungan sistem adalah sebagai berikut: Universitas Sumatera Utara 1. Laptop - OS Windows 7 SP1 - Notepad++, NetBeans IDE - Apache 2.2.21 - PHP 5.3.8 - phpMyAdmin 3.4.5 - MySQL 5.0.8 2. VPS - OS Ubuntu Linux 14.04.1 - Apache 2.4.7 - PHP 5.5.9-1ubuntu4.4 cli built: Sep 4 2014 06:57:30 - phpMyAdmin 4.0.10deb1 - MySQL 5.5.38

4.2. Implementasi Perancangan Antarmuka

4.2.1. Halaman Login Halaman ini adalah halaman pertama yang ditampilkan ketika pengguna mengakses m-learning tanpa login. Untuk dapat memakai sistem m-learning, pengguna diharuskan login dahulu dengan akun yang dimiliki. Halaman login m-Learning dapat dilihat pada gambar 4.1. Gambar 4.1 Halaman Login Universitas Sumatera Utara 4.2.2. Halaman Registrasi Pengguna baru yang belum memiliki akun m-Learning dapat melakukan registrasi terlebih dahulu. Halaman registrasi dapat diakses dengan klik tombol registrasi pada halaman login. Halaman registrasi m-Learning dapat dilihat pada gambar 4.2. Gambar 4.2 Halaman Registrasi Universitas Sumatera Utara 4.2.3. Halaman Tutorial Halaman tutorial menjelaskan bagaimana cara menggunakan m-Learning. Halaman tutorial m-Learning dapat dilihat pada gambar 4.3. Gambar 4.3 Halaman Tutorial Universitas Sumatera Utara 4.2.4. Halaman Home Halaman home akan menampilkan halaman depan m-learning. Halaman home m- Learning dapat dilihat pada gambar 4.4. Gambar 4.4 Halaman Home Universitas Sumatera Utara 4.2.5. Panel Navigasi Panel navigasi memudahkan pengguna m-Learning untuk berpindah-pindah halaman dalam menggunakan sistem ini. Panel navigasi dapat diakses dari semua halaman. Panel navigasi m-Learning dapat dilihat pada gambar 4.5. Gambar 4.5 Panel Navigasi Universitas Sumatera Utara 4.2.6. Halaman Profil Halaman profil menampilkan info dari pengguna m-Learning ini. Pengguna dapat memperbarui status, dan mengubah ketertarikan. Admin juga dapat memblok pengguna melalui halaman ini. Halaman profil m-Learning dapat dilihat pada gambar 4.6. Gambar 4.6 Halaman Profil Universitas Sumatera Utara 4.2.7. Halaman Ketertarikan Halaman ketertarikaninterest menampilkan semua ketertarikan yang sudah disimpan dalam sistem. Pengguna dapat menambah ketertarikan baru atau memilih ketertarikan yang telah ada. Halaman ketertarikan m-Learning dapat dilihat pada gambar 4.7. Gambar 4.7 Halaman Ketertarikan Universitas Sumatera Utara 4.2.8. Halaman Kehidupan kampus dan Adu pintar Halaman kehidupan kampus dan adu pintar menampilkan materi dan soal yang dapat diselesaikan oleh pelajar. Mode kehidupan kampus menampilkan materi dan soal, sedangkan mode adu pintar hanya menampilkan soal. Ada batasan kesalahan menjawab pada mode adu pintar, yaitu sebanyak 3 kali, sedangkan pada mode kehidupan kampus tidak ada batasan. Pada mode adu pintar, jumlah soal tidak terbatas, dan pengguna dapat berhenti kapanpun. Sistem skoring pada mode adu pintar adalah, benar skor ditambah 10, dan salah skor dikurang 5. Halaman kehidupan kampus dan adu pintar m-Learning dapat dilihat pada gambar 4.8. Gambar 4.8 Halaman kehidupan kampus dan adu pintar Universitas Sumatera Utara Halaman kehidupan kampus berisi materi interaktif. Cerita dimulai dengan dosen yang akan pergi kuliah S3 di luar negeri, sehingga dosen tersebut tidak dapat mengajar siswa di kelasnya. Tetapi dosen tersebut telah menghubungi teman lamanya Mr. Lerdorf untuk mengajar di kelas nya. Ternyata teman lama dosen tersebut adalah orang yang mempelopori bahasa pemrogaman PHP itu sendiri. Mr. Lerdorf pun menggantikan posisi dosen untuk mengajar siswa. Gambar 4.9 Dosen memperkenalkan Mr. Lerdorf kepada siswa Universitas Sumatera Utara Selama mengikuti materi pelajaran, cerita akan terus berlanjut sesuai alur. Mr. Lerdorf mengajarkan PHP dengan banyak pemisalan, seperti variabel disamakan dengan sebuah kotak penyimpanan. Gambar 4.10 Materi interaktif menyamakan materi pelajaran dengan kehidupan sehari-hari Universitas Sumatera Utara Selama pelajaran berlangsung terkadang Mr. Lerdorf melempar pertanyaan kepada siswa, sehingga seperti keadaan kelas yang sebenarnya, terjadi interaksi 2 arah antara siswa pemain dan pengajar sistemMr. Lerdorf. Gambar 4.11 Tanya jawab siswa dengan pengajar Universitas Sumatera Utara 4.2.9. Halaman Leaderboard Halaman leaderboardpapan skor menampilkan pengguna sistem yang memiliki skor tertinggi. Sepuluh pengguna sistem dengan skor tertinggi akan mendapat hadiah. Halaman leaderboard m-Learning dapat dilihat pada gambar 4.12. Gambar 4.12 Halaman Leaderboard Ranking Universitas Sumatera Utara 4.2.10. Halaman Forum Halaman forum merupakan fasilitas diskusi saat menggunakan m-Learning. Pengguna dapat membuka topik baru, mengomentari topik dan memberikan vote untuk jawaban terbaik. Kategori baru dapat ditambah oleh admin, dan topik dapat dihapus oleh admin. Halaman forum m-Learning dapat dilihat pada gambar 4.10. Gambar 4.13 Halaman Forum Universitas Sumatera Utara 4.2.11. Halaman Cari User Halaman cari user dapat memudahkan pengguna untuk membuka profil pengguna lain dengan memasukkan query pencarian nama user yang akan ditampilkan. Halaman tutorial m-Learning dapat dilihat pada gambar 4.11. Gambar 4.14 Halaman Cari User 4.2.12. Halaman Admin Halaman admin menampilkan fungsi-fungsi khusus untuk admin. Hanya admin yang dapat membuka halaman ini. Admin dapat membuat pengumuman baru, membuat mata pelajaran baru, dan melihat pelanggaran yang dilaporkan. Halaman admin m- Learning dapat dilihat pada gambar 4.12. Gambar 4.15 Halaman admin dan manajemen mata pelajaran Universitas Sumatera Utara

4.3. Pengujian Sistem