BAB III ANALISIS DAN PERANCANGAN SISTEM
3.5 Desain Sistem
3.2.7 Desain Interface Input/Output
Pada tahap ini dilakukan desain interface input/output yang merupakan
form rancangan I/O untuk berinteraksi antara pengguna dan sistem dalam
memasukkan data dan membuat laporan sebagai informasi yang dihasilkan dari pengelolaan data, selain itu desain interface input/output juga digunakan sebagai acuan membuat aplikasi dalam merancang dan membangun sistem. Perancangan desain interface input/output ini dibuat dengan menggunakan perangkat lunak
A. Desain Input
Desain input merupakan desain masukan dari pengguna kepada sistem yang kemudian disimpan ke dalam database.
1. Login
Desain form login merupakan tampilan awal aplikasi yang digunakan pengguna untuk dapat masuk dan mengakses menu-menu yang terdapat pada
aplikasi administrasi akademik SMA Ta’miriyah. Disini pengguna terlebih dahulu
menginputkan username dan password untuk login sebagai verifikasi user. Desain tampilan login dapat dilihat pada Gambar 3.17.
Gambar 3.17 Tampilan Desain Form Login
2. Siswa
Desain form data siswa digunakan untuk menampilkan semua data siswa
yang terdaftar dalam aplikasi administrasi akademik SMA Ta’miriyah. Form ini
berfungsi untuk memanajemen Create, Read, Update, Delete (CRUD) data siswa. Desain tampilan data siswa dapat dilihat pada Gambar 3.18.
73
Gambar 3.18 Tampilan Desain Halaman Data Siswa
Desain form tambah data siswa adalah form lanjutan dari data siswa,
form ini berfungsi untuk menambah siswa baru pada aplikasi administrasi
akademik SMA Ta’miriyah.
Gambar 3.19 Tampilan Desain Form Tambah Data Siswa
3. Guru
Desain form data guru digunakan untuk menampilkan semua data guru
yang terdaftar dalam aplikasi administrasi akademik SMA Ta’miriyah. Form ini
berfungsi untuk memanajemen Create, Read, Update, Delete (CRUD) data guru. Desain tampilan data guru dapat dilihat pada Gambar 3.20.
Gambar 3.20 Tampilan Desain Halaman Data Bagian
Desain form tambah data guru adalah form lanjutan dari data guru, form ini berfungsi untuk menambah guru baru pada aplikasi administrasi akademik
SMA Ta’miriyah.
Gambar 3.21 Tampilan Desain Form Tambah Data Bagian
4. Kelas
Desain form data kelas digunakan untuk menampilkan semua data kelas
yang terdaftar dalam aplikasi administrasi akademik SMA Ta’miriyah. Form ini
berfungsi untuk memanajemen Create, Read, Update, Delete (CRUD) data kelas. Desain tampilan data kelas dapat dilihat pada Gambar 3.22.
75
Gambar 3.22 Tampilan Desain Halaman Data Kelas
Desain form tambah kelas adalah form lanjutan dari data kelas, form ini berfungsi untuk menambah kelas baru pada aplikasi administrasi akademik SMA
Ta’miriyah.
Gambar 3.23 Tampilan Desain Form Tambah Data Kelas
5. Mata Pelajaran
Desain form data mata pelajaran digunakan untuk menampilkan semua data mata pelajaran yang terdaftar dalam aplikasi administrasi akademik SMA
Delete (CRUD) data mata pelajaran. Desain tampilan data mata pelajaran dapat
dilihat pada Gambar 3.24.
Gambar 3.24 Tampilan Desain Halaman Data Mata Pelajaran
Form tambah mata pelajaran adalah form lanjutan dari data mata
pelajaran, form ini berfungsi untuk menambah mata pelajaran pada aplikasi
administrasi akademik SMA Ta’miriyah.
Gambar 3.25 Tampilan Desain Form Tambah Data Pinjaman
6. Jenis Pelanggaran
Desain form data jenis pelanggaran digunakan untuk menampilkan semua data jenis pelanggaran yang terdaftar dalam aplikasi administrasi akademik
77
SMA Ta’miriyah. Form ini berfungsi untuk memanajemen Create, Read, Update,
Delete (CRUD) data jenis pelanggaran. Desain tampilan data jenis pelanggaran
dapat dilihat pada Gambar 3.26.
Gambar 3.26 Tampilan Desain Halaman Data Jenis Pelanggaran
Desain form tambah jenis pelanggaran adalah form lanjutan dari data jenis pelanggaran, form ini berfungsi untuk menambah jenis pelanggaran pada
aplikasi administrasi akademik SMA Ta’miriyah.
7. Kehadiran
Desain form kehadiran siswa digunakan untuk menginput dan melihat data kehadiran siswa berdasarkan kelas, tanggal dan jam pelajaran yang telah dipilih. Form ini juga dapat digunakan untuk melihat kehadiran siswa pada hari sebelumnya. Desain tampilan data kehadiran siswa dapat dilihat pada Gambar 3.28.
Gambar 3.28 Tampilan Desain Data Halaman Transaksi Kehadiran
8. Penilaian
Desain form penilaian siswa digunakan untuk menginput dan melihat data nilai siswa berdasarkan semester, kelas dan mata pelajaran yang telah dipilih.
Form ini juga dapat digunakan untuk mengubah nilai siswa yang terlah diinput
sebelumnya. Ada berberapa nilai yang dapat diinput diantaranya nilai tugas, nilai ulangan harian, uts, dan uas. Desain tampilan data penilaian siswa dapat dilihat pada Gambar 3.29.
79
Gambar 3.29 Tampilan Desain Data Halaman Transaksi Penilaian
9. Pembayaran SPP
Form pembayaran siswa digunakan untuk menginput dan melihat data
pembayaran SPP siswa berdasarkan kelas, dan tanggal yang telah dipilih. Form ini juga dapat digunakan untuk melihat pembayaran SPP siswa pada periode sebelumnya. Desain tampilan data pembayaran SPP siswa dapat dilihat pada Gambar 3.30.
10. Pelanggaran
Desain form data pelanggaran digunakan untuk menampilkan semua data transaksi pelanggaran yang berada dalam aplikasi administrasi akademik SMA
Ta’miriyah. Form ini berfungsi untuk memanajemen Create, Read, Update,
Delete (CRUD) data transaksi pelanggaran. Desain tampilan data pelanggaran
siswa dapat dilihat pada Gambar 3.31.
Gambar 3.31 Tampilan Desain Halaman Data Transaksi Pelanggaran
Desain form tambah pelanggaran adalah form lanjutan dari data transaksi pelanggaran, form ini berfungsi untuk menambah pelanggaran pada aplikasi
administrasi akademik SMA Ta’miriyah.
81
B. Desain Output
Desain output merupakan perancangan desain keluaran yang merupakan hasil dari proses data, yang tersimpan pada database kemudian dikelola menjadi informasi yang berguna bagi pengguna aplikasi.
1. Kehadiran
Desain form output informasi kehadiran merupakan tampilan yang menunjukkan informasi kehadiran siswa di sekolah per bulan setiap hari dan dapat dilihat detil per jam pelajaran dalam satu tahun ajaran 2015-2016. Tampilan informasi kehadiran disesuaikan dengan kalender berikut dengan hari minggu yang memiliki warna merah pada tampilan kalender. Diawali dari bulan juli 2015 yang di scroll turun kebawah hingga sampai dengan kalender bulan juni 2016, tampilan desain form output informasi kehadiran dapat dilihat pada Gambar 3.33.
2. Penilaian
Desain form output informasi nilai merupakan tampilan yang menunjukkan informasi nilai per semester setiap mata pelajaran di sekolah. Tampilan informasi nilai yang disajikan meliputi nilai tugas, nilai ulangan harian, nilai uts, nilai uas dan nilai akhir dari setiap mata pelajaran. Tampilan desain form
output informasi nilai dapat dilihat pada Gambar 3. Selain itu pada bagian atas di
Gambar 3.34 juga terdapat tombol yang digunakan untuk menampilan nilai antara semester satu dan semester dua.
Gambar 3.34 Desain Output Informasi Nilai
3. Pembayaran
Desain form output informasi pembayaran SPP siswa pada tahun ajaran 2015-2016 yang dimulai dari bulan juni 2015 sampai dengan bulan juli 2016. Pada Gambar 3.35 terdapat kotak yang memuat informasi bulan dan status pelunasan SPP. Jika pada bulan tersebut belum melakukan pelunasan maka
83
tampilan warna merah dan diikuti status belum lunas, begitu juga sebaliknya saat sudah dilakukan pelunasan SPP maka tampilan akan menjadi warna hijau dan status menjadi lunas. Desain form output informasi pembayaran SPP dapat dilihat pada Gambar 3.35.
Gambar 3.35 Desain Output Informasi Keuangan
4. Pelanggaran
Desain form output informasi pelanggaran merupakan tampilan dari pelanggaran yang dilakukan siswa selama disekolah. Pada Gambar 3.36 ditunjukkan tabel pelanggaran yang berisi nomor urut, jenis pelanggaran, poin pelanggaran, dan tanggal kejadian pelanggaran. Pada bagian atas tabel juga disertakan total poin pelanggaran yang dilakukan siswa selama di sekolah secara keseluruhan. Desain form output informasi pelanggaran dapat dilihat pada Gambar 3.36.
Gambar 3.36 Desain Output Informasi Pelanggaran
5. Laporan Nilai
Gambar 3.37 Desain Output Laporan Nilai Siswa
Gambar 3.33 menjelaskan tentang desain form output laporan nilai siswa per semester sesuai dengan mata pelajaran yang dipilih oleh guru. Tampilan atas
85
meliputi semester, nama mata pelajaran, pengasuh, dan kelas yang dipilih. Pada tampilan tabel terdapat no induk siswa, nama siswa, nilai tugas, nilai ulangan harian, uts, dan uas. Pada Gambar 3.37 diatas juga terdapat tombol unduh file excel untuk mengunduh tabel nilai tersebut dalam bentuk excel.