Perancangan Halaman Website Perancangan Data Flow Diagram DFD

Adapun struktur dari situs yang penulis buat ditunjukkan pada gambar berikut : Gambar 4.1 Struktur Website

4.2 Perancangan Halaman Website

4.2.1 Halaman Home

Halaman ini merupakan halaman utama dari website. Halaman ini berisikan beberapa informasi umum tentang sekolah dan link-link utama yang menuju ke halaman- halaman lainnya.

4.2.2 Halaman Profil

Halaman ini berisikan informasi sekilas tentang sekolah, alamat sekolah dan link-link yang menghubungkan ke halaman profil tentang sekolah lainnya, seperti Sejarah, Home Profil Guru dan Siswa Buku Tamu Portal Akademik Admin Sejarah Data Guru Data Siswa Identitas Visi dan Misi Login Siswa Profil Siswa Nilai Siswa InformasiAkademik Login Admin Edit Data Siswa Edit Data Guru Universitas Sumatera Utara Identitas, Visi dan Misi, Struktur Organisasi, serta Komponen dari sekolah dan fungsinya.

4.2.3 Guru dan Siswa

Halaman ini berisikan data guru dan data siswa.

4.2.4 Halaman Buku Tamu

Halaman ini berisikan form tamu untuk memberikan pesan dan kesan kepada sekolah. Isi pesan tersebut hanya dapat dilihat oleh pengirim pesan dan administrator website.

4.2.5 Halaman Portal Akademik

Merupakan halaman yang hanya dapat diakses oleh siswa yang memiliki nis dan password. Halaman ini berisikan tentang data pribadi siswa yang melakukan login tersebut. Selain data pribadi, halaman ini juga berisikan hasil studi atau nilai dari siswa.

4.2.6 Halaman Admin

Halaman admin berisikan login yang akan menghubungkan ke halaman administrator. Halaman ini khusus hanya dapat diakses oleh administrator website untuk melakukan pengaturan website seperti menambah, menghapus dan mengubah data.

4.3 Perancangan Data Flow Diagram DFD

Data flow diagram menggambarkan arus data di dalam sistem dengan struktur, jelas dan menggunakan sejumlah bentuk-bentuk simbol untuk menggambarkan bagaimana Universitas Sumatera Utara data mengalir melalui suatu proses yang saling berkaitan secara grafis. Berikut ini adalah bentuk Data FlowDiagram dari website SMA Negeri 6 Medan. - Info Sejarah Sekolah - Info Struktur Organisasi - Login Administrator - Info Visi Misi - Data Guru - Info Kurikulum - Data Siswa dan Nilai Siswa - Info Data Guru - Data Informasi Beasiswa - Info Data Siswa - Data Informasi Akademik - Info Komponen Sekolah dan fungsinya - Data Buku Tamu Buku Tamu Buku Tamu Laporan - Pengunjung - Info Data Siswa Laporan - Administrator - Info Nilai Siswa Laporan - Data Guru - Informasi Akademik Laporan - Data Siswa dan Nilai Siswa - Informasi Beasiswa Pengunjung Sistem Informasi Akademik Berbasis Web Pada SMA Negeri 6 Medan Administrator Siswa Kepala Sekolah Universitas Sumatera Utara Gambar 4.2 Diagram Konteks Website 4.4 Perancangan Diagram Alir flowchart Website Diagram alir flowchart ini menjelaskan secara rinci langkah-langkah dari proses program. Flowchart dibuat dengan menggunakan simbol-simbol tertentu yang menyatakan setiap langkah program. Berikut ini adalah bentuk-bentuk flowchart dari website SMA Negeri 6 Medan.

4.4.1 Flowchart Menu Utama

Seorang pengunjung website dapat mengakses website SMA Negeri 6 Medan dan dapat berpindah dari halaman yang satu ke halaman yang lainnya. Masing-masing halaman utama memiliki link-link yang dapat dipilih oleh pengunjung. Flowchart menu utama dapat dilihat pada gambar 4.3 di bawah ini : Universitas Sumatera Utara START Tampilan Menu Home Profil Guru dan Siswa Buku Tamu Portal Akademik Admin Keluar Pilih link yang ada A Pilih link yang ada Pilih link yang ada Pilih link yang ada Prosedur Login Prosedur Login END B C D E Ya Ya Ya Ya Ya Ya Ya Tidak Tidak Tidak Tidak Tidak Tidak Tidak Gambar 4.3 Flowchart Menu Utama

4.4.2 Flowchart Portal Akademik

Halaman portal akademik hanya bisa diakses oleh siswa dan administrator. Pada halaman ini terdapat data pribadi siswa dan juga daftar nilai dari siswa. Pada halaman ini pengunjung hanya bisa melihat informasi dan tidak bisa mengubah atau mengeditnya. Namun jika nis dan password salah maka pengunjung tidak akan bisa masuk atau error dan diminta untuk login kembali. Flowchart portal akademik dapat dilihat pada gambar 4.4 di bawah ini : Universitas Sumatera Utara D Pilih login siswa Input nis password Nis Password Nis Password salah Halaman depan Portal Akademik Profil siswa Informasi Hasil Studi Informasi Akademik Ganti Password Logout Tampil Profil Siswa Tampil Nilai Siswa Tampil Informasi Akademik Prosedur Ganti Password D Tidak Ya Ya Ya Ya Ya Tidak Tidak Tidak Tidak Tidak Ya Gambar 4.4 Flowchart Portal Akademik

4.4.3 Flowchart Admin

Halaman admin hanya bisa diakses oleh administrator. Username dan password dari administrator harus sesuai dengan tabel admin. Jika username dan password sesuai maka admin akan masuk ke halaman administrator dan jika username atau password salah maka akan timbul pesan error dan diminta untuk login kembali. Flowchart admin dapat dilihat pada gambar 4.5 di bawah ini. Universitas Sumatera Utara E Buka Halaman Admin Input username password Cek Username password Username password salah Tampil Menu Admin Halaman Data Siswa Halaman Data Guru Logout E Tampil Halaman Siswa Tampil Halaman Guru F G Ya Ya Ya Ya Tidak Tidak Tidak Tidak Gambar 4.5 Flowchart Admin Universitas Sumatera Utara

4.4.4 Flowchart Administrator Siswa

F Halaman Admin siswa Input Siswa Baru Input Nilai Siswa Edit Data Siswa Logout Form Input Siswa Form Input Nilai Edit Hapus Form Edit Update Simpan Data Data Tersimpan Data Sudah Dihapus Simpan Simpan Data Data Tersimpan Simpan Simpan Data Data Tersimpan E Ya Ya Ya Ya Ya Ya Ya Ya Ya Tidak Tidak Tidak Tidak Tidak Tidak Tidak Tidak Gambar 4.6 Flowchart Admin Siswa Universitas Sumatera Utara

4.4.5 Flowchart Admin Guru

G Halaman Admin Guru Input Guru Baru Edit Data Guru Logout Form Input Guru Edit Hapus Form Edit Update Simpan Data Data Tersimpan Data Sudah Dihapus Simpan Simpan Data Data Tersimpan E Ya Ya Ya Ya Tidak Tidak Tidak Tidak Tidak Ya Ya Tidak Tidak Gambar 4.7 Flowchart Admin Guru

4.5 Merancang Database Server