Rancangan layar home website menampilkan info-info seputar produk terbaru dan berita seputar PT Victoria Care Indonesia
Gambar 3.135 Rancangan layar home 2. Rancangan layar profile
Rancangan layar profile menampilkan informasi mengenai perusahaan PT Victoria Care Indonesia.
Gambar 3.136 Rancangan layar profile 3. Rancangan layar our product
Rancangan layar our product menampilkan produk-produk yang diproduksi oleh PT Victoria Care Indonesia. Member dapat memberikan like atau unlike terhadap catalog produk yang disukai.
184
Gambar 3.137 Rancangan layar our product
4. Rancangan layar FAQ
Rancangan layar FAQ menampilkan daftar FAQ yang ada dalam database. FAQ ditampilkan berdasarkan kategori, sub-kategori, brand serta sub-brand yang dipilih oleh member. Bila member tidak menentukan pilihan maka defaultnya adalah seluruh FAQ.
Gambar 3.138 Rancangan layar FAQ
5. Rancangan layar testimonial
Rancangan layar testimonial menampilkan daftar testimonial yang telah ada pada database. Apabila user telah melakukan login, maka pada halaman ini user dapat mengisi testimonial pada pihak perusahaan melalui website.
186
Gambar 3.139 Rancangan layar testimonial 6. Rancangan layar my account admin
Rancangan layar my account admin merupakan halaman kontrol admin, halaman ini memungkinkan admin mengatur isi keseluruhan website. Pada halaman ini terdapat notifikasi singkat data baru user yang belum dikonfirmasi oleh admin, data user yang akan berulang tahun, data pertanyaan dari member yang belum terjawab, serta data testimonial yang belum dikonfirmasi oleh pihak admin.
Gambar 3.140 Rancangan layar my account admin 7. Rancangan layar my account member
Rancangan layar my profile member menampilkan data diri member, pesan dan pertanyaan yang pernah diajukan. Member dapat melakukan edit password, edit profile, membuat pesan baru, melihat polling, melihat event terbaru dan melihat promo terbaru.
188
Gambar 3.141 Rancangan layar my account member
8. Rancangan layar view message
Rancangan layar view message menampilkan pesan yang ada pada halaman inbox member.
9. Rancangan layar view testimony
Rancangan layar view testimony menampilkan testimonial dari member seputar pemakaian produk PT Victoria Care Indonesia.
Gambar 3.143 Rancangan layar view testimony 10. Rancangan layar view question
Rancangan layar view question menampilkan pertanyaan-pertanyaan yang ditanyakan oleh member beserta jawaban apabila pertanyaan tersebut telah dijawab oleh admin atau moderator.
Gambar 3.144 Rancangan layar view question 11. Rancangan layar register
190 Rancangan layar register memungkinkan user website untuk melakukan registrasi. User website perlu mengisi data username, password, real name, gender, date of birth, serta e-mail terlebih dahulu.
Gambar 3.145 Rancangan layar register 12.Rancangan layar login
Rancangan layar login memungkinkan user terdaftar untuk mengakses data atau fasilitas member yang disediakan pada website.
Gambar 3.146 Rancangan layar login 13.Rancangan layar change password
Rancangan layar change password merupakan rancangan layar member untuk mengubah password lama menjadi password baru yang diinginkan. Password baru tersebut akan disimpan dalam database member dan menjadi password tetap member untuk login berikutnya.
192 14.Rancangan layar change data
Rancangan layar change data merupakan rancangan layar member saat hendak melakukan perubahan data personal pada website.
Gambar 3.148 Rancangan layar change data
15.Rancangan layar event calendar
Rancangan layar event calendar merupakan rancangan layar admin untuk memasukkan event terbaru pada tanggal yang diinginkan. Admin dapat memasukkan nama dan deskripsi dari event tersebut.
Gambar 3.149 Rancangan layar event calendar 16.Rancangan layar info
Rancangan layar info admin menampilkan seluruh info yang tersedia pada website. Informasi yang ditampilkan diantaranya adalah judul info, isi info, gambar yang termasuk dalam info serta tanggal berlaku info tersebut. M elalui halaman ini, admin dapat menambah, melakukan edit serta menghapus info yang ada.
194
Gambar 3.150 Rancangan layar info 17.Rancangan layar category
Rancangan layar category menampilkan keseluruhan kategori, sub-kategori, brand dan sub-brand yang telah dibuat oleh admin. Pada halaman ini, admin dapat melakukan edit, menambah, maupun menghapus kategori, sub-kategori, brand dan sub-brand.
Gambar 3.151 Rancangan layar category 18.Rancangan layar themes
Rancangan layar themes memungkinkan admin membuat themes baru agar kemudian member dapat memilih themes yang telah tersedia.
196
Gambar 3.152 Rancangan layar themes 19.Rancangan layar statistic
Rancangan layar statistic menampilkan statistik yang didapat dari aktifitas user web, yaitu melalui data kuisioner yang dijawab oleh user, FAQ yang dirating oleh user, info produk yang disukai customer serta akumulasi aktififtas user.
Statistic Member xxx Jan Fe b Mar Apr May Jun
Gambar 3.153 Rancangan layar statistic 20.Rancangan layar questionnaire
Rancangan layar questionnaire menampilkan informasi dari data tiap kuisioner yang telah diisikan oleh member. Data yang ditampilkan akan berupa statistik hasil pie chart.
198 Result Questionnaire xXx Jan Fe b Mar Apr May Jun
Gambar 3.154 Rancangan layar questionnaire B. Perancangan Storyboard forum
1. Perancangan Storyboard Guest
1. Rancangan layar home
Rancangan layar home yang menampilkan layar utama untuk guest yang tidak mempunyai account. Halaman ini menampilkan personal message member, forum name, user online dan forum statistic.
Gambar 3.155 Rancangan layar home 2. Rancangan layar toppers
Rancangan layar toppers ini menampilkan member yang diurutkan berdasarkan balasan terbanyak, top thanks dan top uploader.
200 3. Rancangan layar forum leaders
Rancangan layar forum leaders ini menampilkan para forum leaders yang ada di forum. Admin sebagai Head Admin yang mempunyai hak akses untuk mengatur semua kegiatan forum dan ada pula yang berposisi sebagai moderator.
Gambar 3.157 Rancangan layar forum leaders 4. Rancangan layar search
Rancangan layar search yang berfungsi untuk mencari kata-kata yang ada di dalam forum, mencari nama member dan attachment file.
5. Rancangan layar forgot password
Rancangan layar forgot password merupakan rancangan layar yang dapat memberikan password baru ke e-mail member yang telah diisi oleh member di kolom e-mail address. Setelah member menekan tombol request new password, maka password baru akan di kirim ke e-mail member.
Gambar 3.159 Rancangan layar forgot password 6. Rancangan layar login
Rancangan layar login bisa diakses oleh semuanya, baik dari user, member maupun admin. login disini berfungsi untuk mengantarkan user yang login ke halaman yang sesuai dengan posisinya dalam forum
202 7. Rancangan layar register
Rancangan layar register berfungsi untuk melakukan registrasi bagi para new member yang ingin bergabung menjadi anggota Victoria Care Indonesia Community.
Gambar 3.161 Rancangan layar register
2. Perancangan Storyboard Member dan Moderator secara umum
1. Rancangan layar user CP
Rancangan layar user CP menampilkan personal message dan berfungsi untuk mengubah e-mail, mobile phone dan location.
Gambar 3.162 Rancangan layar user CP 2. Rancangan layar change password
Rancangan layar change password menampilkan personal message dan berfungsi untuk melakukan perubahan password.
Gambar 3.163 Rancangan layar change password 3. Rancangan layar logout
204 Rancangan layar logout berfungsi untuk keluar dari hak akses member dan moderator. Member dan moderator dapat mengakses kembali halamannya dengan melakukan login.
Gambar 3.164 Rancangan layar logout 4. Rancangan layar inbox
Rancangan layar inbox berfungsi untuk menampilkan pesan yang masuk ke personal message member dan moderator. Member dan moderator dapat melihat pesan dan menghapus pesan.
Gambar 3.165 Rancangan layar inbox 5. Rancangan layar read message
Rancangan layar read message berfungsi untuk menampilkan pesan yang ingin dibaca oleh member dan moderator. Pada halaman ini user dapat membalas pesan dan dapat membuat pesan yang baru.
Gambar 3.166 Rancangan layar read message 6. Rancangan layar new PM
Rancangan layar new PM menampilkan halaman dimana user dapat menuliskan personal message kepada member lain.
Gambar 3.167 Rancangan layar new PM 7. Rancangan layar view forum
206 Rancangan layar view forum berfungsi untuk menampilkan personal message dan topik-topik yang ada di forum. user juga dapat membuat topik baru dengan menekan tombol new topic. Untuk melihat topik pada forum yang berbeda, dapat menggunakan tombol go yang ada di bawah topik dengan memilih nama kategori forum yang diinginkan.
Gambar 3.168 Rancangan layar view forum 8. Rancangan layar view topik member
Rancangan layar view topik berfungsi untuk pesan-pesan yang ada pada suatu topik. Pada layar ini user dapat mengirimkan pesan balasan pada topik, dapat mengubah pesan yang telah dibuat, dapat memberikan thanks kepada member lain, dapat melakukan quote, dapat membuat topik baru dan dapat memberikan reputasi kepada member lain.
Gambar 3.169 Rancangan layar view topic member 9. Rancangan layar reply topic
Rancangan layar reply topic berfungsi untuk membuat pesan yang akan di muat dalam topik yang telah dibuat oleh member.
Gambar 3.170 Rancangan layar reply topik 10. Rancangan layar new topic
208 Rancangan layar new topic berfungsi untuk membuat topik baru yang akan menjadi topik pada halaman kategori yang telah ada.
Gambar 3.171 Rancangan layar new topic 11.Rancangan layar view sub-forum
Rancangan layar view sub-forum berfungsi untuk menampilkan topik-topik yang ada di sub-forum. Untuk melihat topik pada forum yang berbeda, dapat menggunakan tombol go yang ada di bawah topik dengan memilih nama category forum yang diinginkan.
Gambar 3.172 Rancangan layar view sub-forum 12.Rancangan layar download file
Rancangan layar download file berfungsi untuk menampilkan detail dari file attachment dan link untuk melakukan download file tersebut.
210 13.Rancangan layar notification
Rancangan layar notification berfungsi untuk menampilkan notifikasi apabila ada member lain yang membalas thread yang dibuat oleh member tersebut.
Gambar 3.174 Rancangan layar notification 14.Rancangan layar profile member
Rancangan layar profile member menampilkan personal message dan menampilkan informasi mengenai member secara keseluruhan. User dapat mengirim pesan secara langsung kepada member tersebut.
Gambar 3.175 Rancangan layar profile member 3. Perancangan Storyboard Admin Khusus
1. Rancangan layar admin CP
Rancangan layar admin CP berfungsi untuk mengontrol semua kegiatan forum. Admin dapat melakukan manage category, manage forum, manage sub-forum, mengakses forum permission, membuat group management, melakukan IP banning, melakukan e-mail banning, membuat rank system, mengakses user management dan dapat membuat global PM yang dapat dikirimkan kepada semua member yang ada.
212
Gambar 3.176 Rancangan layar admin CP 2. Rancangan layar manage category
Rancangan layar manage category berfungsi untuk menambah, mengubah dan menghapus kategori.
3.Rancangan layar add category
Rancangan layar add category berfungsi untuk menambahkan kategori baru dengan memasukkan nama kategori dan sorting yang dapat dibuat berdasarkan prioritas.
Gambar 3.178 Rancangan layar add category 4.Rancangan layar manage forum
Rancangan layar manage forum berfungsi untuk menambah, mengubah dan menghapus forum.
214 5.Rancangan layar add forum
Rancangan layar add forum berfungsi untuk menambahkan forum baru dengan memasukkan nama forum, deskripsi mengenai forum tersebut, memilih kategori dan sorting yang dapat dibuat berdasarkan prioritas.
Gambar 3.180 Rancangan layar add forum 6.Rancangan layar manage sub-forum
Rancangan layar manage sub-forum berfungsi untuk menambah , mengubah dan menghapus sub-forum.
Gambar 3.181 Rancangan layar manage sub-forum
7.Rancangan layar add sub-forum
Rancangan layar add forum berfungsi untuk menambahkan sub-forum baru dengan memasukkan nama sub-sub-forum, deskripsi mengenai forum tersebut, memilih parent forum dan sorting yang dapat dibuat berdasarkan prioritas.
Gambar 3.182 Rancangan layar add sub-forum 8.Rancangan layar forum permission
Rancangan layar forum permission berfungsi untuk membuat hak akses terhadap guest, member, moderator dan admin.
216 Gambar 3.183 Rancangan layar forum permission
9.Rancangan layar edit forum permission
Rancangan layar edit forum permission ini merupakan halaman dimana admin dapat memberikan hak akses kepada seluruh member dengan memilih salah satu jawaban dari pertanyaan yang telah di sediakan.
Gambar 3.184 Rancangan layar edit forum permission 10.Rancangan layar group management
Rancangan layar group management berfungsi untuk menambah , mengubah dan menghapus group.
Gambar 3.185 Rancangan layar group management 11.Rancangan layar add group management
Rancangan layar add group management berfungsi untuk menambahkan grup, prioritas dari grup tersebut dan memvalidasi apakah grup yang akan dibuat dapat melakukan user banning, melihat IP, melihat e-mail dan melihat browser.
218
Gambar 3.186 Rancangan layar add group management 12.Rancangan layar IP banning
Rancangan layar IP banning menampilkan banned IP.Admin dapat menambahkan IP, mengubah IP dan menghapus IP yang ada di dalam daftar banned IP.
13.Rancangan layar add IP
Rancangan layar add IP berfungsi untuk menambahkan IP yang akan dimasukkan ke dalam daftar banned IP dengan memasukkan IP address yang diinginkan.
Gambar 3.188 Rancangan layar add IP 14.Rancangan layar e-mail banning
Rancangan layar e-mail banning menampilkan banned e-mail. Admin bisa menambahkan e-mail, mengubah e-mail dan menghapus e-mail yang ada.
220 15.Rancangan layar add e-mail
Rancangan layar add e-mail berfungsi untuk menambahkan e-mail yang akan dimasukkan ke dalam daftar banned e-mail dengan memasukkan e-mail address yang diinginkan.
Gambar 3.190 Rancangan layar add e-mail 16.Rancangan layar rank system
Rancangan layar rank system menampilkan urutan ranking dari para member dimana saat member mencapai jumlah balasan tertentu, maka peringkatnya akan bertambah. Admin dapat mengubah, menambah dan menghapus rank system yang ada.
Gambar 3.191 Rancangan layar rank system 17.Rancangan layar add rank system
Rancangan layar add rank system berfungsi untuk menambahkan ranking dengan memasukkan nama rank yang diinginkan dan minimum posting yang dibutuhkan.
Gambar 3.192 Rancangan layar add rank system 18.Rancangan layar user management
222 Rancangan layar user management menampilkan nama user, group, verifikasi e-mail, dan banned user. Admin dapat mengubah, menghapus dan melakukan aktivasi apabila ada user yang belum diaktivasi menjadi member.
Gambar 3.193 Rancangan layar user management 19.Rancangan layar edit user management
Rancangan layar edit user management menampilkan nama user, password, e-mail, group, rank, post, validated, thanks, reputes, location dan mobile phone yang ingin diubah oleh admin.
Gambar 3.194 Rancangan layar edit user management 20.Rancangan layar user management search
Rancangan layar user management search berfungsi untuk mencari nama member yang diinginkan. Setelah selesai melakukan pencarian, maka member tersebut dapat diubah ataupun dihapus dari forum.
224 21.Rancangan layar global PM
Rancangan layar global PM berfungsi untuk mengirimkan pesan secara global kepada seluruh member forum dengan memilih kepada siapa pesan akan disampaikan dan memasukkan subjek serta isi pesan yang ingin disampaikan oleh admin.
Gambar 3.196 Rancangan layar global PM 22.Rancangan layar user banning
Rancangan layar user banning berfungsi untuk melakukan ban terhadap member. Admin dapat mengisi alasan dan lamanya hari member tersebut akan diblok hak aksesnya.
Gambar 3.197 Rancangan layar user banning
23.Rancangan layar delete post, delete thread, dan lock thread
Rancangan layar ini berfungsi untuk menghapus balasan, menghapus topik member dan mengunci topik tersebut.
226 24.Rancangan layar move thread
Rancangan layar move thread berfungsi untuk menampilkan keterangan dari topik yang akan dipindahkan ke kategori forum yang dituju.
Gambar 3.199 Rancangan layar move thread 25.Rancangan layar profile member
Rancangan layar profile member menampilkan personal message admin dan menampilkan informasi mengenai member secara keseluruhan. Admin dapat melakukan ban user dan mengirim pesan secara langsung kepada member tersebut.
Gambar 3.200 Rancangan layar profile member 3.4.6 Perancangan Basis Data Solusi
1. Tabel Attachment
Fungsi tabel digunakan untuk menampung file attachment yang di attach oleh member, moderator dan admin.
Primary key dari tabel ini : attachid
Entity Atribut Tipe data dan panjang Keterangan Attachment attachid bigint(20) PK
fname text nama file
flocation text lokasi file
fsize float ukuran file
postid bigint(20) id post(FK)
download bigint(20) download
userid bigint(20) id user(FK)
timepost bigint(20) waktu post
228 2. Tabel Banned
Fungsi tabel digunakan untuk menampung member yang telah di masukkan ke dalam daftar ban member.
Primary key dari tabel ini : banid
Entity Atribut Tipe data dan panjang Keterangan
Banned banid bigint(20) PK
banby bigint(20) ban by 1 = Admin
reason text alasan
tlapse bigint(20) validasi ban -1 =
permanen
userid bigint(20) FK
bandays varchar(10) lama waktu ban
Tabel 3.56 Tabel basis data Banned 3. Tabel KategoriForum
Fungsi tabel digunakan untuk menampung kategori forum. Primary key dari tabel ini : categoryid
Entity Atribut Tipe data dan panjang Keterangan KategoriForum categoryid bigint(20) PK
categoryname text nama kategori
catsort int(10) sorting kategori
berdasarkan urutan Tabel 3.57 Tabel basis data KategoriForum
4. Tabel Forum
Fungsi tabel digunakan untuk menampung nama forum. Primary key dari tabel ini : forumid
Entitiy Atribut Tipe data dan panjang Keterangan
Forum forumid bigint(20) PK
parentid bigint(20) nama kategori yang dituju
name text nama forum
description text deskripsi forum
numtopics bigint(10) total topik yang ada di forum numposts bigint(10) total balasan yang ada di
forum
sorts int(10) sorting
lastpostuser bigint(20) balasan terakhir dari member lastposttime bigint(20) waktu terakhir balasan
member
pforum bigint(20) total page
Tabel 3.58 Tabel basis data Forum 5. Tabel Grup
Fungsi tabel di gunakan untuk menampung grup member. Primary key dari tabel ini : groupid
Entity Atribut Tipe data dan panjang Keterangan
Grup groupid bigint(20) PK
groupname text nama grup
grouptype int(10) tipe grup
groupsort bigint(20) sorting
canban int(10) validasi 1= bisa ban
member, 0 = tidak bisa ban member
color varchar(15) warna dari tiap grup
viewbrowser int(10) validasi 1= bisa melihat browser, 0 = tidak bisa melihat browser
230 Entity Atribut Tipe data dan panjang Keterangan
viewemail int(10) validasi 1= bisa melihat e-mail, 0 = tidak bisa melihat e-mail
viewip int(10) validasi 1= bisa melihat IP, 0 = tidak bisa melihat IP
Tabel 3.59 Tabel basis data Grup 6. Tabel Permissions
Fungsi tabel digunakan untuk memvalidasi hak akses yang dapat dilakukan oleh user.
Primary key dari tabel ini : permissionid
Entity Atribut Tipe data dan panjang Keterangan Permissions permissionid bigint(20) PK
forumid bigint(20) id forum (FK)
groupid bigint(20) id grup (FK)
view int(10) akses melihat, validasi 1=
bisa, 0 = tidak bisa
newtopic int(10) akses membuat topik baru,
validasi 1= bisa, 0 = tidak bisa
newpost int(10) akses membuat balasan
baru, validasi 1= bisa, 0 = tidak bisa
editpost int(10) akses melakukan edit
balasan, validasi 1= bisa, 0 = tidak bisa
editotherpost int(10) akses melakukan edit
Entity Atribut Tipe data dan panjang Keterangan bisa, 0 = tidak bisa
deletepost int(10) akses menghapus balasan,
validasi 1= bisa, 0 = tidak bisa
deleteotherpost int(10) akses mennghapus balasan lain, validasi 1= bisa, 0 = tidak bisa
movethread int(10) akses memindahkan thread, validasi 1= bisa, 0 = tidak bisa
lockthread int(10) akses mengunci thread,
validasi 1= bisa, 0 = tidak bisa
stickthread int(10) akses membuat sticky
thread, Validasi 1= bisa, 0 = tidak bisa
upload int(10) akses melakukan upload
file, Validasi 1= bisa, 0 = tidak bisa
download int(10) akses melakukan download
file, validasi 1= bisa, 0 = tidak bisa
Tabel 3.60 Tabel basis data Permissions 7. Tabel Post
Fungsi tabel digunakan untuk menampung data topik yang telah dibuat oleh member.
232 Entity Atribut Tipe data dan panjang Keterangan
Post id bigint(40) PK
title text judul topik
author bigint(20) pembuat topik
timepost bigint(20) Waktu posting
numreplies bigint(20) total reply
views bigint(20) total yang melihat thread post longtext isi dari balasan dibuat
threadparent bigint(20) parent dari thread yang dibuat postforum bigint(10) total post forum
nosmilies int(10) validasi smilies
ipaddress varchar(25) alamat IP
locked int(10) deskripsi apakah topik di lock editby bigint(20) deskripsi edit posting member
lockedby bigint(20) deskripsi member yang
mengunci topik Tabel 3.61 Tabel basis data Post
8. Tabel Rank
Fungsi tabel untuk menampung ranking member. Primary key dari tabel ini : rankid
Entity Atribut Tipe data dan panjang Keterangan
Rank rankid bigint(20) PK
rankname char(60) nama rank
postneeded int(10) balasan yang dibutuhkan untuk mencapai rank tertentu
9. Tabel Reputes
Fungsi tabel untuk menampung reputasi yang diberikan kepada member Primary key dari tabel ini : reputeid
Enitity Atribut Tipe data dan panjang Keterangan Reputes reputeid bigint(20) PK
byuser bigint(20) member yang memberikan
reputasi
touser bigint(20) member yang diberikan reputasi
postid bigint(20) FK dari b_posts
reputetime bigint(20) waktu memberikan reputasi
type varchar(5) tipe reputasi
Tabel 3.63 Tabel basis data Reputes 10. Tabel Thanks
Fungsi tabel untuk menampung thanks yang diberikan kepada member Primary key dari tabel ini : thankid
Entity Atribut Tipe data dan panjang Keterangan
Thanks thankid bigint(40) PK
byuser bigint(20) member yang memberikan thanks
touser bigint(20) member yang diberikan thanks