51
BAB V IMPLEMENTASI DAN PENGUJIAN 5.1 Implementasi Sistem Implementasi sistem merupakan tahap penempatan sistem agar dapat dioperasikan, dalam implementasi terdapat beberapa tahapan diantaranya sebagai berikut: 5.1.1
Persiapan Perangkat Lunak (Software) Perangkat lunak yang digunakan untuk pembuatan website sekolah ini yaitu
sebagai berikut: 1.
PHP Triad (Apache, PHP, dan My SQL).
2.
Browser Internet (Google Chrome atau Mozilla Firefox)
3.
Software editor (notepad++) untuk menulis dan mengedit bahasa pemograman HTML, PHP, Javacript dan css
4.
Aplikasi Server (xampp) untuk mengimplementasikan basis data
5.
Desain gambar/tampilan (Corel Draw, Phothoshop)
6.
Perancangan UML menggunakan Star UML
5.1.2
Persiapan Perangkat Keras (Hardware) Perangkat keras yang digunakan untuk pembuatan website sekolah ini yaitu
sebagai berikut: 1.
Intel Core i3 2.6 Ghz
52
2.
Memori 1 GB
3.
Hardisk 320 GB
4.
Monitor
5.
Mouse
6.
Keyboard
5.1.3
Konversi Sistem Tahap konversi sistem dilakukan setelah kode program selesai dibuat dan sarana
pendukung telah disiapkan seperti data yang diperlukan di dalam sistem yang dibuat. Sehingga pembuatan website SMPN 1 Nagrak harus dilakukan pengujian sebelum siap untuk dioperasikan 5.1.4
Pelatihan Tahap pelatihan yaitu proses pemberian pelatihan kepada pengguna yang akan
menggunakan website SMPN 1 Nagrak yaitu dengan memberikan petunjuk cara pengoprasian sistem agar pengguna dapat mengoprasikan sistem sesuai dengan fungsinya. 5.1.5
Pengujian Sistem Tahap pengujian sistem merupakan tahap dilakukannya pengujian terhadap
sistem yang dibuat, untuk membuktikan bahwa sistem mampu bekerja secara optimal. Tujuan utamanya adalah untuk memastikan bahwa komponen-komponen sistem telah berfungsi sesuai dengan yang diharapkan. Pengujian sistem ini untuk memeriksa fungsi-fungsi antar komponen sistem dan pengujian pada program secara keseluruhan.
53
Pengetesan program yang telah disatukan sangat perlu, hal ini untuk mengetahui apakah program dapat menerima input, memproses dan memberikan keluaran sesuai yang diharapkan. 5.1.6
Pengoprasian Untuk menjalanakan atau mengoprasikan website SMPN 1 Nagrak, maka harus
dilakukan hosting terhadap website yang telah siap untuk dioperasikan sebagai tempat disimpanya website sehingga dapat diakses melalui internet. 5.1.7
Implementasi Basis Data
1. Tabel User Tabel user berisi identitas dari admin website, struktur tabel dapat dilihat pada Gambar 5.1.
Gambar 5.1 Tabel User
54
2. Tabel Staf Tabel staf berisi identitas dari guru dan karyawan yang ada disekolah, struktur tabel dapat dilihat pada Gambar 5.2.
Gambar 5.2 Tabel Staff 3. Tabel Siswa Tabel siswa berisi identitas dari siswa yang ada disekolah, struktur tabel dapat dilihat pada Gambar 5.3.
Gambar 5.3 Tabel Siswa
55
4. Tabel Berita Tabel berita berisi daftar berita terbaru mengenai dunia pendidikan, struktur tabel dapat dilihat pada Gambar 5.4.
Gambar 5.4 Tabel Berita 5. Tabel Galeri Tabel galeri berisi album kegiatan pada sekolah, struktur tabel dapat dilihat pada Gambar 5.5
Gambar 5.5 Tabel Galeri 6. Tabel Galeri Album Tabel galeri album berisi album kegiatan pada sekolah galeri album mengambil data dari tabel galeri, struktur tabel dapat dilihat pada Gambar 5.6.
Gambar 5.6 Tabel Galeri Album
56
7. Tabel Agenda Tabel agenda berisi agenda atau daftar acara struktur tabel dapat dilihat pada Gambar 5.8.
Gambar 5.7 Tabel Agenda 8. Tabel Agenda Picture Tabel agenda Picture berisi agenda atau daftar acara, agenda Picture mengambil data dari tabel agenda, struktur tabel dapat dilihat pada Gambar 5.8.
Gambar 5.8 Tabel Agenda Picture
57
5.1.8
Implementasi Antarmuka (Interface)
A. Antarmuka Administrator 1. Implementasi Antarmuka Menu Login Sebelum masuk ke halaman utama, admin terlebih dahulu mengisi username dan password dalam form login. Implementasi form login dapat dilihat pada Gambar 5.9.
Gambar 5.9 Menu Login 2. Implementasi Antarmuka Menu Utama (home) Tampilan home admin adalah halaman utama setelah login, implementasi menu home dapat dilihat pada Gambar 5.10.
Gambar 5.10 Menu Home
58
3. Implementasi Antarmuka Menu Fitur a. Submenu Agenda Submenu agenda pada admin berfungsi untuk mengelola data kegiatan yang akan berlangsung di sekolah SMPN 1 Nagrak, implementasi submenu agenda dapat dilihat pada Gambar 5.11.
Gambar 5.11 Menu Agenda b. Submenu Berita Submenu berita pada admin berfungsi untuk mengelola berita yang akan ditampilkan di user, implementasi submenu berita dapat dilihat pada Gambar 5.12.
Gambar 5.12 Menu Berita
59
c. Submenu Galeri Kegiatan Submenu galeri kegiatan pada admin berfungsi untuk mengelola foto galeri pada setiap kegiatan di sekolah SMPN 1 Nagrak yang akan ditampilkan di user, implementasi submenu galeri kegiatan dapat dilihat pada Gambar 5.13.
Gambar 5.13 Menu Galeri Kegiatan d. Submenu Jajak Pendapat Submenu jajak pendapat pada admin berfungsi untuk mengelola pertanyaan jajak pendapat yang akan ditampilkan di user, implementasi submenu jajak pendapat dapat dilihat pada Gambar 5.14.
Gambar 5.14 Menu Jejak Pendapat
60
e. Submenu Prestasi Submenu prestasi pada admin berfungsi untuk mengelola prestasi yang diraih sekolah SMPN 1 Nagrak yang akan ditampilkan di user, implementasi submenu prestasi dapat dilihat pada Gambar 5.15.
Gambar 5.15 Menu Prestasi
61
4. Implementasi Antarmuka Menu Setting Admin a. Submenu Tambah Admin Submenu tambah admin berfungsi untuk menambahkan admin yang akan mengelola website, implementasi submenu tambah admin dapat dilihat pada Gambar 5.16.
Gambar 5.16 Menu Tambah Admin
62
b. Submenu Lihat Admin Submenu lihat admin berfungsi untuk melihat daftar admin, implementasi submenu lihat admin dapat dilihat pada Gambar 5.17.
Gambar 5.17 Menu Lihat Admin
63
c. Submenu Menu & Profil Submenu menu & profil pada admin berfungsi untuk mengelola menu bar yang akan ditampilkan di user, implementasi submenu prestasi dapat dilihat pada Gambar 5.18.
Gambar 5.18 Menu & Profil
64
5. Data Guru (Direktori Guru) Submenu direktori guru pada admin berfungsi untuk mengelola daftar guru yang ada di sekolah SMPN 1 Nagrak, implementasi submenu direktori guru dapat dilihat pada Gambar 5.19.
Gambar 5.19 Menu Direktori Guru
65
6. Data Siswa a. Direktori Siswa Submenu direktori siswa pada admin berfungsi untuk mengelola data siswa di sekolah SMPN 1 Nagrak yang akan ditampilkan di user, implementasi submenu direktori siswa dapat dilihat pada Gambar 5.20.
Gambar 5.20 Menu Direktori Siswa b. Submenu Cari Siswa Submenu cari siswa pada admin berfungsi untuk mencari data siswa, implementasi submenu cari siswa dapat dilihat pada Gambar 5.21.
Gambar 5.21 Menu Cari Siswa
66
B. Antarmuka User 1. Implementasi Antarmuka Menu Utama (home) Menu home pada user berfungsi untuk menampilkan berita, implementasi menu home dapat dilihat pada Gambar 5.22.
Gambar 5.22 Menu Home User
67
2. Implementasi Antarmuka Menu Profil a. Submenu Visi dan Misi Submenu visi dan misi pada user berfungsi untuk menampilkan visi dan misi sekolah SMPN 1 Nagrak, implementasi submenu visi dan misi dapat dilihat pada Gambar 5.23.
Gambar 5.23 Menu Visi Misi
68
b. Submenu Sejarah Singkat Submenu sejarah singkat pada user berfungsi untuk menampilkan sejarah sekolah SMPN 1 Nagrak, implementasi submenu sejarah singkat dapat dilihat pada Gambar 5.24.
Gambar 5.24 Menu Sejarah Singkat
69
c. Submenu Sarana & Prasarana Submenu sarana & prasarana pada user berfungsi untuk menampilkan sarana sekolah SMPN 1 Nagrak, implementasi submenu sarana dan prasarana dapat dilihat pada Gambar 5.25.
Gambar 5.25 Menu Sarana & Prasarana
70
d. Submenu Struktur Organisasi Submenu struktur organisasi pada user berfungsi untuk menampilkan struktur organisasi sekolah SMPN 1 Nagrak, implementasi submenu struktur organisasi dapat dilihat pada Gambar 5.26.
Gambar 5.26 Menu Struktur Organisasi
71
e. Submenu Kepala Sekolah Submenu kepala sekolah pada user berfungsi untuk menampilkan kepala sekolah SMPN 1 Nagrak, implementasi submenu kepala sekolah dapat dilihat pada Gambar 5.27.
Gambar 5.27 Menu Kepala Sekolah
72
f. Submenu Prestasi Submenu prestasi pada user berfungsi untuk menampilkan prestasi yang diraih oleh sekolah SMPN 1 Nagrak, implementasi submenu prestasi dapat dilihat pada Gambar 5.28.
Gambar 5.28 Menu Prestasi
73
3. Implementasi Antarmuka Menu Guru a. Submenu Direktori Guru Submenu direktori guru pada user berfungsi untuk menampilkan daftar guru yang ada di sekolah SMPN 1 Nagrak dan menyediakan fungsi pencarian berdasarkan nama, implementasi submenu visi dan misi dapat dilihat pada Gambar 5.29.
Gambar 5.29 Menu Direktori Guru
74
b. Submenu Prestasi Guru Submenu prestasi guru pada user berfungsi untuk menampilkan prestasi yang diraih oleh guru sekolah SMPN 1 Nagrak, implementasi submenu prestasi guru dapat dilihat pada Gambar 5.30.
Gambar 5.30 Menu Prestasi Guru
75
c. Submenu Kalender Akademik Submenu kalender akademik pada user berfungsi untuk menampilkan kalender akademik, implementasi submenu kalender akademik dapat dilihat pada Gambar 5.31.
Gambar 5.31 Menu Kalender Akademik
76
4. Implementasi Antarmuka Menu Siswa a. Submenu Direktori Siswa Submenu direktori siswa pada user berfungsi untuk menampilkan data siswa SMPN 1 Nagrak dan menyediakan fungsi pencarian berdasarkan nama dan kelas, implementasi submenu direktori siswa dapat dilihat pada Gambar 5.32.
Gambar 5.32 Menu Direktori Siswa
77
b. Submenu Prestasi Siswa Submenu prestasi siswa pada user berfungsi untuk menampilkan prestasi yang diraih oleh siswa sekolah SMPN 1 Nagrak, implementasi submenu prestasi siswa dapat dilihat pada Gambar 5.33.
Gambar 5.33 Menu Prestasi Siswa
78
c. Submenu Ekstrakurikuler Submenu ekstrakurikuler berfungsi untuk menampilkan daftar ekstrakurikuler yang ada di SMPN 1 Nagrak, implementasi submenu ekstrakurikuler dapat dilihat pada Gambar 5.34.
Gambar 5.34 Menu Ektrakurikuler
79
d. Submenu OSIS Submenu osis pada user berfungsi untuk memperkenalkan organisasi siswa intra sekolah SMPN 1 Nagrak, implementasi submenu osis dapat dilihat pada Gambar 5.35.
Gambar 5.35 Menu Osis
80
5. Implementasi Antarmuka Menu Fitur a. Submenu Agenda Submenu agenda pada user berfungsi untuk menampilkan daftar kegiatan yang akan berlangsung di sekolah SMPN 1 Nagrak, implementasi submenu prestasi guru dapat dilihat pada Gambar 5.36.
Gambar 5.36 Menu Agenda
81
b. Submenu Galeri Kegiatan Submenu galeri kegiatan pada user berfungsi untuk menampilkan foto galeri pada setiap kegiatan di sekolah SMPN 1 Nagrak, implementasi submenu galeri kegiatan dapat dilihat pada Gambar 5.37.
Gambar 5.37 Menu Galeri Kegiatan
82
c. Submenu Peta Situs Submenu peta situs pada user berfungsi untuk menampilkan daftar menu utama yang ada di website, implementasi submenu prestasi guru dapat dilihat pada Gambar 5.38.
Gambar 5.38 Menu Peta Situs
83
d. Submenu Kontak Sekolah Submenu kontak sekolah pada user berfungsi untuk menampilkan alamat sekolah dan kontak telepon, implementasi submenu kontak sekolah dapat dilihat pada Gambar 5.39.
Gambar 5.39 Menu Kontak Sekolah
84
6. Implementasi Antarmuka Menu Hasil Jajak Pendapat Hasil jajak pendapat pada user berfungsi untuk menampilkan daftar penilaian website sekolah SMPN 1 Nagrak, implementasi submenu prestasi guru dapat dilihat pada Gambar 5.40.
Gambar 5.40 Menu Hasil Jajak Pendapat
85
5.2 Pengujian Sistem 5.2.1
Pengujian Antarmuka Admin
1. Uji Halaman Login Tabel 5.1 Uji Halaman Login Administrator Kode P01 P02
P03
Hasil Sukses Gagal
Skenario Login dengan username dan password yang benar Login dengan username dan password yang salah
√ √
Mengisi form login dengan data kosong kemudian submit
√
Keterangan User berhasil masuk ke halaman Admin Ada pesan kesalahan, user tidak bisa masuk Ada pesan kesalahan, user tidak bisa masuk
2. Uji Halaman Konten Tabel 5.2 Ui Halaman Konten Administrator Kode P04 P05
Skenario Klik semua menu Klik semua link
Hasil Sukses Gagal √ √
Keterangan Berhasil dibuka Berhasil berpindah halaman
3. Uji Kelola Konten (Insert, Update, Delete) Tabel 5.3 Uji Kelola Konten Administrator Kode
Skenario
P06 P07 P08
Memasukan data baru Mengubah data yang sudah ada Menghapus data
Hasil Keterangan Sukses Gagal √ Berhasil tersimpan √ Berhasil diubah √ Berhasil terhapus
86
4. Uji masukan dari keyboard halaman Administrator Tabel 5.4 Uji masukan dari keyboard halaman Administrator Hasil Sukses Gagal
Kode
Skenario
P09
Memasukan angka terhadap data dengan tipe angka Memasukan huruf terhadap data dengan tipe angka Memasukan huruf terhadap data dengan tipe huruf Memasukan angka terhadap data dengan tipe huruf Memasukan huruf dan angka terhadap data dengan tipe huruf dan angka (character)
P10 P11 P12 P13
5.2.2
Keterangan
√
Bisa tampil angka
√
Huruf tidak bisa tampil Bisa tampil huruf
√
Angka tidak bisa tampil Huruf dan angka bisa tampil
√ √
Pengujian Antarmuka User
1. Uji Halaman Konten Tabel 5.5 Uji Halaman Konten User Kode
Skenario
P15 P16
Klik semua menu Klik semua link
Hasil Sukses Gagal √ √
Keterangan Berhasil dibuka Berhasil berpindah halaman
2. Uji Pencarian Data Tabel 5.6 Uji Pencarian data Kode P17 P18
Skenario Pencarian data guru Pencarian data siswa
Hasil Keterangan Sukses Gagal √ Data guru muncul √ Data siswa muncul
