cd System
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
ActionView
+ edit : void + list : void
+ new : void
ActionController ActiveRecord
ArticleView
+ edit : void + list : void
+ new : void
CategoryArticleView
+ edit : void + list : void
+ new : void
FIleView
+ edit : void + list : void
+ new : void
CitezenReportVIew
+ edit : void + list : void
+ new : void
LoginView
+ new : void
ArticlesController
+ create : void + destroy : void
+ update : void
CategoryArticlesController
+ create : void + destroy : void
+ update : void
SessionsController
+ login : void + logout : void
FilesController
+ create : void + destroy : void
+ update : void
CitizenReportsController
+ create : void + destroy : void
+ update : void
User
- email: char - login: char
- name: char - password: char
File
- description: char - file_name: char
- file_size: int - title: char
Article
- content: char - title: char
ArticleCategory
- description: char - title: char
CitizenReport
- content: char - email: char
- title: char
UsersController
+ destroy : void + signup : void
Gambar 3.17 Perancangan Kelas system
3.2.2 Perancangan Basis Data
Tujuan dari perancangan basis data ini adalah untuk agar tersedia fasilitas penyimpanan
data yang mendukung system ini. Berikut ini adalah perancangan database yang ada pada system ini.
cd Schema1
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
users
column PK id:
name: login:
password: PK
+ PK_User
articles
column PK id:
user_id: title:
content: created_at:
updated_at: article_category_id:
PK +
PK_Article
article_categories
column PK id:
title: description:
PK +
PK_article_categories
citizen_reports
column PK id:
email: title:
content: created_at:
updated_at: PK
+ PK_citizen_reports
files
column PK id:
file_name: file_size:
title: description:
user_id: PK
+ PK_files
Gambar 3.18 Peracangan database
3.2.3 Perancangan Antarmuka
Tujuan dari perancangan antarmuka ini adalah untuk menjelaskan rancangan tampilan yang akan diimplementasikan. Berikut ini beberapa gambaran rancangan antarmuka dari website
gorontalo.
3.2.3.1 Halaman Home
cd Primary Forms
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
• •
HomePage
LOGO HEADER TITLE
search
MAIN SLIDE IMAGE
MAIN NEWS RIGHT MENU
LEFT MENU MAIN CONTENT
HEADER MENU
Gambar 3.19 Rancangan antarmuka halaman home 1. Logo : Logo khusus dari Pemerintahan Kota Gorontalo sebagai identitas dari website
2. Header Title : Judul dari website, ak an dipasang text “Situs Resmi Pemerintahan Kota
Gorotanlo” 3. Search : Form untuk mencari apapun yang berhubungan dengan website Pemerintahan
Kota Gorontalo. 4. Header Menu : Berisi menu-menu yang ada pada website.
5. Main Slide Image : Gambar-gambar bergerak sebagai pemanis website 6. Main News : Berita utama, atau berita paling baru.
