3.2.7.2 Perancangan antar muka
3.2.7.2.1 Perancangan antar muka halaman utama
Gambar 3.22 Perancangan antarmuka halaman utama
3.2.7.2.2 Perancangan antar muka pendaftaran
Gambar 3.23 Perancangan antarmuka halaman pendaftaran
3.2.7.2.3 Perancangan antar muka lupa password
4 1
4 1
4 1+
4 6
1 4
12 4
5 1,
4 6
1 4
6 1+
4 6
12 4 6
1, =
3 1
3 4
1 4
1. 4
4 1.
7 1.
--?+2 ? =
6 A
5 6
:
3 4
Gambar 3.24 Perancangan antarmuka halaman lupa password
3.2.7.2.4 Perancangan antar muka renungan user
Gambar 3.25 Perancangan antarmuka halaman renungan user
3.2.7.2.5 Perancangan antar muka halaman forum user
Gambar 3.26 Perancangan antarmuka halaman forum user
3.2.7.2.6 Perancangan antar muka halaman isi forum user
Gambar 3.27 Perancangan antarmuka halaman isi forum user
3.2.7.2.7 Perancangan antar muka alkitab digital
Gambar 3.28 Perancangan antarmuka halaman alkitab digital user
3.2.7.2.8 Perancangan antar muka e-book
Gambar 3.29 Perancangan antarmuka halaman e-book user
3.2.7.2.9 Peranncangan antar muka stream
4 1
4 1
4 1+
4 6
1 4
12 4 5
1, 4 6
1 4 6
1+ 4 6
12 4 6
1, 4
. 4
. =
3 1
3 4
1 4
1. 4
1,
7 1,
--?+2 ? =
6 A
5 6
:
3
6 6
Gambar 3.30 Perancangan antarmuka halaman stream user
3.2.7.2.10 Perancangan antar muka video stream
Gambar 3.31 Perancangan antarmuka halaman video stream user
3.2.7.2.11 Perancangan antar muka audio stream
Gambar 3.32 Perancangan antarmuka halaman audio stream user
3.2.7.2.12 Perancangan antar muka halaman utama member
4 4
+ 4
4 6
2 4
, 4 5
- 4 6
+ 4 6
4 6 ,
4 6
- 4 6
4
7 --?+2 ?
= 6
5 6
5 6
:
5 6
6 6
6
Gambar 3.33 Perancangan antarmuka halaman utama member
3.2.7.2.13 Perancangan antar muka renungan member
Gambar 3.34 Perancangan antarmuka halaman renungan member
3.2.7.2.14 Perancangan antar muka forum member
Gambar 3.35 Perancangan antarmuka halaman forum member
3.2.7.2.15 Perancangan antar muka buat forum member
Gambar 3.36 Perancangan antarmuka halaman buat forum member
3.2.7.2.16 Perancangan antar muka isi forum member
Gambar 3.37 Perancangan antarmuka isi forum member
3.2.7.2.17 Perancangan antar muka alkitab digital member
Gambar 3.38 Perancangan antarmuka alkitab digital member
3.2.7.2.18 Perancangan antar muka e-book member
Gambar 3.39 Perancangan antarmuka halaman e-book member
3.2.7.2.19 Perancangan antar muka stream member
Gambar 3.40 Perancangan antarmuka halaman stream member
3.2.7.2.20 Perancangan antar muka video member
Gambar 3.41 Perancangan antarmuka halaman video member
3.2.7.2.21 Perancangan antar muka audio member
Gambar 3.42 Perancangan antarmuka halaman audio member
3.2.7.2.22 Perancangan antar muka halaman utama admin
Gambar 3.43 Perancangan antar muka halaman utama admin
3.2.7.2.23 Perancangan antar muka halaman renungan admin
Gambar 3.44 Perancangan antar muka halaman renungan admin
3.2.7.2.24 Perancangan antar muka tambah renungan
Gambar 3.45 Perancangan antar muka tambah renungan admin
3.2.7.2.25 Perancangan antar muka forum admin
Gambar 3.46 Perancangan antar muka halaman forum admin
3.2.7.2.26 Perancangan antar muka buat forum admin
Gambar 3.47 Perancangan antar muka halaman buat forum admin
3.2.7.2.27 Perancancangan antar muka isi forum admin
Gambar 3.48 Perancangan antar muka halaman isi forum admin
3.2.7.2.28 Perancangan antar muka alkitab digital admin
Gambar 3.49 Perancangan antar muka halaman alkitab digital admin
3.2.7.2.29 Perancangan antar muka pengaturan alkitab admin
Gambar 3.50 Perancangan antar muka halaman pengaturan alkitab admin
3.2.7.2.30 Perancangan antar muka e-book admin
Gambar 3.51 Perancangan antar muka halaman e-book admin
3.2.7.2.31 Perancangan antar muka stream admin
Gambar 3.52 Perancangan antar muka halaman stream admin
3.2.7.2.32 Perancangan antar muka video stream admin
4 1
4 4
4 6
. 4
4 5
+ 1.
= 1
4
7 1,
--?+2 ? =
5 6
:
3
6 5
7 ? 4
6 5
6
Gambar 3.53 Perancangan antar muka halaman video stream admin
3.2.7.2.33 Perancangan antar muka audio stream admin
Gambar 3.54 Perancangan antar muka halaman audio stream admin
3.2.7.2.34 Perancangan antar muka data diri
Gambar 3.55 Perancangan antar muka halaman data diri
3.2.7.2.35 Perancangan antar muka kirim pesan
Gambar 3.56 Perancangan antar muka halaman kirim pesan
3.2.7.2.36 Perancangan antar muka hasil pencarian
Gambar 3.57 Perancangan antar muka halaman pencarian
3.2.7.3 Perancangan pesan
Gambar 3.58 Perancangan pesan
3.2.7.4 Perancangan prosedural
Perancangan prosedural merupakan perancangan yang dilakukan untuk menetapkan detail algoritma yang akan dinyatakan kedalam suatu program.
Adapun perancangan prosedural untuk portal web komunitas kristen yang akan dibangun sebagai berikut
1. Flowchart Login, merupakan prosedur yang terjadi ketika member atau
Administrator mulai mengakses Web
Gambar 3.59 Flowchart login
Keterangan : T10 : Form menu admin
T24 : Form menu member
2. Flowchart Tambah Data, merupakan prosedur yang terjadi ketika
Administrator menginputkan data baru.
6 A
6 A
B
B
5 6
4
6 5
6 5
6 5
A B
6 4
6 6
Gambar 3.60 Flowchart cari data
3. Flowchart Ubah Data, merupakan prosedur yang terjadi ketika
Administrator mengubah data yang dianggap perlu dilakukan perubahan
Gambar 3.61 Flowchart ubah data
4. Flowchart Hapus Data, merupakan prosedur yang terjadi ketika
Administrator menghapus data.
Gambar 3.62 Flowchart hapus data
5. Flowchart Cari Data, merupakan prosedur yang terjadi ketika Administrator
atau member mencari data dengan memasukkan kata kunci.
5 6
6 A
B
6 6
6
Gambar 3.63 Flowchart cari data
3.2.7.5 Jaringan semantik
1. Jaringan semantik untuk user
Gambar 3.64 Jaringan semantik user
2. Jaringan semantik untuk member
Gambar 3.65 jaringan semantik member
3. Jaringan semantik untuk admin
.
2 .,
.-
1 -
1
1
1. 1=
1+= 1
12= 1,=
1-
Gambar 3.66 jaringan semantik admin
125
BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM
Pada bab ini akan dilakukan implementasi dan pengujian terhadap sistem web portal yang akan dibangun. Tahapan ini dilakukan setelah perancangan selesai
dilakukan dan selanjutnya akan diimplementasikan kedalam bahasa pemograman. Setelah implementasi maka dilakukan pengujian terhadap sistem yang baru dan
akan dilihat kekurangan-kekurangan pada aplikasi yang baru untuk pengembangan sistem selanjutnya.
4.1 Implementasi Sistem
Tahap implementasi merupakan tahap penciptaan perangkat lunak, tahap kelanjutan dari kegiatan perancangan sistem. Tahap ini merupakan tahap
dimana sistem siap untuk dioperasikan, yang terdiri dari penjelasan mengenai lingkungan implementasi, dan implementasi program.
4.1.1 Perangkat Keras Yang Digunakan
Spesifikasi perangkat keras yang digunakan dalam pembangunan perangkat keras adalah tercantum pada tabel 4.1 sebagai berikut :
Tabel 4.1. Perangkat Keras Yang Digunakan Perangkat
Spesifikasi
Processor Kecepatan 1 GHz
RAM 1GHz
Harddisk 80 Gb
Monitor Resolusi 1024 x
768 VGA
128 Mb Ethernet Card
4.1.2 Perangkat Lunak Yang Digunakan
Spesifikasi perangkat lunak yang digunakan dalam membangun Web adalah sebagai berikut:
Tabel 4.2. Perangkat Lunak Yang Digunakan No
Perangkat Lunak Keterangan
1. Sistem Operasi
Windows XP SP II 2.
Bahasa Pemrograman PHP
3. DBMS
MySQL 5.0.18 4.
Image capture Adobe Photoshop CS3
5. Web Browser
Mozilla 3.0.0 6.
Koneksi internet Minimum upload dan download 128kbps
4.1.3 Implementasi Webhosting
Spesifikasi webhosting yang digunakan dalam membangun Web adalah sebagai berikut:
1. Web host
www.qwords.com 2.
Nama Situs www.pencerahanjiwa.com
3. Bandwdith
unlimited 4.
Kuota 350 MB
5. Database
MySql 5.0.91
4.2 Implementasi Database
Pembuatan database dilakukan dengan menggunakan aplikasi DBMS MySQL. Implementasi database dalam bahasa SQL adalah sebagai berikut:
Tabel 4.3. Implementasi DataBase
Tabel tbl_forum Tabel balasanforum
CREATE TABLE IF NOT EXISTS `forum` `id`
int4 NOT
NULL AUTO_INCREMENT,
`topic` varchar255 NOT NULL, `detail` longtext NOT NULL,
`id_u` int5 NOT NULL, `datetime` varchar25 NOT NULL,
`view` int4 NOT NULL, `reply` int4 NOT NULL,
PRIMARY KEY `id`, KEY `id_u` `id_u`,
ADD
CONSTRAINT `forum_ibfk_1`
FOREIGN KEY `id_u` REFERENCES `members` `iu` ON DELETE CASCADE
ON UPDATE CASCADE; ENGINE=InnoDB DEFAULT
CHARSET=latin1; CREATE
TABLE IF
NOT EXISTS
`balasanforum` `question_id` int4 NOT NULL DEFAULT
0, `a_id` int4 NOT NULL DEFAULT 0,
`id_u` int5 NOT NULL, `a_answer` longtext NOT NULL,
`a_datetime` varchar25 NOT NULL, KEY `question_id` `question_id`,
KEY `id_u` `id_u`, ADD CONSTRAINT `balasanforum_ibfk_1`
FOREIGN KEY
`question_id` REFERENCES `forum` `id` ON
DELETE CASCADE ON UPDATE CASCADE,
ADD CONSTRAINT `balasanforum_ibfk_2` FOREIGN
KEY `id_u`
REFERENCES `members` `iu` ON DELETE CASCADE ON UPDATE
CASCADE; ENGINE=InnoDB
DEFAULT CHARSET=latin1;
Tabel jenis Tabel pengarang
CREATE TABLE IF NOT EXISTS `jenis` `id_b`
int5 NOT
NULL AUTO_INCREMENT,
`tipe` varchar65 NOT NULL, PRIMARY KEY `id_b`
ENGINE=InnoDB DEFAULT
CHARSET=latin1; CREATE TABLE IF NOT EXISTS `pengarang`
`id` int2 NOT NULL AUTO_INCREMENT, `nama` varchar65 NOT NULL,
PRIMARY KEY `id`
ENGINE=InnoDB DEFAULT CHARSET=latin1;
Tabel members Tabel ayat
CREATE TABLE
IF NOT
EXISTS `members`
`iu` int4
NOT NULL
AUTO_INCREMENT, `nama` varchar65 NOT NULL,
`mail` varchar65 NOT NULL, `pass` varchar47 NOT NULL,
`pertanyaan` varchar65 NOT NULL, CREATE TABLE IF NOT EXISTS `ayat`
`id` int2 NOT NULL, `bab` int2 NOT NULL,
`ayat` int2 NOT NULL, `isi` longtext NOT NULL,
KEY `id` `id`, KEY `id_2` `id`,