BAB III ANALISA DAN PERANCANGAN

BAB III ANALISA DAN PERANCANGAN

Bab ini menjelaskan analisa dan proses perancangan aplikasi tentang kegiatan multiuser dalam aplikasi agenda online. Hasil analisa dan proses perancangan akan diterapkan kedalam pembangunan aplikasi. Metode pelaksanaan yang akan diimplementasikan ke pembangunan aplikasi agenda online pada penyusunan tugas ini adalah sebagai berikut: 3.1

Analisa 3.1.1

Analisa Aplikasi yang Akan Dikembangkan Pada aplikasi sebelumnya “Aplikasi Sinkronisasi Kegiatan Multi

User Dalam Agenda Online” Ma‟arif. (2012) sudah terdapat sebuah aplikasi agenda yang dapat digunakan pengguna untuk membantu mengatur perancangan agenda yang akan dijalankan. Tabel 3.1.1 Analisa Fitur Aplikasi Sebelumnya Fitur Aplikasi

Deskripsi

Pendaftaran Pengguna

Fungsi pengguna yang belum terdaftar untuk dapat mendaftar pada aplikasi, sehingga dapat menggunakan aplikasi nantinya

Login

Fungsi untuk identifikasi pengguna untuk masuk ke dalam aplikasi dan menggunakan aplikasi sesuai dengan haknya

Agenda

Daftar dari agenda yang telah dibuat ataupun yang akan dijalani oleh pengguna

Buat Agenda

Fungsi untuk membuat agenda baru

Sinkronisasi

Fungsi untuk mengambil jadwal agenda anggota yang beririsan dengan jadwal agenda saat ini

Logout

Menghapus sesi pengguna dan keluar dari aplikasi

27

http://digilib.mercubuana.ac.id/

28

Seperti banyak penelitian lain, aplikasi tersebut juga memiliki beberapa fitur untuk ditambahkan atau diperbaiki. Hal ini juga disadari oleh penulis sebelumnya dimana beliau menyarankan untuk melanjutkan aplikasi tersebut pada bagian : 1. Membuat range waktu untuk pelaksanaan agenda, sehingga agenda tidak hanya untuk agenda satu hari 2. Memiliki data menit pada jam pelaksanaan agenda, sehingga agenda akan lebih jelas waktu pelaksanaannya 3. Membuat sebuah aplikasi agenda ini dapat berjalan pada aplikasi bergerak seperti Android Selain

hal

yang

disarankan,

penulis

juga

merasa

perlu

menambahkan : 1. Opsi agenda menjadi agenda pribadi atau agenda terbuka 2. Fitur map untuk lokasi kegiatan agenda 3. Fitur lupa password 3.1.2

Analisa Kebutuhan/ Solusi/ Pengembangan dari Alpikasi Sebelumnya Dari hasil analisa permasalahan di atas, dapat dianalisa untuk

mencari kebutuhna, solusi, dan jalan untuk menyelesaikan permasalahan tersebut. Dari analisa penulis, maka penulis mendapat kesimpulan untuk solusi tersebut yaitu : 1. Membuat variable tambahan untuk waktu kegiatan agenda. Jadi tidak hanya variable waktu mulai agenda tapi juga membuat variable waktu selesai agenda 2. Membuat pilihan waktu tidak hanya jam saja tapi juga menambahkan pilihan menit, sehingga pengguna dapat menentukan waktu menit dari kegiatan


29

3. Membuat aplikasi pendukung pada sistem Android 4. Membuat sebuah tanda pada agenda di mana tanda tersebut merupakan tanda yang menentukan agenda tersebut agenda pribadi atau agenda terbuka sehingga jika agenda tersebut merupakan agenda terbuka, maka pengguna lain dapat melihat dan mendaftar pada agenda tersebut 5. Dengan menggunakan API dari Google Map, penulis dapat memanfaatkannya untuk menambahkan fitur map pada aplikasi ini 6. Menambahkan fungsi lupa password dengan cara pengguna me-input email pengguna dan sistem akan mengirimkan password baru ke email pengguna Tabel 3.1.2 Analisa Kebutuhan dan Solusi Sebelumnya

Pengembangan Solusi

Hanya tanggal mulai

Range waktu pelaksanaan agenda

Membuat variable waktu berupa variable waktu mulai dan variable waktu selesai

Waktu agenda hanya pilihan dalam jam

Detail menit pada waktu agenda

Menambahkan pilihan menit pada form pembuatan agenda

Tidak ada

Agenda Online pada Modile Device

Membuat agenda online pada Android

Tidak ada

Sifat agenda terbuka atau tertutup

Membuat tanda pada agenda, dengan maksud agenda tersebut adalah agenda tertutup atau agenda terbuka

Tidak ada

Map lokasi agenda

Menggunakan API Google Map untuk dapat menampilkan map lokasi agenda

Tidak ada

Lupa password

Membuat form lupa password yang akan membuat acak password baru dan mengirimkan melalui email


30

Setelah mengidentifikasi masalah dan penyelesaian, maka penulis memutuskan bahasa permrograman yang akan diimplementasikan kedalam pembangunan aplikasi agenda online ini adalah bahasa pemrograman PHP framework CodeIgniter dengan model MVC (Model View Controller), MySQL, Java untuk Android serta Client Side Script seperti HTML, CSS dan Javascript. Untuk menggunakan bahasa PHP maka kita perlu meletakan script ini di server Appache. Hal ini untuk mengeksekusi code PHP tersebut sesuai dengan rancangannya. Selain memiliki server untuk menjalankan bahasa PHP tersebut, di server tersebut juga akan memiliki MySQL sebagai basis datanya. Untuk aplikasi Android, kita hanya perlu perancangan agar aplikasi Android tersebut dapat membaca data yang ada pada basis data MySQL. Hal ini mengakibatkan aplikasi ini nantinya juga dapat berjalan pada sistem operasi yang menggunakan Android. 3.2

Perancangan 3.2.1

Perancangan Use Case Diagram Perancangan use case diagram pada aplikasi ini akan menggunakan

dua aktor, yaitu pengguna yang belum terdaftar dan user yang sudah terdaftar. Berikut adalah rancangan use case diagram : a. Guest Berikut adalah gambar use case diagram untuk guest.


31

Pendaftaran

extends

Email Konfirmasi

Konfirmasi Pendaftaran Guest Lupa Password

Gambar 3.2.1 Use Case Guest Tabel 3.2.1 Use Case Description Pendaftaran Nama Use Case

Pendaftaran

Aktor

Guest

Deskripsi

Fungsi untuk pengguna mendaftar dari status tidak terdaftar menjadi terdaftar sehingga dapat menggunakan fungsi lain yang menjadi hak pengguna

Normal course

Users 1.

3.

Sistem

Memilih halaman pendaftaran pengguna 2.

Sistem menampilkan form pendaftaran

4.

Validasi data

Mengisi form pendaftaran dan mengirim ke sistem

5a. Data diterima. Validasi kecocokan password dan pengulangan password 6a. Password sama, maka simpan data pada basis data 7.


Kirim data konfirmasi pendaftaran menggunakan email dan tampilkan pesan „pendaftaran berhasil silahkan cek email‟

32

Lanjutan Tabel 3.2.1 Use Case Description Pendaftaran Normal course

Users

Sistem 5b. Data tidak diterima. Kembalikan pada tampilan form pendaftaran dengan pesan „data tidak valid‟

Alternate Course

6b. Password tidak sama. Kembalikan pada tampilan form pendaftaran dengan pesan „pendaftaran gagal karena password berbeda‟ Pre-Condition

Akses halaman pendaftaran

Post-Condition

Halaman pesan hasil pendaftaran

Assumtion

- Pengguna telah mengetahui alamat pendaftaran - Pengguna telah memiliki email untuk keperluan pendaftaran

Tabel 3.2.2 Use Case Description Konfirmasi Pendaftaran Nama Use case

Konfirmasi Pendaftaran

Aktor

Guest

Deskripsi

Fungsi untuk konfirmasi keaktifan pendaftaran dari pengguna

Normal course

Users 1.

Membuka email

2.

Klik link konfirmasi email

Sistem

3.

Validasi kode konfirmasi

4a. Data diterima. Ubah status pengguna menjadi pengguna aktif


33

Lanjutan Tabel 3.2.2 Use Case Description Konfirmasi Pendaftaran Normal course

Users

Alternate Course

Sistem 5.

Tampilkan halaman login dan persilahkan pengguna untuk login menggunakan username dan password yang telah terdaftar

4b.

Data tidak diterima. Kembalikan pada tampilan form login dengan pesan „kode validasi salah‟

Pre-Condition

Akses email pengguna konfirmasi

Post-Condition

Halaman pesan hasil konfirmasi dan halaman login

Assumtion

- Dapat mengakses email sendiri - Sudah pernah mendaftar di aplikasi ini sebelumnya

Tabel 3.2.3 Use Case Description Lupa Password Nama Use case

Lupa Password

Aktor

Guest

Deskripsi

Fungsi untuk mengirimkan ulang password baru kepada pengguna yang telah lupa password sebelumnya

Normal course

Users 1.

Mengakses halaman lupa password

2.

Memasukkan email pada form lupa password

Sistem

3.

Validasi email

4a. Email ditemukan dan mengirimkan password baru ke email tersebut


34

Lanjutan Tabel 3.2.3 Use Case Description Lupa Password Normal course

Users

Sistem 5.

Tampilkan halaman login dan persilahkan pengguna untuk login menggunakan username dan password yang baru dengan pesan password baru telah dikirim melalui email

4b. Email tidak ditemukan atau belum terdaftar. Tampilkan pesan bahwa email belum terdaftar

Alternate Course

Pre-Condition

Akses halaman lupa password

Post-Condition

Halaman pesan hasil proses dan halaman login

Assumtion

- Dapat mengakses email sendiri


35

b. Users Berikut adalah gambar use case diagram untuk users.

Buat Agenda Pribadi

Email Agenda

extends

Agenda Terbuka

include

extends

include

Email Agenda Terbuka

Lihat Agenda

include Login include

Logout users

Email Perteman

include

extends include Perteman

GroupTeman

include

extends

Email Pemberitahuan Group Email Perubahan Agenda extends Rubah Agenda Milik Sendiri

Gambar 3.2.2 Use Case Users


36

Tabel 3.2.4 Use case Description Login Nama Use Case

Login

Aktor

Guest

Deskripsi

Fungsi untuk masuk ke dalam aplikasi dan menandakan pengguna tersebut adalah pengguna yang berhak

Normal course

Users 1.

3.

Sistem

Membuka aplikasi 2.

Tampilkan form login

4.

Validasi data

Kirim username dan password pada form login

5a. Data cocok. Ciptakan session penanda login pengguna dan tampilkan halaman muka aplikasi 5b. Data tidak cocok. Tampilkan halaman login dengan pesan „login gagal. Username dan password tidak cocok‟

Alternate Course

Pre-Condition

Halaman login aplikasi

Post-Condition

Halaman muka aplikasi

Assumtion

- Pengguna sudah mengetahui cara membuka aplikasi - Sudah pernah mendaftar dan konfirmasi pendaftaran aplikasi


37

Tabel 3.2.5 Use Case Description Lihat Agenda Nama Use Case

Lihat Agenda

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk menampilkan daftar agenda yang akan diikuti dan daftar agenda undangan

Normal course

Users 1.

Sistem

Membuka alamat daftar agenda 2a. Tampilkan daftar agenda yang akan dijalankan dan daftar agenda undangan 2b. Tampilkan pesan bahwa tidak ada agenda

Alternate Course

Pre-Condition

Pengguna sudah yang memiliki sesi login

Post-Condition

Halaman daftar agenda

Assumtion

- Pengguna sudah melakukan login pada aplikasi

Tabel 3.2.6 Use Case Description Buat Agenda Nama Use Case

Buat Agenda

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk membuat sebuah agenda baik itu nantinya menjadi agenda terbuka atau tertutup

Normal course

Users 1.

3.

Sistem

Membuka form agenda baru 2.

Tampilkan form agenda baru

4.

Validasi data

Kirim data agenda baru yang direncanakan


38

Lanjutan Tabel 3.2.6 Use Case Description Buat Agenda Normal course

Users

Sistem 5a. Data cocok. Simpan data agenda baru 6.

Kirim email pemberitahuan untuk merespon undangan agenda

5b. Data tidak cocok. Tampilkan pesan kesalahan

Alternate Course

Pre-Condition

Pengguna sudah yang memiliki sesi login

Post-Condition

Halaman daftar agenda beserta agenda baru

Assumtion

- Pengguna sudah melakukan login pada aplikasi - Pengguna sudah memiliki beberapa teman untuk diundang dalam agenda

Tabel 3.2.7 Use Case Description Ubah Agenda Milik Sendiri Nama Use Case

Ubah Agenda Milik Sendiri

Aktor

Pengguna terdaftar

Deskripsi

Fungsi untuk mengubah elemen yang ada pada agenda menjadi agenda yang sesuai

Normal course

Users 1.

Sistem

Memilih agenda yang akan diubah 2.

3.

Tampilkan form agenda dengan data agenda lama

Kirim data agenda baru yang telah diubah


39

Lanjutan Tabel 3.2.7 Use Case Description Ubah Agenda Milik Sendiri Normal course

Users

Sistem 4.

Validasi data

5a. Data cocok. Simpan data agenda 6.

Kirim email pemberitahuan untuk pemberitahuan perubahan agar pengguna undangan dapat merespon undangan agenda

5b. Data tidak cocok. Tampilkan pesan kesalahan

Alternate Course

Pre-Condition

Daftar agenda milik sendiri

Post-Condition

Halaman daftar agenda beserta agenda baru

Assumtion

- Pengguna sudah melakukan login pada aplikasi - Pengguna sudah memiliki beberapa teman untuk diundang dalam agenda - Pengguna mengetahui agenda yang akan diubah

Tabel 3.2.8 Use Case Description Terima atau Tolak Agenda Undangan Nama Use Case

Terima atau Tolak Agenda Undangan

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk menentukan apakah mengikuti atau menolak sebuah agenda undangan dari pengguna lain

Normal course

Users 1.

Memilih agenda undangan

2.

Pelajari data agenda


Sistem

40

Lanjutan Tabel 3.2.8 Case Description Terima atau Tolak Agenda Undangan Normal course

Users 3.

Sistem

Ambil keputusan untuk agenda 4a. Simpan data agenda disetujui 5a. Kirim email persetujuan kepada pemilik agenda 6a. Tampilkan agenda tersebut dalam kalender agenda 4b. Simpan data agenda ditolak

Alternate Course

5b. Kirim email penolakan kepada pemilik agenda 6b. Tampilkan agenda tersebut dalam daftar agenda ditolak Pre-Condition

Daftar agenda undangan

Post-Condition


Assumtion

- Pengguna sudah melakukan login pada aplikasi - Pengguna memiliki undangan agenda dari pengguna lain


41

Tabel 3.2.9 Use Case Description Agenda Terbuka Nama Use Case

Agenda Terbuka

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk mendaftar pada sebuah agenda terbuka yang dibuat oleh pengguna lain

Normal course

Users 1.

Membuka daftar agenda terbuka

2.

Memilih agenda terbuka yang ingin diikuti

3.

Kirim permintaan mengikuti agenda

Sistem

4.

Simpan data permintaan dan kirim email pemberitahuan kepada pemilik agenda

5a. Kirim email persetujuan kepada pemilik agenda 6a. Tampilkan agenda tersebut dalam kalender agenda 4b. Simpan data agenda ditolak

Alternate Course

5b. Kirim email penolakan kepada pemilik agenda 6b. Tampilkan agenda tersebut dalam daftar agenda ditolak Pre-Condition

Daftar agenda undangan

Post-Condition


Assumtion

- Pengguna sudah melakukan login pada aplikasi - Pengguna memiliki undangan agenda dari pengguna lain


42

Tabel 3.2.10 Use Case Description Pertemanan Nama Use Case

Pertemanan

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk menghubungkan antara satu pengguna dengan pengguna lainnya sehingga dapat membuat sebuah agenda yang sama

Normal course

Users 1.

Membuka daftar pengguna

2.

Memilih pengguna lain yang akan diundang dalam pertemanan

Sistem

3.

Menyimpan data permintaan pertemanan dan mengirim email kepada pengguna lain

4a. Permintaan pertemanan diterima 5a. Menyimpan hasil keputusan pertemanan Alternate Course

4b. Permintaan pertemanan ditolak

Pre-Condition

Daftar pengguna keseluruhan

Post-Condition

Hasil pertemanan

Assumtion

- Pengguna sudah melakukan login pada aplikasi - Terdapat lebih dari 1 pengguna di dalam aplikasi


43

Tabel 3.2.11 Use Case Description Group Pertemanan Nama Use Case

Group Pertemanan

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk membuat sebuah kelompok untuk penggunapengguna yang sudah berteman

Normal course

Users 1.

Membuka form pembuatan group

2.

Kirim data group dan pilihan anggota pengguna dalam group

Sistem

3.

Validasi data

4a. Simpan data group dan kirim email kepada pengguna yang didaftarkan 4b. Kembali ke form group dan tampilkan pesan gagal

Alternate Course

Pre-Condition

Form group pertemanan

Post-Condition

Daftar group yang ada

Assumtion

- Pengguna sudah melakukan login pada aplikasi - Pengguna telah memiliki hubungan teman terhadap pengguna lain


44

Tabel 3.2.12 Use Case Description Logout Nama Use Case

Logout

Aktor

Pengguna Terdaftar

Deskripsi

Fungsi untuk menghapus sesi pengguna dan keluar dari aplikasi

Normal course

Users 1.

Sistem

Klik link logout 2.

Sistem menghapus data sesi pengguna

3.

Tampilkan halaman login

Alternate Course Pre-Condition

Aplikasi

Post-Condition

Form login

Assumtion

- Pengguna sudah melakukan login pada aplikasi

3.2.2

Perancangan Activity Diagram Berdasarkan use case di atas, maka dapat dibuat perancangan

activity diagram untuk aplikasi ini. Dokumentasi perancangan ini akan memudahkan dalam membaca struktur kerja dari sebuah aplikasi.


45

a. Pendaftaran Activity diagram untuk pendaftaran adalah activity diagram yang merupakan diagram untuk guest saat akan mendaftarkan dirinya terhadap aplikasi ini agar dapat menggunakan fasilitas aplikasi. Pendaftaran Guest

System

Isi form pndaftaran

Kirim Emai Kode Konfirmasi

Konfirmasi Kode Pendaftaran

Cek Kode

Apakah Kode Konfirmasi Benar?

Salah

Benar Ubah Status Menjadi User Aktif

Gambar 3.2.3 Activity Diagram Pendaftaran


46

b. Login Untuk activity diagram login ini, pengguna dapat masuk ke dalam sistem dengan mencatatkan sesi dirinya pada aplikasi sehingga aplikasi dapat membaca informasi data pengguna tersebut Login Users

System

Mengisi Form Login

Cek Kecocokan User dan Sandi

Tidak

Apakah Cocok?

Iya

User Login

Gambar 3.2.4 Activity Diagram Login


47

c. Pertemanan Pada activity diagram pertemanan, pengguna akan dapat mengirimkan undangan pertemanan kepada pengguna lain. Sehingga hal ini akan menjadikan pengguna dapat membuat agenda bersama Pertemanan Users

System

Kirim Undangan Pertemanan

Kirim Email Pemberitahuan

Status Menunggu Konfirmasi

Apakah Pertemanan Diterima

Tidak

Status Pertemanan Ditolak Pengguna Tidak dapat membuat agenda bersama

Iya

Status Pertemanan Terhubung Pengguna dapat saling mengundang agenda

Gambar 3.2.5 Activity Diagram Pertemanan


48

d. Pembuatan Group Group hanya untuk pengguna yang telah terhubung sebagai teman. Fasilitas ini akan membuat pengguna dapat membuat group bersama dan saat membuat agenda tidak perlu memilih teman satu persatu sehingga memudahkan pengguna

Group User Users

System

Buat Group

Masukkan Daftar User Kirim Email Kepada Users Undangan

Simpan Daftar User Dalam Group

Gambar 3.2.6 Activity Diagram Pembuatan Group


49

e. Agenda Activity diagram agenda merupakan alur agenda tercipta. Dimana pengguna dapat membuat agenda sendiri atau besama teman. Selain itu, pada agenda ini pengguna dapat menentukan nantinya saat mengisi form agenda sebagai agenda tertutup atau agenda terbuka Agenda Users

System

Isi form agenda

Tunggu konfirmasi peserta belum

Konfirmasi peserta?

sudah

Tolak atau Terima

Terima

Agenda terkonfirmasi semua peserta

Gambar 3.2.7 Activity Diagram Agenda


Tolak

50

f. Mendaftar Pada Agenda Terbuka Pengguna yang terdaftar dapat melihat seluruh agenda terbuka yang dibuat pengguna lain. Pengguna tersebut juga dapat mendaftar pada agenda terbuka tersebut. Walau dapat mendaftar dengan bebas, tapi menjadi hak pemilik agenda untuk memutuskan siapa saja yang dapat mengikuti agenda tersebut Daftar Agenda Terbuka Users

System

Buka Agenda Terbuka

Daftar Agenda

Permintaan Diterima

Tidak

Email Pendaftaran Agenda

Iya

Email Permintaan Dierima

Email Permintaan Ditolak

Gambar 3.2.8 Activity Diagram Daftar Agenda Terbuka


51

g. Logout Setelah menggunakan aplikasi ini, hendaknya pengguna menghapus sesi dirinya untuk menghindari hal-hal yang tidak diinginkan Logout Users

System

Pilih Logout

Hapus Sesi User

Gambar 3.2.9 Activity Diagram Logout 3.2.3

Perancangan Sequence Diagram Setelah mendapat rancangan dari use case diagram dan activity

diagram, maka dapat kita buat sebuah perancangan yang akan menggambarkan interaksi antar object pada tiap waktunya. Perancangan ini adalah perancangan sequence diagram yang akan menjelaskan bagaimana jalannya sebuah fungsi-fungsi aplikasi dalam tiap objectnya. a. Pendaftaran Sequence diagram pada fungsi pendaftaran ini nantinya akan menjelaskan bagaimana pengguna akan melalui tiap objectnya dari waktu ke waktu sehingga dapat mendaftar dan menjadi pengguna yang dapat menggunakan fungsi aplikasi lainnya


52

Form Register

Data Center

Controller Check

Data Entry

users

IsiForm()

PostData()

CheckData() true SimpanData() Data tersimpan KirimEmail()

false

Gambar 3.2.10 Sequence Diagram Pendaftaran b. Login Pada fungsi login, pengguna akan dipaparkan untuk masuk ke dalam aplikasi dan membuat sesi pada aplikasi

users

Form Login

Data Center

Controller

IsiForm() PostData() true

LoadData()

false

Gambar 3.2.11 Sequence Diagram Login


Dashbord

53

c. Pertemanan Sequence

diagram

digambarkan

pada

bagaimana

fungsi

seorang

pertemanan

pengguna

ini,

akan

akan

menjalin

pertemanan terhadap pengguna lain

Daftar Users

Data Center

users

PilihUser() KirimPermintaan() TandaiPermintaan() SimpanKeputusan()

Gambar 3.2.12 Sequence Diagram Pertemanan d. Pembuatan Group Sequence diagram pembuatan group ini akan menampilkan bagaimana alur pembuatan group dari tiap satuan waktunya

Form Group

Data Center

users

IsiForm() SimpanData()

EmailPemberitahuan()

Gambar 3.2.13 Sequence Diagram Pembuatan Group


54

e. Agenda Sequence diagram untuk menggambarkan alur object pembuatan agenda

Form Agenda

Data Center

users

IsiForm() SimpanData() KirimKonfirmasi()

KonfirmasiAgenda()

DaftarAgendaTerbuka() SimpanData()

Gambar 3.2.14 Sequence Diagram Agenda 3.2.4

Perancangan Basis Data Pada perancangan basis data ini, akan dipaparkan dalam tiga

tahapan perancangan. Tahapan ini merupakan tahapan yang berurutan. Hal ini berarti perancangan ini akan dimulai dari tahapan pertama dan berurut ke tahapan selanjutnya. 3.2.4.1 Perancangan Konseptual Perancangan ini adalah perancangan dasar yang tidak dapat langsung diimplementasikan pada aplikasi. Hal ini dikarenakan terdapat relasi many-to-many.


55

Perancangan konseptual untuk basis data aplikasi ini adalah sebagai berikut :

user_pertemanan PK

id_user_pertemanan

FK1

pertemanan id_users UsersPertemanan

1...*

*...1

agenda

users PK

id_users name email

PK

id_agenda

FK1

name waktu tempat id_users

UsersAgenda 1...*

UsersGroup

0...*

0...*

1...*

user_group PK

user_group

FK1

name id_users

Gambar 3.2.15 Perancangan Basis Data Konseptual Pada Gambar 3.2.15 dapat dilihat bahwa perancangan Basis Data Konseptual ini tidak dapat langsung diimplementasikan pada basis data aslinya. Hal ini dikarenakan table-table yang terbentuk adalah table dengan relasi many-to-many artinya table di atas belum dalam bentuk table normal. Table-table yang belum normal di atas adalah table users yang berelasi terhadap table agenda dan table users yang berelasi terhadap table user_group. Jadi tiap data pada table users dapat memiliki lebih dari 1


56

relasi data pada table agenda. Seperti itupula sebaliknya, tiap data agenda dapat memiliki lebih dari 1 data pada table users. Hal inilah yang diperlukan perancangan lanjutan yaitu perancangan logikal untuk membentuk table baru yang akan mengubah relasi many-to-many menjadi relasi one-to-many. 3.2.4.2 Perancangan Logikal Dari

perancangan

konseptual,

maka

dibuatkan

sebuah

perancangan logikalnya. Pada perancangan inilah yang dibuat agar perancangan konseptual dapat diimplementasikan pada basis data nyata. Pada perancangan ini, akan terdapat tabel tambahan untuk memisahkan relasi many-to-many menjadi relasi one-to-many. Berikut adalah gambar dari rancangan logical untuk aplikasi ini : user_pertemanan PK

id_user_pertemanan pertemanan id_users

peserta_agenda

users PK

id_users

PK

id_peserta_agenda

name email

FK2 FK1

id_agenda id_users

agenda_group_users PK

id_agenda_group_users

FK1 FK2

id_users id_agenda_group

agenda_group PK

id_agenda_group name

Gambar 3.2.16 Perancangan Basis Data Logikal


agenda PK

id_agenda

FK1

name waktu tempat id_users

57

Setelah tercipta perancangan logikanya, terlihat bahwa tabel di atas sudah dalam bentuk normal forms. Tabel di atas telah memiliki Primary Key, Foreign Key, dan tabel relasi many-to-many sudah diciptakan tabel relasi sehingga terbentuk tabel relasi one-to-many. 3.2.4.3 Perancangan Fisikal Pada perancangan fisikal, basis data akan terlihat struktur field tiap tabel. Sehingga dapat kita rancang sebuah bentuk nyata dari basis data dan tabel basis data ini nantinya dapat digunakan aplikasi untuk menyimpan data-data kegiatan pada aplikasi. a. Tabel users Tabel user akan digunakan untuk menyimpan data-data pengguna yang terdaftar di aplikasi. Tabel 3.2.13 users pada Basis Data Field

Jenis

Kosong Tidak

Default

id_users

int(11)

Tidak

nama

varchar(25) Tidak

No name

email

varchar(40) Tidak

No email

sandi

varchar(88) Tidak

No password

Ekstra

Indeks

AI

Primary

Unique

b. Tabel user_pertemanan Tabel

ini

adalah

tabel

penyimpan

relasi

pertemanan dari pengguna satu dan pengguna lainnya.


hubungan

58

Tabel 3.2.14 user_pertemanan pada Basis Data Field

Jenis

Kosong Default

id_users_pertemanan

int(11)

Tidak

Tidak

id_users

int(11)

Tidak

NULL

pertemanan

int(11)

Tidak

NULL

Ekstra

Indeks

Auto_increment

Primary Foreign

c. Tabel peserta_agenda Tabel ini adalah tabel yang menyimpan daftar pengguna yang ikut dalam sebuah agenda. Pada tabel ini juga ditampilkan status keputusan pengguna tersebut pada kondisi agendanya. Tabel 3.2.15 peserta_agenda pada Basis Data Field

Jenis

Kosong

Default

id_peserta_agenda

int(11)

Tidak

Tidak

id_users

int(11)

Tidak

NULL

status

tinyint(1)

Tidak

1



Ekstra

Indeks

Auto_increment

Primary Foreign

Status hanya menampilkan 1 sebagai belum direspon, 2 disetujui dan 3 ditolak d. Tabel agenda Tabel ini menyimpan data agenda master yang dibuat oleh pengguna Tabel 3.2.16 agenda pada Basis Data Field

Jenis

Kosong

Default

id_ agenda

int(11)

Tidak

Tidak

nama_agenda

varchar(30)

Tidak

NULL

sifat

tinyint(1)

Tidak

1


Ekstra

Indeks

Auto_increment

Primary

59

Lanjutan Table 3.2.16 agenda pada Basis Data Field

Jenis

Kosong

Default

tanggal_dari

datetime

Tidak

NULL

tanggal_sampai

datetime

Tidak

NULL

lokasi

varchar(100)

Tidak

NULL

koor_x

double

Tidak

NULL

koor_y

double

Tidak

NULL

keterangan

text

Tidak

NULL

id_users

int(11)

Tidak

NULL



Ekstra

Indeks

Foreign

Sifat hanya menampilkan 1 sebagai agenda tertutup dan 2 agenda terbuka e. Tabel agenda_group_users Tiap peserta dalam sebuah group pertemanan akan disimpan disini. Tabel 3.2.17 agenda_group_users pada Basis Data Field

Jenis

Kosong

Default

Ekstra

Indeks

Auto_increment

Primary

id_ agenda _group_users

int(11)

Tidak

Tidak

id_users

int(11)

Tidak

NULL

Foreign

id_agenda_group

int(11)

Tidak

NULL

Foreign

f. Tabel agenda_group Data agenda group yang dibuat oleh pengguna, maka data tersebut akan disimpan pada tabel ini.


60

Tabel 3.2.18 agenda_group pada Basis Data Field

Jenis

Kosong

Default

id_ agenda_group

int(11)

Tidak

Tidak

id_users

int(11)

Tidak

NULL

nama_group

varchar(25)

Tidak

NULL

3.2.5

Ekstra

Indeks

Auto_increment

Primary Foreign

Perancangan User Interface Pada perancangan user Interface akan digambarkan tampilan dari

aplikasi agenda online. Pada aplikasi nantinya akan memiliki 3 menu utama, yaitu Login, Pendaftaran, Home, Agenda, dan Users. Berikut akan ditampilkan gambaran tiap menunya. 3.2.5.1 Login Saat pertama kali membuka aplikasi, pengguna akan diberikan halaman ini. Sebagai halaman pembuka yang akan meminta hak akses terhadap pengguna yang akan menggunakan aplikasi.

LOGO

Email

Sandi

Submit

Gambar 3.2.17 User interface login


61

3.2.5.2 Pendaftaran Jika pengguna yang akan menggunakan aplikasi ternyata pengguna

tersebut

belum

memiliki

hak

akses

untuk

menggunakannya, maka pengguna tersebut harus mendaftar terlebih dahulu. Halaman ini akan menampilkan form untuk pengguna mendaftar ke aplikasi dan nantinya dapat menggunakan aplikasi.

LOGO

Nama

Email

Sandi

Ulangi Sandi

Submit

Gambar 3.2.18 User interface pendaftaran 3.2.5.3 Home Halaman Home hanya memiliki 1 halaman saja. Halaman ini nantinya akan menampilkan tanggal agenda, daftar agenda undangan, daftar agenda terbuka dan daftar agenda ditolak. Halaman ini nantinya membantu pengguna dalam melihat gambaran besar dari agenda-agenda yang akan dijalani.


62

Menu

KelenderAgenda aktifitasyang akan dijalankan

Agenda umum

Agenda undangan

Agenda yang ditolak

Gambar 3.2.19 User interface home 3.2.5.4 Agenda Pada menu agenda ini terdapat menu lainnya juga yang berhubungan dengan agenda. Submenu agenda adalah menu Daftar Agenda dan Buat Baru. a. Daftar Agenda Halaman ini adalah halaman yang akan menampilkan daftar agenda yang dibuat oleh pengguna tersebut.

Menu Daftar Agenda

Gambar 3.2.20 User interface daftar agenda


63

b. Buat Agenda Halaman ini akan menampilkan form agenda yang nantinya akan menjadi jalan pengguna dalam mebuat agenda.

Menu Nama Agenda

Group Peserta

Peserta

Sifat Agenda

Terbuka

Jumlah Peserta Tanggal Dari Tanggal Sampai Lokasi

MAP

Koordinat X

Koordiat Y

Keterangan

Submit

Gambar 3.2.21 User interface create agenda 3.2.5.5 Users Menu ini adalah menu yang akan mengakomodasi kegiatan pengguna dalam pengaturan-pengaturan kegiatan yang berhubungan dengan pengguna lain ataupun diri sendiri. Submenu


64

yang ada di sini adalah Pertemanan, Group Pertemanan, dan Data Diri. a. Pertemanan Halaman ini akan menampilkan daftar pengguna lain yang juga menggunakan aplikasi ini. Nantinya pengguna dapat mencari pengguna lain dan mengundang pengguna tersebut untuk menjalin pertemanan pada aplikasi ini. Pada daftar ini nanti juka akan menampilkan status pertemanan antar pengguna tersebut.

Menu Daftar Users Nama Users Status pertemanan

Gambar 3.2.22 User interface daftar pertemanan b. Group Pertemanan Dalam halaman ini adalah halaman yang akan menampilkan daftar group pertemanan yang pengguna ini miliki. Daftar ini adalah daftar group yang dibuat ataupun group undangan dari pengguna lain. Selain halaman daftar group ini terdapat menu lain yang berfungsi untuk menampilkan form pembuatan group pertemanan.


65

Menu Daftar Group Pertemanan Nama Agenda Pembuat Agenda edit

Buat Group Baru

Gambar 3.2.23 User interface daftar group pertemanan

Menu Nama Group

Peserta

Gambar 3.2.24 User interface form group pertemanan


BAB III ANALISA DAN PERANCANGAN

Recommend Documents