BAB 3
PERANCANGAN SISTEM
3.1 Perancangan Sistem
Tahap perencanaan dan perancangan sistem ini merupakan tahap awal dalam membangun sebuah situs, seperti membuat perencanaan, perancangan, diagram alur,
tujuan dan isi dari sebuah situs. Situs ini dirancang dengan menggunakan PHP sebagai bahasa pemrogramannya dan MySQL sebagai databasenya, sedangkan Dreamweaver
CS5 digunakan sebagai tempat untuk membuat layout dari situs yang telah dirancang.
Tahap selanjutnya yaitu tahap pembuatan flowchart bagan alir atau aliran informasi dari situs tersebut. Flowchart atau diagram alir adalah gambaran yang
menampilkan struktur hirarki dan isi halaman per halaman. Dengan adanya flowcart, akan sangat membantu untuk memvisualisasikan isi dari setiap halaman situs tersebut.
Dengan pembuatan flowchart dalam suatu situs dapat mebantu mempermudah dalam pemeliharaan dan pembaharuan isi situs. Hal ini sangat penting dilakukan
karena isi situs harus selalu diperbaharui sehingga pegunjung tidak bosan.
3.2 Perancangan Algoritma
Algoritma adalah urutan dari barisan langkah-langkah atau instruksi penyelesaian masalah yang disusun secara sistematis. Kriteria algoritma yang baik adalah
mempunyai output efektif, jumlah langkah berhingga, terstruktur dan punya akhir. Salah satu cara penyajian dengan algoritma yaitu dalam bentuk flowchart. Fllowchart
Universitas Sumatera Utara
adalah gambaran dalam bentuk diagram alir dari algoritma dalam suatu program yang menyatakan arah alur program dalam menyelesaikan suatu masalah.
Berikut algoritma untuk menampilkan halaman menu pada website yayasan : Langkah algoritmanya adalah :
1. Definisikan variabel menu
2. Definisikan variabel isi menu
3. Pilih menu
4. Tampilkan hasilnya
Pseude Code : Algoritma tampilan menu
Deklarasi div class=menu
div class=isi-menu Deskripsi
Masukkan menuHome, Profil, Staff Pengajjar, Fasilitas, Kesiswaan Pilih isi menu :
Home Slider Gambar
Profil Sejarah, Profil, Visi Misi
Staff Pengajar Database Staff Pengajar
Fasilitas Database Fasilitas
Kesiswaan Database Siswa SMP, SMA, SMK
Tampilan isi menu
Universitas Sumatera Utara
Flowchart dari situs penulis buat yaitu :
Gambar 3.1 Flowchart Rancangan Web situs
Start
Slider Gambar
Home
Sejarah Profil
Visi Misi Profil
Database Staff Pengajar
Staff Pengajar
Database Fasilitas
Fasilitas
Database Siswa SMP
Siswa SMA Siswa SMK
Kesiswaan
Finish
Universitas Sumatera Utara
Berikut algoritma untuk menampilkan halaman admin pada website yayasan : Langkah algoritmanya adalah :
1. Definisikan variabel admin
2. Definisikan variabel menu
3. Defenisikan aksi admin
4. Pilih menu
5. Tampilkan hasilnya
Pseude Code : Algoritma tampilan admin
Deklarasi div class=content
div class=menu-kiri div class=aksi
Deskripsi Login
admin NamaId, Password Masukkan menu Home, Staff Pengajar, Fasilitas, Kesiswaan
Pilih menu Home, Staff Pengajar, Fasilitas, Kesiswaan Pilih aksi Lihat Data, Edit, Tambah, Hapus
Tampil admin
Universitas Sumatera Utara
Gambar 3.2 Flowchart Rancangan Admin
Start
Admin
Username Password
Login
Aksi Database
Admin Home
Aksi Database
Staff Pengajar Staff
Pengajar
Aksi Database
Fasilitas Fasilitas
Database Siswa SMP
Siswa SMA Siswa SMK
Aksi Kesiswaan
Logout
Finish
Universitas Sumatera Utara
Halaman-halaman yang dirancang penulis, yaitu: 1.
Halaman home.php, merupakan halaman yang pertama kali muncul pada saat situs dibuka.
2. Halaman profil.php, merupakan halaman yang berisikan tentang sejarah, profil
dan visi misi yayasan berupa data perkembangan dan informasi tentang yayasan. 3.
Halaman staff.php, merupakan halaman yang mnampilkan data guru di Yayasan Perguruan Panca Jaya Galang
4. Halaman fasilitas.php, merupakan halaman yang berisi tentang fasilitas yang ada
pada yayasan dalam mengembangkan kegiatan ekstra kulikuler yayasan. 5.
Halaman kesiswaan.php, merupakan halaman yang menampilkan data siswa- siswi SMP, SMA dan SMK dari Yayasan Perguruan Panca Jaya Galang.
6. Halaman admin.php, merupakan halaman yang berisi tentang admin dimana
admin berfungsi mengatur tampilan halaman website.
3.3 Perancangan Data Flow Diagram DFD