Perancangan Aplikasi
3.2.2 Perancangan Aplikasi
3.2.2.1 Use Case Diagram
Aplikasi administrasi yang akan dibuat dirancang menggunakan use case diagram seperti pada gambar 3.4. Use diagram yang dibuat menggunakan package diagram karena jumlah use case-nya terlalu banyak. Jika tidak menggunakan package diagram, relasi (hubungan) antara use case dengan actor maupun antara use case dengan use case lain akan banyak yang bersilangan, hal ini akan sulit dibaca/dipelajari. Pada gambar (diagram) selanjutnya akan digambarkan detil masing-masing package.
Gambar 3. 5 Use case diagram aplikasi administrasi sekolah Gambar 3. 5 Use case diagram aplikasi administrasi sekolah
Login
Staf Guru
(from Use Case Model) (from Use Case Model)
Logout
Gambar 3. 6 Paket use case diagram akses aplikasi
uc Master Data
Mengelola Jenis
Mengelola Jenis
Pembayaran
Persyaratan
Mengelola Data Staf Administrasi
Mengelola Data Sisw a
Mengelola Data Guru
Mengelola Data Jam
Staf
Mengelola Data
(from Use Case Model)
Jurusan
Mengelola Data
Mengelola Data
Kelas
Kelas Sisw a
Mengelola Data Kelompok Mata
Pelaj aran
Mengelola Data Mata Pelaj aran
Gambar 3. 7 Paket use case diagram master data Gambar 3. 7 Paket use case diagram master data
Mengelola Data Pendaftaran
Memproses Penerimaan Sisw a
Staf
(from Use Case Model)
Mengelola Data
Mengelola Jadw al
Pembayaran
Guru
(from Use Case Model)
Mengelola Data Nilai
Gambar 3. 8 Paket use case diagram transaksi
uc Laporan
Mencetak Laporan Penerimaan Sisw a
Mencetak Laporan Pembayaran
Staf
(from Use Case Model)
Mencetak Nilai
Guru
Mencetak Jadw al
(from Use Case Model)
Gambar 3. 9 Paket use case diagram laporan
3.2.2.2 Sequence Diagram
Setelah dibuat use case diagram, selanjutnya masing-masing use case dibuatkan sequence diagram-nya sebagai berikut:
A. Sequence diagram login
sd Interaction
Staf Guru
baca(userId, password) :boolean
baca(nig, password) :boolean
(from Use Case Model)
(from Use Case Model)
Gambar 3. 10 Sequence diagram login
B. Sequence diagram logout
sd Interaction
(from Use Case Model)
(from Use Case Model)
Gambar 3. 11 Sequence diagram logout
C. Sequence diagram mengelola jenis persyaratan
sd Interaction
JenisPersyaratanController JenisPersyaratan
hapus(kodeJenisPersyaratan)
(from Use Case Model)
Gambar 3. 12 Sequence diagram mengelola jenis persyaratan
D. Sequence diagram mengelola jenis pembayaran
sd Interaction
JenisPembayaranController JenisPembayaran
simpan() klikHapusButton()
hapus(kodeJenisPembayaran)
hapus(kodeJenisPembayaran)
(from Use Case Model)
Gambar 3. 13 Sequence diagram mengelola jenis pembayaran
E. Sequence diagram mengelola data staf administrasi
sd Interaction
StafAdministrasiController StafAdministrasi
hapus(noPegawai)
hapus(noPegawai)
(from Use Case Model)
Gambar 3. 14 Sequence diagram mengelola data staf administrasi
F. Sequence diagram mengelola data guru
sd Interaction
Staf Guru
FormGuru
FormDaftarGuru
GuruController Guru
inputNig()
inputNig() inpuDataGuru()
klikHapusButton() hapus(nig)
hapus(nig)
klikDaftarButton()
klikDaftarButton() tampilkanDaftar()
tampilkanData()
bacaData()
(from Use Case Model) (from Use Case Model)
Gambar 3. 15 Sequence diagram mengelola data guru
G. Sequence diagram mengelola data siswa
sd Interaction
SiswaController Siswa
haspu(nis)
hapus(nis)
(from Use Case Model)
Gambar 3. 16 Sequence diagram mengelola data siswa
H. Sequence diagram mengelola kelompok mata pelajaran
sd Interaction
KelompokMataKuliahController KelompokMataKuliah
hapus(kodeKelompokMataKuliah)
hapus(kodeKelompokMataKuliah)
(from Use Case Model)
Gambar 3. 17 Sequence diagram mengelola kelompok mata pelajaran
I. Sequence diagram mengelola mata pelajaran
sd Interaction
MataPelajaranController MataPelajaran
hapus(kodeMataPelajaran)
hapus(kodeMataPelejaran)
(from Use Case Model)
Gambar 3. 18 Sequence diagram mengelola mata pelajaran
J. Sequence diagram mengelola data jam
sd Interaction
inputKodeJam() inputDataJam()
hapus(kodeJam)
hapus(kodeJam)
(from Use Case Model)
Gambar 3. 19 Sequence diagram mengelola data jam
K. Sequence diagram mengelola data jurusan
sd Interaction
Staf
FormJurusan FormDaftarJurusan
JurusanController Jurusan
hapus(kodeJurusan)
hapus(kodeJurusan)
(from Use Case Model)
Gambar 3. 20 Sequence diagram mengelola data jurusan
L. Sequence diagram mengelola data kelas
sd Interaction
(from Use Case Model)
Gambar 3. 21 Sequence diagram mengelola data kelas
M. Sequence diagram mengelola data kelas siswa
sd Interaction
Staf
FormKelasSiswa FormDaftarKelasSiswa
KelasSiswaController KelasSiswa
(from Use Case Model)
Gambar 3. 22 Sequence diagram mengelola data kelas siswa
N. Sequence diagram mengelola data pendaftaran
sd Interaction
Staf
FormPendaftaran
PendaftaranController CalonSiswa
inputNoPendaftaran() inputDataCalonSiswa() inputKelengkapanPersyaratan()
(from Use Case Model)
Gambar 3. 23 Sequence diagram mengelola data pendaftaran
O. Sequence diagram diagram proses penerimaan siswa
sd Interaction
Staf
FormPenerimaanSiswa
PenerimaanSiswaController CalonSiswa Siswa KelasSiswa
inputTahunAjaran()
hitungJumlahCalonSiswa() bacaData()
setJumlahCalonSiswa()
klikProsesPenerimaanSiswaButton()
prosesPenerimaanSiswa() bacaData()
setJumlahDiterima()
klikSimpanButton()
simpan() bacaData()
simpan() simpan()
(from Use Case Model)
Gambar 3. 24 Sequence diagram diagram proses penerimaan siswa
P. Sequence diagram mengelola data pembayaran
sd Interaction
Staf
FormPembayaran
PembayaranController JenisPembayaran Pembayaran DetilPembayaran
inputNoPembayaran() klikBaruButton()
simpan() simpan()
simpan()
klikHapusButton()
hapus(noPembayaran)
hapus(noPembayaran) hapus(noPembayaran)
klikDaftarButton()
tampilkanDaftarPembayaran() bacaData() tampilkanData()
(from Use Case Model)
Gambar 3. 25 Sequence diagram mengelola data pembayaran
Q. Sequence diagram mengelola jadwal
sd Interaction
Staf
FormJadwal FormDaftarJadwal
JadwalController
Jadwal Kelas MataPelajaran Guru Jam
bukaForm()
aturTampilanAwal() bacaData()
setItemKelasComboBox() bacaData() setItemMataPelajaranComboBox()
bacaData() setItemGuruComboBox()
cari(kodeJadwal) baca(kodeJadwal) tampilkanDataJadwal()
klikDaftarButton()
tampilkanDaftarJadwal() bacaData() tampilkanData()
klikPilihButton()
tampilkanDataJadwal() baca(kodeDipilih) tampilkanDataJadwal()
klikSimpanButton()
simpan() simpan()
klikHapusButton()
hapus(kodeJadwal) hapus(kodeJadwal)
(from Use Case Model)
Gambar 3. 26 Sequence diagram mengelola jadwal
R. Sequence diagram mengelola data nilai
sd Interaction
Nilai Jadwal KelasSiswa MataPelajaran Siswa
inputKodeJadwal()
cariDataJadwal() baca() tampilkanDataJadwal() baca() tampilkanDataKelasSiswa() baca() tampilkanNamaMataPelajaran()
baca()
tampilkanDataSiswa() baca() tampilkanNilaiSiswa()
klikDaftarButton()
tampilkanDaftarJadwal() bacaData() tampilkanData()
klikPilihButton()
tampilkanDataJadwal() baca()
tampilkanDataKelasSiswa() baca()
tampilkanNamaMataPelajaran()
baca()
tampilkanDataSiswa() baca() tampilkanNilaiSiswa()
inputDataNilai()
klikSimpanButton()
simpan() simpan()
(from Use Case Model)
Gambar 3. 27 Sequence diagram mengelola data nilai
S. Sequence diagram mencetak laporan penerimaan siswa
sd Interaction
Staf FormLaporanPenerimaanSiswa PenerimaanSiswaController Siswa
inputTahunAjaran()
klikCetakButton()
cetakPenerimaanSiswa(tahunAjaran)
cetakSiswaBaru(tahunAjaran)
(from Use Case Model)
Gambar 3. 28 Sequence diagram mencetak laporan penerimaan siswa
T. Sequence diagram mencetak laporan pembayaran
sd Interaction
(from Use Case Model)
Gambar 3. 29 Sequence diagram mencetak laporan pembayaran
U. Sequence diagram mencetak laporan nilai
sd Interaction
NilaiController Nilai
klikCetakButton() cetakNilai()
cetak()
klikCetakButton() cetakNilai()
cetak()
(from Use Case Model) (from Use Case Model)
Gambar 3. 30 Sequence diagram mencetak laporan nilai
V. Sequence diagram mencetak laporan jadwal
sd Interaction
klikCetakButton() cetakJadwal()
cetak()
klikCetakButton() cetakJadwal()
cetak()
(from Use Case Model) (from Use Case Model)
Gambar 3. 31 Sequence diagram mencetak laporan jadwal
3.2.2.3 Activity Diagram
Masing-masing use case juga dibuatkan activity diagram untuk menunjukkan alur prosesnya.
A. Activity diagram login
act Activ ity
Mulai
Input User ID (atau NIG)
dan passw ord
valid? [Ya]
Masuk ke dalam
[Tidak]
sistem/aplikasi dan aktifkan menu sesuai hak aksesnya
Selesai
Gambar 3. 32 Activity diagram login
B. Activity diagram logout
act Activ ity
Mulai
Klik tombol Logout
Disable semua menu
Selesai
Gambar 3. 33 Activity diagram logout
C. Activity diagram mengelola jenis persyaratan
act Activ ity
Mulai
Input kode j enis persyaratan, nama persyaratan, j umlah, dan satuan
Klik tombol daftar
Tampilkan daftar j enis persyaratan
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data j enis
j enis persyaratan
persyaratan
[Ya]
Tampilkan data j enis persyaratan yang dipilih
Selesai
Gambar 3. 34 Activity diagram mengelola jenis persyaratan
D. Activity diagram mengelola jenis pembayaran
act Activ ity
Mulai
Input kode j enis pembayaran, nama pembayaran, j angka, dan satuan
Klik tombol daftar
Tampilkan daftar j enis pembayaran
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data j enis
j enis pembayaran
pembayaran
[Ya]
Tampilkan data j enis pembayaran yang dipilih
Selesai
Gambar 3. 35 Activity diagram mengelola jenis pembayaran
E. Activity diagram mengelola data staf administrasi
act Activ ity
Mulai
Input no. pegaw ai, nama, alamat, tempat lahir, tanggal lahir, dan
Klik tombol daftar
passw ord
Tampilkan daftar staf administrasi
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data staf
staf administrasi
administrasi
[Ya]
Tampilkan data staf administrasi yang dipilih
Selesai
Gambar 3. 36 Activity diagram mengelola data staf administrasi
F. Activity diagram mengelola data guru
act Activ ity
Mulai
Input NIG, nama, alamat, tempat lahir, tanggal lahir, dan passw ord
Klik tombol daftar
Tampilkan daftar guru
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data guru
guru
[Ya]
Tampilkan data guru yang dipilih
Selesai
Gambar 3. 37 Activity diagram mengelola data guru
G. Activity diagram mengelola data siswa
act Activ ity
Mulai
Input no. pegaw ai, nama, alamat, tempat Klik tombol daftar lahir, tanggal lahir, asal sekolah, tahun
lulus, dan nilai uj ian nasional
Tampilkan daftar sisw a
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data sisw a
sisw a
[Ya]
Tampilkan data sisw a yang dipilih
Selesai
Gambar 3. 38 Activity diagram mengelola data siswa
H. Activity diagram mengelola kelompok mata pelajaran
act Activ ity
Mulai
Input kode kelompok, dan nama
kelompok
Klik tombol daftar
Tampilkan daftar kelompok mata pelaj aran
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan (update/insert) data
Hapus data kelompok
kelompok mata pelaj aran
mata pelaj aran
[Ya]
Tampilkan data kelompok mata pelaj aran yang dipilih
Selesai
Gambar 3. 39 Activity diagram mengelola kelompok mata pelajaran
I. Activity diagram mengelola mata pelajaran
act Activ ity
Mulai
Input kode mata pelaj aran, dan nama Klik tombol daftar
mata pelaj aran
Tampilkan daftar mata pelaj aran
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan data (update/insert)
Hapus data mata
mata pelaj aran
pelaj aran
[Ya]
Tampilkan data mata pelaj aran yang dipilih
Selesai
Gambar 3. 40 Activity diagram mengelola mata pelajaran
J. Activity diagram mengelola data jam
act Activ ity
Mulai
Input kode j am, keterangan, mulai,
dan selesai
Klik tombol daftar
Tampilkan daftar j am
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan (update/insert) data
Hapus data j am
j am
[Ya]
Tampilkan data j am yang dipilih
Selesai
Gambar 3. 41 Activity diagram mengelola data jam
K. Activity diagram mengelola data jurusan
act Activ ity
Mulai
Input kode j urusan, dan nama
j urusan
Klik tombol daftar
Tampilkan daftar j urusan
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan (update/insert) data
Hapus data j urusan
j urusan
[Ya]
Tampilkan data j urusan yang dipilih
Selesai
Gambar 3. 42 Activity diagram mengelola data jurusan
L. Activity diagram mengelola data kelas
act Activ ity
Mulai
Input tahun aj aran, semester, tingkat, Klik tombol daftar kode j urusan, urutan kelas, dan daya
tampung
Tampilkan daftar kelas
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
[Tidak]
Simpan (update/insert) data
Hapus data kelas
kelas
[Ya]
Tampilkan data kelas yang dipilih
Selesai
Gambar 3. 43 Activity diagram mengelola data kelas
M. Activity diagram mengelola data kelas siswa
act Activ ity
Mulai
Input tahun aj aran, semester, tingkat, Klik tombol daftar kode j urusan, urutan kelas, dan nis
Tampilkan daftar kelas sisw a
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
Simpan (update/insert) data
Hapus data kelas sisw a
kelas sisw a
[Ya]
[Tidak] Tampilkan data kelas sisw a yang dipilih
Selesai
Gambar 3. 44 Activity diagram mengelola data kelas siswa
N. Activity diagram mengelola data pendaftaran
act Activ ity
Mulai
Input tahun aj aran, no. pendaftaran, data sisw a, dan data kelengkapan
Klik tombol daftar
persyaratan
klik tombol no. pendaftaran baru
Tampilkan daftar calon sisw a
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
tampilkan no. pendaftaran baru Simpan (update/insert) data
[Tidak]
Hapus data calon sisw a
calon sisw a
[Ya]
Tampilkan data calon sisw a yang dipilih
Selesai
Gambar 3. 45 Activity diagram mengelola data pendaftaran
O. Activity diagram proses penerimaan siswa
act Activ ity
Mulai
Tampilkan j umlah calon sisw a, dan daya tampung
Klik tombol proses
penerimaan
Klik tombol simpan
Urutkan calon sisw a berdasarkan j urusan yang dipilih, nilai uj ian nasional (desc), tahun lulus (desc), dan no pendaftaran.
Simpan semua data calon sisw a yang telah dialokasikan ke dalam tabel sisw a
Alokasikan calon sisw a dalam kelas sesuai daya tampung
Selesai
Gambar 3. 46 Activity diagram proses penerimaan siswa
P. Activity diagram mengelola data pembayaran
act Activ ity
Mulai
Input no. pembayaran, data sisw a, dan data pembayaran
Klik tombol daftar
klik tombol no. pembayaran baru
Tampilkan daftar pembayaran
Klik tombol simpan
Klik tombol hapus
Ada yang dipilih?
tampilkan no. pembayaran baru Simpan (update/insert) data
[Tidak]
Hapus data pembayaran
pembayaran
[Ya]
Tampilkan data pembayaran yang dipilih
Selesai
Gambar 3. 47 Activity diagram mengelola data pembayaran
Q. Activity diagram mengelola jadwal
act Activ ity
Mulai
Input data nilai
Klik tombol daftar
Input kode Jadw al
Tampilkan daftar j adw al
Klik tombol simpan
Tampilkan data j adw al Simpan data nilai
Ada yang
dipilih?
[Ya]
yang dipilih
[Tidak]
Tampilkan data sisw a dan nilainya
Selesai
Gambar 3. 48 Activity diagram mengelola jadwal
R. Activity diagram mengelola data nilai
act Activ ity
Mulai
Klik tombol daftar Input nilai sisw a
Tampilkan daftar j adw al Klik tombol simpan
Ada yang dipilih?
[Tidak]
Simpan data nilai sisw a
[Ya]
Tampilkan data sisw a sesuai j adw al yang dipilih
Selesai
Gambar 3. 49 Activity diagram mengelola data nilai
S. Activity diagram mencetak laporan penerimaan siswa
act Activ ity
Mulai
Input tahun aj aran
Tombol cetak diklik Tombol tutup diklik
Cetak data penerimaan sisw a Tutup form sesuai tahun aj aran yang diinput
Selesai
Gambar 3. 50 Activity diagram mencetak laporan penerimaan siswa
T. Activity diagram mencetak laporan pembayaran
act Activ ity
Mulai
Tampilkan pilihan data pembayaran yang akan dicetak
Tombol cetak diklik Tombol tutup diklik
Cetak data pembayaran Tutup form
Selesai
Gambar 3. 51 Activity diagram mencetak laporan pembayaran
U. Activity diagram mencetak laporan nilai
act Activ ity
Mulai
Tampilkan pilihan Nilai yang akan dicetak
Tombol cetak diklik Tombol tutup diklik
Cetak nilai
Tutup form
Selesai
Gambar 3. 52 Activity diagram mencetak laporan nilai
V. Activity diagram mencetak laporan jadwal
act Activ ity
Mulai
Tampilkan pilihan j adw al yang akan dicetak
Tombol cetak diklik Tombol tutup diklik
Cetak data j adw al Tutup form
Selesai
Gambar 3. 53 Activity diagram mencetak laporan jadwal
3.2.2.4 Class Diagram
Rancangan hubungan antar-class dibuat dalam diagram class sebagai berikut:
Gambar 3. 54 Class diagram aplikasi administrasi sekolah
3.2.2.5 User Interface (Antarmuka Pengguna)
Antarmuka pengguna dibuat seperti gambar-gambar di bawah ini:
A. Desain antarmuka form utama
Gambar 3. 55 Desain antarmuka form utama
B. Desain antarmuka form login
custom Aplikasi
Form Login
User ID
Password
Status
Staf Administrasi
Login
Batal
Gambar 3. 56 Desain antarmuka form login
C. Desain antarmuka informasi aplikasi
custom Aplikasi
Informasi Aplikasi
Aplikasi Administrasi Sekolah SMK AVERUS JAKARTA
Oleh: Yulianti NIM: 2009140661
Universitas Pamulang 2013
Gambar 3. 57 Desain antarmuka informasi aplikasi
D. Desain antarmuka master data jenis persyaratan
custom Master Data
Master Data Jenis Persyaratan
Kode Persyaratan
Daftar
Nama Persyaratan
Gambar 3. 58 Desain antarmuka master data jenis persyaratan
E. Desain antarmuka master data jenis pembayaran
custom Master Data
Master Data Jenis Pembayaran
Kode Jenis Pembayaran
Daftar
Nama Jenis Pembayaran Jumlah Pembayaran
Jangka Waktu
Gambar 3. 59 Desain antarmuka master data jenis pembayaran