BAB III
PERANCANGAN SISTEM
3.1 Ruang lingkup aplikasi
Berdasarkan kebutuhan dari pengguna, pembuatan
website ini ditujukan kepada masyarakat yang
membutuhkan informasi studio photo yang dapat dijadikan
rekomendasi bagi mereka sesuai dengan kebutuhan. Penulis
juga menyertakan alamat serta nomor telepon yang dapat
dihubungi apabila masyarakat ingin mendapatkan informasi
lebih lanjut.
3.2 DFD ( Data Flow Diagram ) 3.2.1 Data Flow Diagram level 0
Gambar 3.1 menunjukkan DFD level 0 dimana seorang
Admin yang mengupdate dan mengupload informasi terbaru
yang akan diupdate dan diupload di website yang
selanjutnya website tersebut akan diakses oleh para
pengguna yang akan dijadikan sebagai rekomendasi.
3.2.2 Data Flow Diagram level 1
Pada gambar 3.2 menunjukkan DFD level 1 dimana
admin masuk ke dalam website, penentuan informasi apa
saja yang diperbahurui yang nantinya setelah semua
informasi telah diperbaharui oleh admin maka akan
ditampilkan pada halaman yang telah disediakan,
kemudian apabila dari user mempunyai informasi –
informasi baru user dapat memberikan komentarnya
pada halaman yang telah disediakan. Admin akan
menampung informasi dari user untuk kemudian website
akan ditambah dengan informasi dari para user.
3.3 Flowchart
3.3.1 FlowChart untuk Admin Start Lihat LogIn Admin Masukkan Username dan Password
Insert dan Update Artikel Ya
User Vaild Ya
End tidak Tidak
Database Artikel
Pada gambar 3.3 menunjukkan Flowchart admin, dimana
admin sebagai aktor utama yang mempunyai hak akses untuk
mengupdate dan mengupload suatu informasi kedalam
website yang nantinya semua pengguna dapat mengetahui
informasi terbaru dari website ini.
3.3.2 Flowchart untuk User Start Lihat Komentar Masukkan komentar Ya End Tidak Database Komentar
Gambar 3.4 Flow Chart User
Pada gambar 3.4 menunjukkan Flowchart User dimana
aktor yang adalah user itu sendiri. User dapat melihat isi
dari website ini dan user dapat memberikan komentar
terhadap website maupun informasi – informasi seputar
dunia fotografi.
3.4 Lembar Kerja Tampilan
Perancangan web ini menggunakan software bantuan
WampServer Version 2.1 yang dikoneksikan secara offline
untuk membuat koneksi dengan cara lokal dan dengan
bahasa pengkodean yang digunakan pada perancangan web
ini adalah menggunakan PHP.
Susunan LKT di bawah ini terdiri dari :
a. Coding pembuatan web.
b. Cara mengkoneksikan ke PhpMyAdmin.
c. Cara pembuatan database pada PhpMyAdmin.
d. Cara Export dan Import database pada PhpMyAdmin
3.4.1 Form Login
Formlogin, merupakan halaman yang disediakan hanya
untuk admin agar admin dapat mengontrol website yang
Gambar 3.5 LKT Form Login
3.4.2 Form Kelola Data
Form Kelola data merupakan halaman yang disediakan
untuk admin agar dapat menginputkan artikel.
Gambar 3.6 LKT Kelola Data
Form Post Artikel merupakan halaman yang disediakan
untuk admin agar dapat menambahkan informasi.
Gambar 3.7 LKT Post Artikel
Form Home ini berisi tentang garis besar dari website
photography information.
Gambar 3.8 LKT Home
Form news berisi tentang berita – berita terbaru seputar
photography information untuk para pengguna website
ini agar dapat mencari rekomendasi tentang tempat –
tempat fotografi di daerah salatiga dan sekitarnya.
Gambar 3.9 LKT News
Form galeri ini berisi hasil – hasil foto yang telah di
ambil oleh fotografer sebagai referensi para pengguna
website ini.
Gambar 3.10 LKT Galery
Form About ini berisi tentang informasi dan data
pembuat website photography information.
Gambar 3.11LKT About
Form kontak ini berisi tentang informasi kontak –
kontak dari studio - studio fotografi yang di daerah
sekitar salatiga yang bertujuan untuk memudahkan para
pengguna website photography information.
Gambar 3.12 LKT Contact
a. Tabel Struktur Database Studio PhotoOnline
Berikut adalah tabel struktur yang terdapat pada
Aplikasi StudioPhotoOnline.
Gambar 3.13 Tabel Struktur Home\
Tabel struktur home ini berisi tentang struktur dari
sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Judul Varchar(50) Menyimpan data
judul
Info Text Menyimpan data info
Penulis Varchar(30) Menyimpan data
penul;is
Tabel struktur news ini berisi tentang struktur dari
sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Judul Text Menyimpan data judul
Isi Text Menyimpan data isi
website
Gambar 3.15 Tabel Struktur About Me
Tabel struktur About Me ini berisi tentang struktur
dari sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Judul Varchar(20) Menyimpan data
judul
Gambar 3.16 Tabel Struktur Contact
Tabel struktur contact ini berisi tentang struktur
dari sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Judul Varchar(30) Menyimpan data judul
Isi Text Menyimpan data isi
Gambar 3.17 Tabel Struktur Artikel
Tabel struktur Artikel ini berisi tentang struktur
dari sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Id Int(11) Auto_increment
Menyimpan data ID
judul
Penulis Varchar(20) Menyimpan data
penulis
Isi Text Menyimpan data isi
Tanggal Date Menyimpan data
tanggal
Gambar 3.18 Tabel Struktur Data
Tabel struktur Data ini berisi tentang struktur dari
sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
Intermez1 Text Menyimpan data
intermezo
Tabel struktur Comment ini berisi tentang struktur
dari sebuah tabel berikut adalah struktur tabelnya
Field Type Keterangan
ID Int(11) Menyimpan data ID
Nama Varchar(10) Menyimpan data nama
Email Varchar(20) Menyimpan data
Website Varchar(20) Menyimpan data
Website
Komentar Text Menyimpan data
komentar user
Date Date Menyimpan data
tanggal
Art_id Int(11) Menyimpan data Id
secara berurutan
Art_url Int(11) Menyimpan data url
secara urut
b. Isi Tabel Database Aplikasi Studio Photo Online
Berikut adalah tabel – tabel yang digunakan dalam
Gambar 3.20 Tabel Home 1
Gambar 3.21Tabel Home 2
Gambar 3.22 Tabel Home 3
Gambar 3.23 Tabel Home 4
Gambar 3.24 Tabel News 1
Gambar 3.26 Tabel News 3
Gambar 3.27 Tabel About
Gambar 3.28 Tabel Contact 1
Gambar 3.29 Tabel Contact 2
Gambar 3.31 Tabel Data 1
Gambar 3.32Tabel Data 2
Gambar 3.33Tabel Data 3
Gambar 3.34Tabel Data 4
Gambar 3.36 Tabel Comment
3.4.10 Eksport dan Import database a. Proses Import Database
Sebelum melakukan importdatabase, pertama kita
harus membuat blankdatabase terlebih dahulu.
Gambar 3.38 Tampilan setelah memilih menu import
Gambar 3.39 Tampilan dialog box setelah user memilih tombol browse untuk memilih database
yang akan diimport
Setelah semua proses dilakukan maka langsung
tekan tombol Go untuk menyelesaikan proses import
database
Gambar 3.42 Tampilan isi keseluruhan database setelah berhasil di import
b. Proses Eksport Database
Mula – mula pilih database yang akan di eksport
kemudian pilih menu eksport untuk memulai proses
eksport database
Tekan tombol Go untuk melanjutkan
Maka akan muncul dialogbox
Gambar 3.44 Tampilan dialog box setelah memilih tombol Go
Kemudian klik ok atau save untuk melakukan
