Perancangan Arsitektur Perancangan Antarmuka

43

2. Perancangan Arsitektur

Gambar 20. Rancangan Arsitektur Sistem Pengolahan Nilai Berdasarkan rancangan arsitektur sistem pengolahan nilai pada gambar 20, dapat diketahui bahwa sistem pengolahan nilai menggunakan prinsip MVC Model-View-Controller. Model berisi method-method yang berisi source code yang menangani manipulasi data dan business logic. View berisi source code yang menangani tampilan halaman. Controller berisi source code yang menangani request dari pengguna melalui browser. Dalam sistem pengolahan nilai ini, pengguna memerlukan browser untuk melakukan request perintah dan untuk menampilkan halaman sistem. Request yang dikirimkan pengguna lewat browser akan diterima oleh controller. Kemudian controller akan mengintruksikan model dan view untuk melakukan aksi sesuai dengan request yang diterima controller. Kelas-kelas yang termasuk di dalam package controller antara lain: Admin dan nilai. Kelas-kelas yang termasuk di dalam package model antara lain: 44 m_guru, m_siswa, m_mapel, m_aspek, m_jenis_nilai, m_nilai dan adminmodel. Di dalam package view terdapat: v_user, v_guru, v_siswa, v_mapel, v_aspek, v_jenis_nilai, v_nilai.

3. Perancangan Antarmuka

Perancangan antarmuka dirancang sesuai dengan kebutuhan pengguna. Perancangan antarmuka digunakan sebagai panduan untuk membangun berbagai view pada CodeIgniter. a. Halaman Menu Kelola Deskripsi Kompetensi Dasar Gambar 22 merupakan rancangan tampilan halaman kelola kompetensi dasar. Halaman ini digunakan sebagai acuan pengisian nilai aspek pengetahuan dan keterampilan pada kolom deskripsi. Gambar 22. Rancangan Antarmuka Halaman Deskripsi KD b. Halaman Data Nilai Sikap Gambar 23 menampilkan rancangan halaman nilai sikap siswa dalam satu kelas. Halaman ini memiliki menu edit. Setiap siswa sudah memiliki nilai sikap rata-rata atau nilai sikap siswa dianggap baik kecuali jika memiliki catatan di dalam buku jurnal yang diisi oleh guru. 45 Gambar 23. Rancangan Antarmuka Halaman Data Nilai Sikap c. Halaman Data Nilai Mata Pelajaran Gambar 24 menampilkan rancangan halaman nilai siswa dari aspek pengetahuan dan aspek keterampilan dalam satu mata pelajaran tertentu. Halaman ini hanya dapat diakses oleh guru yang mengampu mata pelajaran tersebut. Gambar 24. Rancangan Antarmuka Halaman Data Nilai Mata Pelajaran d. Halaman Rapor Siswa Gambar 25 menampilkan rancangan halaman rapor siswa. Halaman rapor siswa menampilkan laporan nilai siswa dalam satu semester. 46 Gambar 25. Rancangan Antarmuka Rapor Siswa Selain keempat perancangan antarmuka tersebut, perancangan antarmuka yang lebih lengkap untuk masing-masing halaman terdapat dalam lampiran.

4. Perancangan Komponen