dokumentasi sistem kelompok 1a11

KATA PENGANTAR

Puji syukur kami panjatkan kehadirat Tuhan Yang Maha Esa karena dengan

rahmat, karunia, serta taufik dan hidayah-Nya kami dapat menyelesaikan buku tentang

dokumentasi sistem aplikasi berbasis web dengan tema perancangan system informasi

club motor berbasis web pada N.A.V.C Jakarta ini dengan baik meskipun banyak

kekurangan didalamnya. Dan juga kami berterima kasih pada Bapak Wachyu Hari Haji,

S.Kom, MM selaku Dosen mata kuliah Proyek Pengembangan Sistem Informasi yang

telah memberikan tugas ini kepada kami, Juga kepada Bapak , saudara keluarga besar

club N.A.V.C yang telah banyak membantu dalam perancangan dan pembuata aplikasi

ini.

Kami sangat berharap buku ini dapat berguna dalam rangka menambah wawasan

serta pengetahuan kita tentang bagaimana perancangan sebuah sistem absensi sebuah club

motor. Kami juga menyadari sepenuhnya bahwa di dalam buku ini terdapat kekurangan

dan jauh dari kata sempurna. Oleh sebab itu, kami berharap adanya kritik, saran dan

usulan demi perbaikan buku yang telah kami buat di masa yang akan datang, mengingat

tidak ada sesuatu yang sempurna tanpa saran yang membangun dari para pembaca.

Semoga buku sederhana ini dapat dipahami bagi siapapun yang membacanya.

Sekiranya laporan yang telah disusun ini dapat berguna bagi kami sendiri maupun orang

yang membacanya. Sebelumnya kami mohon maaf apabila terdapat kesalahan kata-kata

yang kurang berkenan dan kami memohon kritik dan saran yang membangun demi

perbaikan di masa depan.

Jakarta, 23 Oktober 2015

Penyusun

Dokumentasi Sistem | Kelompok 1A11 i

DAFTAR ISIKATA PENGANTAR..........................................................................................................i

DAFTAR ISI........................................................................................................................ii

1. PENDAHULUAN...........................................................................................................1

1.1. Latar belakang...................................................................................................1

1.2. Rumusan Masalah..............................................................................................1

2. MODUL-MODUL.......................................................................................................2

3. Design Sistem..................................................................................................................2

3.1 Use Case Diagram......................................................................................................2

3.2. Spesifikasi Usecase Diagram...............................................................................3

4. DESAIN RINCI SYSTEM..............................................................................................6

4.1 Activity Diagram........................................................................................................6

4.1.1. Activity Diagram Input Basis............................................................................6

4.1.2 Activity Diagram Input Member.........................................................................8

4.1.3. Activity Diagram Edit Member.........................................................................9

4.1.4 Acivity Diagram Hapus Member...............................................................10

4.1.5. Activity Diagram Input Absensi......................................................................11

4.1.6. Activity Diagram Mencetak Laporan..............................................................12

4.1.7. Activity Diagram Ubah Data Member.............................................................13

4.1.8 Activity Diagram Lihat Absensi Member.........................................................14

4.2 Sequence Diagram...................................................................................................15

4.2.1. SSD Input Absen..............................................................................................15

4.2.2. SSD CUD Member..........................................................................................16

4.2.3. SSD Cetak Laporan....................................................................................16

4.2.4 SSD Lihat Absensi............................................................................................17

4.2.5. SSD Edit Profil Member..................................................................................17

4.3 Class Diagram..........................................................................................................18

5. Basis Data......................................................................................................................19

5.1 Spesifikasi Basis Data..............................................................................................19

Dokumentasi Sistem | Kelompok 1A11 ii

5.2 Rancangan Kode Pada Basis Data...........................................................................22

6. Rancangan Layar Aplikasi.............................................................................................23

6.1. Site Map Aplikasi...................................................................................................23

6.2 Tampilan Antarmuka...............................................................................................24

6.2.1. Tampilan Home...............................................................................................24

6.2.2 Tampilan Tentang Club....................................................................................25

6.2.3. Tampilan Peraturan Club................................................................................25

6.2.4 Tampilan Galeri Foto........................................................................................26

6.2.5 Tampilan Kontak...............................................................................................26

6.2.6 Tampilan Profil Member...................................................................................27

6.2.7 Tampilan Kehadiran Member...........................................................................27

7. Tampilan Kelola Member.........................................................................................28

7.1. Tampilan Input Member.....................................................................................28

7.2. Tampilan Edit Member.......................................................................................28

7.3. Tampilan Detail Member....................................................................................29

7.4. Tampilan Absensi Member.................................................................................29

8. Laporan..........................................................................................................................30

8.1. Laporan Detail Member..........................................................................................30

8.2. Laporan Kehadiran Member...................................................................................30

9. Penutup.........................................................................................................................31

Dokumentasi Sistem | Kelompok 1A11 iii

1. PENDAHULUAN

1.1. Latar belakang

Dinamika sosial masyarakat di duniat saat ini telah mengalami

perubahan pesat. Hal ini ditandai oleh perkembangan yang sangat pesat

dalam bidang teknologi informasi dan teknologi komunikasi. Hal yang

paling menonjol dalam perkembangan teknologi informasi dan teknologi

komunikasi adalah hadirnya suatu teknologi baru berupa jaringan

computer yang terhubung ke seluruh dunia, yaitu internet.

NAVC Jakarta adalah sebuah komunitas pecinta sepeda motor

gede (moge) khususnya Kawasaki yang berdiri sejak 7 November 2013

dan bermarkas di Kembangan Jakarta Barat. Sampai saat ini NAVC pada

saat berkumpul seluruh anggota maupun pengurus hanya menghafal siapa

saja yang hadir pada hari itu.

Berdasarkan latar belakang diatas,kami ingin merancang dan

membuat sebuah sistem informasi pada NAVC agar lebih modern.

1.2. Rumusan Masalah

Berdasarkan latar belakang diatas, maka dapat dirumuskan suatu

masalah :

1. Bagaimana cara menyediakan informasi club motor ke

masyarakat ?

2. Bagaimana membuat sistem absensi untuk member ?

Dokumentasi Sistem | Kelompok 1A11 1

3. Bagaimana membuat laporan data member dan rekap absensi

pada Club NAVC ?

2. MODUL-MODUL2.1. Modul Login

2.1.1. Login member

2.1.2. Login Admin

2.2. Modul CUD Member

2.3. Modul CUD Basis

2.4. Modul Absensi

2.5. Modul Mengubah Profil

2.6. Modul Melihat Absensi

2.7. Modul Laporan

2.7.1. Laporan Data Member

2.7.2. Laporan Pendaftaran Member

2.7.3. Laporan Absensi Member

3. Design Sistem

3.1 Use Case Diagram

Usecase diagram merupakan suatu aktifitas yang menggambarkan

urutan interaksi antar satu atau lebih actor dan sistem. Usecase yang akan

dirancang yaitu usecase diagram untuk website.

Gambar 2.1 dibawah ini menjelaskan aliran usecase diagram

pengaksesan melalui website.


Gambar 2.1 Usecase Diagram Sistem Informasi Club Berbasis WEB pada

NAVC Jakarta

3.2. Spesifikasi Usecase Diagram

Spesifikasi Membuat Grup/Basis

Actor Admin

Use Case Membuat Grup/Basis

DescriptionAdmin mengakses menu input basis di halaman admin

yang sudah login

Pre

Condition

Sistem menampilkan halaman admin, jika admin

sudah berhasil login


Post

Condiotion

Admin berhasil melakukan akses ke menu input basis

untuk menambahkan basis

Spesifikasi CUD Member

Actor Admin

Use Case CUD Member

DescriptionAdmin mengakses menu input member di halaman

admin yang sudah login

Pre

Condition



Post

Condiotion

Admin berhasil melakukan akses ke menu input

member untuk menambahkan/mengedit/menghapus

member

Spesifikasi Input Absensi

Actor Admin

Use Case Input Absensi

DescriptionAdmin mengakses menu absensi di halaman admin

yang sudah login

Pre

Condition



Post

Condiotion

Admin berhasil melakukan akses ke menu absen

setelah itu pilih Grup/Basis yang akan diabsen

Spesifikasi Mencetak Laporan


Actor Admin

Use Case Mencetak Laporan

DescriptionAdmin mengakses menu Laporan di halaman admin

yang sudah login

Pre

Condition



Post

Condiotion

Admin berhasil melakukan akses ke menu laporan

kemudian pilih laporan yang ingin dicetak

Spesifikasi Mengubah Profil

Actor Member

Use Case Mengubah Profil

DescriptionMember mengakses menu profil di halaman member

yang sudah login

Pre

Condition

Sistem menampilkan halaman member, jika member


Post

Condiotion

Member berhasil melakukan akses ke menu profil

untuk mengubah profil

Spesifikasi Melihat Absen

Actor Member

Use Case Melihat Absen

DescriptionMember mengakses menu kehadiran di halaman

member yang sudah login

Pre Sistem menampilkan halaman member, jika member


Condition sudah berhasil login

Post

Condiotion

Member berhasil melakukan akses ke menu kehadiran

untuk melihat absensi

4. DESAIN RINCI SYSTEM

4.1 Activity Diagram

Activity diagram merupakan alur kerja pada setiap usecase. Activity

diagram pada analisa ini mencakup activity diagram setiap usecase.

4.1.1. Activity Diagram Input Basis

Gambar 2.2.1 Activity Diagram Input Basis


Note :

1. Apabila admin telah masuk login maka admin

langsung memilih menu input basis untuk memasuki halaman menu yang

akan di pilih .

2. Admin setelah login masuk maka admin segera

melakukkan pengisisan data pada form input untuk memberikan suatu

informasi yang akan di adakan untuk kopdar dan informasi-informasi

lainnya.

3. Menyimpan data yang telah diinput, setelah admin

melakukkan sebuah pengisian data suatu acara untuk club maka admin

melakukkan penyimpanan data.

Dokumentasi Sistem | Kelompok 1A11

Pilih Menu Input basis

Mengisi Data Pada Form Input

Basis

Menyimpan Data Yang Sudah dinput

7

4.1.2 Activity Diagram Input Member

Gambar 2.2.2 Activity Diagram Input Member

Note:

1. Input member, sebuah pengisian data pada sebuah member yang

dilakukan oleh admin dimana apabila ada member baru maka admin akan

melakukkan pengisian input member .


Mengisi data pada form input member

8

4.1.3. Activity Diagram Edit Member

Gambar 2.2.3 Activity Diagram Edit Member

Note:

1. Memilih data member untuk diedit, data yang

mengalami kesalahan maka admin mencari atau memilih mana saja data

member yang mengalami kesalahan dalam input data member tersebut.

2. Mengubah data member, admin melakukkan

pengubahan data member yang terjadi kesalah dalam input data member.


Memilih data member untuk

diedit

Mengubah data member

9

4.1.4 Acivity Diagram Hapus Member

Gambar 2.2.4 Activity Diagram Hapus Member

Note:

1. Hapus data member, apabila member telah

mengundurkan dalam club tersebut maka admin akan menghapus member

tersebut dalam club dan menghapus data-data member tersebut.


Memilih data member yang dihapus

10

4.1.5. Activity Diagram Input Absensi

Gambar 2.2.5 Activity Diagram Input Absensi

Note:

1. pemilihan sesuai basis , admin sebelum melakukkan

absensi maka admin bisa melakukan pemilihan tampilan menu halaman absen

berdasarkan basis tersebut.

2. Absen , setelah admin memilih basis absensi maka

admin kemudian melakukan system absensi member yang di panggil satu-persatu

sesuai nama member tersebut apakan hadir atau tidak.


Pilih sesuai basis

Memulai absen

11

4.1.6. Activity Diagram Mencetak Laporan

Gambar 2.2.6 Activity Diagram Mencetak Laporan

Note :

1. Cetak laporan , setelah admin mengisi data dan absensi

member maka admin melakukan pencetakan laporan hasil absensi dan data

lainnya .


Pilih laporan yang ingin dicetak

12

4.1.7. Activity Diagram Ubah Data Member

Gambar 2.2.7 Activity Diagram Ubah Data Member

Note :

1. apabila member mengalami perpindahan tempat tinggal

atau hal lainnya maka admin akan meakukan ubah data member yang lama

menjadi data member yang baru sesuai identitas member tersebut.


Ubah data member

13

4.1.8 Activity Diagram Lihat Absensi Member

Gambar 2.2.7 Activity Diagram Lihat Absesnsi Member

Note :

1. Absensi kehadiran, apabila member ingin megetahui

kehadirannya atau tidak kehadirannya maka member bisa melakukan lihat

absensi member sesuai nama member tersebut.


Pilih menu kehadiran

14

4.2 Sequence Diagram

Sequence diagram adalah representasi dari interaksi-interaksi objek yang

berjalan pada sistem. Dengan menggunakan sequence diagram kita dapat melihat

objek-objek bekerja. Sequence diagram dapat menampilkan bagaimana sistem

merespon setiap kejadian atau permintaan dari user, dapat mempertahankan

integritas internal. Setiap sistem memiliki proses dan setiap proses memiliki dua

kriteria, yaitu proses sederhana dan kompleks.

4.2.1. SSD Input Absen

Gambar 2.3.1 SSD Input Absesnsi


4.2.2. SSD CUD Member

Gambar 2.3.2 SSD CU Member

4.2.3. SSD Cetak Laporan

Gambar 2.3.3 SSD Cetak Laporan


4.2.4 SSD Lihat Absensi

Gambar 2.3.4 SSD Lihat Absensi

4.2.5. SSD Edit Profil Member

Gambar 2.3.5 SSD Edit Profil Member


4.3 Class Diagram

Class Diagram menggambarkan struktur dan deskripsi class,

package dan objek yang saling terhubung.

Gambar 2.4.1 Class Diagram Pada Sistem Informasi Club Berbasis WEB pada

NAVC Jakarta


5. Basis Data

5.1 Spesifikasi Basis DataSpesifikasi basis data merupakan uraian rinci tentang tiap-tiap relasi (tabel atau file).

Berikut adalah spesifikasi basis data dari sistem yang diusulkan.

1) Nama File : Member

Media : Harddisk

Isi : Data Member

Primary Key : kd_member dan kd_basis

Struktur

No Nama Field Jenis/Tipe Data Lebar Desimal Keterangan

1 kd_member Varchar 3 -- Kode Member

2 kd_basis Varchar 5 -- Kode Basis

3 nama_member Varchar 30 -- Nama Member

4 jenis_kelamin Varchar 10 -- Jenis Kelamin Member

5 Alamat Varchar 30 -- Alamat Member

6 domisili Varchar 25 -- Domisili Member

7 tgl_lahir Date -- -- Tanggal Lahir Member

8 tempat_lahir Varchar 15 -- Tempat Lahir Member

9 email Varchar 5 -- Email Member

10 no_telepon Varchar 12 -- Nomor Telepon

Member

11 username Varchar 10 -- Username Member

12 password Varchar 10 -- Password Member

Tabel 3-1 Member

2) Nama File : Pendaftaran

Media : Harddisk

Isi : Pendaftaran Member

Primary Key : id_pendaftaran dan kd_member


Struktur


1 id_pendaftaranVarchar

5 Id Pendaftaran

Member


3 tanggal_pendaftaranDate

-- -- Tanggal Pendaftaran

Member

Tabel 3-2 Pendaftaran Member

3) Nama File : Admin

Media : Harddisk

Isi : Data Admin

Primary Key : id_admin

Struktur


1 id_admin Varchar 5 Id Admin

2 nama_admin Varchar 30 -- Nama Admin

3 email Varchar 25 -- Email Admin

4 username Varchar 10 -- Username Admin

5 password Varchar 10 -- Password Admin

Tabel 3-3 Data Admin

4) Nama File : Absensi

Media : Harddisk

Isi : Input Absensi Member

Primary Key : kd_member dan kd_basis

Struktur





3 tgl_kehadiran Date -- -- Tanggal Absesnsi Member

4 hadir Int 5 -- Kehadiran Member

5 alpha Int 5 -- Ketidak hadiran Member

6 selesai Varchar 5 -- Menyudahi absensi Member

Tabel 3-4 Input Absensi Member

5) Nama File : Basis

Media : Harddisk

Isi : Data Basis

Primary Key : kd_basis

Struktur



2 nama_basis Varchar 30 -- Nama Basis


6) Nama File : Kritik dan Saran

Media : Harddisk

Isi : Kritik dan Saran

Primary Key : kd_ks

Struktur


1 kd_ks Varchar 5 -- Kode Kritik dan Saran

2 nama_lengkap Varchar 30 -- Nama Lengkap Penulis KS

3 email Varchar 30 -- Alamat Email Penulis KS

4 pesan Varchar 255 -- Isi dari Kritik dan Saran

5 waktu Date -- -- Kapan Kritik dan Saran di


masukkan


5.2 Rancangan Kode Pada Basis Data

1) Rancangan Kode : kd_member 001, 002, 003……999

3 digit merupakan nomor urut kode member

2) Rancangan Kode : id_pendaftaran (4digit) P001…P999

1 digit pertama “P” singkatan dari pendaftaran

3 digit terakhir nomor urut pendaftaran

3) Rancangan Kode : id_admin (4digit) A001..A999

1 digit pertama “A” singkatan dari admin

3 digit terakhir nomor urut admin

4) Rancangan Kode : id_basis (4digit) B001 = Basis Cengkareng

1 digit pertama “B” merupakan singkatan basis

3 digit terakhir merupakan nomor basis yang sudah ditetapkan


6. Rancangan Layar Aplikasi

6.1. Site Map Aplikasi

Gambar 5.1.1 Rancangan SI NAVC Jakarta

Gambar 5.1.2 Rancangan SI NAVC Jakarta member sudah login


Sistem Informasi

Club Motor NAVC Jakarta

HomeAbout Us

Galeri LoginContact

Login Admin

Login member

Sistem Informasi


(Member)

HomeProfil

Absensi GaleriPeraturan Logout

23

Gambar 5.1.3 Rancangan SI NAVC Jakarta pada halaman admin

6.2 Tampilan Antarmuka

6.2.1. Tampilan Home


Sistem Informasi


(Admin)

Input MemberKelola Member

Absensi LaporanKelola Basis

Lap. Member

Lap. Absensi

Logout

Input Basis

Edit Basis

Hapus Basis

Edit Member

Hapus Member

Detail Member

24

6.2.2 Tampilan Tentang Club

6.2.3. Tampilan Peraturan Club


6.2.4 Tampilan Galeri Foto

6.2.5 Tampilan Kontak


6.2.6 Tampilan Profil Member

6.2.7 Tampilan Kehadiran Member


7. Tampilan Kelola Member

7.1. Tampilan Input Member

7.2. Tampilan Edit Member


7.3. Tampilan Detail Member

7.4. Tampilan Absensi Member


8. Laporan

8.1. Laporan Detail Member

8.2. Laporan Kehadiran Member


9. Penutup

Demikian yang dapat kami paparkan beberapa informasi mengenai karya

ilmiah yang menjadi pokok bahasan dalam mata kuliah Perancangan

Pengembangan Sistem Informasi (PPSI) dijurusan sistem informasi yang kami

ambil, tentunya masih banyak kekurangan dan kelemahannya, kerena terbatasnya

pengetahuan dan waktu pengerjaan yang dimiliki.

Penulis berharap para pembaca yang budiman sudi memberikan kritik dan

saran yang membangun kepada penulis demi sempurnanya karya tulis dan karya

lainnya di kesempatan-kesempatan berikutnya. Semoga karya tulis ini berguna

bagi penulis pada khususnya juga para pembaca yang budiman pada umumnya.


Profil Penulis

1. NIM : 41812010006

Nama : Suhendra Wijaya

Program Studi : Sistem Informasi

Fakultas : Ilmu Komputer

Universitas : Universitas Mercu Buana Jakarta

2. NIM : 41812010020

Nama : Ardy Tri Widiyanto




3. NIM : 41812010037

Nama : Sefty Mubaroq




4. NIM : 41812010038

Nama : Ali Sofi Al Habibi





dokumentasi sistem kelompok 1a11

Documents