BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN

(1)

31

RANCANGAN

RANCANGAN RANCANGAN RANCANGAN SISTEM SISTEM SISTEM SISTEM DAN DAN DAN DAN PROGRAM PROGRAM PROGRAM PROGRAM USULAN USULAN USULAN USULAN

4.1.4.1.

4.1.4.1. AnalisaAnalisaAnalisaAnalisa KebutuhanKebutuhanKebutuhanKebutuhan SoftwareSoftwareSoftwareSoftware A.

A.

A. TahapanTahapanTahapanTahapan AnalisisAnalisisAnalisisAnalisis

Sistem informasi penerimaan siswa baru pada Madrasah Aliyah Annajah Jakarta dimana calon siswa dapat melakukan proses pendaftran dan melihat pengumuman serta dapat berinterkasi dengan pihak Madrasah Aliyah Annajah tersebut secara langsung. Para calon siswa dapat mengakses sistem pendaftran penerimaan siswa baru tersebut melalui media browser. Berikut ini spesifikasi kebutuhan (system requirement) dari system penerimaan siswa baru berbasis web.

Halaman peserta :

A1. Peserta dapat melakukan pendaftaran A2. Peserta dapat melihat hasil pendaftaran

A3. Peserta dapat melakukan konfirmasi pembayaran Halaman Admin :

B1. Admin dapat mengelola daftar calon siswa B2. Admin dapat mengelola verifikasi pembayaran

(2)

B3. Admin dapat melihat pesan masuk B4. Admin dapat mengelola pengumuman B.B.

B.B. UseUseUseUse CaseCaseCaseCase DiagramDiagramDiagramDiagram

Kegiatan sistem informasi penerimaan siswa baru pada MA Islam Annajah Jakarta digambarkan olehBusiness Use Case Diagramsebagai berikut:

1.1.1.1. UseUseUseUse CaseCaseCaseCase DiagramDiagramDiagramDiagramHalamanHalamanHalamanHalaman pesertapesertapesertapeserta

Use Case Diagram Use Case Diagram Use Case Diagram

Use Case DiagramHalaman pesertaHalaman pesertaHalaman pesertaHalaman peserta

Pengunjung

lo g in

data peserta D ata peserta

pendaftaran

K onfirmasi pembayaran H asil pendaftaran

H asil pengumuman pendaftaran peserta

logout

ex ten d

Gambar Gambar GambarGambar IV.1IV.1IV.1IV.1 UseUse

UseUse CaseCaseCaseCase DiagramDiagramDiagramDiagramHalamanHalamanHalamanHalaman PesertaPesertaPesertaPeserta

(3)

2.

2.2.2. UseUseUseUse CaseCaseCaseCase DiagramDiagramDiagramDiagramHalamanHalamanHalamanHalaman AdminAdminAdminAdmin

Gambar Gambar GambarGambar IV.2IV.2IV.2IV.2 UseUse

UseUse CaseCaseCaseCase DiagramDiagramDiagramDiagramHalamanHalamanHalamanHalaman AdminAdminAdminAdmin

(4)

a. Deskripsi Use Case Diagram Sistem Informasi Penerimaan Siswa Baru Mengelola Halaman biodata diri:

Tabel Tabel Tabel Tabel IV.1IV.1IV.1IV.1 Deskripsi

Deskripsi Deskripsi

DeskripsiUseUseUseUse CaseCaseCaseCaseSistemSistemSistemSistem InformasiInformasiInformasiInformasi PenerimaanPenerimaanPenerimaanPenerimaan SiswaSiswaSiswaSiswa BaruBaruBaruBaru MengelolaMengelolaMengelolaMengelola Halaman

Halaman Halaman

Halaman PendaftaranPendaftaranPendaftaranPendaftaran PesertaPesertaPesertaPeserta BaruBaruBaruBaru

UseUseUseUse CaseCaseCaseCase NameNameNameName HalamanHalamanHalamanHalaman pendaftaranpendaftaranpendaftaranpendaftaran pesertapesertapesertapeserta BaruBaruBaruBaru Requirements

RequirementsRequirementsRequirements A1A1A1A1

GoalGoalGoalGoal PesertaPesertaPesertaPeserta dapatdapatdapatdapat melakukanmelakukanmelakukanmelakukan pendaftaran

pendaftaran pendaftaran pendaftaran Pre-conditions

Pre-conditionsPre-conditionsPre-conditions PesertaPesertaPesertaPeserta telahtelahtelahtelah loginloginloginlogin Post-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform pendaftaran

pendaftaran pendaftaran pendaftaran Failed

FailedFailedFailed andandandand conditionconditionconditioncondition SistemSistemSistemSistem tidaktidaktidaktidak dapatdapatdapatdapat menampilkanmenampilkanmenampilkanmenampilkan formform

form

form pendaftaranpendaftaranpendaftaranpendaftaran Primary

PrimaryPrimaryPrimary ActorsActorsActorsActors PesertaPesertaPesertaPeserta

MainMainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPath 1.1.1.1. SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform pendaftaran

pendaftaranpendaftaranpendaftaran

(5)

Invariant

InvariantInvariantInvariant A.1.A.1.A.1.A.1. PesertaPesertaPesertaPeserta inputinputinputinput datadatadatadata diridiridiridiri pesertapesertapesertapeserta A.2.A.2.

A.2.A.2. PesertaPesertaPesertaPeserta pilihpilihpilihpilih simpansimpansimpansimpan A.3.A.3.

A.3.

A.3. SistemSistemSistemSistem menyimpanmenyimpanmenyimpanmenyimpan datadatadatadata pesertapesertapesertapeserta

b. Deskripsi Use Case Diagram Sistem Informasi Penerimaan Siswa Baru Mengelola Halaman hasil pendaftran:

HalamanHalamanHalaman hasilhasilhasilhasil pendaftaranpendaftaranpendaftaranpendaftaran

UseUseUseUse CaseCaseCaseCase NameNameNameName HalamanHalamanHalamanHalaman hasilhasilhasilhasil pendaftranpendaftranpendaftranpendaftran Requirements

GoalGoalGoalGoal PesertaPesertaPesertaPeserta dapatdapatdapatdapat melihatmelihatmelihatmelihat hasilhasilhasilhasil pendaftaran

pendaftaran pendaftaran pendaftaran Pre-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan hasilhasilhasilhasil pengumuman

pengumuman pengumuman

pengumuman pendaftaranpendaftaranpendaftaranpendaftaran pesertapesertapesertapeserta Failed

FailedFailedFailed andandandand conditionconditionconditioncondition SistemSistemSistemSistem tidaktidaktidaktidak dapatdapatdapatdapat menampilkanmenampilkanmenampilkanmenampilkan hasil

hasil hasil

hasil pengumumanpengumumanpengumumanpengumuman pendaftaranpendaftaranpendaftaranpendaftaran peserta

peserta peserta peserta Primary

PrimaryPrimaryPrimary ActorsActorsActorsActors PesertaPesertaPesertaPeserta

(6)

Main

MainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPath 1.1.1.1. PesertaPesertaPesertaPeserta memilihmemilihmemilihmemilih hasilhasilhasilhasil pendaftaranpendaftaranpendaftaranpendaftaran 2.2.2.2. SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform hasilhasilhasilhasil

pengumuman

pengumumanpengumumanpengumuman pendaftaranpendaftaranpendaftaranpendaftaran pesertapesertapesertapeserta Invariant

InvariantInvariantInvariant ----

c. Deskripsi Use Case Diagram Sistem Informasi Penerimaan Siswa Baru Mengelola Halaman hubungi kami:

HalamanHalamanHalaman konfirmasikonfirmasikonfirmasikonfirmasi pembayaranpembayaranpembayaranpembayaran

Use

UseUseUse CaseCaseCaseCase NameNameNameName HalamanHalamanHalamanHalaman KonfirmasiKonfirmasiKonfirmasiKonfirmasi PembayaranPembayaranPembayaranPembayaran Requirements

GoalGoalGoalGoal PesertaPesertaPesertaPeserta dapatdapatdapatdapat KonfirmasiKonfirmasiKonfirmasiKonfirmasi Pembayaran

Pembayaran Pembayaran Pembayaran Pre-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform Konfirmasi

Konfirmasi Konfirmasi

Konfirmasi PembayaranPembayaranPembayaranPembayaran Failed

FailedFailedFailed andandandand conditionconditionconditioncondition SistemSistemSistemSistem tidaktidaktidaktidak dapatdapatdapatdapat menampilkanmenampilkanmenampilkanmenampilkan Konfirmasi

Konfirmasi Konfirmasi

Konfirmasi PembayaranPembayaranPembayaranPembayaran

(7)

Primary

PrimaryPrimaryPrimary ActorsActorsActorsActors PesertaPesertaPesertaPeserta Main

MainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPath 1.1.1.1. PesertaPesertaPesertaPeserta memilihmemilihmemilihmemilih KonfirmasiKonfirmasiKonfirmasiKonfirmasi pembayaran

pembayaranpembayaranpembayaran

2.2.2.2. SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform Konfirmasi

KonfirmasiKonfirmasiKonfirmasi PembayaranPembayaranPembayaranPembayaran Invariant

InvariantInvariantInvariant A.1.A.1.A.1.A.1. PesertaPesertaPesertaPeserta inputinputinputinput NamaNamaNamaNama PemilikPemilikPemilikPemilik Rekening

RekeningRekeningRekening A.2.

A.2.

A.2. PesertaPesertaPesertaPeserta InputInputInputInput NomorNomorNomorNomor RekeningRekeningRekeningRekening A.3.

A.3.

A.3. PesertaPesertaPesertaPeserta InputInputInputInput JumlahJumlahJumlahJumlah PembayaranPembayaranPembayaranPembayaran A.4.A.4.

A.4.A.4. PesertaPesertaPesertaPeserta PilihPilihPilihPilih konfirmasikonfirmasikonfirmasikonfirmasi A.5.

A.5.

A.5. SistemSistemSistemSistem MenyimpanMenyimpanMenyimpanMenyimpan datadatadatadata Pembayaran

PembayaranPembayaranPembayaran

d. Deskripsi Use Case Diagram Sistem Informasi Penerimaan Siswa Baru Mengelola Halaman daftar calon siswa:

Halaman daftardaftardaftardaftar caloncaloncaloncalon siswasiswasiswasiswa

Use

UseUseUse CaseCaseCaseCase NameNameNameName HalamanHalamanHalamanHalaman daftardaftardaftardaftar caloncaloncaloncalon siswasiswasiswasiswa Requirements

RequirementsRequirementsRequirements B1B1B1B1 Goal

GoalGoalGoal AdminAdminAdminAdmin dapatdapatdapatdapat melihatmelihatmelihatmelihat daftardaftardaftardaftar caloncaloncaloncalon siswa

siswa siswa

siswa yangyangyangyang telahtelahtelahtelah terdaftarterdaftarterdaftarterdaftar Pre-conditions

Pre-conditionsPre-conditionsPre-conditions AdminAdminAdminAdmin telahtelahtelahtelah loginloginloginlogin

(8)

Post-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan daftardaftardaftardaftar caloncaloncaloncalon siswa

siswa siswa

siswa yangyangyangyang telahtelahtelahtelah terdaftarterdaftarterdaftarterdaftar Failed

FailedFailedFailed andandandand conditionconditionconditioncondition SistemSistemSistemSistem tidaktidaktidaktidak dapatdapatdapatdapat menampilkanmenampilkanmenampilkanmenampilkan daftar

daftar daftar

daftar caloncaloncaloncalon siswasiswasiswasiswa yangyangyangyang telahtelahtelahtelah terdaftar

terdaftar terdaftar terdaftar Primary

PrimaryPrimaryPrimary ActorsActorsActorsActors AdminAdminAdminAdmin

MainMainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPath 1.1.1.1. AdminAdminAdminAdmin memilihmemilihmemilihmemilih daftardaftardaftardaftar caloncaloncaloncalon siswasiswasiswasiswa 2.

2.2.2. AdminAdminAdminAdmin memilihmemilihmemilihmemilih menumenumenumenu viewviewviewview 3.

3.3.3. SystemSystemSystemSystem menampilkanmenampilkanmenampilkanmenampilkan detaildetaildetaildetail daftardaftardaftardaftar calon

caloncaloncalon siswasiswasiswasiswa yangyangyangyang telahtelahtelahtelah terdaftarterdaftarterdaftarterdaftar Invariant

InvariantInvariantInvariant AAAA - Invariant

InvariantInvariantInvariant BBBB ----

e. DeskripsiUse CaseSistem Informasi penerimaan siswa baru Mengelola verifikasi pembayaran

DeskripsiUseUseUseUse CaseCaseCaseCaseSistemSistemSistemSistem InformasiInformasiInformasiInformasi penerimaanpenerimaanpenerimaanpenerimaan siswasiswasiswasiswa barubarubarubaru Mengelola

Mengelola Mengelola

Mengelola verifikasiverifikasiverifikasiverifikasi pembayaranpembayaranpembayaranpembayaran

UseUseUseUse CaseCaseCaseCase NameNameNameName MengelolaMengelolaMengelolaMengelola verifikasiverifikasiverifikasiverifikasi pembayaranpembayaranpembayaranpembayaran Requirements

GoalGoalGoal AdminAdminAdminAdmin dapatdapatdapatdapat merubahmerubahmerubahmerubah statusstatusstatusstatus pembayaran

pembayaran pembayaran pembayaran

(9)

Pre-conditions

Pre-conditionsPre-conditionsPre-conditions AdminAdminAdminAdmin telahtelahtelahtelah loginloginloginlogin Post-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform verifikasiverifikasiverifikasiverifikasi pembayaran

pembayaran pembayaran pembayaran Failed

formform verifikasiverifikasiverifikasiverifikasi pembayaranpembayaranpembayaranpembayaran Primary

MainMainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPath 1.1.1.1. AdminAdminAdminAdmin memilihmemilihmemilihmemilih verifikasiverifikasiverifikasiverifikasi pembayaran

pembayaranpembayaranpembayaran

2.2.2.2. SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform verifikasiverifikasiverifikasiverifikasi pembayaran

pembayaranpembayaranpembayaran Invariant

InvariantInvariantInvariant AAAA A.1.A.1.A.1.A.1. AdminAdminAdminAdmin inputinputinputinput idididid pesertapesertapesertapeserta A.2.A.2.

A.2.A.2. AdminAdminAdminAdmin memilihmemilihmemilihmemilih menumenumenumenu tambahtambahtambahtambah A.3.A.3.

A.3.A.3. SistemSistemSistemSistem menyimpanmenyimpanmenyimpanmenyimpan statusstatusstatusstatus pembayaran

pembayaranpembayaranpembayaran Invariant

a. DeskripsiUse CaseSistem Informasi penerimaan siswa baru mengelola pengumuman

DeskripsiDeskripsiDeskripsiUseUseUseUse CaseCaseCaseCaseSistemSistemSistemSistem InformasiInformasiInformasiInformasi penerimaanpenerimaanpenerimaanpenerimaan siswasiswasiswasiswa barubarubarubaru MengelolaMengelolaMengelolaMengelola pengumumnan

pengumumnan pengumumnan pengumumnan

(10)

Use

UseUseUse CaseCaseCaseCase NameNameNameName mengelolamengelolamengelolamengelola pengumumanpengumumanpengumumanpengumuman Requirements

GoalGoalGoal AdminAdminAdminAdmin dapatdapatdapatdapat memmberikanmemmberikanmemmberikanmemmberikan informasi

informasi informasiinformasi Pre-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform pengumuman

pengumuman pengumumanpengumuman Failed

FailedFailedFailed andandandand conditionconditionconditioncondition SistemSistemSistemSistem tidaktidaktidaktidak dapatdapatdapatdapat menampilkanmenampilkanmenampilkanmenampilkan form

form

formform pengumumanpengumumanpengumumanpengumuman Primary

MainMainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPathmemilihmemilihmemilihmemilih menumenumenumenu pengumumanpengumumanpengumumanpengumuman menampilkan

menampilkan menampilkan

menampilkan pengumumanpengumumanpengumumanpengumuman

Invariant

InvariantInvariantInvariant AAAA 1.1.1.1. AdminAdminAdminAdmin inputinputinputinput juduljuduljuduljudul dandandandan isiisiisiisi beritaberitaberitaberita 2.

2.

2. adminadminadminadmin memilihmemilihmemilihmemilih menumenumenumenu postpostpostpost 3.3.

3.3. systemsystemsystemsystem meyimpanmeyimpanmeyimpanmeyimpan pengumumanpengumumanpengumumanpengumuman

Invariant

b. DeskripsiUse CaseSistem Informasi penerimaan siswa baru Mengelola hubungi kami

(11)

DeskripsiDeskripsiDeskripsiUseUseUseUse CaseCaseCaseCaseSistemSistemSistemSistem InformasiInformasiInformasiInformasi penerimaanpenerimaanpenerimaanpenerimaan siswasiswasiswasiswa barubarubarubaru MengelolaMengelolaMengelolaMengelola hubungi

hubungi hubungi hubungi kamikamikamikami

Use

UseUseUse CaseCaseCaseCase NameNameNameName MengelolaMengelolaMengelolaMengelola hubungihubungihubungihubungi kamikamikamikami Requirements

GoalGoalGoal AdminAdminAdminAdmin dapatdapatdapatdapat pesanpesanpesanpesan masukmasukmasukmasuk Pre-conditions

Post-conditionsPost-conditionsPost-conditions SistemSistemSistemSistem menampilkanmenampilkanmenampilkanmenampilkan formformformform kotakkotakkotakkotak pesan

pesan pesan

pesan masukmasukmasukmasuk Failed

form

formkotakkotakkotakkotak pesanpesanpesanpesan masukmasukmasukmasuk Primary

PrimaryPrimaryPrimary ActorsActorsActorsActors AdminAdminAdminAdmin Main

MainMainMain Flow/BasicFlow/BasicFlow/BasicFlow/Basic PathPathPathPathmemilihmemilihmemilihmemilih menumenumenumenu hubungihubungihubungihubungi kamikamikamikami menampilkan

menampilkan menampilkan

menampilkanformformformformkotakkotakkotakkotak pesanpesanpesanpesan masukmasukmasukmasuk

Invariant

InvariantInvariantInvariant ----

2.2.

2.2. ActivityActivityActivityActivity DiagramDiagramDiagramDiagram

1. Activity Diagramhalaman Peserta

(12)

P eser ta P eser ta P eser ta

P eser ta S i s t e mS i s t e mS i s t e mS i s t e m

L o g in p e sr ta

In p u t p a ssw o r d In p u t u se r n a m e

C e k u se r n a m e d a n p a ssw o r d

M e n a m p ilka n h a la m a n a d m in

V a lid ? T id a k

Y a

Gambar Gambar Gambar Gambar IV.IV.IV.IV.3333 Activity

Activity Activity

Activity DiagramDiagramDiagramDiagram LoginLoginLoginLoginHalamanHalamanHalamanHalaman PesertaPesertaPesertaPeserta

(13)

2.

2. Activity DiagramMengelola biodata diri

ActivityActivityActivity DiagramDiagramDiagramDiagramPesertaPesertaPesertaPeserta MengelolaMengelolaMengelolaMengelola biodatabiodatabiodatabiodata diridiridiridiri

(14)

3.3.

3.

3. Activity DiagramMengelola hasil pendaftaran

Activity

ActivityActivity DiagramDiagramDiagramDiagramPesertaPesertaPesertaPeserta MengelolaMengelolaMengelolaMengelola HasilHasilHasilHasil PendaftaranPendaftaranPendaftaranPendaftaran

4.4.

4.4. Activity DiagramMengelola hubungi kami

(15)

i

Activity DiagramDiagramDiagramDiagramPesertaPesertaPesertaPeserta MengelolaMengelolaMengelolaMengelola HubungiHubungiHubungiHubungi KamiKamiKamiKami

(16)

5. Activity Diagramhalaman admin

ActivityActivityActivity DiagramDiagramDiagramDiagramAdminAdminAdminAdmin MengelolaMengelolaMengelolaMengelola loginloginloginlogin adminadminadminadmin

(17)

6. Activity Diagramdaftar calon siswa

Activity DiagramDiagramDiagramDiagramAdminAdminAdminAdmin MengelolaMengelolaMengelolaMengelola daftardaftardaftardaftar caloncaloncaloncalon siswasiswasiswasiswa

(18)

7. Activity Diagramverifikasi pembayaran

Activity DiagramDiagramDiagramDiagramAdminAdminAdminAdmin MengelolaMengelolaMengelolaMengelola verifikasiverifikasiverifikasiverifikasi pembayaranpembayaranpembayaranpembayaran

(19)

8. Activity Diagramhubungi kami

Gambar GambarGambarGambar IV.IV.IV.IV.10101010 Activity

ActivityActivityActivity DiagramDiagramDiagramDiagramAdminAdminAdminAdmin MengelolaMengelolaMengelolaMengelola HubungiHubungiHubungiHubungi KamiKamiKamiKami

(20)

9. Activity Diagrampengumuman

(21)

Gambar GambarGambarGambar IV.IV.IV.IV.11111111 Activity

ActivityActivityActivity DiagramDiagramDiagramDiagramAdminAdminAdminAdmin MengelolaMengelolaMengelolaMengelola pengumumanpengumumanpengumumanpengumuman

4.2.4.2.

4.2.4.2. DesainDesainDesainDesain

Pada tahapan ini akan menjelaskan tentang desain database, desain software architecturedan desain user interfacedari sistem informasi akademik pada madrasah aliyah annajah Jakarta.

(22)

4.2.1.

4.2.1.4.2.1.DatabaseDatabaseDatabaseDatabase

Menggambarkan hubungan antar tabel yang dibuat beserta relasi antar tabel. Perancangan basis data menghasilkan pemetaan tabel-tabel yang digambarkan dengan Entity Relationship Diagram (ERD) dan Logical Record Structure(LRS).

1. Entity Relationship Diagram(ERD)

Gambar Gambar Gambar Gambar IV.12IV.12IV.12IV.12 Entity

Entity

EntityEntity RelationshipRelationshipRelationshipRelationship DiagramDiagramDiagramDiagram

(23)

2. Logical Record Structure(LRS)

1 1 M 1

Pembayaran I d _A dm in I d _pendafatran I d _pem bayaran Statu s

Tgl _pem bayaran Peserta

i d _peserta na m a alamat tm p _lahir tg l _lahir sekola h I n d In g M a t Ip a Ip s N u n ortu alam at_ortu pendidikan pekerjaan penghasilan

ad m in i d _adm in username p ass n am a

Gambar Gambar Gambar Gambar IV.13IV.13IV.13IV.13 Logical

LogicalLogicalLogical RecordRecordRecordRecord StructureStructureStructureStructure

3.

3. SpesifikasiSpesifikasiSpesifikasiSpesifikasiFileFileFileFile

a. SpesifikasiFileTabel user

NamaDatabase : penerimaan NamaFile : Tabel user

Akronim : user.myd

TipeFile :File Master

AksesFile :Random

PanjangRecord : 80Byte

(24)

KunciField : id_user

Tabel TabelTabelTabel IV.8IV.8IV.8IV.8 Spesifikasi Spesifikasi Spesifikasi

SpesifikasiFileFileFileFileuseruseruseruser

No Elemen Data Nama Field Type Size Keterangan

1 Id_user Id_user varchar 10 Primary Key

1 username Username varchar 30

2 password Pass varchar 10

3 Nama user Nama varcahar 30

b. SpesifikasiFileTabel peserta NamaDatabase : penerimaan NamaFile : Tabel peserta

Akronim : peserta.myd

TipeFile :File Master

AksesFile :Random

PanjangRecord : 380Byte KunciField : id_peserta

(25)

Tabel TabelTabelTabel IV.9IV.9IV.9IV.9 Spesifikasi

SpesifikasiSpesifikasiSpesifikasiFileFileFileFilepesertapesertapesertapeserta

No Elemen Data Nama Field Type Size Keterangan 1 Id peserta Id_peserta varhar 10 Primary Key 2 Nama peserta Nama varchar 50 Foreign Key 3 Alamat

peserta

Alamat varchar 50

4 Tempat lahir Tmp_lahir varchar 30 5 Tanggal lahir Tgl_lahir date

6 Sekolah asal Sekolah varchar 30

7 indonesia Ind varchar 10

8 inggris Ing varchar 10

9 matematika Mat varchar 10

10 Ipa Ipa varchar 10

(26)

11 Ips Ips varchar 10 12 Nilai ujian

nasional

Nun varchar 10

13 Nama orang tua

Ortu Varchar 30

13 Alamat orang tua

Alamat_ortu Varchar 50

14 Pendidikan orang tua

Pendidikan Varchar 10

15 Pekerjaan orang tua

Pekerjaan Varchar 30

16 Penghasilan orang tua

Penghasilan Varchar 30

c. Spesifikasi File Tabel hubungi

Nama Database : penerimaan Nama File : Tabel hubungi

Akronim : hubungi.myd

(27)

Tipe File : File Master Akses File : Random Panjang Record : 80 byte Kunci Field : id_hubungi

Tabel Tabel Tabel Tabel IV.10IV.10IV.10IV.10 Spesifikasi

Spesifikasi Spesifikasi

Spesifikasi FileFileFileFile TabelTabelTabelTabel hubungihubungihubungihubungi

No Elemen Data Nama Field Type Size Keterangan 1 Id hubungi Id_hubungi varchar 10 Primary Key 2 Id_peserta Id_peserta varchar 10

3 Nama nama Varchar 30

4 Email Email Varchar 30

5 Pesan Pesan Text

6 Tanggal_hubungi Tanggal hubungi

date

(28)

d. Spesifikasi File Tabel pembayaran

Nama Database : penerimaan Nama File : Tabel pembayaran

Akronim : pembayaran.myd

Tipe File : File Transaksi Akses File : Random Panjang Record : 42byte

Kunci Field : id_pembayaran Tabel

Tabel Tabel Tabel IV.11IV.11IV.11IV.11 Spesifikasi

Spesifikasi FileFileFileFile TabelTabelTabelTabel pembayaranpembayaranpembayaranpembayaran

No Elemen Data Nama Field Type Size Keterang

an 1 Id_pembayaran Id_ pembayaran Varchar 15 Primary

key

1 Id_user Id_user Int 10

2 Id_peserta Id_peserta Varchar 10

(29)

3 Status_pembayaran Status_pembayaran int 7 4 Tanggal_pembayara

n

Tanggal_pembayara n

date

e. Spesifikasi File Tabel pengumuman

Nama Database : penerimaan

Nama File : Tabel pengumuman

Akronim : pengumuman.myd

Tipe File : File Master Akses File : Random Panjang Record : 208 byte

Kunci Field : id_pengumuman

SpesifikasiSpesifikasiSpesifikasi FileFileFileFile TabelTabelTabelTabel pengumumanpengumumanpengumumanpengumuman

(30)

No Elemen Data Nama Field Type Size Keterangan 1 Id

Pengumuman

Id_pengumuman varchar 8 Primary Key

2 Judul

pengumuman

Judul Varchar 100 Foreign

Key

3 Isi

pengumuman

Isi Varchar 100

4 Tanggal pengumuman

Tgl_pengumuman Date

f. Spesifikasi File Tabel filepeserta

Nama Database : penerimaan Nama File : Tabel filepeserta Akronim : filepeserta.myd Tipe File : File Master Akses File : Random Panjang Record : 186 byte Kunci Field : id_upload

(31)

Spesifikasi FileFileFileFile TabelTabelTabelTabel filepesertafilepesertafilepesertafilepeserta

an

1 Id_upload Id_ upload Int 11 Primary

key

2 Id_peserta Id_peserta varchar 25

3 Nama_File Nama_file Varchar 50

4 Direktori Direktori Varchar 100

g. Spesifikasi File Tabel konfirmasi pembayaran Nama Database : penerimaan Nama File : Tabel konpem

Akronim : konpem.myd

Tipe File : File Master Akses File : Random Panjang Record : 116 byte

(32)

Kunci Field : id_konpem

Spesifikasi FileFileFileFile TabelTabelTabelTabel KonfirmasiKonfirmasiKonfirmasiKonfirmasi pembayaranpembayaranpembayaranpembayaran

an

1 Id_konpem Id_ konpem Int 11 Primary

key

3 Namapemilik_reken ing

Namapemilik_reken ing

Varchar 35

4 Nomor_rekening Nomor_rekening Varchar 20

5 Jumlah Jumlah Varchar 15

6 Tanggal_pembayara n

Tanggal_pembayara n

Date

7 Tanggal_konpem Tanggal_konpem Date

8 Status_konpem Status_kompem Varchar 10

h. Spesifikasi File Tabel verifikasi pembayaran

(33)

Nama Database : penerimaan Nama File : Tabel verpem

Akronim : verpem.myd

Tipe File : File Master Akses File : Random Panjang Record : 58 byte Kunci Field : id_verpem

Spesifikasi FileFileFileFile TabelTabelTabelTabel VerifikasiVerifikasiVerifikasiVerifikasi pembayaranpembayaranpembayaranpembayaran

an

1 Id_verpem Id_ verpem Int 11 Primary

key

2 Id_konpem Id_konpem Int 11

3 Id_user Id_user Int 11

5 Tgl_verpem Tgl_verpem date

(34)

4.2.2

4.2.24.2.24.2.2 SoftwareSoftwareSoftwareSoftware ArchitectureArchitectureArchitectureArchitecture A.A.A.A. ComponentComponentComponentComponent DiagramDiagramDiagramDiagram

Component Diagram menggambarkan struktur dan hubungan antar komponen piranti lunak. Berikut adalah gambaran component diagram:

Halaman pengunjung Halaman pengunjung Halaman pengunjung Halaman pengunjung

Application Database Application Database Application Database Application Database

Halaman admin Halaman admin Halaman admin Halaman admin Bootstrap

Bootstrap Bootstrap Bootstrap....m inm inm inm in ....c s sc s sc s sc s s

jq u ery jq u ery jq u ery jq u ery ....m inm inm inm in ....j sjsjsjs

Xampp server Xampp server Xampp server Xampp server

MYSQL Database MYSQL Database MYSQL Database MYSQL Database

Gambar Gambar Gambar Gambar IV.14IV.14IV.14IV.14

(35)

Component Component Component

Component DiagramDiagramDiagramDiagram

B.

B.B.B. DeploymentDeploymentDeploymentDeployment DiagramDiagramDiagramDiagram

Menggambarkan tata letak sistem secara fisik, yang menampakkan bagian-bagian software yang berjalan pada hardware yang digunakan untuk mengimplementasikan sebuah sistem dan keterhubungan antara komponen hardware-hardware tersebut.

W eb Server W eb Server W eb Server W eb Server

Halaman pengunjung Halaman pengunjung Halaman pengunjung Halaman pengunjung

Halaman admin Halaman admin Halaman adminHalaman admin

Bootstrap BootstrapBootstrapBootstrap....m inm inm inm in....c s sc s sc s sc s s

jquery jqueryjqueryjquery ....m inm inm inm in....j sjsjsjs

xampp Server xampp Server xampp Serverxampp Server

Database Server Database Server Database Server Database Server

Application Database Application DatabaseApplication DatabaseApplication Database MYSQL Database MYSQL Database MYSQL DatabaseMYSQL Database

Client PC Client PC Client PCClient PC

Browser Browser Browser Browser

(36)

Gambar Gambar Gambar Gambar IV.15IV.15IV.15IV.15 Deployment Deployment

DeploymentDeployment DiagramDiagramDiagramDiagram 4.2.3.

4.2.3.4.2.3.4.2.3. UserUserUserUser InterfaceInterfaceInterfaceInterface

User Interface adalah tampilan program atau website yang dibuat oleh penulis. Berikut adalah user interface dari sistem infoemasi penerimaan siswa baru:

Gambar Gambar Gambar Gambar IV.16IV.16IV.16IV.16 Halaman

Halaman PengunjungPengunjungPengunjungPengunjung

(37)

Gambar Gambar Gambar Gambar IV.17IV.17IV.17IV.17 FormForm

FormForm pendaftaranpendaftaranpendaftaranpendaftaran

(38)

Halaman

HalamanHalaman PesertaPesertaPesertaPeserta

Gambar Gambar Gambar Gambar IV.19IV.19IV.19IV.19 FormForm

FormForm HasilHasilHasilHasil PengumumanPengumumanPengumumanPengumuman PendaftaranPendaftaranPendaftaranPendaftaran PesertaPesertaPesertaPeserta

(39)

Halaman HubungiHubungiHubungiHubungi KamiKamiKamiKami

HalamanHalamanHalaman KonfirmasiKonfirmasiKonfirmasiKonfirmasi PembayaranPembayaranPembayaranPembayaran

(40)

HalamanHalamanHalaman AdminAdminAdminAdmin

(41)

Halaman

HalamanHalaman DaftarDaftarDaftarDaftar CalonCalonCalonCalon SiswaSiswaSiswaSiswa YangYangYangYang TerdaftarTerdaftarTerdaftarTerdaftar

Gambar Gambar GambarGambar IV.24IV.24IV.24IV.24 Halaman

Halaman VerifikasiVerifikasiVerifikasiVerifikasi PembayaranPembayaranPembayaranPembayaran

4.3.

4.3. CodeCodeCodeCode GenerationGenerationGenerationGeneration i.

i.

i.i. FormFormFormForm PendaftaranPendaftaranPendaftaranPendaftaran

<!DOCTYPE

<!DOCTYPE htmlhtmlhtmlhtml PUBLICPUBLICPUBLICPUBLIC "-//W3C//DTD"-//W3C//DTD"-//W3C//DTD"-//W3C//DTD XHTMLXHTMLXHTMLXHTML 1.01.01.01.0 Transitional//EN"Transitional//EN"Transitional//EN"Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html

<html xmlns="http://www.w3.org/1999/xhtml">xmlns="http://www.w3.org/1999/xhtml">xmlns="http://www.w3.org/1999/xhtml">xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta

<meta http-equiv="Content-Type"http-equiv="Content-Type"http-equiv="Content-Type"http-equiv="Content-Type" content="text/html;content="text/html;content="text/html;content="text/html; charset=utf-8"charset=utf-8"charset=utf-8"charset=utf-8" />/>/>/>

(42)

<title>Untitled

<title>Untitled Document</title>Document</title>Document</title>Document</title>

</head>

<body>

<?php

<?php<?php

include"koneksi.php";

include"koneksi.php";include"koneksi.php";

error_reporting(E_ALL error_reporting(E_ALL

error_reporting(E_ALLerror_reporting(E_ALL ^^^^ (E_NOTICE(E_NOTICE(E_NOTICE(E_NOTICE ||||

E_WARNING));

$tgl

$tgl$tgl ==== datedatedatedate ('Y-m-d');('Y-m-d');('Y-m-d');('Y-m-d');

$query="SELECT

$query="SELECT$query="SELECT max(id_peserta)max(id_peserta)max(id_peserta)max(id_peserta) asasasas maxIDmaxIDmaxIDmaxID FROMFROMFROMFROM tbl_peserta

tbl_peserta tbl_peserta

tbl_peserta WHEREWHEREWHEREWHERE id_pesertaid_pesertaid_pesertaid_peserta LIKELIKELIKELIKE 'PES%'";'PES%'";'PES%'";'PES%'";

$hasil=mysql_query($query);

$hasil=mysql_query($query);$hasil=mysql_query($query);

$data=mysql_fetch_array

$data=mysql_fetch_array$data=mysql_fetch_array ($hasil);($hasil);($hasil);($hasil);

$idMax=$data['maxID'];

$idMax=$data['maxID'];$idMax=$data['maxID'];

$noUrut

$noUrut$noUrut ==== (int)(int)(int)(int) substr($idMax,substr($idMax,substr($idMax,substr($idMax, 3,3,3,3, 3);3);3);3);

$noUrut++;

$noUrut++;$noUrut++;

$newID=

$newID=$newID= PESPESPESPES .... sprintf("%03s",$noUrut);sprintf("%03s",$noUrut);sprintf("%03s",$noUrut);sprintf("%03s",$noUrut);

(43)

?>

?>?>

<hr

<hr />/>/>/>

<h2

<h2 align="center">align="center">align="center">align="center"> PendaftaranPendaftaranPendaftaranPendaftaran PesertaPesertaPesertaPeserta BaruBaruBaruBaru </h2></h2></h2></h2>

<hr

<hr />/>/>/>

<form

<form<form<form id="tambah_pesertabaru"id="tambah_pesertabaru"id="tambah_pesertabaru"id="tambah_pesertabaru" class="form-horizontal"class="form-horizontal"class="form-horizontal"class="form-horizontal"

action="kirimpendaftaranpeserta.php"

action="kirimpendaftaranpeserta.php" enctype="multipart/form-data"enctype="multipart/form-data"enctype="multipart/form-data"enctype="multipart/form-data"

method="post">

<fieldset>

<fieldset><fieldset>

<legend>Silahkan

<legend>Silahkan<legend>Silahkan IsiIsiIsiIsi FormFormFormForm PendaftaranPendaftaranPendaftaranPendaftaran DibawahDibawahDibawahDibawah Ini</legend>Ini</legend>Ini</legend>Ini</legend>

<div

<div<div class="form-group">class="form-group">class="form-group">class="form-group">

<label

<label<label class="col-sm-3class="col-sm-3class="col-sm-3class="col-sm-3 control-label"control-label"control-label"control-label" for="nama">Namafor="nama">Namafor="nama">Namafor="nama">Nama Peserta</label>

Peserta</label>

<div

<div<div class="col-sm-5">class="col-sm-5">class="col-sm-5">class="col-sm-5">

<input

<input<input type="text"type="text"type="text"type="text" size="30"size="30"size="30"size="30" class="form-class="form-class="form-class="form- control"

control"

control" id="nama"id="nama"id="nama"id="nama" name="nama"name="nama"name="nama"name="nama" autocomplete="off"autocomplete="off"autocomplete="off"autocomplete="off"

placeholder="Nama placeholder="Nama placeholder="Nama

placeholder="Nama LengkapLengkapLengkapLengkap Peserta"Peserta"Peserta"Peserta" required="required"required="required"required="required"required="required" />/>/>/>

</div>

</div></div>

(44)

</div>

</div></div>

<div

<label

<label<label class="col-sm-3class="col-sm-3class="col-sm-3class="col-sm-3 control-label"control-label"control-label"control-label" for="alamat">Alamatfor="alamat">Alamatfor="alamat">Alamatfor="alamat">Alamat Peserta</label>

Peserta</label>

<div

<textarea

<textarea<textarea rows="5"rows="5"rows="5"rows="5" size="30"size="30"size="30"size="30" class="form-class="form-class="form-class="form- control"

control"

control" id="alamat"id="alamat"id="alamat"id="alamat" name="alamat"name="alamat"name="alamat"name="alamat" autocomplete="off"autocomplete="off"autocomplete="off"autocomplete="off"

placeholder="Alamat placeholder="Alamat placeholder="Alamat

placeholder="Alamat LengkapLengkapLengkapLengkap Peserta"Peserta"Peserta"Peserta" required="required"required="required"required="required"required="required" /></textarea>/></textarea>/></textarea>/></textarea>

</div>

</div></div>

</div>

</div></div>

<div

<label

<label<label class="col-sm-3class="col-sm-3class="col-sm-3class="col-sm-3 control-label"control-label"control-label"control-label"

for="tmp_lahir">Tempat for="tmp_lahir">Tempat for="tmp_lahir">Tempat

for="tmp_lahir">Tempat Lahir</label>Lahir</label>Lahir</label>Lahir</label>

<div

<input

control"

control" id="tmp_lahir"id="tmp_lahir"id="tmp_lahir"id="tmp_lahir" name="tmp_lahir"name="tmp_lahir"name="tmp_lahir"name="tmp_lahir" autocomplete="off"autocomplete="off"autocomplete="off"autocomplete="off"

placeholder="Tempat placeholder="Tempat placeholder="Tempat

placeholder="Tempat LahirLahirLahirLahir Peserta"Peserta"Peserta"Peserta" required="required"required="required"required="required"required="required" />/>/>/>

</div>

</div></div>

</div>

</div></div>

(45)

<div

<label

for="tgl_lahir">Tanggal for="tgl_lahir">Tanggal for="tgl_lahir">Tanggal

for="tgl_lahir">Tanggal Lahir</label>Lahir</label>Lahir</label>Lahir</label>

<div

<input

<input<input type="date"type="date"type="date"type="date" size="30"size="30"size="30"size="30" class="form-class="form-class="form-class="form- control"

control"

control" id="tgl_lahir"id="tgl_lahir"id="tgl_lahir"id="tgl_lahir" name="tgl_lahir"name="tgl_lahir"name="tgl_lahir"name="tgl_lahir" autocomplete="off"autocomplete="off"autocomplete="off"autocomplete="off"

required="required"

required="required" />/>/>/>

</div>

</div></div>

</div>

</div></div>

<div

<label

for="sekolah">Sekolah for="sekolah">Sekolah for="sekolah">Sekolah

for="sekolah">Sekolah Asal</label>Asal</label>Asal</label>Asal</label>

<div

<input

control"

control" id="sekolah"id="sekolah"id="sekolah"id="sekolah" name="sekolah"name="sekolah"name="sekolah"name="sekolah" autocomplete="off"autocomplete="off"autocomplete="off"autocomplete="off"

placeholder="Sekolah placeholder="Sekolah placeholder="Sekolah

placeholder="Sekolah AsalAsalAsalAsal Peserta"Peserta"Peserta"Peserta" required="required"required="required"required="required"required="required" />/>/>/>

</div>

</div></div>

</div>

</div></div>

<div