BAB III ANALISIS DAN DESAIN SISTEM

Transkripsi

1 BAB III ANALISIS DAN DESAIN SISTEM III.1. Analisis Masalah Tahap analisis sistem yang berjalan ini bertujuan untuk mencari informasi mengenai sistem yang lama guna mendapatkan bahan evaluasi untuk pengembangan pada sistem yang akan dirancang, evaluasi pada sistem yang lama ialah sulitnya mendapatkan informasi mengenai letak SMA Negeri di Kota Padang Sidempuan. Dengan adanya bahan evaluasi sistem yang lama, maka diharapkan agar pembangunan aplikasi yang baru akan dilakukan dapat terbentuk dengan lebih baik dari pada sistem sebelumnya. Analisis yang ada pada tahap analisis sistem yang sedang berjalan ini tiga jenis analisis, yaitu meliputi analisis input, analisis process dan analisis output. III.1.1. Analisis Input Analisis input yang ada pada sistem yang lama, yaitu : 1. Masyarakat melihat informasi selebaran tentang SMA Negeri di Kota Padang Sidempuan. 2. Masyarakat mengingat informasi yang ada pada selebaran tersebut, atau 3. Masyarakat mencatat alamat SMA Negeri di Kota Padang Sidempuan tersebut. 4. Masyarakat mengunjungi SMA Negeri di Kota Padang Sidempuan yang mereka ketahui dan yang terdekat dari tempat tinggal mereka. 31

2 Salah satu sekolah SMA Negeri yang berlokasi di Kota Padang Sidempuan dapat dilihat pada gambar III.1: Gambar III.1 Sekolah SMA Negeri di Kota Padang Sidempuan III.1.2.Analisis proses Proses yang terjadi pada sistem yang dijelaskan pada langkah-langkah: Sistem Informasi Geografis Letak SMA Negeri yang ada di Kota Padang Sidempuan SMA Negeri Masyarakat MULAI Papan Iklan / Brosur SMA Negeri Papan Iklan / Brosur SMA Negeri Mengingat Alamat Mengunjungi Sekolah SMA Negeri Mengunjungi Sekolah SMA Negeri SELESAI Phase

3 Gambar III.2. Flow Of Document Lokasi SMA Negeri di Kota Padang Sidempuan Keterangan FOD : 1. Konsumen mendapatkan informasi mengenai SMA Negeri yang berada di kota Sidempuan melalui iklan dan selebaran brosur. 2. Kemudian konsumen mengingat atau mencatat alamat lokasi SMA Negeri tersebut. 3. Setelah mendapatkan informasi SMA Negeri di Kota Padang Sidempuan, konsumen melakukan pengunjungan ke lokasi SMA Negeri di Kota Padang Sidempuan yang mereka ketahui. III.1.3.Analisis Output Analisis output untuk rangkaian kerja pada kegiatan mencari letak SMA Negeri di Kota Padang Sidempuan yang lama yaitu : 4. Masyarakat melihat letak SMA Negeri di Kota Padang Sidempuan. 5. Masyarakat mengingat letak SMA Negeri di Kota Padang Sidempuan. 6. Masyarakat mengunjungi letak SMA Negeri di Kota Padang Sidempuan. III.2. Evaluasi Sistem yang Berjalan Sistem yang sedang berjalan memiliki beberapa kelemahan yang dijabarkan sebagai berikut: 1. Sulitnya menemukan letak SMA Negeri di Kota Padang Sidempuan. 2. Lambatnya memberikan informasi letak SMA Negeri di Kota Padang Sidempuan.

4 3. Kurangnya efesien kerja dan banyaknya waktu yang terbuang untuk memberikan informasi letak SMA Negeri di Kota Padang Sidempuan. Sistem yang sedang berjalan memiliki beberapa kelebihan yang dijabarkan sebagai berikut: 1. Penghematan dana saat penyebaran informasi lokasi. 2. Informasi dapat dilihat dan di akses oleh semua kalangan masyarakat. III.3. Desain Sistem Desain sistem pada penelitian ini dibagi menjadi dua desain, yaitu desain sistem secara global untuk penggambaran model sistem secara garis besar dan desain sistem secara detail untuk membantu dalam pembuatan sistem. III.3.1. Desain Sistem Baru Desain sistem secara global menggunakan bahasa pemodelan UML yang terdiri dari Usecase Diagram, Activity Diagram, Class Diagram, dan Sequence Diagram. III Usecase Diagram Secara garis besar, bisnis proses sistem yang akan dirancang digambarkan dengan usecase diagram yang terdapat pada Gambar III.3 :

5 Sistem Informasi Geografis Letak SMA Negeri yang ada di Kota Padang Sidempuan Profil Blog Login Data Sekolah <include> Peta Sekolah <include> Peta Sekolah Administrator User Buku Tamu Home Gambar III.3 Usecase Diagram Sistem III Class Diagram Rancangan kelas-kelas yang akan digunakan pada sistem yang akan dirancang dapat dilihat pada gambar III.3 :

6 Sekolah Jalan Komentar + Kode_Tempat + Nama_Tempat + Nama_Kesek + Alamat + Telepon + Gambar + Lon +Lat + keterangan () - InitComponents () + Main (String args []) Using + Kode_Jalan + Nama_Jalan + Tipe_Jalan + Lon + Lat + Jalan () - InitComponents () + Main (String args []) Using Connection + Kode_Komentar + Nama + + Tanggal + Pesan + Komentar () - InitComponents () + Main (String args []) Using Using + ConnectionManager () Using Konten + Kode_Konten + Tanggal + Terbit + Judul + Isi + Thumbnail + Konten () - InitComponents () + Main (String args []) User + Id_User + Username + Password + Nama + User () - InitComponents () + LoginAcction (Evt) + ResetAcction (Evt) Gambar III.4 Class Diagram Sistem III Sequence Diagram Rangkaian kegiatan pada setiap terjadi event sistem digambarkan pada sequence diagram berikut: 1. Sequence Diagram pada Form Peta Sekolah Serangkaian kegiatan saat terjadi event pada form peta dapat dilihat pada gambar III.11 :

7 User Tampilkan Menu () Main form Form Peta Menu () click form Peta () Koneksi database () Gambar III.5. Sequence Diagram Form Peta Sekolah 2. Sequence Diagram pada Form Login Serangkaian kegiatan saat terjadi event pada form login dapat dilihat pada gambar III.12 : Administrator Website Main form Form Login Proses Login Halaman Administrator Tampilkan Fom () Menu () click form login Validasi nama dan password () Invalid () Login sukses () Gambar III.6. Sequence Diagram Form Login 3. Sequence Diagram pada Form Data Sekolah Serangkaian kegiatan saat terjadi event pada form Sekolah dapat dilihat pada gambar III.13 :

8 Administrator Website Main form Form Data Sekolah Proses Sekolah Tampilkan Fom () Menu () click form dealer () update data () Koneksi database () Close form () deletel data () Koneksi database () Update data dealer Gambar III.7 Sequence Diagram Form Sekolah 4. Sequence Diagram pada Form Data Konten Serangkaian kegiatan saat terjadi event pada form data konten dapat dilihat pada gambar III.14 : Administrator Website Main form Form Blog Proses Konten Tampilkan Fom () Menu () click form Blog () update data () Koneksi database () Close form () deletel data () Koneksi database () Update data konten Gambar III.8. Sequence Diagram Form Data Konten

9 5. Sequence Diagram pada Form Data Guest Book (Buku Tamu) Serangkaian kegiatan saat terjadi event pada form buku tamu dapat dilihat pada gambar III.9 : Administrator Website Main form Form Data Buku Tamu Proses Buku tamu Tampilkan Fom () Menu () click form Buku Tamu () update data () Koneksi database () Close form () deletel data () Koneksi database () Update data buku tamu Gambar III.9. Sequence Diagram Form Guest Book ( Buku Tamu) III.3.2. Desain Sistem Secara Detail Tahap perancangan berikutnya yaitu desain sistem secara detail yang meliputi desain output sistem, desain input sistem, dan desain database. III Desain Input Berikut ini adalah rancangan atau desain input sebagai antarmuka pengguna: 1. Desain FormLogin Desain form login dapat dilihat pada gambar III.10:

10 Home Peta Sekolah Guest Book Admin WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Logo Login Admin Username Password Login Reset 2. Desain Form Data Sekolah Gambar III.10 Desain Form Login Desain form sekolah dapat dilihat pada gambar III.11 : Home Peta Sekolah Guest Book Data Sekolah Blog Profil Logout Logo WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Form Input Data Sekolah Nama Sekolah Nama Kepalah Sekolah Alamat Telepon Gambar Sekolah Longitudinal Latitude Keterangan Tambah Reset No. Nama Sekolah Cari Data Nama Kesek Alamat Telepon Gambar Lot Lat Aksi Gambar III.11 Desain Form Data Sekolah 3. Desain Form Data Guest Book (Buku Tamu)

11 Desain form buku tamu dapat dilihat pada gambar III.12 : Home Peta Sekolah Guest Book Data Sekolah Blog Profil Logout Logo WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Guest Book Nama Pesan Kirim Reset Gambar III.12 Desain Form Guest Book (Buku Tamu) 4. Desain Form Data Blog Desain form Data Blog dapat dilihat pada gambar III.13 : Home Peta Sekolah Guest Book Data Sekolah Blog Profil Logout Logo WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Manajemen Blog Judul Terbit Gambar Tambah Reset Judul Cari Data No. Judul Konten Terbit Aksi Gambar III.13 Desain Form Data Blog 5. Desain FormPengaturan Akun Desain formpengaturan Akun dapat dilihat pada gambar III.14 :

12 Home Peta Sekolah Guest Book Data Sekolah Blog Profil Logout Logo WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Pengaturan Akun username Nama Admin Pass Lama Pass Baru Ubah Reset Gambar III.14 Desain FormAkun III Desain Output Berikut ini adalah rancangan tampilan desain peta yang akan dihasilkan oleh sistem: Home Peta Sekolah Guest Book Data Sekolah Blog Profil Logout Logo WEBSITE GIS SEKOLAH MENENGAH KEATAS KOTA PADANG SIDEMPUAN Peta Sekolah Menengah Atas (SMA) Padang Sidempuan Nama Sekolah Cari Sekolah PETA Gambar III.15 Desain Tampilan Peta III Desain Basis Data Desain basis data terdiri dari tahap merancang kamus data, melakukan normalisasi tabel, merancang struktur tabel, dan membangun Entity Relationship Diagram (ERD).

13 III Kamus Data Kamus data merupakan sebuah daftar yang terorganisasi dari elemen data yang berhubungan dengan sistem, dengan definisi yang tepat dan teliti sehingga pemakai dan analis sistem akan memiliki pemahaman yang umum mengenai input, output, dan komponen penyimpan. Kamus data penyimpanan sistem yang akan dirancang dapat dilihat pada tabel III.1 : Tabel III.1. Kamus Data Data Atribut Ekspresi Reguler Data jalan + Nama_Jalan + Tipe_Jalan + Lon + Lat 1. Kode_Jalan = {^[-+]?[0-9]} 2. Nama_Jalan = {[0-9][a-z][A-Z][Spasi]} 3. Tipe_Jalan = {[0-9][a-z][A-Z][Spasi]} 4. Lon = ^[-+]?[0-9]*\.?[0-9]+$ 5. Lat = ^[-+]?[0-9]*\.?[0-9]+$ Sekolah + Nama_Sekolah + Nama_Kesek + Alamat + Telepon + Gambar + Lon + Lat + Keterangan 1. Kode_Tempat = {^[-+]?[0-9]} 2. Nama_Sekolah = {[0-9][a-z][A-Z][Spasi]} 3. Nama_Kesek = {[0-9][a-z][A-Z][Spasi]} 4. Alamat = {[0-9][a-z][A-Z][Spasi]} 5. Telepon = {[0-9][a-z][A-Z][Spasi]} 6. Gambar = {[0-9][a-z][A-Z][Spasi]} 7. Lon = ^[-+]?[0-9]*\.?[0-9]+$ 8. Lat = ^[-+]?[0-9]*\.?[0-9]+$ 9. Keterangan = {[0-9][a-z][A-Z][Spasi]} komentar + Nama + + Tanggal + Pesan 1. Kode_Komentar = {^[-+]?[0-9]} 2. Nama = {[0-9][a-z][A-Z][Spasi]} 3. = {[0-9][a-z][A-Z][Spasi]} 4. Tanggal = {^[-+]?[0-9]} 5. Pesan = {[0-9][a-z][A-Z][Spasi]} konten + Tanggal + Terbit + Judul + Isi + Thumbnail + Tag 1. Kode_Konten = {^[-+]?[0-9]} 2. Tanggal = {^[-+]?[0-9]} 3. Terbit = {[0-9][a-z][A-Z][Spasi]} 4. Judul = {[0-9][a-z][A-Z][Spasi]} 5. Isi = {[0-9][a-z][A-Z][Spasi]}

14 6. Thumbnail = {[0-9][a-z][A-Z][Spasi]} 7. Tag = {[0-9][a-z][A-Z][Spasi]} user + Username + Password + Nama 1. Id_User = {^[-+]?[0-9]} 2. Username = {[0-9][a-z][A-Z][Spasi]} 3. Password = {[0-9][a-z][A-Z][Spasi]} 4. Nama = {[0-9][a-z][A-Z][Spasi]} III Desain Tabel Setelah melakukan tahap normalisasi, maka tahap selanjutnya yang dikerjakan yaitu merancang struktur tabel pada basis data sistem yang akan dibuat, berikut ini merupakan rancangan struktur tabel tersebut: 1. Struktur Tabel Jalan Tabel jalan digunakan untuk menyimpan data Kode_Jalan, Nama_Jalan, Tipe_Jalan, Lon, Lat, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.2 di bawah ini: Tabel III.2 Rancangan Tabel Jalan Nama Database usup_gissma Nama Tabel Jalan No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Jalan int(5) Tidak Primary Key 2. Nama_Jalan varchar(30) Tidak - 3. Tipe_Jalan varchar(10) Tidak - 4. Lon Double Tidak - 5. Lat Double Tidak - 2. Struktur Tabel Komentar Tabel komentar digunakan untuk menyimpan data Kode_Komentar, Nama, , Tanggal, Pesan, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.3 di bawah ini:

15 Tabel III.3 Rancangan Tabel Komentar Nama Database usup_gissma Nama Tabel Komentar No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Komentar int(5) Tidak Primary Key 2. Nama varchar(25) Tidak varchar(25) Tidak - 4. Tanggal Datetime Tidak - 5. Pesan Text Tidak - 3. Struktur Tabel Konten Tabel konten digunakan untuk menyimpan data Kode_Konten, Tanggal, Terbit, Judul, Isi, Thumbnail, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.4 di bawah ini: Tabel III.4 Rancangan Tabel Konten Nama Database usup_gissma Nama Tabel Konten No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Konten int(11) Tidak Primary Key 2. Tanggal Timestamp Tidak - 3. Terbit varchar(6) Tidak - 4. Judul Text Tidak - 5. Isi Text Tidak - 6. Thumbnail Text Tidak - 4. Struktur Tabel Sekolah Tabel sekolah digunakan untuk menyimpan data Kode_Tempat, Nama_Sekolah, Nama_Kasek, Alamat, Telepon, Gambar, Lon, Lat, Keterangan, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.5 di bawah ini:

16 Tabel III.5 Rancangan Tabel Sekolah Nama Database usup_gissma Nama Tabel Sekolah No Nama Field Tipe Data Boleh Kosong Kunci 1. Kode_Tempat int(5) Tidak Primary Key 2. Nama_Sekolah varchar(25) Tidak - 3. Nama_Kasek varchar(25) Tidak - 4. Alamat Text Tidak - 5. Telepon varchar(12) Tidak - 6. Gambar Text Tidak - 7. Lon Double Tidak - 8. Lat Double Tidak - 9. Keterangan Text Tidak - 5. Struktur Tabel User Tabel user digunakan untuk menyimpan data Id_User, Username, Password, Nama, selengkapnya mengenai struktur tabel ini dapat dilihat pada tabel III.6 di bawah ini: Tabel III.6 Rancangan Tabel User Nama Database usup_gissma Nama Tabel User No Nama Field Tipe Data Boleh Kosong Kunci 1. Id_User int(11) Tidak Primary Key 2. Username varchar(12) Tidak Unique 3. Password varchar(12) Tidak - 4. Nama varchar(25) Tidak - III ERD (Entity Relationship Diagram) Tahap selanjutnya pada penelitian ini yaitu merancang ERD untuk mengetahui hubungan antar tabel yang telah didesain sebelumnya, ERD tersebut dapat dilihat pada gambar III.16 :

17 Id _ User User Username Password Kode _ komentar 1 Nama Nama Kode _ Tempat Mengolah Data Komentar Nama_sekolah Nama_kesek Alamat M Tanggal Pesan Telepon Sekolah Gambar Memiliki Kode _ konten Lon Lat Keterangan M Memiliki M Konten tanggal terbit judul Kode _ Jalan Jalan isi thumbnail Nama_Jalan Tipe_Jalan Lat Lon Gambar III.16 Diagram ERD III Activity Diagram Bisnis proses yang telah digambarkan pada usecase diagram diatas dijabarkan dengan activity diagram : 1. Activity Diagram Melihat Peta Aktivitas melihat peta diterangkan dalam langkah-langkah state, dimulai dari kegiatan melihat peta kemudian mencari Sekolah, selanjutnya klik Peta dan yang terakhir melihat informasi Peta Sekolah yang di sajikan dalam peta yang ditunjukkan pada gambar III.17:

18 Peta Cari Sekolah Klik Peta Melihat Informasi Peta Sekolah Gambar III.17. Activity Diagram Melihat Peta 2. Activity Diagram Login Administrator Website Aktvitas proses login admin diterangkan dalam langkah-langkah state, dimulai dari memasukkan username, memasukkan password, jika profil valid maka sistem akan mengaktifkan menu administrator, sedangkan jika tidak valid, maka tampilkan pesan kesalahan yang ditunjukkan pada gambar III.18: Memasukkan Username Memasukkan Password Valid Aktifkan Menu Administrator invalid Menampilkan Pesan Error Gambar III.18. Activity Diagram Login Admin

19 3. Activity Diagram Mengolah Data Lokasi Sekolah Aktivitas proses mengolah data Lokasi Sekolah diterangkan dalam langkahlangkah state yang ditunjukkan pada gambar III.19: Form Input Data Sekolah Tambah Ediit Hapus Mengisi Data Memilih Data Memilih Data Menyimpan Data Mengubah Data Konfirmasi Penghapusan Tidak Menekan ttombol Tamba Menyimpan Data Menghapus Data Ya Gambar III.19. Activity Diagram Mengolah Data Lokasi Sekolah 4. Activity Diagram Mengolah Data Guest Book (Buku Tamu) Aktvitas proses mengolah data Buku Tamu diterangkan dalam langkahlangkah state yang ditunjukkan pada gambar III.20: Form Guest Book (Buku Tamu) Tambah Hapus Mengisi Data Menyimpan Data Menekan Tombol Kirim Memilih Data Konfirmasi Penghapusan Menghapus Data Tidak Ya Gambar III.20. Activity Diagram Mengolah Data Guest Book (Buku Tamu) 5. Activity Diagram Mengolah Data Blog

20 Aktvitas proses mengolah data Blog diterangkan dalam langkah-langkah state yang ditunjukkan pada gambar III.21: Form Manajemen Blog Tambah Edit Hapus Mengisi Data Memilih Data Memilih Data Menyimpan Data Mengubah Data Konfirmasi Penghapusan Tidak Menekan Tombol Simpan Menyimpan Data Menghapus Data Ya Gambar III.21 Activity Diagram Mengolah Data Blog