Sistem Informasi Wisata Kota Padangsidimpuan Berbasis Web Chapter III V

16

BAB 3
PERANCANGAN SISTEM

3.1 Pengertian Perancangan Sistem
Perancangan sistem adalah merancang atau mendesain suatu sistem yang baik, yang
isinya adalah langkah-langkah operasi dalam proses pengolahan data dan prosedur
untuk mendukung operasi sistem. Menurut Jogiyanto perancangan sistem dapat
diartikan sebagai berikut:
1. Tahap setelah analisis dari siklus pengembangan sistem.
2. Pendefinisian dari kebutuhan-kebutuhan fungsional.
3. Persipan untuk rancang bangun implementasi.
4. Menggambarkan bagaimana suatu sistem dibentuk.
5. Yang dapat berupa penggambaran perencanaan dan pembuatan sketsa atau
pengaturan dari beberapa elemen yang terpisah ke dalam satu kesatuan yang
utuh dan berfungsi.
6. Termasuk menyangkut mengkonfigurasi dari komponen perangkat keras dari

suatu sistem.


Universitas Sumatera Utara

17

3.1.1 Flowchart Halaman Homepage
Berikut adalah alur flowchart halaman homepage untuk website yang dibangun.

Mulai

Tampilan Menu
Utama

Tampilan
Informasi
Terbaru

Tampilan
kategori wisata

Form

Kritik dan Saran

Selesai

Gambar 3.1. Flowchart Halaman Homepage

Gambar 3.1. user hanya dapat melihat informasi pada website Sistem Informasi
Kota Padangsidimpuan, user tidak perlu melakukan proses login sebelum mengakses
website tersebut.

Universitas Sumatera Utara

18

Berikut adalah alur flowchart halaman homepage untuk kategori wisata.
Tampilan
kategori wisata

Pilih kategori
wisata


Sejarah

Alam

Kuliner

Budaya

Info

Info

Info

Info

Gambar 3.2. Tampilan Kategori Wisata

3.1.2 Flowchart Halaman Administrator sebagai Admin

Berikut adalah alur flowchart halaman admin untuk website yang dibangun.

Mulai

Tabel Admin, sejarah, alam,
kuliner, budaya, dan saran

Tambah, edit, dan
hapus tabel Admin,

Login

sejarah, alam,
kuliner, budaya,
dan saran
Tidak

Cek
Login


Ya

Log out

Selesai

Universitas Sumatera Utara

19

Gambar 3.3. Flowchart Login Admin

Gambar 3.3. admin dapat melakukan beberapa hal melalui halaman administrator.
Dimulai dari proses pemasukan, pengeditan, dan juga penghapusan informasi. Pada
halaman admin ini harus melakukan proses login. Admin juga bisa menambah dan
menghapus admin maupun operator untuk bisa login.

3.1.3 Flowchart Halaman Administrator sebagai Operator
Berikut adalah alur flowchart halaman admin untuk website yang dibangun.


Mulai

Tabel sejarah, alam,
kuliner, budaya, dan saran

Login

Tambah, edit, dan
hapus tabel

sejarah, alam,
kuliner, budaya,
dan saran
Tidak

Cek
Login

Ya


Log out

Selesai

Gambar 3.4. Flowchart Login Operator

Gambar 3.4. operator dapat melakukan beberapa hal melalui halaman
administrator. Dimulai dari proses pemasukan, pengeditan, dan juga penghapusan
informasi. Pada halaman admin ini harus melakukan proses login. Untuk menjadi admin
harus login sebagai admin, tidak sebagai operator.

Universitas Sumatera Utara

20

3.1.4 Diagram Konteks Sistem
Gambar 3.5. merupakan diagram konteks dari website Sistem Informasi Wisata Kota
Padangsidimpuan ini.yang dibangun.

Input Informasi Wisata


Sistem Informasi

Memperoleh Informasi Wisata

Wisata Kota

Admin

User

Padangsidimpuan
Rekap Informasi Wisata

Akses Informasi Wisata

Gambar 3.5. Diagram Konteks Sistem

3.1.4 Entity Relationship Diagram
Gambar 3.6. merupakan ERD dari website Sistem Informasi Wisata Kota

Padangsidimpuan ini.

Judul_
info

Password

Username

1
Admin

Jenis_info

Tgl_info

M
Mengontrol

Info_Wisata


id

Gambar
Lokasi

Isi_info

Gambar 3.6.Entity Relationship Diagram

Universitas Sumatera Utara

21

3.1.5 Struktur Database
Berikut tabel-tabel yang ada di dalam database Sistem Informasi Wisata Kota
Padangsidimpuan berbasis web dinamis.

Tabel 3.1. Tabel Admin
Nama Field


Tipe Data

Keterangan

Username

Varchar (30)

Primari Key

Password

Varchar (30)

-

nama_lengkap Varchar (30)

-

Email

Varchar (30)

-

Alamat

Text

-

Kota

Varchar (30)

-

negara

Varchar (30)

-

kode_pos

Varchar (30)

-

tentang

Text

-

Level

Varchar (30)

Admin dan Operator

Tabel 3.2. Tabel Berita
Nama Field

Tipe Data

Keterangan

id

Int(5)

Auto Increment

penulis

Varchar (30)

-

tgl_info

Date

-

lokasi_info

Varchar (30)

-

Judul_info

Text

-

Gbr_info

Varchar (30)

-

isi_info

Text

-

Universitas Sumatera Utara

22

Tabel 3.3. Tabel Alam
Nama Field

Tipe Data

Keterangan

id

Int(5)

Auto Increment

penulis

Varchar (30)

-

tgl_info

Date

-

lokasi_info

Varchar (30)

-

Judul_info

Text

-

Gbr_info

Varchar (30)

-

isi_info

Text

-

Tabel 3.3. Tabel Sejarah
Nama Field

Tipe Data

Keterangan

id

Int(5)

Auto Increment

penulis

Varchar (30)

-

tgl_info

Date

-

lokasi_info

Varchar (30)

-

Judul_info

Text

-

Gbr_info

Varchar (30)

-

isi_info

Text

-

Tabel 3.4. Tabel Kuliner
Nama Field

Tipe Data

Keterangan

id

Int(5)

Auto Increment

penulis

Varchar (30)

-

tgl_info

Date

-

lokasi_info

Varchar (30)

-

Judul_info

Text

-

Gbr_info

Varchar (30)

-

Universitas Sumatera Utara

23

isi_info

Text

-

Tabel 3.5. Tabel Budaya
Nama Field

Tipe Data

Keterangan

id

Int(5)

Auto Increment

penulis

Varchar (30)

-

tgl_info

Date

-

lokasi_info

Varchar (30)

-

Judul_info

Text

-

Gbr_info

Varchar (30)

-

isi_info

Text

-

Tabel 3.6. Tabel Saran
Nama Field

Tipe Data

Keterangan

nama

Varchar (30)

-

nohp

Varchar (30)

-

email

Varchar (30)

-

subject

Text

-

saran

Text

-

Universitas Sumatera Utara

24

BAB 4
IMPLEMENTASI SISTEM

4.1 Pengertian Implementasi Sistem
Implementasi sistem adalah prosedur yang dilakukan untuk menyelesaikan desain yang
ada dalam dokumen desain sistem yang disetujui dan menguji, menginstal, memulai,
serta menggunakan sistem yang baru atau sistem yang diperbaiki. Penggunaan suatu
komputer untuk pemecahan masalah membutuhkan suatu sistem yang baik, sehingga
memungkinkan berhasilnya komputer dalam melaksanakan tugasnya, yaitu mengolah
data menjadi informasi.

4.2 Tujuan Implementasi Sistem

Sistem setelah dianalisa dan dirancang, maka sistem tersebut siap diterapkan atau
diimplementasikan. Tahap implementasi adalah tahap dimana sistem informasi telah
digunakan oleh pengguna. Sebelum benar-benar bisa digunakan dengan baik oleh
pengguna, sistem harus melalui tahap pengujian terlebih dahulu untuk menjamin tidak
ada kendala fatal yang muncul pada saat pengguna memanfaatkan sistemnya. Jika
sistem perangkat lunak telah selesai melewati tahap pengujian sistem maka sistem
perangkat lunak tersebut telah siap untuk digunakan.

Universitas Sumatera Utara

25

Penggunaan sistem perangkat lunak yang baru pada suatu organisasi atau perusahaan
kadangkadang merupakan proses yang tidak mudah sehingga diperlukan latihan bagi
pengguna sebelum digunakan. Adapun beberapa tujuan dari implementasi sistem
sebagai berikut:
1. Membuat desain sistem selama melakukan penelitian dan analisa.
2. Menguji dan mendokumentasikan prosedur dan program yang diperlukan.
3. Menyelesaikan desain sistem yang telah disetujui

4.3 Demonstrasi Website Wisata Kota Padangsidimpuan

Tampilan website Sistem Informasi Wisata Kota Padangsidimpuan terdiri dari dua
halaman yaitu Homepage dan Administrator Page.

4.3.1 Tampilan Homepage
Homepage adalah halaman utama, halaman pertama, halaman pembuka dari suatu
website / situs web. Homepage merupakan halman yang paling penting pada suatu
website karena merupakan halaman utama dan halaman yang di index terlebih dahulu
oleh search engine sebelum halaman-halaman yang lain pada suatu website.

Universitas Sumatera Utara

26

Gambar 4.1. terdapat beberapa menu yaitu menu Home, News, Destinasi Wisata, dan
Contact. Pada menu destinasi wisata menggunakan dropdown yang membagi menjadi
beberapa menu yaitu: Alam, Sejarah, Kuliner, dan Budaya. Background di bawah
menggunakan Carrousel yang menjadikan gambar menjadi beberapa slide.

Gambar 4.1. Tampilan Menu Utama

Universitas Sumatera Utara

27

Gambar 4.2. merupakan informasi terbaru di Kota Padangsidimpuan, dalam
menampilkan berita menggunakan pembagian kolom menjadi 4 kolom dan
menggunakan hover untuk menampilkan tanggal dan judul berita.

Gambar 4.2. Tampilan Berita

Gambar 4.3. merupakan destinasi wisata yang menggunakan beberapa kategori yaitu:
sejarah, alam, kuliner, dan budaya

Gambar 4.3. Tampilan Kategori Destinasi Wisata

Universitas Sumatera Utara

28

Gambar 4.4. merupakan form untuk kritik dan saran, jadi setiap user bisa mengirimkan
pesan kepada admin untuk menjadi bahan evaluasi tentang website yang dibuat. User
tidak bisa melihat pesan yang sudah dikirim.

Gambar 4.4. Tampilan Kritik dan Saran

Gambar 4.5. merupakan tampilan dari komentar dan saran dari user, hal ini digunagan
sebagai evaluasi dalam proses update web.

Gambar 4.5. Tampilan Komentar dan Saran

Universitas Sumatera Utara

29

Gambar 4.6. merupakan tampilan footer untuk menampilakan informasi web, media
social, dan lokasi.

Gambar 4.6. Tampilan Footer

Gambar 4.7. untuk menampilkan isi dari informasi tabel event pada database, informasi
disini bisa dirubah dan dihapus apabila mengalami kesalahan pada proses penambahan.

Gambar 4.7. Tampilan Isi Berita

Universitas Sumatera Utara

30

Gambar 4.8. untuk menampilkan isi dari informasi tabel wisata pada database,
informasi disini bisa dirubah dan dihapus apabila mengalami kesalahan pada proses
penambahan. Proses perubahan dilakukan di halaman administrator.

Gambar 4.8. Tampilan Isi Wisata

Gambar 4.9. untuk menampilkan isi dari informasi tabel kuliner pada database,
informasi disini bisa dirubah dan dihapus apabila mengalami kesalahan pada proses
penambahan. Proses perubahan dilakukan di halaman administrator.

Gambar 4.9. Tampilan Isi Kuliner

Universitas Sumatera Utara

31

Gambar 4.10. untuk menampilkan isi dari informasi tabel budaya pada database,
informasi disini bisa dirubah dan dihapus apabila mengalami kesalahan pada proses
penambahan. Proses perubahan dilakukan di halaman administrator.

Gambar 4.10. Tampilan Isi Budaya

Gambar 4.11. untuk menampilkan isi dari informasi tabel sejarah pada database,
informasi disini bisa dirubah dan dihapus apabila mengalami kesalahan pada proses
penambahan. Proses perubahan dilakukan di halaman administrator.

Universitas Sumatera Utara

32

4.3.2 Tampilan Administrator
Tampilan administrator adalah untuk mengubah isi konten website. Gambar 4.8. adalah
halaman untuk login, pada halaman administrator dibagi menjadi 2 kategori untuk login
yaitu: admin dan operator. Perbedaannya admin bisa menambah akun, sedangkan
operator tidak.

Gambar 4.9. Tampilan Login

Gambar 4.9. terdapat tabel untuk proses penghapusan akun terdaftar. Tabel ini hanya
ada ketika login sebagai admin, bukan operator.

Gambar 4.9. Tampilan Tabel Admin

Universitas Sumatera Utara

33

Gambar 4.10. adalah tabel news, ada 3 proses yang dapat dilakukan yaitu: tambah, edit,
dan hapus. Tampilan news samadengan tampilan tabel sejarah, alam, kuliner, dan juga
budaya.

Gambar 4.10. Tampilan Tabel News

Gambar 4.11. adalah profil akun yang sedang login, ada dua button pada gambar di
bawah yaitu: tambah akun dan ubah profil.

Gambar 4.11. Tampilan Profil Admin

Universitas Sumatera Utara

34

Gambar 4.12. adalah profil akun yang sedang login, ada satu button pada gambar di
bawah yaitu: ubah profil.

Gambar 4.12. Tampilan Profil Operator

Gambar 4.13. adalah form untuk menambah akun, form tersebut menggunakan modal
pada bootstrap. Tambah admin ini hanya dapat diakses oleh admin bukan operator.

Gambar 4.13. Tampilan Tambah Admin

Universitas Sumatera Utara

35

BAB 5
PENUTUP

5.1 Kesimpulan
Berdasarkan proses perencanaan hingga implementasi sistem, maka sebagai penutup
laporan penulis mengambil beberapa kesimpulan:
1. Sistem

informasi

wisata

Kota

Padangsidimpuan

berbasis

web

dapat

mempermudah penyebaran informasi.
2. Dengan adanya website sistem informasi wisata ini dapat memaksimalkan
penggunaan internet.
3. Website wisata ini dapat menambah minat wisata masyarakat lokal maupun luar
lokal.
4. Website wisata ini dapat menambah pendapatan masyarakat maupun pemerintah
Kota.

5.2 Saran
Beberapa saran penulis dalam pembuatan sistem informasi ini adalah:
1. Agar sistem ini lebih sempurna diperlukan pengembangan fasilitas-fasilitas
informasi yang lebih lengkap seperti map dan video streaming informasi wisata.
2. Sistem yang dibuat dapat dikembangkan dengan memberikan informasi yang
lengkap dan menarik.

Universitas Sumatera Utara