Upload
hoangbao
View
220
Download
0
Embed Size (px)
Citation preview
13
Bab 3
Perancangan Sistem
Penelitian adalah suatu proses mencari sesutu secara sistematis
dalam waktu yang ralelatif lama dengan menggunakan metode ilmiah
serta aturan yang berlaku. Konseptualisasi proses tersebut kemudian
dituangkan menjadi suatu metode penelitian lengkap dengan pola
analisis observasi serta pengumpulan data yang diperlukan untuk
melukiskan fenomena tersebut.
3.1 Model Perancangan Sistem
Perancangan sistem yang digunakan dalam penelitian ini
adalah metode Waterfall. Tahap-tahap dari metode Waterfall dapat
dilihat pada Gambar 3.1
Gambar 3.1 Waterfall Model (Pressman, 2001)
14
Fase-fase yang terdapat dalam metode waterfall yaitu :
1. Penentuan dan analisis spesifikasi. Tahap ini mengumpulkan
data yang diperlukan oleh sistem, dihasilkan dari konsultasi
dengan pengguna sistem. Meliputi domain informasi, fungsi,
unjuk kerja, dan antarmuka. Pada tahap ini dalam perancangan
akan dibuat use case, activity diagram, dan class diagram.
2. Design sistem dan perangkat lunak. Proses yang menghasilkan
proses arsitektur secara keseluruhan. Pada tahap ini terfokus
pada desian program yang dibutuhkan, bagaimana program ini
dapat berinteraksi, karakteristik antarmuka dan juga pada tahap
ini akan dibuat secara detail class diagram dan sequence
diagram.
3. Implementasi dan uji coba unit. Pada tahap ini merupakan
desain pengkodean yang akan dibuat. Disesuaikan dengan
bahasa pemrograman yang digunakan. Uji unit termasuk
pengujian bahwa setiap unit sesuai dengan spesifikasi.
4. Integrasi dan uji coba sistem. Unit program diintegrasikan dan
diuji menjadi sistem yang lengkap untuk disampaikan ke
pelanggan.
5. Operasi dan pemeliharaan. Normalnya, ini adalah fase yang
terpanjang. Karena sistem dipasang dan digunakan dapat
terjadi perubahan dan mempengaruhi operasi-operasi yang ada
pada perangkat lunak secara langsung.
15
3.1.1 Kebutuhan Hardware dan Software
Dalam pemakaian web aplikasi properti menggunakan
framework MVC ini, dibutuhkan perangkat keras minimal seperti
berikut ini :
Prosesor : Intel Pentium IV
RAM : 512 MB
Hardisk : 40 GB
Monitor : Resolusi 800px X 600px
Aplikasi ini dibangun dengan spesifikasi perangkat lunak sebagai
berikut :
UML Designer : Rational Rose
Framework : MVC 3.0 beta dan ActiveRecord 3.0
Database : Microsoft SQL Server 2008
Tool Designer : Adobe Photoshop CS4
Tool Editor : Microsoft Visual Studio 2010
Web Browser : Internet Explorer 6.0 dan Opera
3.2 Desain Sistem
Pada tahap ini, dilakukan pembuatan desain sistem, dan juga
disertakan diagram-diagram, yaitu usecase diagram, activity diagram,
class diagram, sequence diagram dan deployment diagram.
16
3.2.1 Use Case Diagram
Di dalam usecase seorang user dapat melakukan beberapa
aktivitas. Aktivitas inilah yang akan membatasi kegiatan user didalam
sistem. Diagram usecase dapat dilihat pada Gambar 3.2
Gambar 3.2 Use Case Diagram
Dari Gambar 3.2, dapat dijelaskan aktivitas dari user. User
dapat melakukan pengisian biodata yang meliputi nama, alamat,
nomor telepon dan email, melakukan pemilihan pertanyaan dan dapat
melakukan login dan logout , jika user akan melanjutkan ke tahap
penjualan. Sedangkan aktivitas dari admin yaitu, admin harus
malakukan login terlebih dahulu sebelum melakukan manipulasi data.
Setelah login berhasil, admin dapat melakukan penambahan data,
perubahan data, dan penghapusan data. Setelah proses manipulasi data
selesai, admin dapat keluar dengan cara logout.
Tambah data
Edit Data
Delete Data
Masukan Biodata
Memilih Pertanyaan
Login
Admin
<<include>>
user
Logout
17
3.2.2 Activity Diagram
Activity diagram menggambarkan proses-proses yang terjadi
dari suatu aktifitas dimulai sampai berhenti. Activity diagram dapat
dilihat pada Gambar 3.3 dan Gambar 3.4
Gambar 3.3 Activity Diagram User
Dari Gambar 3.3, dapat dijelaskan aktivitas dari user. Pertama
user akan masuk ke halaman home. Dari halaman home tersebut, user
dapat memilih pertanyaan berdasarkan kategori yang ada. Kategori
dibagi menjadi 3, yaitu building, water, dan energy. Berikutnya user
selesai memilih pertanyaan, user akan melakukan login untuk
Start
Finish
Memilih pertanyaan
Mengisi Form Biodata
Home
Logout
Login
Database
databasesystemUser
18
pengisian biodata. Setelah pengisian biodata selesai, user akan
kembali ke halaman home dengan cara logout dari aplikasi.
Gambar 3.4 Activity Diagram Admin
Dari gambar 3.4, dapat dijelaskan aktivitas dari admin.
Pertama admin akan masuk ke halaman home. Dari halaman home
admin akan melakukan login. Setelah login berhasil maka admin akan
dapat melakukan proses manupulasi data seperti insert data, edit data
dan delete data. Setelah proses manipulasi data selesai, maka data
akan tersimpan dalam database. Admin dapat keluar dari aplikasi
dengan melakukan logout dari sistem.
Start
Home
Manage data
Insert data / edit data / delete data
Finish
Logout
Login
Save data
Database
sincronise
databasesystemadmin
19
3.2.3 Sequence Diagram
Sequence diagram menggambarkan interaksi antar obyek di
dalam dan di sekitar sistem (termasuk pengguna, display, dan
sebagainya) berupa message yang digambarkan terhadap waktu.
Sequence diagram terdiri atas dimensi vertikal (waktu) dan dimensi
horisontal (obyek-obyek yang terkait). Sequence diagram biasa
digunakan untuk menggambarkan skenario atau rangkaian langkah
yang dilakukan sebagai tanggapan dari sebuah event untuk
menghasilkan output tertentu. Sequence Diagram dapat dilihat pada
Gambar 3.5 dan Gambar 3.6
Gambar 3.5 Sequence Diagram User
Dari Gambar 3.5, dapat dijelaskan aktivitas user terhadap
sistem. Pertama kali user akan masuk ke halaman home. Dari halaman
User : user
System
: Database1: Home
2: Album
5: Choose Question
3: Request
4: Response
7: Save
6: Choose Question
8: Insert Biodata
9: Save
10: Home
20
home user dapat melihat album dari bangunan yang dijual. Saat user
akan melakukan pemilihan pertanyaan, sistem akan melakukan
request kedalam database, response dari database akan dikembalikan
ke user dalam bentuk list pertanyaan. Setelah user melakukan
pemilihan pertanyaan, sistem akan melakukan save data ke dalam
database. Setelah proses save selesai, user akan diminta untuk
melakukan pengisian biodata, lalu sistem akan melakukan save
biodata dan sistem akan memberikan halaman home kepada user.
Gambar 3.6 Sequence Diagram Admin
Dari Gambar 3.6, dapat dijelaskan aktivitas admin terhadap
sistem. Pertama kali admin akan masuk ke halaman home. Lalu admin
akan melakukan login dengan memasukan username dan password.
Sistem akan melakukan cek kedalam database, jika username dan
Admin : AdminSystem
Database : Database
1: Home
2: Login
3: Check username and password
6: Valid
7: Manage data
9: Save
10: Manage form
8: Manage Data
4: Invalid
5: Form Login
21
password valid maka admin dapat melakukan manage data. Jika
username dan password tidak valid maka admin diminta mengisi
username dan password yang baru. Setelah itu admin dapat
melakukan manage data. Setelah selesai, system akan melakukan
proses save ke dalam database. Dan sistem akan memberikan halaman
manage data ke admin.
3.2.4 Class Diagram
Class diagram merupakan diagram yang selalu ada di
permodelan sistem berorientasi objek. Class diagram menunjukkan
hubungan antar class dalam sistem yang sedang dibangun dan
bagaimana setiap class dapat saling berkolaborasi untuk mencapai
suatu tujuan. Class diagram sistem dapat dilihat pada Gambar 3.7
Gambar 3.7 Class Diagram Sistem
22
3.2.5 Deployment Diagram
Deployment diagram merupakan diagram pemodelan sistem
dalam proses deploy. Proses deployment meliputi interface, sistem,
dan database. Deployment diagram dapat dilihat pada Gambar 3.8
Gambar 3.8 Deployment Diagram
3.3 Desain Antarmuka
Desain antarmuka untuk Analisis dan Penjualan properti ini
terbagi menjadi dua bagian utama yaitu tampilan untuk halaman
analisis dan penjualan. Untuk halaman analisis terbagi menjadi 4
halaman, yaitu halaman awal, halaman analisa, halaman penjualan,
dan halaman admin.
Web browser
Web server
Model
View
Controller
Database server
MS. Sql Server
23
3.3.1 Desain antarmuka halaman home
Pada halaman home, terdapat 4 menu, untuk halaman
analisa dan halaman penjualan. Desain halaman home dapat dilihat
pada Gambar 3.9
Gambar 3.9 Desain antarmuka halaman home
2.2.1. Desain antarmuka halaman analisa
3.3.2.1 Desain halaman biodata
Halaman biodata akan menangani data inputan dari
user, meliputi username, firstname, lastname, address, city, state,
postcode, country, phone, dan email. Pada saat klik button, akan
mengarah ke halaman home. Desain halaman biodata dapat dilihat
pada Gambar 3.10
Logo
Header
Footer
Body Category
Menu
24
Gambar 3.10 Desain halaman biodata
3.3.2.2 Desain halaman kategori bangunan
Pada halaman ini akan terdapat beberapa pertanyaan
mengenai sisi bangunan yang terdapat dalam obyek yang
ditawarkan oleh konsumen. Desain antarmuka pertanyaan
kategori bangunan dapat dilihat pada Gambar 3.11
Logo
Header
Footer
Menu
Button
FirstName
Address
City
State
PostalCode
Country
Phone
LastName
Autentication
Category
25
Gambar 3.11 Desain antarmuka halaman pertanyaan kategori bangunan
3.3.2.3 Desain halaman pertanyaan kategori energi
Pada halaman ini akan terdapat beberapa pertanyaan
mengenai sisi energi yang terdapat dalam obyek yang
ditawarkan oleh konsumen. Desain antarmuka pertanyaan
kategori energi dapat dilihat pada Gambar 3.12
Logo
Header
Footer
Menu
List Question Category
26
Gambar 3.12 Desain halaman pertanyaan kategori energi
3.3.2.4 Desain halaman pertanyaan kategori air
Pada halaman ini akan terdapat beberapa pertanyaan
mengenai sisi air yang terdapat dalam obyek yang ditawarkan
oleh konsumen. Desain antarmuka pertanyaan kategori air
dapat dilihat pada Gambar 3.13
Logo
Header
Footer
Menu
List Question Category
27
Gambar 3.13 Desain halaman pertanyaan kategori air
3.3.3 Desain halaman admin
Pada halaman antar muka admin, untuk dapat melakukan
pengolahan data, admin diminta memasukkan username dan
password. Halaman login untuk admin dapat dilihat pada Gambar
3.14
Logo
Header
Footer
Menu
List Question Category
28
Gambar 3.14 Desain halaman login admin
3.3.3.1 Desain halaman manage data
Pada halaman manage data, admin dapat melakukan
pengolahan data, meliputi edit data dan delete data. Halaman
manage data dapat dilihat pada Gambar 3.15
Gambar 3.15 Desain halaman manage data
Logo
Header
Manage data
Footer
Menu
Category
Edit||Delete
Edit||Delete
Edit||Delete
Logo
Header
Footer
Menu
Category
Username
Password
Button
29
3.4 Desain Tabel
Tabel 3.1 Tabel Questions
Field Type Length Information
Question Id Int Max Primary Key
Category Id Int Max Foreign Key
QuestionCategoryId Int Max Foreign Key
Title nVarchar 160 Not null
Nominal Numeric 10,2 Not null
DisplayArtUrl nVarchar 1024 Allow nul
Dalam tabel question terdapat 6 field. QuestionId merupakan
primary key dan juga sebagai kunci yang menghubungkan dengan
tabel results dan charts. Tabel ini juga mempunyai foreign key
CategoryId dan QuestionCategoryId yang berhubungan dengan tabel
Categories dan QuestionCategories. Nominal yang memiliki type data
Numeric memiliki value 10.2 yang berarti 10 digit pertama sebagai
desimal dan 2 sebagai pecahan. Field DisplayArtUrl dapat memiliki
value dan dapat juga tidak memiliki value.
Tabel 3.2 Tabel Categories
Field Type Length Information
Category Id Int Max Primary Key
Name nVarchar 120 Allow null
Description nVarchar 4000 Allow null
30
Dalam tabel Categories terdapat 3 field. CategoryId
merupakan primary key. Name dan description yang memiliki type
data nVarchar dapat memiliki value dan dapat juga tidak memiliki
value
Tabel 3.3 Tabel QuestionCategories
Field Type Length Information
QuestionCategory
Id
Int Max Primary Key
TitleCategory nVarchar 120 Allow null
Dalam tabel QuestionCategories terdapat 2 field.
QuestionCategoryId merupakan primary key. TitleCategory yang
memiliki type data nVarchar dapat memiliki value dan dapat juga
tidak memiliki value.
Tabel 3.4 Tabel Charts
Field Type Length Information
RecordId Int Max Primary Key
ChartId Varchar 50 Not null
QuestionId Int Max Foreign Key
Count Int Max Not null
DateCreate DateTime yy:mm:dd
00:00:00.000
Not null
31
Dalam tabel Charts terdapat 5 field. RecordId merupakan
primary key. Sedangkan QuestionId merupakan foreign key untuk
terhubung dengan tabel Question. DateCreated yang memiliki type
data DateTime memiliki value yy:mm:dd:00:00:00.000 yang berarti
year, month, date, hour, minute, second dan milisecond.
Tabel 3.5 Tabel Results
Field Type Length Information
ResultDetailId Int Max Primary Key
ResultId Int Max Not null
QuestionId Int Max Foreign Key
Quantity Int Max Not null
Nominal Numeric 10.2 Not null
Dalam tabel Results terdapat 5 field. ResultDetailId
merupakan primary key. Sedangkan QuestionId merupakan foreign
key untuk terhubung dengan tabel Question. Nominal yang memiliki
type data Numeric memiliki value 10.2 yang berarti 10 digit pertama
sebagai desimal dan 2 sebagai pecahan.
Tabel 3.6 Tabel Guest
Field Type Length Information
GuestId Int Max Primary Key
OrderDate DateTime yy:mm:dd
00:00:00.000
Allow null
UserName nVarchar 256 Allow null
FirstName nVarchar 160 Allow null
LastName nVarchar 160 Allow null
32
Address nVarchar 70 Allow null
City nVarchar 40 Allow null
State nVarchar 40 Allow null
PostalCode nVarchar 10 Allow null
Country nVarchar 40 Allow null
Phone nVarchar 24 Allow null
Email nVarchar 160 Allow null
NominalTotal Numeric 10.2 Not null
Dalam tabel Guest terdapat 13 field. GuestId merupakan
primary key. OrderDate yang memiliki type data DateTime memiliki
value yy:mm:dd:00:00:00.000 yang berarti year, month, date, hour,
minute, second dan milisecond. Nominal yang memiliki type data
Numeric memiliki value 10.2 yang berarti 10 digit pertama sebagai
desimal dan 2 sebagai pecahan.
3.4.1 Database Diagram
Dari tabel yang sudah dirancang, maka dapat dijelaskan
lebih detailnya hubungan antar tabel yang menghasilkan sebuah
sistem yang saling berhubungan. Hubungan antar tabel tersebut
dapat dilihat pada Gambar 3.16
33
Gambar 3.16 Relasi Tabel
Dari Gambar 3.16 dapat dijelaskan mengenai hubungan relasi
antar tabel. Tabel Question memiliki QuestionId sebagai primary key
dari tabel tersebut. Foreignkey dari QuestionId terdapat pada tabel
Carts, dan Results. Sedangkan primary key pada tabel
QuestionCategories adalah QuestionCategoryId yang juga terdapat
foreignkey pada tabel Question. Untuk tabel Categories, memiliki
CategoryId sebagai primarykey dan foreignkey pada tabel Question.
Dan untuk tabel Guest hanya memiliki primarykey yaitu, GuestId dan
tidak memiliki foreignkey di tabel yang lain.
34
3.5 Analisis Sistem
Dalam penelitian ini, akan dilakukan analisis framework MVC
3.0 dan Active Record. Proses analisis dilakukan dengan
menggunakan analyse performance tools dari Microsoft Visual Studio
2010. Aspek dari analisis yang akan dilakukan yaitu analisis
kecepatan dan analisis alokasi memori. Analisis kecepatan meliputi
kecepatan akses dalam setiap method yang ada dalam sistem (proses
query, running web layout, dan penggunaan resource dari processor).
Untuk analisis alokasi memori meliputi alokasi memori yang
digunakan dalam setiap proses yang dijalankan dan alokasi memori
untuk setiap variable dalam sistem (string, char, dan integer) serta
alokasi penggunaan resource dari processor.