BAB 3 ANALISIS DAN PERANCANGAN 3.1 Latar Belakang ...thesis.binus.ac.id/doc/Bab3/2009-2-00199-IF BAB...

37

BAB 3

ANALISIS DAN PERANCANGAN

3.1 Latar Belakang Perusahaan

3.1.1 Riwayat Singkat Perusahaan

P.T. Tunas Tangkas Primaraga Sakti sebelumnya bernama P.T. Bima

Tangkas Bakti, didirikan di Jakarta pada tanggal 31 Agustus 1983. Perusahaan

ini bergerak di bidang jasa olahraga. Perusahaan ini menggunakan sistem

membership (keanggotaan) untuk mendapatkan pelanggan dan sekaligus untuk

mendapatkan keuntungan.

Fasilitas olahraga yang disediakan oleh perusahaan P.T. Tunas Tangkas

Primaraga Sakti saat ini adalah 9 lapangan badminton, 6 lapangan tenis, 2 kolam

renang, fitness, aerobics, futsal, tenis meja, sauna, yoga, aikido, taekwondo, dan

hot shower. Semua fasilitas di atas bisa digunakan oleh para anggota atau

member dan beberapa fasilitas untuk non-anggota atau non-member.

Anggota mendapatkan berbagai keuntungan dibandingkan dengan non-

anggota, di antaranya dengan mendapatkan akses sepenuhnya terhadap semua

fasilitas yang ada di dalam perusahaan. Selain itu, anggota juga mendapatkan

potongan harga (diskon) di berbagai tempat yang bekerja sama dengan

perusahaan.

Jenis membership yang ada di P.T. Tunas Tangkas Primaraga Sakti yaitu:

1. Membership Single: Keanggotaan untuk siapa saja yang ingin menjadi

member seorang diri.

2. Membership Mahasiswa: Keanggotaan untuk para mahasiswa.

38

3. Membership Pelajar: Keanggotaan untuk para pelajar.

4. Membership Family: Keanggotaan untuk suami, istri, dan anak kandung

berusia kurang dari 21 tahun.

5. Membership Couple: Keanggotaan untuk 2 orang dewasa yang belum

menikah dan berusia kurang dari 30 tahun.

Perusahaan ini juga memiliki berbagai pelatihan bagi para anggota yang

ingin melakukan pelatihan olahraga. Pelatihan yang disediakan di sini yaitu

pelatihan bulutangkis, tenis, renang, aikido, tae kwon do, dan yoga.

3.1.2 Visi dan Misi Perusahaan

Adapun visi dari PT. Tunas Tangkas Primaraga Sakti adalah menjadi

perusahaan jasa olahraga yang terkemuka di Indonesia. Selain itu PT. Tunas

Tangkas Primaraga Sakti juga memiliki misi perusahaan, antara lain membuat

fasilitas olahraga yang dibutuhkan oleh siapa saja yang ingin melakukan kegiatan

olahraga dan sesuai dengan lingkungan sekitarnya, mencari anggota sebanyak-

banyaknya, dan mengembangkan bisnis perusahaan untuk memenuhi keinginan

pihak-pihak yang terkait (stakeholders).

3.1.3 Struktur Organisasi Perusahaan

Untuk mengakomodasi tuntutan bisnis dan aspek legal, manajemen

perusahaan PT. Tunas Tangkas Primaraga Sakti menggunakan struktur

organisasi yang disusun berdasarkan kebutuhan internal perusahaan agar bisnis

yang dijalankannya dapat lebih fokus dan saling menunjang. Berikut ini adalah

struktur organisasi PT. Tunas Tangkas Primaraga Sakti:

39

Direktur

General Manager

Marketing Finance Operasional Personalia / HRD

Membership

Promotion

Bidang Ekstrakurikuler

Kasir

Pembukuan

Administrasi Pembukuan

Fasilitas

Maintenance

Cleaning Service

Security

Administrasi Personalia

Gambar 3.1 Struktur Organisasi PT. Tunas Tangkas Primaraga Sakti

3.1.4 Tugas dan Wewenang

Berikut ini adalah tugas dan wewenang dari masing-masing jabatan yang

ada di PT. Tunas Tangkas Primaraga Sakti:

1. Director

Tugas dan wewenang dari Director adalah sebagai pemimpin dari

perusahaan yang mengontrol seluruh kegiatan perusahaan dan

40

menentukan kebijakan perusahaan, mengembangkan perusahaan baik dari

segi fasilitas maupun keanggotaannya, mencari partnership atau investor

untuk bekerja sama memberikan permodalan tambahan, dan mengambil

keputusan-keputusan penting yang berhubungan dengan kemajuan

perusahaan.

2. General Manager

Tugas dan wewenang dari General Manager adalah sebagai wakil dari

Director (terutama ketika Director tersebut sedang berhalangan tugas),

mengontrol dan mengawasi pekerjaan semua bagian yang ada di

bawahnya, dan membantu Director dalam mengambil keputusan.

3. Marketing

Tugas dan wewenang dari bagian Marketing adalah mencari anggota baru

dengan cara mempromosikan perusahaan dan tetap memberikan

pelayanan yang terbaik kepada anggota lama, merencanakan dan

membuat program-program pelayanan terhadap anggota (misalnya

program diskon kepada anggota berdasarkan syarat-syarat tertentu), dan

melakukan negosiasi dengan perusahaan iklan yang ingin melakukan

promosi di perusahaan.

4. Financial

Tugas dan wewenang dari bagian Financial adalah mengelola data

keuangan perusahaan, memeriksa masa berakhirnya anggota dan

membuat surat pemberitahuan masa berakhir anggota untuk segera

dilakukan registrasi ulang, mengurus gaji karyawan, dan membuat

laporan keuangan untuk GM.

41

5. Operational

Tugas dan wewenang dari bagian Operational adalah memelihara

fasilitas-fasilitas yang ada di dalam perusahaan, membina hubungan yang

baik dengan anggota-anggota, menerima saran dan kritik dari anggota-

anggota untuk mengetahui kelebihan dan kekurangan dari perusahaan,

dan mengatur segala hal yang berhubungan dengan keamanan

perusahaan.

6. HRD

Tugas dan wewenang dari bagian HRD adalah merekrut pegawai baru

sesuai dengan keahlian dan spesifikasi yang dibutuhkan, mengadakan

pelatihan-pelatihan terhadap karyawan-karyawan baik secara internal

maupun eksternal, dan memberhentikan karyawan sesuai dengan

kebijaksanaan perusahaan.

3.2 Analisis Sistem

3.2.1 Analisis Wawancara

Untuk mendukung analisis pada studi kasus ini, kami melakukan

wawancara dengan Manager Keuangan PT. Tunas Tangkas Primaraga Sakti.

Wawancara yang dilakukan untuk mendukung analisis tersebut antara lain:

42

Tabel 3.1 Draft Wawancara

Wawancara

Nama : Bapak Hendro

Jabatan : Manager Keuangan

Tanggal Wawancara : 10 April 2009

Waktu : Pukul 13:00 WIB

Daftar Pertanyaan :

1) Bagaimana sistem informasi manajemen keanggotaan yang sedang

berjalan pada PT. Tunas Tangkas Primaraga Sakti?

Jawab:

Sistem yang kami gunakan belum terkomputerisasi atau masih secara

manual.

2) Kendala apa saja yang dihadapi pada sistem manual yang sedang berjalan?

Jawab:

Kendala yang kami hadapi pada sistem manual yaitu kami kesulitan dalam

mengolah dan menyajikan data anggota yang menghambat keefisienan dan

efektivitas kerja pada perusahaan kami.

3) Perubahan apa yang anda harapkan terhadap sistem informasi manajemen

keanggotaan yang sedang berjalan?

43

Jawab:

Kami ingin sistem yang ada bisa lebih memudahkan kami dalam

mengolah dan menyajikan data anggota.

4) Bagaimana pendapat anda dengan sistem informasi manajemen

keanggotaan yang berbasis web?

Jawab:

Hal itu sangat baik sekali karena dapat menjadikan karyawan bekerja lebih

efektif dalam menyajikan laporan dan mengolah data anggota dan juga

anggota dengan mudah mendapatkan informasi melalui internet.

5) Fitur apa saja yang diperlukan dalam website tentang perusahaan ini

nantinya?

Jawab:

Kami mengharapkan dalam website itu nanti terdapat fitur-fitur seperti

pendaftaran anggota baru, pemesanan tempat dan waktu olahraga bagi

anggota, dan informasi mengenai masa keanggotaan.

3.2.2 Analisis Kuesioner

Kuesioner yang kami bagikan terdapat 30 buah yang ditujukan kepada

anggota-anggota olahraga dalam perusahaan, dimana di dalam kuesioner tersebut

44

terdapat 8 buah pertanyaan. Adapun pertanyaan-pertanyaan yang terdapat di

dalam kuesioner tersebut adalah sebagai berikut:

1. Sudah berapa lama anda menjadi anggota di sini?

a. < 1 tahun 15%

b. 1-2 tahun 37%

c. 2-3 tahun 25%

d. > 3 tahun 23%

Gambar 3.2 Diagram Hasil Kuesioner Pertanyaan No. 1

2. Apakah anda bisa menggunakan internet?

a. Ya 85%

b. Tidak 15%

45


3. Seberapa mudah anda mendapatkan informasi mengenai keanggotaan anda?

a. Mudah 18%

b. Biasa 28%

c. Sulit 54%


46

4. Bagaimana cara anda mendapatkan informasi mengenai keanggotaan anda?

a. Menanyakan kepada admin melalui telepon 45%

b. Menanyakan kepada admin secara langsung 55%

c. Mencari ke internet 0%


5. Apakah anda membutuhkan sebuah aplikasi yang dapat memudahkan dan

membantu anda dalam mendapatkan informasi mengenai keanggotaan anda?

a. Ya 75%

b. Tidak 25%

47


6. Apakah anda pernah mendengar dan mengetahui mengenai aplikasi

berbasiskan web?

a. Ya 64%

b. Tidak 36%


7. Jika ya, apakah anda tertarik dalam menggunakan sebuah aplikasi berbasis

web?

a. Ya 79%

b. Tidak 21%

48


8. Menurut anda, apakah dengan adanya suatu aplikasi web mengenai

keanggotaan dapat membantu dalam mendapatkan informasi yang anda

butuhkan?

a. Sangat membantu 36%

b. Cukup membantu 40%

c. Biasa saja 18%

d. Tidak membantu 6%

e. Sangat tidak membantu 0%


49

3.2.3 Sistem yang Sedang Berjalan

Adapun sistem yang sedang berjalan pada PT. Tunas Tangkas Primaraga

Sakti berkaitan dengan manajemen keanggotaannya adalah sebagai berikut:

1. Sistem pendaftaran anggota baru

• Pendaftaran dilakukan di kasir.

• Pembayaran dilakukan segera setelah pendaftaran selesai.

2. Sistem pembayaran

• Pembayaran dilakukan di kasir.

• Kasir menyimpan hasil pembayaran ke kasir besar.

• Kasir besar memeriksa hasil pembayaran tersebut dan

memasukkannya ke bagian administrasi anggota.

• Administrasi anggota membukukannya ke dalam komputer.

3. Sistem pemesanan tempat dan waktu olahraga (booking)

• Booking dapat dilakukan melalui telepon ataupun melalui resepsionis.

4. Sistem absensi anggota

• Anggota memberikan kartu anggotanya ke resepsionis dan ditukarkan

dengan kartu deposit.

• Resepsionis mencatat kehadiran anggota tersebut ke dalam buku

besar.

5. Sistem promosi

• Promosi dilakukan melalui media cetak.

50

3.2.4 Identifikasi Permasalahan

Setelah dilakukan analisis terhadap sistem yang sedang berjalan pada PT.

Tunas Tangkas Primaraga Sakti, didapat permasalahan sebagai berikut:

• Pencarian data anggota masih dilakukan secara satu per satu.

• Tidak dapat melihat secara langsung anggota-anggota yang akan berakhir

masa keanggotaannya.

• Kesulitan dalam memantau anggota-anggota yang sudah keluar atau

habis masa keanggotaannya.

3.2.5 Usulan Pemecahan Masalah

Berdasarkan permasalahan-permasalahan yang telah didapat, diajukan

usulan pemecahan masalah sebagai berikut:

• Membuat suatu aplikasi yang dapat menunjang sistem informasi

manajemen keanggotaan perusahaan secara penuh.

• Merancang dan membuat sistem basis data agar data dapat terorganisasi

dengan rapi dan lebih mudah diperbarui serta mempercepat dalam proses

pencarian data.

51

3.3 Perancangan Sistem

3.3.1 Class Diagram

+insert()+delete()

-Tanggal-Jam-Jenis Member-Kode Member-Username

Absence

+insert()+delete()

-Kode Booking-Tempat-Tanggal-Jam-Jenis Member-Kode Member-Username

Booking

+insert()+update()+delete()

-Kode Anggota-Nama-Gender-Tempat Lahir-Tanggal Lahir-Pekerjaan-Username

Child

+insert()+delete()

-ID-Email-Komentar

Comment


-ID-Image-Keterangan

Gallery


-Username-Password-Nama-Gender-Tempat Lahir-Tanggal Lahir-Gol Darah-Alamat-Telp-HP-No Pengenal-Email-Status-Kewarganegaraan-Agama-Pekerjaan-Nama Perusahaan-Alamat Perusahaan-Telp Perusahaan-Fax Perusahaan-Bidang Usaha-Jenis Member-Kode Member-Image

Member


-Tanggal-Jam-Judul-Berita

News


-Username-Nama-Tempat Lahir-Tanggal Lahir-Pekerjaan

Spouse


-Username-Nama-Gender-Tempat Lahir-Tanggal Lahir-No Pengenal-Alamat-Telp-HP-Kewarganegaraan-Agama

Partner

+insert()+delete()

-Kode Pembayaran-Tanggal-Jam-Uang Pangkal-Iuran-Jenis Member-Kode Member-Username

Payment


-Username-Nama-Alamat-Telp-Fax

School


-Jenis Member-Kode Member-Tanggal Awal-Tanggal Akhir-Username

Membership

+insert()+delete()

-Username-Jenis Member-Masa-Tanggal

Temp

1 0..*

1

0..*

1

0..*

1

0..*

1

0..1

1

0..1

1

0..*

1

0..11

0..1

Gambar 3.10 Class Diagram

52

3.3.2 Use Case Diagram

Use Case merupakan representasi dari proses bisnis yang ada pada

sistem. Use Case diagram merupakan model yang menunjukkan hubungan

antara aktor dengan use case.

Gambar 3.11 Aktor pada Use Case

Aktor adalah entiti di luar sistem yang berinteraksi dengan sistem. Aktor-

aktor tersebut adalah:

1. Guest adalah pengguna yang bertindak sebagai tamu / pendatang di

dalam sistem dan dapat menggunakan sebagian dari subsistem promosi.

2. Member adalah pengguna yang bertindak sebagai anggota olahraga

dalam perusahaan dan dapat menggunakan beberapa subsistem yang ada

di dalam perusahaan.

3. Admin adalah pengguna yang berwenang untuk melakukan pengaturan-

pengaturan di dalam sistem.

53

Gambar 3.12 Use Case Subsistem Registrasi

54

Gambar 3.13 Use Case Subsistem Administrasi Member

55

Gambar 3.14 Use Case Subsistem Booking

56

Gambar 3.15 Use Case Subsistem Absensi

57

Gambar 3.16 Use Case Subsistem Pembayaran

58

Gambar 3.17 Use Case Subsistem Promosi

59

3.3.3 Sequence Diagram

Gambar 3.18 Sequence Member Login

Member

Logout GUI

pilih link

Login Pagesession destroy

Gambar 3.19 Sequence Member Logout

60

Gambar 3.20 Sequence Admin Login

Gambar 3.21 Sequence Admin Logout

61

Guest

Add Comment GUI

pilih link

Form Add Comment GUI

input form comment

Result

Error Message

MsComment

insert Comment

Comment Inserted

validasi

Gambar 3.22 Sequence Guest Add Comment

Gambar 3.23 Sequence Member Add General Data

62

Member

Add Family Data GUI

pilih link

Form Add Spouse GUI

input form spouse data

Result

Error Message

MsSpouse

insert Spouse Data

Spouse Inserted

validasi

MsChild

Result

Child Inserted

Add Spouse GUI

pilih link

Result

Add Child GUI Form Add Child GUI

pilih link

input form child data

validasiResult

Error Message insert Child Data

Gambar 3.24 Sequence Member Add Family Data

Gambar 3.25 Sequence Member Add Partner Data

63

Member

Add School Data GUI

pilih link

Form Add School DataGUI

input form school data

Result

Error Message

MsSchool

insert School Data

School Data Inserted

validasi

Gambar 3.26 Sequence Member Add School Data

Gambar 3.27 Sequence Member Show Profile

64

Gambar 3.28 Sequence Member Edit Profile dan Change Password

Member

Booking GUI

pilih link

Form Booking GUI

input form booking

Result

Error Message

MsBooking

insert Booking

Booking Inserted

validasi

Gambar 3.29 Sequence Member Add Booking

65

Gambar 3.30 Sequence Member View Confirmation

Gambar 3.31 Sequence Admin Search, View, dan Delete Absence

66

Gambar 3.32 Sequence Admin Search, View, dan Delete Booking

Gambar 3.33 Sequence Admin Search, View, dan Delete Comment

67

Gambar 3.34 Sequence Admin Search, View, dan Delete General Data

Admin

Search Payment GUI

pilih link

Payment

search Payment

Result

Error Message

delete Payment

MsPaymentView Payment GUI

view Payment

Result

Payment Deleted

Show Payment

Gambar 3.35 Sequence Admin Search, View, dan Delete Payment

68

Gambar 3.36 Sequence Admin Search, View, dan Delete Member Property

Gambar 3.37 Sequence Admin Add Absence

69

Gambar 3.38 Sequence Admin Activate Member

Gambar 3.39 Sequence Admin Extend Member

70

Gambar 3.40 Sequence Admin Search, View, Edit, dan Delete News

71

Admin

Search Gallery GUI

pilih link

Gallery

search Gallery

Result

Error Message

delete Gallery

MsGalleryView Gallery GUI

view Gallery

Result

Gallery Updated

Show Gallery

Form Edit Gallery GUI

isi form edit gallery

Edit Gallery GUI

klik button

validasiValidation Result

Error Message

edit Gallery

Result

Result

Gallery Deleted

Gambar 3.41 Sequence Admin Search, View, Edit, dan Delete Gallery

72

Gambar 3.42 Sequence Admin Add News

Gambar 3.43 Sequence Admin Add Gallery

73

3.3.4 Statechart Diagram

Gambar 3.44 Statechart Admin Delete Absence

Gambar 3.45 Statechart Admin Add Absence

Waiting/ pilih booking / delete OK

Konfirmasi/ delete booking

/ cancel delete

Gambar 3.46 Statechart Admin Delete Booking

Gambar 3.47 Statechart Member Add Booking

74

Gambar 3.48 Statechart Admin Delete Payment

Gambar 3.49 Statechart Admin Add Payment

Waiting/ pilih member / delete OK

Konfirmasi/ delete member

/ cancel delete

Gambar 3.50 Statechart Admin Delete Member

Gambar 3.51 Statechart Member Add Member

75

Gambar 3.52 Statechart Member Edit Member

Gambar 3.53 Statechart Member Add Registration Data

Gambar 3.54 Statechart Member Add Spouse Data

Spouse/ edit spouse / update OK

Konfirmasi/ update spouse

/ cancel update/ waiting

Gambar 3.55 Statechart Member Edit Spouse Data

76

Gambar 3.56 Statechart Member Add Child Data

Child/ edit child / update OK

Konfirmasi/ update child


Gambar 3.57 Statechart Member Edit Child Data

Gambar 3.58 Statechart Member Add Partner Data

Partner/ edit partner / update OK

Konfirmasi/ update partner


Gambar 3.59 Statechart Member Edit Partner Data

77

Gambar 3.60 Statechart Member Add School Data

School/ edit school / update OK

Konfirmasi/ update school


Gambar 3.61 Statechart Member Edit School Data

Gambar 3.62 Statechart Admin Delete Membership Data

Waiting/ pilih comment / delete OK

Konfirmasi/ delete comment

/ cancel delete

Gambar 3.63 Statechart Admin Delete Comment

78

Gambar 3.64 Statechart Guest Add Comment

Gambar 3.65 Statechart Admin Delete News

Gambar 3.66 Statechart Admin Add News

Gambar 3.67 Statechart Admin Edit News

79

Gambar 3.68 Statechart Admin Delete Gallery

Gambar 3.69 Statechart Admin Add Gallery

Gambar 3.70 Statechart Admin Edit Gallery

80

3.3.5 Perancangan Basis Data

MsAbsence

PK TanggalPK Jam

JenisMemberKodeMember

FK1 Username

MsBooking

PK KodeBooking

TempatTanggalJamJenisMemberKodeMember

FK1 Username

MsChild

PK KodeAnggota

NamaGenderTempatLahirTanggalLahirPekerjaan

FK1 Username

MsComment

PK ID

EmailKomentar

MsGallery

PK ID

ImageKeterangan

MsMember

PK Username

PasswordNamaGenderTempatLahirTanggalLahirGolDarahAlamatTelpHPNoPengenalEmailStatusKewarganegaraanAgamaPekerjaanNamaPerusahaanAlamatPerusahaanTelpPerusahaanFaxPerusahaanBidangUsahaJenisMemberKodeMemberImage

MsNews

PK TanggalPK Jam

JudulBerita

MsSpouse

PK,FK1 Username

NamaTempatLahirTanggalLahirPekerjaan

MsPartner

PK,FK1 Username

NamaGenderTempatLahirTanggalLahirNoPengenalAlamatTelpHPKewarganegaraanAgama

MsPayment

PK KodePembayaran

TanggalJamUangPangkalIuranJenisMemberKodeMember

FK1 Username

MsSchool

PK,FK1 Username

NamaAlamatTelpFax

MsMembership

PK JenisMemberPK KodeMember

TanggalAwalTanggalAkhir

FK1 Username

MsTemp

PK,FK1 Username

JenisMemberMasaTanggal

Gambar 3.71 Model Data ERD

81

Gambar 3.72 Tabel MsMember

Tabel ini digunakan untuk menyimpan data anggota / member yang

terdaftar pada PT. Tunas Tangkas Primaraga Sakti.

Tabel 3.2 Definisi Tabel MsMember

No. Nama Field Tipe Data Keterangan

1. Username Varchar(20) Username dari member untuk login

2. Password Varchar(40) Password dari member untuk login

3. Nama Varchar(50) Nama member

4. Gender Varchar(10) Jenis kelamin member

5. TempatLahir Varchar(30) Tempat lahir member

82

6. TanggalLahir Date Tanggal lahir member

7. GolDarah Varchar(2) Golongan darah member

8. Alamat Text Alamat tempat tinggal member

9. Telp Varchar(20) Nomor telepon member yang dapat

dihubungi

10. HP Varchar(20) Nomor ponsel member yang dapat

dihubungi

11. NoPengenal Varchar(20) Nomor KTP / SIM / Passport member

12. Email Varchar(50) Alamat E-mail member

13. Status Varchar(20) Status member

14. Kewarganegaraan Varchar(3) Kewarganegaraan member

15. Agama Varchar(20) Agama member

16. Pekerjaan Varchar(30) Pekerjaan member

17. NamaPerusahaan Varchar(50) Nama perusahaan tempat member

bekerja

18. AlamatPerusahaan Text Alamat perusahaan tempat member

bekerja

19. TelpPerusahaan Varchar(20) Nomor telepon perusahaan tempat

member bekerja

20. FaxPerusahaan Varchar(20) Nomor fax perusahaan tempat

member bekerja

21. BidangUsaha Varchar(20) Bidang usaha perusahaan tempat

member bekerja

83

22. JenisMember Varchar(2) Jenis member yang sedang aktif

23. KodeMember Char(5) Kode member yang sedang aktif

24. Image Varchar(100) Letak direktori gambar dari member

MsSpouse

PK,FK1 Username

NamaTempatLahirTanggalLahirPekerjaan

Gambar 3.73 Tabel MsSpouse

Tabel ini digunakan untuk menyimpan data suami / istri dari member.

Tabel 3.3 Definisi Tabel MsSpouse


1. Username Varchar(20) Username dari tabel MsMember

2. Nama Varchar(50) Nama suami / istri

3. TempatLahir Varchar(30) Tempat lahir suami / istri

4. TanggalLahir Date Tanggal lahir suami / istri

5. Pekerjaan Varchar(30) Pekerjaan suami / istri

84

Gambar 3.74 Tabel MsChild

Tabel ini digunakan untuk menyimpan data anak-anak dari member.

Tabel 3.4 Definisi Tabel MsChild


1. KodeAnggota Int(11) Kode unik untuk setiap record

2. Nama Varchar(50) Nama anak

3. Gender Varchar(10) Jenis kelamin anak

4. TempatLahir Varchar(30) Tempat lahir anak

5. TanggalLahir Date Tanggal lahir anak

6. Pekerjaan Varchar(30) Pekerjaan anak


85

Gambar 3.75 Tabel MsPartner

Tabel ini digunakan untuk menyimpan data partner dari member.

Tabel 3.5 Definisi Tabel MsPartner



2. Nama Varchar(50) Nama partner

3. Gender Varchar(10) Jenis kelamin partner

4. TempatLahir Varchar(30) Tempat lahir partner

5. TanggalLahir Date Tanggal lahir partner

6. NoPengenal Varchar(20) Nomor KTP / SIM / Passport partner

7. Alamat Text Alamat tempat tinggal partner

8. Telp Varchar(20) Nomor telepon partner yang dapat

dihubungi

9. HP Varchar(20) Nomor ponsel partner yang dapat

dihubungi

10. Kewarganegaraan Varchar(3) Kewarganegaraan partner

86

11. Agama Varchar(20) Agama partner

Gambar 3.76 Tabel MsSchool

Tabel ini digunakan untuk menyimpan data sekolah / universitas tempat

member belajar.

Tabel 3.6 Definisi Tabel MsSchool



2. Nama Varchar(50) Nama sekolah tempat member belajar

3. Alamat Text Alamat sekolah tempat member belajar

4. Telp Varchar(20) Nomor telepon sekolah yang dapat

dihubungi

5. Fax Varchar(20) Nomor fax sekolah yang dapat

dihubungi

87

Gambar 3.77 Tabel MsMembership

Tabel ini digunakan untuk menyimpan data properti member untuk jenis

member Single, Family, Couple, Mahasiswa, dan Pelajar.

Tabel 3.7 Definisi Tabel MsMembership


1. JenisMember Varchar(2) Jenis member yang telah dipilih member

2. KodeMember Int(11) Kode member untuk setiap jenis member

3. TanggalAwal Date Tanggal awal di mana member mulai

aktif

4. TanggalAkhir Date Tanggal akhir di mana member akan

habis masa keanggotaannya


MsTemp

PK,FK1 Username

JenisMemberMasaTanggal

Gambar 3.78 Tabel MsTemp

88

Tabel ini digunakan untuk menyimpan data sementara member yang

sudah terdaftar tapi belum membayar (belum aktif) untuk segera dilakukan

aktivasi member berdasarkan pada jenis member dan masa keanggotaan yang

dipilih oleh member tersebut.

Tabel 3.8 Definisi Tabel MsTemp



2. JenisMember Varchar(2) Jenis Member yang dipilih oleh member

3. Masa Int(11) Masa keanggotaan yang dipilih oleh

member

4. Tanggal Date Tanggal member tersebut mendaftar

Gambar 3.79 Tabel MsBooking

Tabel ini digunakan untuk menyimpan data booking tempat dan waktu

yang dipilih oleh member.

Tabel 3.9 Definisi Tabel MsBooking


1. KodeBooking Int(11) Kode unik untuk setiap record

89

2. Tempat Varchar(30) Tempat olahraga yang dipilih oleh

member

3. Tanggal Date Tanggal yang dipilih oleh member

4. Jam Time Jam yang dipilih oleh member

5. JenisMember Varchar(2) Jenis member yang aktif pada member

6. KodeMember Char(5) Kode member yang aktif pada member


Gambar 3.80 Tabel MsAbsence

Tabel ini digunakan untuk menyimpan data absensi member yang ingin

melakukan kegiatan olahraga di dalam perusahaan.

Tabel 3.10 Definisi Tabel MsAbsence


1. Tanggal Date Tanggal kehadiran member

2. Jam Time Jam kehadiran member




90

Gambar 3.81 Tabel MsPayment

Tabel ini digunakan untuk menyimpan data pembayaran yang sudah

dilakukan oleh member.

Tabel 3.11 Definisi Tabel MsPayment


1. KodePembayaran Int(11) Kode unik untuk setiap record

2. Tanggal Date Tanggal member melakukan

pembayaran

3. Jam Time Jam member melakukan pembayaran

4. UangPangkal Int(11) Besar uang pangkal yang dibayar oleh

member

5. Iuran Int(11) Besar iuran yang dibayar oleh member




91

Gambar 3.82 Tabel MsComment

Tabel ini digunakan untuk menyimpan data komentar yang dikirim oleh

pendatang (guest) kepada perusahaan.

Tabel 3.12 Definisi Tabel MsComment


1. ID Int(11) Kode unik untuk setiap record

2. Email Varchar(50) Alamat E-mail pendatang yang

mengirim komentar

3. Komentar Text Isi komentar yang dikirim

Gambar 3.83 Tabel MsNews

Tabel ini digunakan untuk menyimpan data berita-berita terbaru dari

perusahaan.

Tabel 3.13 Definisi Tabel MsNews


1. Tanggal Date Tanggal berita dipublikasikan

92

2. Jam Time Jam berita dipublikasikan

3. Judul Varchar(100) Judul berita

4. Berita Text Isi berita

MsGallery

PK ID

ImageKeterangan

Gambar 3.84 Tabel MsGallery

Tabel ini digunakan untuk menyimpan data galeri gambar-gambar dari

perusahaan.

Tabel 3.14 Definisi Tabel MsGallery


1. ID Int(11) Kode unik untuk setiap record

2. Image Varchar(100) Letak direktori gambar

3. Keterangan Text Nama / deskripsi dari gambar

93

3.3.6 Perancangan Struktur Menu

Gambar 3.85 Struktur Menu Guest

94

Gambar 3.86 Struktur Menu Member

95

Halaman Utama

Home Member

View Member Data

Comment

View Member Property

View Comment

Booking

View Booking

Absence

View Absence

Add Absence

Add News

Edit News

Payment

View Payment

Activate Member

Add Gallery

Edit Gallery

Extend Member

View News

View Gallery

Search News

Search Gallery

Search Member Property

Change Password

Switch User

Detail News

Detail Member Data

View Family Data

View Partner Data

View School Data

Gambar 3.87 Struktur Menu Admin

96

3.3.7 Perancangan Layar

<HEADER>

Home

About Us

Contact Us

Gallery

Help

<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>

HOME

<Informasi> Username :

Password :

Forgot Password

Jika anda ingin register, klik Sign Up

<Gambar Perusahaan>

<FOOTER>

Gambar 3.88 Rancangan Layar Guest Home

Rancangan layar Guest Home adalah rancangan layar utama dari website ini.

Halaman ini berisi informasi tentang website ini. Selain itu, halaman ini berfungsi

sebagai login untuk anggota yang telah mendaftar menjadi anggota Tangkas Sports

Centre. Dan halaman ini berisi link diantaranya: Home, About Us, Contact Us, Gallery,

Help, Forgot Password, Sign up.

Login

97

<HEADER>

Home About Us Contact Us Gallery Help

<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

About Us

<Isi Tentang About Us>

<Gambar Perusahaan>

<FOOTER>

Gambar 3.89 Rancangan Layar Guest About Us

Rancangan layar Guest About Us adalah halaman yang memberikan informasi

tentang PT. Tunas Tangkas Sports Centre agar user yang membuka halaman ini dapat

mengenal tentang perusahaan ini. Halaman ini berisi link diantaranya: Home, About Us,

Contact Us, Gallery, Help.

98

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Contact Us

<Alamat Lengkap Perusahaan>

E‐mail :

Komentar :

<Gambar Perusahaan>

<FOOTER>

Gambar 3.90 Rancangan Layar Guest Contact Us

Rancangan layar Guest Contact Us adalah halaman dimana user dapat

memberikan saran dan kritik serta komentar tentang PT. Tunas Tangkas Sports Centre.

Selain itu, di halaman ini juga memberikan informasi tentang alamat, nomor telepon, e-

mail, dan nomor rekening perusahaan untuk memudahkan user dalam menghubungi

perusahaan. Halaman ini berisi link diantaranya: Home, About Us, Contact Us, Gallery,

Help.

Submit Clear

99

<HEADER>


Data komentar anda berhasil dikirim

Back to Home

<FOOTER>

Gambar 3.91 Rancangan Layar Guest Success Contact Us

Rancangan Layar Guest Success Contact Us adalah halaman dimana user telah

berhasil mengirim komentarnya kepada PT. Tunas Tangkas Sports Centre. Halaman ini

berisi link diantaranya Home, About Us, Contact Us, Gallery, Help.

100

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Gallery

<Isi Gallery>

<paging>

<Gambar Perusahaan>

<FOOTER>

Gambar 3.92 Rancangan Layar Guest Gallery

Rancangan layar Guest Gallery adalah halaman dimana user dapat melihat

suasana dan situasi serta fasilitas yang ada di PT. Tunas Tangkas Sports Centre.

Halaman ini berisi link diantaranya Home, About Us, Contact Us, Gallery, Help.

101

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Gallery

<Prev> <Gallery secara spesifik> <Next>

<Gambar Perusahaan>

<FOOTER>

Gambar 3.93 Rancangan Layar Guest Show Gallery

Rancangan Layar Guest Show Gallery adalah halaman dimana user dapat melihat

gambar – gambar perusahaan secara spesifik. Halaman ini berisi link diantaranya: Home,

About Us, Contact Us, Gallery, Help.

102

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Isi Help>

<Gambar Perusahaan>

<FOOTER>

Gambar 3.94 Rancangan Layar Guest Help

Rancangan Layar Guest Help adalah halaman yang memberikan informasi secara

lengkap kepada user untuk memudahkan dan membantu user dalam mencari informasi

yang cepat dan akurat yang berhubungan dengan Tangkas Sports Centre. Halaman ini

berisi link diantaranya: Home, About Us, Contact Us, Gallery, Help.

103

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

Back

<Gambar Perusahaan>

<FOOTER>

Gambar 3.95 Rancangan Layar Guest Entry 1

Rancangan Layar Guest Entry 1 adalah halaman dimana user dapat mencari

informasi secara spesifik yang sesuai dengan keinginan user. Halaman Guest Entry 1

memberikan informasi tentang pendaftaran secara spesifik. Halaman ini berisi link

diantaranya: Home, About Us, Contact Us, Gallery, Help.

104

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

Back

<Gambar Perusahaan>

<FOOTER>




memberikan informasi tentang lupa password dan e-mail secara spesifik. Halaman ini

berisi link diantaranya: Home, About Us, Contact Us, Gallery, Help.

105

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

Back

<Gambar Perusahaan>

<FOOTER>




memberikan informasi tentang cara membuat account dan mengirim komentar secara

spesifik. Halaman ini berisi link diantaranya: Home, About Us, Contact Us, Gallery,

Help.

106

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

Back

<Gambar Perusahaan>

<FOOTER>




memberikan informasi tentang cara menjadi member aktif, booking, dan pembayaran

secara spesifik. Halaman ini berisi link diantaranya: Home, About Us, Contact Us,

Gallery, Help.

107

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

<Pertanyaan>

<Jawaban>

<Pertanyaan>

<Jawaban>

Back

<Gambar Perusahaan>

<FOOTER>

Gambar 3.99 Rancangan Layar Guest Terms

Rancangan Layar Guest Terms adalah halaman dimana user dapat mencari

informasi secara spesifik yang sesuai dengan keinginan user. Halaman Guest Terms

memberikan informasi tentang persyaratan keanggotaan dan tata tertib keanggotaan

secara spesifik. Halaman ini berisi link diantaranya: Home, About Us, Contact Us,

Gallery, Help.

108

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

Single

<keterangan>

<Family>

<keterangan>

<Couple>

<keterangan>

<Mahasiswa>

<keterangan>

<Pelajar>

<keterangan>

Back

<Gambar Perusahaan>

<FOOTER>

Gambar 3.100 Rancangan Layar Guest Price

Rancangan Layar Guest Price adalah halaman dimana user dapat mencari

informasi secara spesifik yang sesuai dengan keinginan user. Halaman Guest Price

memberikan informasi tentang harga tiap – tiap jenis anggota secara spesifik. Halaman

ini berisi link diantaranya: Home, About Us, Contact Us, Gallery, Help.

109

<HEADER>


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Help

Discount

<Keterangan>

<Discount> <Discount>



<Keterangan>

Back

<Gambar Perusahaan>

<FOOTER>

Gambar 3.101 Rancangan Layar Guest Discount

Rancangan Layar Guest Discount adalah halaman dimana user dapat mencari

informasi secara spesifik yang sesuai dengan keinginan user. Halaman Guest Discount

memberikan informasi tentang diskon bagi anggota secara spesifik. Halaman ini berisi

link diantaranya: Home, About Us, Contact Us, Gallery, Help.

110

<HEADER>

Home

About Us

Contact Us

Gallery

Help

<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Password Assistance

Username :

Alamat E‐mail :

<Gambar Perusahaan>

<FOOTER>

Gambar 3.102 Rancangan Layar Guest Forgot Password

Rancangan Layar Guest Forgot Password adalah halaman yang membantu

member untuk mendapatkan passwordnya karena terjadi sesuatu. Halaman ini berisi link

diantaranya: Home, About Us, Contact Us, Gallery, Help.

Submit

111

<HEADER>


<Keterangan Berhasil Submit>

Back To Home

<FOOTER>

Gambar 3.103 Rancangan Layar Guest Success Forgot Password

Rancangan Layar Guest Success Forgot Password adalah halaman dimana user

telah berhasil merequest password yang hilang. Halaman ini berisi link diantaranya

Home, About Us, Contact Us, Gallery, Help.

112

<HEADER>


<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>

Register

Username :

Password :

Konfirmasi Password :

Upload Image :

Data Pribadi

Nama Lengkap :

Jenis Kelamin : Laki – Laki Perempuan

Golongan Darah :

Tempat & Tanggal Lahir :

Alamat ;

Telp :

HP :

No. KTP/SIM/Passport :

Alamat E‐mail :

Status : Belum Menikah Menikah

Kewarganegaraan : WNI WNA

Agama :

Pekerjaan / Jabatan :

Data Perusahaan

D V M V Y V

Browse

O V

113

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

<Keterangan Register>

<Gambar Perusahaan>

<FOOTER>

Gambar 3.104 Rancangan Layar Guest Sign Up

Rancangan Layar Guest Sign Up adalah halaman dimana user dapat melakukan

pendaftaran sebagai syarat untuk bisa membuat account sebagai member aktif. Halaman

ini berisi link diantaranya: Home, About Us, Contact Us, Gallery, Help.

Submit Clear

114

<HEADER>


<Keterangan Berhasil Register>

Back To Home

<FOOTER>

Gambar 3.105 Rancangan Layar Guest Success Sign Up

Rancangan Layar Guest Success Sign Up adalah halaman dimana user telah

berhasil mendaftar sebagai member sementara untuk membuat account baru sebagai

member aktif. Halaman ini berisi link diantaranya Home, About Us, Contact Us,

Gallery, Help.

115

<HEADER>

Home Profile Register Booking Payment Help

Selamat Datang, <user> Sign Out

<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

HOME

<NEWS>

<Paging>

<FOOTER>

Gambar 3.106 Rancangan Layar Member Home

Rancangan Layar Member Home adalah halaman yang memberikan informasi

berupa berita terbaru dari perusahaan seperti event yang akan diadakan, dan lain – lain.

Halaman ini berisi link diantaranya: Home, Profile, Edit Profile, Registration, Add

Family Data, Add Partner Data, Add School Data, Booking, Payment, Konfirmasi

Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

116

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

HOME

<NEWS secara spesifik dan detail>

<Next / Prev>

Kembali

<FOOTER>

Gambar 3.107 Rancangan Layar Member News

Rancangan Layar Member News adalah halaman yang memberikan informasi

berita terbaru secara spesifik sesuai dengan keinginan member. Halaman ini berisi link

diantaranya: Home, Profile, Edit Profile, Registration, Add Family Data, Add Partner

Data, Add School Data, Booking, Payment, Konfirmasi Tagihan, Konfirmasi

Pembayaran, Help, Sign Out.

117

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

PROFILE

<Gambar Member>

Kode Member: <Kode Member>

Tanggal Awal: <Tanggal Awal>

Tanggal Akhir: <Tanggal Akhir>

Data Pribadi

Nama Lengkap : <Nama Lengkap>

Jenis Kelamin : <Jenis Kelamin>

Golongan Darah : <Golongan Darah>

Tempat & Tanggal

Lahir

: <Tempat & Tanggal

Lahir>

Alamat : <Alamat>

Telp : <Telp>

HP : <HP>

No. KTP / SIM /

Passport

: <No. KTP / SIM /

Passport>

Alamat E‐mail : <Alamat E‐mail>

Status : <Status>

Kewarganegaraan : <Kewarganegaraan>

Agama : <Agama>

118

Pekerjaan / Jabatan : <Pekerjaan /

Jabatan>

Data Perusahaan

Nama Perusahaan : <Nama

Perusahaan>

Alamat Perusahaan : <Alamat

Perusahaan>

Telp : <Telp>

Fax : <Fax>

Bidang Usaha : <Bidang Usaha>

<FOOTER>

Gambar 3.108 Rancangan Layar Member Profile

Rancangan Layar Member Profile adalah halaman yang memberikan informasi

berupa data – data pribadi member kepada member yang bersangkutan. Halaman ini

berisi link diantaranya: Home, Profile, Edit Profile, Registration, Add Family Data, Add

Partner Data, Add School Data, Booking, Payment, Konfirmasi Tagihan, Konfirmasi


119

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

PROFILE

<Gambar Member>

Kode Member:

Tanggal Awal:

Tanggal Akhir:

Data Pribadi

Nama Lengkap :

Jenis Kelamin :

Golongan Darah :


Alamat :

Telp :

HP :

No. KTP / SIM / Passport :

Alamat E‐mail :

Status :

Kewarganegaraan :

Agama :


Data Perusahaan

120

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

View Family Data

<FOOTER>

Gambar 3.109 Rancangan Layar Member Profile Family

Rancangan Layar Member Profile Family adalah halaman yang memberikan

informasi berupa data – data pribadi member jenis member family kepada member yang

bersangkutan. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile,

Registration, Add Family Data, Add Partner Data, Add School Data, Booking, Payment,

Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

121

<HEADER>



Profile

Data Istri / Suami

Nama <Nama>

Tempat / Tanggal Lahir <Tempat / Tanggal Lahir>

Pekerjaan <Pekerjaan>

Data Anak – anak

Nama Jenis Kelamin Tempat / Tanggal Lahir Pekerjaan

<Nama> <Jenis Kelamin> <Tempat / Tanggal

Lahir>

<Pekerjaan>

Back

<FOOTER>

Gambar 3.110 Rancangan Layar Member View Family Data

Rancangan Layar Member View Family Data adalah halaman dimana member

dapat melihat informasi berupa data – data pribadi jenis member family secara spesifik.




122

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

PROFILE

<Gambar Member>

Kode Member:

Tanggal Awal:

Tanggal Akhir:

Data Pribadi

Nama Lengkap :

Jenis Kelamin :

Golongan Darah :


Alamat :

Telp :

HP :


Alamat E‐mail :

Status :

Kewarganegaraan :

Agama :


Data Perusahaan

123

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

View Partner Data

<FOOTER>

Gambar 3.111 Rancangan Layar Member Profile Couple

Rancangan Layar Member Profile Couple adalah halaman yang memberikan

informasi berupa data – data pribadi member jenis member couple kepada member yang

bersangkutan. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile,



124

<HEADER>



Profile

Data Partner

Nama <Nama>

Jenis Kelamin <Jenis Kelamin>


No. KTP / SIM / Passport <No. KTP / SIM / Passport>

Alamat <Alamat>

Telp <Telp>

HP <HP>

Kewarganegaraan <Kewarganegaraan>

Agama <Agama>

Back

<FOOTER>

Gambar 3.112 Rancangan Layar Member View Partner Data

Rancangan Layar Member View Partner Data adalah halaman dimana member

dapat melihat informasi berupa data – data pribadi jenis member couple secara spesifik.




125

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

PROFILE

<Gambar Member>

Kode Member:

Tanggal Awal:

Tanggal Akhir:

Data Pribadi

Nama Lengkap :

Jenis Kelamin :

Golongan Darah :


Alamat :

Telp :

HP :


Alamat E‐mail :

Status :

Kewarganegaraan :

Agama :


Data Perusahaan

126

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

View School Data

<FOOTER>

Gambar 3.113 Rancangan Layar Member Profile Mahasiswa / Pelajar

Rancangan Layar Member Profile Mahasiswa / Pelajar adalah halaman yang

memberikan informasi berupa data – data pribadi member jenis member mahasiswa /

pelajar kepada member yang bersangkutan. Halaman ini berisi link diantaranya: Home,

Profile, Edit Profile, Registration, Add Family Data, Add Partner Data, Add School

Data, Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

127

<HEADER>



Profile

Data Sekolah / Universitas

Nama Sekolah / Universitas <Nama Sekolah / Universitas>

Alamat Sekolah / Universitas <Alamat Sekolah / Universitas>

Telp <Telp>

Fax <Fax>

Back

<FOOTER>

Gambar 3.114 Rancangan Layar Member View School Data

Rancangan Layar Member View School Data adalah halaman dimana member

dapat melihat informasi berupa data – data pribadi jenis member mahasiswa / pelajar

secara spesifik. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile,



128

<HEADER>



<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>

EDIT PROFILE

<Gambar Member>

Change Image

Password : Change Password

Data Pribadi

Nama Lengkap :


Golongan Darah :


Alamat ;

Telp :

HP :

No. KTP/SIM/Passport :

Alamat E‐mail :

Status : Belum Menikah Menikah


Agama :


Data Perusahaan

D V M V Y V

O V

129

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

<FOOTER>

Gambar 3.115 Rancangan Layar Member Edit Profile

Rancangan Layar Member Edit Profile adalah halaman dimana member dapat

mengubah data – data pribadinya. Halaman ini berisi link diantaranya: Home, Profile,

Edit Profile, Registration, Add Family Data, Add Partner Data, Add School Data,

Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out,

Change Password, Change Image.

Save Reset

130

<HEADER>



Data profile anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.116 Rancangan Layar Member Success Edit Profile

Rancangan Layar Member Success Edit Profile adalah halaman dimana user

telah berhasil mengubah data – data pribadinya. Halaman ini berisi link diantaranya:

Home, Profile, Edit Profile, Registration, Add Family Data, Add Partner Data, Add

School Data, Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help,

Sign Out.

131

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Change Image

Back

<FOOTER>

Gambar 3.117 Rancangan Layar Member Change Image

Rancangan Layar Member Change Image adalah halaman dimana member dapat

mengubah gambar atau foto member. Halaman ini berisi link diantaranya: Home,



Browse

Change Clear

132

<HEADER>



Image anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.118 Rancangan Layar Member Success Change Image

Rancangan Layar Member Success Change Image adalah halaman dimana user

telah berhasil mengubah gambar atau foto member. Halaman ini berisi link diantaranya

Home, About Us, Contact Us, Gallery, Help.

133

<HEADER>

Home

Profile

Register

Booking

Payment Help


<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>

Change Password

Password Lama :

Password Baru :

Konfirmasi Password Baru

Back

<FOOTER>

Gambar 3.119 Rancangan Layar Member Change Password

Rancangan Layar Member Change Password adalah halaman dimana member

dapat mengubah Password lamanya. Halaman ini berisi link diantaranya: Home, Profile,


Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

Change Clear

134

<HEADER>



Password anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.120 Rancangan Layar Member Success Change Password

Halaman Member Success Change Password adalah halaman dimana user telah

berhasil mengubah Password lamanya. Halaman ini berisi link diantaranya Home, About

Us, Contact Us, Gallery, Help.

135

<HEADER>

Home

Profile

Register

Booking

Payment Help


EDIT Profile

<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>

Data Istri / Suami

Nama Istri /

Suami

:

Tempat /

Tanggal Lahir

:

Pekerjaan :

Back

<FOOTER>

Gambar 3.121 Rancangan Layar Member Edit Spouse Data

Halaman Member Edit Spouse Data adalah halaman dimana member bisa

mengubah data – data family secara spesifik, misalnya: nama istri / suami, tempat /

tanggal lahir, dan pekerjaan. Halaman ini berisi link diantaranya: Home, Profile, Edit

Profile, Registration, Add Family Data, Add Partner Data, Add School Data, Booking,

Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

Reset Save

D V M V Y V

136

<HEADER>


Selamat Datang, <user> Sign Up

Data Suami / Istri anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.122 Rancangan Layar Member Success Edit Spouse Data

Rancangan Layar Member Success Edit Spouse Data adalah halaman dimana

member telah berhasil mengubah data – data family secara spesifik, misalnya: nama istri

/ suami, tempat / tanggal lahir, dan pekerjaan. Halaman ini berisi link diantaranya:



Sign Out.

137

<HEADER>



EDIT PROFILE

<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

Data Anak – anak

Nama Jenis

Kelamin

Tempat

/

Tanggal

Lahir

Pekerjaan

<Nama> <JK> <TTL> <Pekerjaan> Edit

Back

<FOOTER>

Gambar 3.123 Rancangan Layar Member View Child Data

Rancangan Layar Member View Child Data adalah halaman yang menampilkan

informasi berupa data anak - anak. Halaman ini berisi link diantaranya: Home, Profile,


Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out, Edit.

138

<HEADER>

Home

Profile

Register

Booking

Payment Help


EDIT Profile

<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>

Data Anak – anak

Nama Anak :

Tempat /

Tanggal

Lahir

:

Jenis

Kelamin

: Laki ‐ Laki Perempuan

Pekerjaan :

Back

<FOOTER>

Gambar 3.124 Rancangan Layar Member Edit Child Data

Rancangan Layar Member Edit Child Data adalah halaman dimana member bisa

mengubah data – data family secara spesifik, misalnya: nama anak, jenis kelamin,

tempat / tanggal lahir, dan pekerjaan. Halaman ini berisi link diantaranya: Home,



Reset Save

D V M V Y V

139

<HEADER>



Data anak anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.125 Rancangan Layar Member Success Edit Child Data

Rancangan Layar Member Success Edit Child Data adalah halaman dimana

member telah berhasil mengubah data – data family secara spesifik misalnya: nama

anak, jenis kelamin, tempat / tanggal lahir, dan pekerjaan. Halaman ini berisi link




140

<HEADER>

Home

Profile

Register

Booking

Payment Help


EDIT Profile

<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>


Nama Sekolah / Universitas:

Alamat Sekolah / Universitas:

Telp

Fax

Back

<FOOTER>

Gambar 3.126 Rancangan Layar Member Edit School Data

Rancangan Layar Member Edit School Data adalah halaman dimana member

bisa mengubah data – data pribadi yang diperlukan untuk jenis member mahasiswa dan

pelajar. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile, Registration,

Add Family Data, Add Partner Data, Add School Data, Booking, Payment, Konfirmasi


Reset Save

141

<HEADER>



Data sekolah / universitas anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.127 Halaman Member Success Edit School Data

Rancangan Layar Member Success Edit School Data adalah halaman dimana

member telah berhasil mengubah data – data pribadi yang diperlukan untuk jenis

member mahasiswa dan pelajar. Halaman ini berisi link diantaranya: Home, Profile, Edit



142

<HEADER>

Home

Profile

Register

Booking

Payment Help


EDIT Profile

<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>

Data Partner

Nama lengkap

Partner

:

Tempat / Tanggal

Lahir

:


No.

KTP/SIM/Passport

:

Alamat :

Telp :

HP :

Agama :

Kewarganergaraan : WNI WNA

Back

<FOOTER>

Gambar 3.128 Rancangan Layar Member Edit Partner Data

Reset Save

D V M V Y V

143

Halaman Member Edit Partner Data adalah halaman dimana member bisa

mengubah data – data pribadi yang diperlukan untuk jenis member couple. Halaman ini




<HEADER>



Data partner anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.129 Rancangan Layar Member Success Edit Partner Data

Rancangan Layar Member Success Edit Partner Data adalah halaman dimana

member telah berhasil mengubah data – data pribadi yang diperlukan untuk jenis

member couple. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile,



144

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

REGISTRATION

Jenis Keanggotaan :

Masa Keanggotaan :

<Keterangan menjadi member>

<FOOTER>

Gambar 3.130 Rancangan Layar Member Registration

Rancangan Layar Member Registration adalah halaman dimana user dapat

membuat account baru untuk menjadi member aktif dan member akan mendapatkan

kode member sesuai jenis member yang dipilih oleh member. Halaman ini berisi link




Pilih V

Pilih V

Submit

145

<HEADER>



Data registrasi member anda berhasil diubah

Back to Home

<FOOTER>

Gambar 3.131 Rancangan Layar Member Success Registration

Rancangan Layar Member Success Registration adalah halaman dimana user

telah berhasil membuat account baru untuk menjadi member aktif sesuai dengan jenis

member yang dipilih oleh member. Halaman ini berisi link diantaranya: Home, Profile,


Booking, Payment, Konfirmasi Tagihan, Konfirmasi Pembayaran, Help, Sign Out.

146

<HEADER>

Home Profile Registration Booking Payment Help


<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

ADD FAMILY DATA

Add Spouse Data

<Keterangan>

Add Children Data

<Keterangan>

<FOOTER>

Gambar 3.132 Rancangan Layar Member Add Family Data

Rancangan Layar Member Add Family Data adalah halaman untuk mengisi data

– data pribadi yang diperlukan untuk menjadi anggota jenis member family. Halaman ini



Pembayaran, Help, Sign Out, Add Spouse Data, Add Children Data.

147

<HEADER>

Home

Profile

Register

Booking

Payment Help


Add Family Data

<Sponsor Iklan

1>

<Sponsor Iklan

2>

<Sponsor Iklan

3>

<Sponsor Iklan

4>

Data Istri / Suami

Nama Istri /

Suami

:

Tempat /

Tanggal Lahir

:

Pekerjaan :

Back

<FOOTER>

Gambar 3.133 Rancangan Layar Member Add Spouse Data

Rancangan Layar Member Add Spouse Data adalah halaman dimana member

yang memilih jenis member family perlu mengisi data – data family secara spesifik,

misalnya: nama istri / suami, tempat / tanggal lahir, dan pekerjaan. Halaman ini berisi

link diantaranya: Home, Profile, Edit Profile, Registration, Add Family Data, Add



Clear Add

D V M V Y V

148

<HEADER>



Data suami / istri anda berhasil ditambahkan

Back to Home

<FOOTER>

Gambar 3.134 Rancangan Layar Member Success Add Spouse Data

Rancangan Layar Member Success Add Spouse Data adalah halaman dimana

user telah berhasil mendaftar data – data family berupa nama istri / suami, tempat /

tanggal lahir, dan pekerjaan. Halaman ini berisi link diantaranya: Home, Profile, Edit



149

<HEADER>

Home

Profile

Register

Booking

Payment Help


Add Family Data

<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>

Data Anak


Laki – Laki

Perempuan

Back

<FOOTER>

Gambar 3.135 Rancangan Layar Member Add Children Data

Rancangan Layar Member Add Children Data adalah halaman dimana member

yang memilih jenis member family perlu mengisi data – data family secara spesifik,

misalnya: nama anak, jenis kelamin, tempat / tanggal lahir, dan pekerjaan. Halaman ini




Clear Add

D V M V Y V

150

<HEADER>



Data anak anda berhasil ditambahkan

Back to Home

<FOOTER>

Gambar 3.136 Rancangan Layar Member Success Add Children Data

Rancangan Layar Member Success Add Children Data adalah halaman dimana

member telah berhasil mendaftar data – data family secara spesifik, misalnya: nama

anak, jenis kelamin, tempat / tanggal lahir, dan pekerjaan. Halaman ini berisi link




151

<HEADER>



Add Partner Data

<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>

Data Partner

Nama Lengkap Partner :

Jenis Kelamin : Laki – laki Perempuan

Tempat / Tanggal lahir :


Alamat :

Telp :

HP :


Agama :

<FOOTER>

Gambar 3.137 Rancangan Layar Member Add Partner Data

Rancangan Layar Member Add Partner Data adalah halaman untuk mengisi data

– data pribadi yang diperlukan untuk jenis member couple. Halaman ini berisi link




D V M V Y V

Clear Add

152

<HEADER>



Data partner anda berhasil ditambahkan

Back to Home

<FOOTER>

Gambar 3.138 Rancangan Layar Member Success Add Partner Data

Rancangan Layar Member Success Add Partner Data adalah halaman dimana

member telah berhasil mendaftar data – data pribadi yang diperlukan untuk jenis

member couple. Halaman ini berisi link diantaranya: Home, Profile, Edit Profile,



153

<HEADER>

Home Profile Registration Booking Payment


ADD SCHOOL DATA

<Sponsor

Iklan 1>

<Sponsor

Iklan 2>

<Sponsor

Iklan 3>

<Sponsor

Iklan 4>


Nama Sekolah / Universitas :

Alamat Sekolah / Universitas :

Telp :

Fax :

<FOOTER>

Gambar 3.139 Rancangan Layar Member Add School Data

Rancangan Layar Member Add School Data adalah halaman untuk mengisi data

– data pribadi yang diperlukan untuk jenis member mahasiswa dan pelajar. Halaman ini




Submit

Clear Add

154

<HEADER>



Data sekolah / universitas anda berhasil ditambahkan

Back to Home

<FOOTER>

Gambar 3.140 Rancangan Layar Member Success Add School Data

Rancangan Layar Member Success Add School Data adalah halaman dimana

member telah berhasil mendaftar data – data pribadi yang diperlukan untuk jenis

member mahasiswa dan pelajar. Halaman ini berisi link diantaranya: Home, Profile, Edit



155

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

BOOKING

Tempat : <Gambar>

Lap. Tenis

1

<Gambar>

Lap. Tenis

2

<Gambar>

Lap. Tenis

3

<Gambar>

Lap. Tenis

4

<Gambar>

Lap. Tenis

5

<Gambar>

Lap. Tenis

6

Tanggal :

Jam :

<FOOTER>

Gambar 3.141 Rancangan Layar Member Booking

Rancangan Layar Member Booking adalah halaman yang menyediakan gambar

lapangan tenis agar member dapat melihat kondisi lapangan yang akan di booking dan

tanggal serta jam booking. Halaman ini berisi link diantaranya: Home, Profile, Edit



06:00 – 07:00

Submit

V

156

<HEADER>



Data booking anda berhasil ditambahkan

Kode booking anda: <Kode booking>

Harap dicatat!

Back to Home

<FOOTER>

Gambar 3.142 Rancangan Layar Member Success Booking

Rancangan Layar Member Success Booking adalah halaman yang memberikan

kode booking kepada member yang telah berhasil booking. Halaman ini berisi link




157

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

PAYMENT

Konfirmasi Tagihan

<Keterangan>

Konfirmasi Pembayaran

<Keterangan>

<FOOTER>

Gambar 3.143 Rancangan Layar Member Payment

Rancangan Layar Member Payment adalah halaman dimana member dapat

melihat konfirmasi tagihan dan konfirmasi pembayaran. Halaman ini berisi link




158

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

KONFIRMASI TAGIHAN

<Keterangan>

Jenis

Member

Uang

Pangkal

Iuran Tangg

al

Status

<Jenis

Member>

<Uang

Pangkal>

<Iuran> <Tang

gal>

<Status>

<FOOTER>

Gambar 3.144 Rancangan Layar Member Konfirmasi Tagihan

Rancangan Layar Member Konfirmasi Tagihan adalah halaman dimana member

dapat melihat tagihan yang diberikan kepada member yang bersangkutan untuk

perpanjangan masa keanggotaan dan masa aktif. Halaman ini berisi link diantaranya:



Sign Out.

159

<HEADER>



<Sponsor Iklan 1>

<Sponsor Iklan 2>

<Sponsor Iklan 3>

<Sponsor Iklan 4>

KONFIRMASI PEMBAYARAN

<Keterangan>

Tang

gal

Jam Uang

Pangkal

Iuran Kode

Memb

er

Lama

Kode

Member

Baru

<Tan

ggal

>

<Ja

m>

<Uang

Pangkal

>

<Iuran> <Kode

Memb

er

Lama>

<Kode

Member

Baru>

<FOOTER>

Gambar 3.145 Rancangan Layar Member Konfirmasi Pembayaran

Rancangan Layar Member Konfirmasi Pembayaran adalah halaman dimana

member dapat melihat history dari pembayaran member yang bersangkutan. Halaman ini




160

<HEADER>

Home Member Comment Booking Absence Payment

Selamat Datang, <admin> Sign Out

<WELCOME TO ADMIN> <WELCOME> <WELCOME TO ADMIN>

<FOOTER>

Gambar 3.146 Rancangan Layar Admin Home

Rancangan Layar Admin Home adalah halaman utama untuk admin. Halaman ini

berisi link diantaranya: Home, Search News, Add News, Search Gallery, Add Gallery,

Change Password, Switch User, Search Member Data, Search Member Property,

Comment, Booking, Search Absence, Add Absence, Search Payment, Activate Member,

Extend Member.

161

<HEADER>




Search News

<Hasil>

Tanggal Jam Judul Berita

<Tanggal> <Jam> <Judul> <Berita> Details Edit

<Paging>

<FOOTER>

Gambar 3.147 Rancangan Layar Admin Search News

Rancangan Layar Admin Search News adalah halaman dimana admin bisa

mencari berita terbaru secara detail tentang perusahaan untuk dihapus dan diedit,

halaman Halaman ini berisi link diantaranya: Home, Search News, Add News, Search

Gallery, Add Gallery, Change Password, Switch User, Search Member Data, Search

Member Property, Comment, Booking, Search Absence, Add Absence, Search Payment,

Activate Member, Extend Member, Details, Edit.

Check All Uncheck All Delete

Judul V GO

162

<HEADER>




<Tanggal Berita>

<Judul Berita>

<Isi Berita>

Back

<FOOTER>

Gambar 3.148 Rancangan Layar Admin Detail News

Rancangan Layar Admin Detail News adalah halaman dimana admin bisa

melihat berita terbaru tentang perusahaan secara detail. Halaman ini berisi link

diantaranya: Home, Search News, Add News, Search Gallery, Add Gallery, Change

Password, Switch User, Search Member Data, Search Member Property, Comment,

Booking, Search Absence, Add Absence, Search Payment, Activate Member, Extend

Member.

163

<HEADER>




Judul

Berita

Back

<FOOTER>

Gambar 3.149 Rancangan Layar Admin Edit News

Rancangan Layar Admin Edit News adalah halaman dimana admin bisa

mengubah judul dan isi berita tentang perusahaan. Halaman ini berisi link diantaranya:

Home, Search News, Add News, Search Gallery, Add Gallery, Change Password, Switch

User, Search Member Data, Search Member Property, Comment, Booking, Search

Absence, Add Absence, Search Payment, Activate Member, Extend Member.

<Isi Judul>

<Isi Berita>

Save Reset

164

<HEADER>




Data news berhasil diubah

Back To Home

<FOOTER>

Gambar 3.150 Rancangan Layar Admin Success Edit News

Rancangan Layar Admin Success Edit News adalah halaman dimana admin telah

berhasil mengubah judul dan isi berita tentang perusahaan. Halaman ini berisi link




Member.

165

<HEADER>




Judul

Berita

Back

<FOOTER>

Gambar 3.151 Rancangan Layar Admin Add News

Rancangan Layar Admin Add News adalah halaman dimana admin bisa

menambahkan judul dan berita terbaru tentang perusahaan. Halaman ini berisi link




Member.

Add Clear

166

<HEADER>




Data news berhasil ditambahkan

Back To Home

<FOOTER>

Gambar 3.152 Rancangan Layar Admin Success Add News

Rancangan Layar Admin Success Add News adalah halaman dimana admin telah

berhasil menambahkan judul dan berita terbaru tentang perusahaan. Halaman ini berisi

link diantaranya: Home, Search News, Add News, Search Gallery, Add Gallery, Change



Member.

167

<HEADER>




Search Gallery

<Hasil>

Nama File Keterangan

<Nama File> Edit

<Paging>

<FOOTER>

Gambar 3.153 Rancangan Layar Admin Search Gallery

Rancangan Layar Admin Search Gallery adalah halaman dimana admin bisa

mencari dan mengedit serta menghapus gambar – gambar tentang perusahaan. Halaman

ini berisi link diantaranya: Home, Search News, Add News, Search Gallery, Add Gallery,



Extend Member.


Nama File V GO

168

<HEADER>




<Gambar Gallery>

Nama File

Keterangan

Back

<FOOTER>

Gambar 3.154 Rancangan Layar Admin Edit Gallery

Rancangan Layar Admin Edit Gallery adalah halaman dimana admin bisa

mengubah nama file dan keterangan gallery. Halaman ini berisi link diantaranya: Home,

Search News, Add News, Search Gallery, Add Gallery, Change Password, Switch User,

Search Member Data, Search Member Property, Comment, Booking, Search Absence,

Add Absence, Search Payment, Activate Member, Extend Member.

<Nama File>

<Keterangan>

Save Reset

169

<HEADER>




Data gallery berhasil diubah

Back To Home

<FOOTER>

Gambar 3.155 Rancangan Layar Admin Success Edit Gallery

Rancangan Layar Admin Success Edit Gallery adalah halaman dimana admin

telah berhasil mengubah nama file dan keterangan gallery. Halaman ini berisi link




Member.

170

<HEADER>




File

Keterangan

Back

<FOOTER>

Gambar 3.156 Rancangan Layar Admin Add Gallery

Rancangan Layar Admin Add Gallery adalah halaman dimana admin bisa

menambah file dan keterangan gallery. Halaman ini berisi link diantaranya: Home,

Search News, Add News, Search Gallery, Add Gallery, Change Password, Switch User,

Search Member Data, Search Member Property, Comment, Booking, Search Absence,

Add Absence, Search Payment, Activate Member, Extend Member.

Add Clear

Browse

171

<HEADER>




Data gallery berhasil ditambahkan

Back To Home

<FOOTER>

Gambar 3.157 Rancangan Layar Admin Success Add Gallery

Rancangan Layar Admin Success Add Gallery adalah halaman dimana admin

telah berhasil menambah nama file dan keterangan gallery. Halaman ini berisi link




Member.

172

<HEADER>




Password Lama

Password Baru

Konfirmasi Password Baru

<FOOTER>

Gambar 3.158 Rancangan Layar Admin Change Password

Rancangan Layar Admin Change Password adalah halaman dimana admin dapat

mengubah password lamanya untuk meningkatkan keamanan. Halaman ini berisi link




Member.

Change Clear

173

<HEADER>




Data password berhasil diubah

Back To Home

<FOOTER>

Gambar 3.159 Rancangan Layar Admin Success Change Password

Rancangan Layar Admin Success Change Password adalah halaman dimana

admin telah berhasil mengubah password lamanya. Halaman ini berisi link diantaranya:




174

<HEADER>




Username

Password

<FOOTER>

Gambar 3.160 Rancangan Layar Admin Switch User

Rancangan Layar Admin Switch User adalah halaman dimana admin dapat

mengakses member aktif seolah – olah admin menjadi member dan melakukan aktifitas

seperti member dengan menggunakan account member yang bersangkutan. Halaman ini




Extend Member.

Login

175

<HEADER>




Search Member Data

<Hasil>

Username Nama Jenis

Kelamin

Tanggal

Lahir

Member

Aktif

<Username> <Nama> <Jenis

Kelamin>

<Tanggal

Lahir>

<Member

Aktif>

Details

<Paging>

<FOOTER>

Gambar 3.161 Rancangan Layar Admin Search Member Data

Rancangan Layar Admin Search Member Data adalah halaman dimana admin

bisa mencari data – data member yang aktif maupun non aktif secara detail. Halaman ini




Extend Member, Detail.

Username V All V GO


176

<HEADER>



<WELCOME TO

ADMIN>

<WELCOME> <WELCOME TO

ADMIN>

<Image>

Username :

Member Aktif :

Kode Member :

Data Pribadi

Nama Lengkap :

Jenis Kelamin :

Golongan Darah :


Alamat :

Telp :

HP :


Alamat E‐mail :

Status :

Kewarganegaraan :

Agama :


177

Data Perusahaan

Nama Perusahaan :

Alamat Perusahaan :

Telp :

Fax :

Bidang Usaha :

View Family Data

View Partner Data

View School Data

Back

<FOOTER>

Gambar 3.162 Rancangan Layar Admin Detail Member

Rancangan Layar Admin Detail Member adalah halaman dimana admin dapat

melihat data member yang aktif maupun non aktif secara detail. Halaman ini berisi link




Member, View Family Data, View Partner Data, View School Data.

178

<HEADER>




Data Istri / Suami

Nama <Nama>


Pekerjaan <Pekerjaan>

Data Anak ‐ anak


<Nama> <Jenis Kelamin> <Tempat / Tanggal

Lahir>

<Pekerjaan>

Back

<FOOTER>

Gambar 3.163 Rancangan Layar Admin Detail Family

Rancangan Layar Admin Detail Family adalah halaman dimana admin bisa

melihat informasi data family jenis member family secara detail. Halaman ini berisi link




Member.

179

<HEADER>




Data Partner

Nama <Nama>

Jenis Kelamin <Jenis Kelamin>


No. KTP / SIM / Passport <No. KTP / SIM / Passport>

Alamat <Alamat>

Telp <Telp>

HP <HP>

Kewarganegaraan <Kewarganegaraan>

Agama <Agama>

Back

<FOOTER>

Gambar 3.164 Rancangan Layar Admin Detail Partner

Rancangan Layar Admin Detail Partner adalah halaman dimana admin bisa

melihat informasi data jenis member couple secara detail. Halaman ini berisi link




Member.

180

<HEADER>





Nama Sekolah / Universitas <Nama Sekolah / Universitas>

Alamat Sekolah / Universitas <Alamat Sekolah / Universitas>

Telp <Telp>

Fax <Fax>

Back

<FOOTER>

Gambar 3.165 Rancangan Layar Admin Detail School

Rancangan Layar Admin Detail School adalah halaman dimana admin bisa

melihat informasi data mahasiswa dan pelajar secara detail. Halaman ini berisi link




Member.

181

<HEADER>




Search Member

Property

<Hasil>

Kode

Member

Tanggal

Awal

Tanggal Akhir Tanggal Lahir Username

<Kode

Member>

<Tanggal

Awal>

<Tanggal

Akhir>

<Tanggal

Lahir>

<Username>

<Paging>

<FOOTER>

Gambar 3.166 Rancangan Layar Admin Search Member Property

Rancangan Layar Admin Search Member Property adalah halaman dimana

admin bisa melihat data – data member aktif lebih spesifik sesuai jenis membernya.

Halaman ini berisi link diantaranya: Home, Search News, Add News, Search Gallery,

Add Gallery, Change Password, Switch User, Search Member Data, Search Member

Property, Comment, Booking, Search Absence, Add Absence, Search Payment, Activate

Member, Extend Member.

Kode Member V All V GO

182

<HEADER>




Search Comment

<Hasil>

E‐Mail Komentar

<E‐Mail> <Komentar>

<Paging>

<FOOTER>

Gambar 3.167 Rancangan Layar Admin Search Comment

Rancangan Layar Admin Search Comment adalah halaman dimana admin dapat

mencari komentar dari setiap member aktif maupun non aktif. Halaman ini berisi link




Member.


E‐Mail V GO

183

<HEADER>




Search Booking

<Hasil>

Kode

Booking

Tempat Tanggal Jam Username Kode

Member

<Kode

Booking>

<Tempat> <Tanggal> <Jam> <Username> <Kode

Member>

<Paging>

<FOOTER>

Gambar 3.168 Rancangan Layar Admin Search Booking

Rancangan Layar Admin Search Booking adalah halaman dimana admin dapat

mencari member yang telah booking. Halaman ini berisi link diantaranya: Home, Search

News, Add News, Search Gallery, Add Gallery, Change Password, Switch User, Search

Member Data, Search Member Property, Comment, Booking, Search Absence, Add

Absence, Search Payment, Activate Member, Extend Member.


Kode Booking V GO

184

<HEADER>




Kode Member

<FOOTER>

Gambar 3.169 Rancangan Layar Admin Add Absence

Rancangan Layar Admin Add Absence adalah halaman dimana admin bisa

melakukan absensi terhadap member yang ingin melakukan aktifitas olahraga. Halaman




Extend Member.

Add

185

<HEADER>




Data absensi member berhasil ditambahkan

Back To Home

<FOOTER>

Gambar 3.170 Rancangan Layar Admin Success Add Absence

Rancangan Layar Admin Success Add Absence adalah halaman dimana admin

telah berhasil melakukan absensi terhadap member yang ingin melakukan aktifitas

olahraga. Halaman ini berisi link diantaranya: Home, Search News, Add News, Search

Gallery, Add Gallery, Change Password, Switch User, Search Member Data, Search

Member Property, Comment, Booking, Search Absence, Add Absence, Search Payment,

Activate Member, Extend Member.

186

<HEADER>




Search Absence

<Hasil>

Tanggal Jam Username Kode Member

<Tanggal> <Jam> <Username> <Kode Member>

<Paging>

<FOOTER>

Gambar 3.171 Rancangan Layar Admin Search Absence

Rancangan Layar Admin Search Absence adalah halaman dimana admin dapat

mencari data – data member aktif yang telah absen. Halaman ini berisi link diantaranya:





Kode Member V GO

187

<HEADER>



<WELCOME TO

ADMIN>


ADMIN>

Search Payment

<Hasil>

Kode

Pemba

yaran

Tangg

al

Jam Uan

g

Pang

kal

Iura

n

Userna

me

Kode

Mem

ber

Lama

Kode

Mem

ber

Baru

<Kode

Pemba

yaran>

<Tang

gal>

<Ja

m>

<Ua

ng

Pang

kal

<Iur

an>

<Userna

me>

<Kod

e

Mem

ber

Lama

>

<Kod

e

Mem

ber

Baru

>

Pri

nt

<Paging>

<FOOTER>

Gambar 3.172 Rancangan Layar Admin Search Payment

Rancangan Layar Admin Search Payment adalah halaman dimana admin bisa

mencari dan mencetak pembayaran member sebagai tanda bukti transaksi. Halaman ini


Kode Pembayaran V GO


188



Extend Member, Print.

Kode Pembayaran <Kode Pembayaran>

Tanggal <Tanggal>

Jam <Jam>

Uang Pangkal <Uang Pangkal>

Iuran <Iuran>

Username <Username>

Kode Member Lama <Kode Member Lama>

Kode Member Baru <Kode Member Baru>

Gambar 3.173 Rancangan Layar Admin Print Preview

Rancangan Layar Admin Print Preview adalah halaman dimana admin dapat

mencetak hasil pembayaran member sebagai bukti transaksi.

Print

189

<HEADER>




Username

Uang Pangkal

Iuran

<FOOTER>

Gambar 3.174 Rancangan Layar Admin Activate Member

Rancangan Layar Admin Activate Member adalah halaman dimana admin bisa

mengaktifkan member sementara menjadi member aktif sesuai dengan jenis membernya.

Halaman ini berisi link diantaranya: Home, Search News, Add News, Search Gallery,

Add Gallery, Change Password, Switch User, Search Member Data, Search Member

Property, Comment, Booking, Search Absence, Add Absence, Search Payment, Activate

Member, Extend Member.

Activat Reset

190

<HEADER>




Data pembayaran berhasil ditambahkan dan aktivasi member berhasil dilakukan

Klik link dibawah ini untuk melakukan pencetakan

Print Preview

Back To Home

<FOOTER>

Gambar 3.175 Rancangan Layar Admin Success Activate Member

Rancangan Layar Admin Success Activate Member adalah halaman dimana

admin telah berhasil mengaktifkan member sementara menjadi member aktif. Halaman




Extend Member, Print Preview.

191

HEADER



<WELCOME TO

ADMIN>


ADMIN>

Kode Member :

Masa Keanggotaan :

Iuran :

FOOTER

Gambar 3.176 Rancangan Layar Admin Extend Member

Rancangan Layar Admin Extend Member adalah halaman dimana admin bisa

memperpanjang masa keanggotaan member aktif. Halaman ini berisi link diantaranya:




Pilih

0

V

Extend Reset

192

<HEADER>




Data pembayaran berhasil ditambahkan dan masa keanggotaan member berhasil

diperpanjang

Klik link dibawah ini untuk melakukan pencetakan

Print Preview

Back To Home

<FOOTER>

Gambar 3.177 Rancangan Layar Admin Success Extend Member

Rancangan Layar Admin Success Extend Member adalah halaman dimana admin

telah berhasil melakukan perpanjangan masa keanggotaan terhadap member yang

bersangkutan. Halaman ini berisi link diantaranya: Home, Search News, Add News,

Search Gallery, Add Gallery, Change Password, Switch User, Search Member Data,

Search Member Property, Comment, Booking, Search Absence, Add Absence, Search

Payment, Activate Member, Extend Member.

193

3.3.8 Spesifikasi Proses

Spesifikasi proses adalah suatu pernyataan cara yang ditempuh untuk

mengarahkan aliran input menjadi aliran output melalui fungsi utama rancangan

dan diambil dari modul dalam bagan terstruktur.

Penggunaan spesifikasi proses untuk merancang dan menulis program

secara terstruktur dalam Sistem Informasi Manajemen Keanggotaan pada PT.

Tunas Tangkas Primaraga Sakti yang diusulkan adalah:

Modul Login Sistem Informasi Manajemen Keanggotaan

Open Layar Index

Input Username

Input Password

IF Username dan Password tidak terdapat dalam database THEN

Kembali ke layar Index dan tampilkan kesalahan

ELSE IF Username = “admin” THEN

Pindah ke halaman Admin Home

ELSE

Pindah ke halaman Member Home

END IF

End Modul

Modul Forgot Password

Open Layar Forgot Password

Input Username

194

Input E-mail

IF Username dan E-mail tidak terdapat dalam database THEN

Kembali ke layar Forgot Password dan tampilkan kesalahan

ELSE

Pindah ke halaman Success

END IF

End Modul

Modul Sign Up

Open Layar Sign Up

Input Data Pribadi

Input Data Perusahaan

IF Validasi tidak berhasil THEN

Kembali ke layar Sign Up dan tampilkan kesalahan

ELSE

Insert Data Pribadi dan Data Perusahaan ke database


END IF

End Modul

Modul About Us

Open Layar About Us

Tampil informasi About Us

End Modul

195

Modul Contact Us

Open Layar Contact Us

Input E-mail

Input Komentar


Kembali ke layar Contact Us dan tampilkan kesalahan

ELSE

Insert data E-mail dan Komentar ke database


END IF

End Modul

Modul Gallery

Open Layar Gallery

Tampil informasi gambar Gallery

IF klik gambar Gallery THEN

Tampil halaman Show Gallery

END IF

End Modul

Modul Help

Open Layar Help

Tampil link-link Help

196

IF klik salah satu link THEN

Tampil informasi Help

END IF

End Modul

Modul Member Home

Open Layar Member Home

Baca Database

Tampil daftar informasi News

IF klik link Selengkapnya THEN

Tampil halaman News

Baca Database

Tampil Full Detail News

END IF

End Modul

Modul Member Profile

Open Layar Profile

Baca Database

Tampil Data Pribadi dan Data Perusahaan

IF klik link View Family Data THEN

Tampil halaman View Family Data

Baca Database

Tampil Data Suami / Istri dan Data Anak-Anak

197

ELSE IF klik link View Partner Data THEN

Tampil halaman View Partner Data

Baca Database

Tampil Data Partner

ELSE IF klik link View School Data THEN

Tampil halaman View School Data

Baca Database

Tampil Data Sekolah / Universitas

END IF

End Modul

Modul Member Edit Profile

Open Layar Edit Profile

IF klik link Change Password THEN

Tampil halaman Change Password

Input Password Lama

Input Password Baru

Input Konfirmasi Password Baru


Kembali ke layar Change Password dan tampilkan

kesalahan

ELSE

Update data Password di database

Pindah ke halaman Member Success

198

END IF

ELSE IF klik link Change Image THEN

Tampil halaman Change Image

Input Image


Kembali ke layar Change Image dan tampilkan kesalahan

ELSE

Update data Image di database


END IF

ELSE IF klik link Edit Spouse Data THEN

Tampil halaman Edit Spouse Data

Edit Data Suami / Istri


Kembali ke layar Edit Spouse Data dan tampilkan

kesalahan

ELSE

Update Data Suami / Istri di database


END IF

ELSE IF klik link Edit Child Data THEN

Tampil halaman View Child Data

Baca Database

Tampil daftar Data Anak-Anak

199

IF klik button Edit THEN

Tampil halaman Edit Child Data

Edit Data Anak


Kembali ke layar Edit Child Data dan tampilkan

kesalahan

ELSE

Update Data Anak di database


END IF

END IF

ELSE IF klik link Edit Partner Data THEN

Tampil halaman Edit Partner Data

Edit Data Partner


Kembali ke layar Edit Partner Data dan tampilkan

kesalahan

ELSE

Update Data Partner di database


END IF

ELSE IF klik link Edit School Data THEN

Tampil halaman Edit School Data

Edit Data Sekolah / Universitas

200


Kembali ke layar Edit School Data dan tampilkan

kesalahan

ELSE

Update Data Sekolah / Universitas di database


END IF

ELSE

Edit Data Pribadi

Edit Data Perusahaan


Kembali ke layar Edit Profile dan tampilkan kesalahan

ELSE

Update Data Pribadi dan Data Perusahaan di database


END IF

END IF

End Modul

Modul Member Registration

Open Layar Registration

Pilih Jenis Keanggotaan

Pilih Masa Keanggotaan


201

Kembali ke layar Registration dan tampilkan kesalahan

ELSE

Insert data Jenis Keanggotaan dan Masa Keanggotaan ke

database


END IF

End Modul

Modul Member Add Family Data

Open Layar Add Family Data

IF klik link Add Spouse Data THEN

Tampil halaman Add Spouse Data

Input Data Suami / Istri


Kembali ke layar Add Spouse Data dan tampilkan

kesalahan

ELSE

Insert Data Suami / Istri ke database


END IF

ELSE IF klik link Add Child Data THEN

Tampil halaman Add Child Data

Input Data Anak


202

Kembali ke layar Add Child Data dan tampilkan kesalahan

ELSE

Insert Data Anak ke database


END IF

END IF

End Modul

Modul Member Add Partner Data

Open Layar Add Partner Data

Input Data Partner


Kembali ke layar Add Partner Data dan tampilkan kesalahan

ELSE

Insert Data Partner ke database


END IF

End Modul

Modul Member Add School Data

Open Layar Add School Data

Input Data Sekolah / Universitas


Kembali ke layar Add School Data dan tampilkan kesalahan

203

ELSE

Insert Data Sekolah / Universitas ke database


END IF

End Modul

Modul Member Booking

Open Layar Booking

Pilih Tempat

Pilih Jam


Kembali ke layar Booking dan tampilkan kesalahan

ELSE

Insert data Tempat dan Jam ke database


END IF

End Modul

Modul Member Konfirmasi Tagihan

Open Layar Konfirmasi Tagihan

Baca Database

Tampil status tagihan untuk aktivasi member dan perpanjangan masa

keanggotaan member

End Modul

204

Modul Member Konfirmasi Pembayaran

Open Layar Konfirmasi Pembayaran

Baca Database

Tampil status histori pembayaran

End Modul

Modul Admin Search Member Data

Open Layar Search Member Data

Pilih Kriteria Member Aktif / Non-Aktif

Pilih Kriteria Data

Input Data

Tampil halaman View Member Data

Baca Database

Tampil daftar Member Data

IF klik link Detail THEN

Tampil halaman Detail Member

Baca Database

Tampil Data Pribadi dan Data Perusahaan

IF klik link View Family Data THEN

Tampil halaman View Family Data

Baca Database

Tampil Data Suami / Istri dan Data Anak-Anak

ELSE IF klik link View Partner Data THEN

205

Tampil halaman View Partner Data

Baca Database

Tampil Data Partner

ELSE IF klik link View School Data THEN

Tampil halaman View School Data

Baca Database

Tampil Data Sekolah / Universitas

END IF

ELSE IF klik button Check All THEN

Semua Member Data terpilih

ELSE IF klik button Uncheck All THEN

Semua Member Data tidak terpilih

ELSE IF klik button Delete THEN

Delete Member Data dari database

Pindah ke halaman Admin Success

END IF

End Modul

Modul Admin Search Member Property

Open Layar Search Member Property

Pilih Kriteria Single / Family / Couple / Mahasiswa / Pelajar

Pilih Kriteria Data

Input Data

Tampil halaman View Member Property

206

Baca Database

Tampil daftar Member Property

IF klik button Check All THEN

Semua Member Property terpilih


Semua Member Property tidak terpilih


Delete Member Property dari database


END IF

End Modul

Modul Admin Search Comment

Open Layar Search Comment

Pilih Kriteria Data

Input Data

Tampil halaman View Comment

Baca Database

Tampil daftar Comment


Semua Comment terpilih


Semua Comment tidak terpilih


207

Delete Comment dari database


END IF

End Modul

Modul Admin Search Booking

Open Layar Search Booking

Pilih Kriteria Data

Input Data

Tampil halaman View Booking

Baca Database

Tampil daftar Booking


Semua Booking terpilih


Semua Booking tidak terpilih


Delete Booking dari database


END IF

End Modul

Modul Admin Search Absence

Open Layar Search Absence

208

Pilih Kriteria Data

Input Data

Tampil halaman View Absence

Baca Database

Tampil daftar Absence


Semua Absence terpilih


Semua Absence tidak terpilih


Delete Absence dari database


END IF

End Modul

Modul Admin Search Payment

Open Layar Search Payment

Pilih Kriteria Data

Input Data

Tampil halaman View Payment

Baca Database

Tampil daftar Payment

IF klik link Print THEN

Tampil halaman Print Preview untuk pembayaran

209


Semua Payment terpilih


Semua Payment tidak terpilih


Delete Payment dari database


END IF

End Modul

Modul Admin Search News

Open Layar Search News

Pilih Kriteria Data

Input Data

Tampil halaman View News

Baca Database

Tampil daftar News

IF klik link Details THEN

Tampil halaman Detail News

Baca Database

Tampil Full News Data

ELSE IF klik link Edit THEN

Tampil halaman Edit News

Edit Judul

210

Edit Berita


Kembali ke layar Edit News dan tampilkan kesalahan

ELSE

Update data Judul dan Berita di database


END IF


Semua News terpilih


Semua News tidak terpilih


Delete News dari database


END IF

End Modul

Modul Admin Search Gallery

Open Layar Search Gallery

Pilih Kriteria Data

Input Data

Tampil halaman View Gallery

Baca Database

Tampil daftar Gallery

211

IF klik link Edit THEN

Tampil halaman Edit Gallery

Edit Nama File

Edit Keterangan


Kembali ke layar Edit Gallery dan tampilkan kesalahan

ELSE

Update data Nama File dan Keterangan di database


END IF


Semua Gallery terpilih


Semua Gallery tidak terpilih


Delete Gallery dari database


END IF

End Modul

Modul Admin Activate Member

Open Layar Activate Member

Input Username

Input Uang Pangkal

212

Input Iuran


Kembali ke layar Activate Member dan tampilkan kesalahan

ELSE

Update data Jenis Member dan Kode Member di database

Insert data Username, Uang Pangkal, dan Iuran ke database


END IF

End Modul

Modul Admin Extend Member

Open Layar Extend Member

Input Kode Member

Pilih Masa Keanggotaan

Input Iuran


Kembali ke layar Extend Member dan tampilkan kesalahan

ELSE

Update data Tanggal Awal dan Tanggal Akhir member di

database

Insert data Iuran ke database


END IF

End Modul

213

Modul Admin Add Absence

Open Layar Add Absence

Input Kode Member


Kembali ke layar Add Absence dan tampilkan kesalahan

ELSE

Insert data Kode Member ke database


END IF

End Modul

Modul Admin Add News

Open Layar Add News

Input Judul

Input Berita


Kembali ke layar Add News dan tampilkan kesalahan

ELSE

Insert data Judul dan Berita ke database


END IF

End Modul

214

Modul Admin Add Gallery

Open Layar Add Gallery

Input Nama File

Input Keterangan


Kembali ke layar Add Gallery dan tampilkan kesalahan

ELSE

Insert data Nama File dan Keterangan ke database


END IF

End Modul

Modul Admin Change Password

Open Layar Change Password

Input Password Lama

Input Password Baru

Input Konfirmasi Password Baru


Kembali ke layar Change Password dan tampilkan kesalahan

ELSE

Update data Password di database


END IF

End Modul

215

Modul Admin Switch User

Open Layar Switch User

Input Username

Input Password

IF Username dan Password tidak terdapat dalam database THEN

Kembali ke layar Switch User dan tampilkan kesalahan

ELSE

Pindah ke halaman Member Home

END IF

End Modul

BAB 3 ANALISIS DAN PERANCANGAN 3.1 Latar Belakang ...thesis.binus.ac.id/doc/Bab3/2009-2-00199-IF BAB...

Documents

Transcript of BAB 3 ANALISIS DAN PERANCANGAN 3.1 Latar Belakang ...thesis.binus.ac.id/doc/Bab3/2009-2-00199-IF BAB...