bab iv fix

70

BAB IV

RANCANGAN SISTEM YANG DIUSULKAN

4.1. Usulan Prosedur Yang Baru.

Untuk menganalisa sistem yang diusulkan, pada penelitian ini

digunakan program Visual Paradigma for UML 4.0. Untuk menggambarkan

Use Case Diagram, Sequence Diagram, Statechart diagram, Class Diagram

dan Activity Diagram,

4.1.1. Rancangan Sistem Yang Diusulka Pada Use Case Diagram, Diantaranya :

4.1.1.1. Use Case Diagram User Yang Diusulkan

Gambar 4.1. Use Case Diagram User Yang Diusulkan

71

Berdasarkan Gambar 4.1. Use Case Diagram User Yang telah Diusulkan

Terdapat :

1. Sistem yang mencakup pada saat web online Sistem Penerimaan Calon

Siswa Baru yang diusulkan pada SMA Genta Syaputra Tangerang.

2. Terdapat 2 Actor yang melakukan kegiatan, yaitu Calon Siswa, dan

Admin

3. Terdapat 16 Use Case yang dapat dilakukan oleh actor.

4.1.1.2. Use Case Diagram Admin Yang Diusulkan

Gambar 4.2. Use Case Diagram Admin Yang Diusulkan

72

Berdasarkan Gambar 4.2. Use Case Diagram Admin Yang telah Diusulkan

Terdapat :

1. Sistem yang mencakup kegiatan pengolahan data up to date pada web

Sistem Informasi Penerimaan Calon Siswa Baru yang diusulkan Pada

SMA Genta Syaputra Tangerang.

2. Terdapat 2 Actor yang melakukan kegiatan, yaitu Admin dan Kepala

Sekolah

3. Terdapat 10 Use Case yang dapat dilakukan oleh actor.

4.1.2. Activity Diagram yang Diusulkan

Menggambarkan berbagai alir aktivitas dalam sistem yang sedang

dirancang, bagaimana masing-masing alir berawal, decision yang mungkin

terjadi dan bagaimana mereka berakhir. Activity diagram juga dapat

menggambaran proses paralel yang mungkin terjadi pada beerapa eksekusi.

Activity diagram merupakan state diagram khusus. Di mana sebagaian

besar state adalah action dan sebagian besar transisi di-trigger oleh

selesainya state sebelumnya (internal processing) Oleh karena itu actvity

diagram tidak menggambarkan behaviour internal sebuah sistem ( dan

intraksi antar subsistem ) secara eksak, tetapi lebih menggambarkan proses-

proses dan jalur-jaur aktivitas dari level atas secara umum.

73

4.1.2.1. Activity Diagram User Yang Diusulkan

Gambar 4.3. Activity Diagram User Yang Diusulkan

Berdasarkan Gambar 4.3 Activity Diagram User yang diusulkan terdapat :

1. 1 Initial Node, Sebagai awal objek

2. 25 Action, state dari sistem yang mencerminkan eksekusi dari suatu aksi

3. 2 Fork Node, satu aliran yang pada tahap tertentu berubah menjadi

beberapa aliran.

4. 1 Join Node, beberapa aliran yang tahap tertentu menjadi satu aliran

5. 1 Final Object yang di akhir

74

4.1.2.2. Activity Diagram yang diusulkan pada Admin

Gambar 4.4. Activity Diagram Admin

Berdasarkan gambar 4.4 Activity Diagram Admin yang diusulkan terdapat :

1. 1 Initial Node, Sebagai awal objek

2. 15 Action, state dari sistem yang mencerminkan eksekusi dari suatu aksi

3. 2 Fork Node, satu aliran yang pada tahap tertentu berubah menjadi beberapa

aliran.

4. 1 Join Node, beberapa aliran yang tahap tertentu menjadi satu aliran

5. 1 Activity Final Node, sebagai akhir objek

75

4.1.3. Squence Diagram Yang Diusulkan

Squence Diagram yang Diusulkan menggambarkan interaksi antar

objek di dalam dan di sekitar sistem (termasuk pengguna, display, dan

sebagainya) berupa massage yang digambarkan terhadap waktu. Saquence

diagram terdiri dari dimensi vertikal (waktu) dan dimensi horizontal (objek-

objek yang terkait).

4.1.3.1. Squence Diagram User Yang Diusulkan

Gambar 4.5. Squence Diagram User yang Diusulkan

76

Berdasarkan gambar 4.5 Squence Diagram User yang diusulkan terdapat :

1. 10 Life line antar muka yang saling berintraksi.

2. 1 Actor yang elakukan kegiatan yaitu calon siswa

3. 27 Massage spesifikasi dari komunikasi antar objek yang memuat

informasi-informasi tentang aktifitas yang terjadi kegiatan yang biasa

dilakukan oleh Actor.

4.1.3.2. Squence Diagram Admin Yang Diusulkan

Gambar 4.6. Squence Diagram Admin yang Diusulkan

77

Berdasarkan gambar 4.6 Squence Diagram User yang diusulkan terdapat :

4. 8 life line antar muka yang saling berintraksi.

5. 2 actor yang elakukan kegiatan yaitu calon siswa

6. 24 massage spesifikasi dari komunikasi antar objek yang memuat

informasi-informasi tentang aktifitas yang terjadi kegiatan yang biasa

dilakukan oleh actor.

4.1.4. State Chart Diagram Yang Diusulkan

State diagram menggambarkan transisi dan perubahan keadaan (dari

satu state ke state yang lainya) suatu objek pada sistem sebagai akibat dari

stimuli yang diterima. Pada umumnya State diagram menggambarkan class

tertentu (satu class dapat memiliki lebih dari satu State diagram ). Dari state

diagram usulan memiliki 2 (dua) aktor, yaitu admin dan user.

78

4.1.4.1. State Chart Diagram Admin yang Diusulkan

Gambar 4.7. State Chart Diagram Admin yang Diusulkan

Berdasarkan gambar 4.7 State Chart Diagram Admin yang diusulkan

terdapat :

1. 1 Initial Pseudo State, sebagai awal objek.

2. 10 State, nilai atribut dan nilai link pada suatu waktu tertentu yang

dimiliki oleh suatu objek tersebut.

3. 1 Final state, objek yang diakhiri.

79

4.1.4.2. State Chart Diagram yang diusulkan pada User

Gambar 4.8. State Chart Diagram Uer yang Diusulkan

Berdasarkan gambar 4.8 State Chart Diagram User yang diusulkan terdapat :

5. 1 Initial Pseudo State, sebagai awal objek.

6. 16 State, nilai atribut dan nilai link pada suatu waktu tertentu yang dimiliki oleh

suatu objek tersebut.

7. 1 Final state, objek yang diakhiri.

80

4.1.5. Calss Diagram yang Diusulkan

Class Diagram merupakan diagram yang slalu ada di pemodelan

sistem berorientasi objek. Class Diagram menunjukan hubungan antar class

dalam sistem yang sedang di bangun dan bagaimana mereka saling

berkolaborasi untuk mencapai suatu tujuan.

4.1.5.1. Class Diagram yang Diusulkan

Gambar 4.9. Class Diagram yang Diusulkan

Berdasarkan gambar 4.9. Class Diagram yang Diusulkan yang diusulkan

terdapat :

1. 4 Class

2. 3 Assosation

81

4.2. Spesifikasi Basis Data

Spesifikasi basis data tersebut dapat dijelaskan secara detail seperti

dibawah ini.

1. Tabel data_siswa

Nama File : data_siswa

Media : Hard Disk

Isi : nis + id_thn_ajaran + Id_gelombang + no_sttb

+ nilai + nama_siswa + kelamin +

agama_siswa + tempat_lahir_siswa +

tgl_lahir_siswa + gambar + status_keluarga +

anak_ke + alamat_siswa + telepon_siswa +

asal_sekolah + alamat_sekolah_asal +

nama_ayah + pendidikan_ayah +

pkerjaan_ayah + nama_ibu + pendidikan_ibu

+ pekerjaan_ibu + status_siswa

Primary Key : nis + id_thn_ajaran + id_gelombang

Panjang Record : 788 bytes

No Nama Field Jenis Lebar Keterangan

1 nis Varchar 100 Identitas siswa

2 id_thn_ajaran Int 11 Identitas thn ajaran baru

3 id_gelombang Int 11 Identitas gelombang

82

4 No_sttb varcahr 25 Nomor sttb

5 nilai varchar 15 nilai

6 nama_siswa varcahar 60 Nama siswa

7 kelamin enum L/P Jenis kelamin

8 agama_siswa varchar 15 agama

9 tempat_lahir_siswa varchar 10 Tempat lahir siswa

10 tgl_lahir_siswa date Tanggal lahir siswa

11 gambar varchar 100 gambar

12 status_keluarga varchar 20 Status keluarga

13 anak_ke Int 11 Anak ke

14 alamat_siswa text Alamat siswa

15 Telepon_siswa varchar 12 Telepon siswa

16 asal_sekolah varcahr 70 Asal sekolah

17 Alamat_sekolah_asal varchar 70 Alamat seklah asal

18 Nama_ayah varcahr 60 Nama ayah

19 pendidikan_ayah varchar 40 Pendidikan ayah

20 pekerjaan_ayah varchar 40 Pekerjaan ayah

21 nama_ibu varchar 60 Nama ibu

22 Pendidikan_ibu Varchar 40 Pendidikan ibu

23 Pekerjaan_ibu varchar 40 Pekerjaan ibu

24 Alamat_ortu text Pekerjaan ibu

25 Status_siswa varchar 10 Status ibu

Tabel 4.1. Struktur tabel data siswa

83

1. File bayar

Nama File : bayar

Media : Hard Disk

Isi : nis + no_pendaftar + nama + nama_bank +

atas_nama + nominal + gambar

Primary Key : nis



1 Nis varchar 100 Identitas siswa

2 no_pendaftaran int 11 No pendaftaran

3 nama varchar 100 Nama calon siswa

4 Nama_bank varchar 100 Nama bank

5 Atas_nama varchar 100 Atas nama pengirim

6 nominal Int 11 Jumlah nominal

7 gambar varchar 100 Gambar bukti struk

Tabel 4.2. Struktur tabel bayar

2. File gelombang

Nama File : gelombag

Media : Hard Disk

Isi : id_gelombang + gelombnag + biaya + status

Primary Key : id_gelombang


84


1 id_gelombang int 11 Identitas gelombnag

2 gelombang Varchar 15 Gelombang penerimaan siswa baru

3 biaya int 11 Nominal biaya pada gelombnag tertentu

4 status varchar 10 Untuk perubahan status aktif

Tabel 4.3. Struktur tabel gelombang

4. File Tahun ajaran

Nama File : tahun_ajaran

Media : Hard Disk

Isi : id_thm_ajran + thn_ajran +status

Primary Key : id_thm_ajran



1 id_thn_ajaran int 11 Identitas tahun ajaran

2 thn_ajaran Varchar 10 Periode tahun ajran

3 status Varchar 5 Untuk perubahasn status aktif

Tabel 4.4. Struktur tabel tahun ajaran

85

5. File berita

Nama File : berita

Media : Hard Disk

Isi : id_berita + judul + tgl + gambar + ket + status

Primary Key : id_berita



1 Id_berita

Int 11 Identitas berita

2 judul

Varchar 60 judul

3 tgl Date tanggal

4 gambar Varchar 60 gambar

5 ket Text Keterangan berita

6 status Varchar 50 status

Tabel 4.5. Struktur tabel berita

6. File galeri

Nama File : galeri

Media : Hard Disk

Isi : id_galeri + nama_galeri + gambar

Primary Key : id_galeri


86


1 Id_galeri Int 11 Identitas galeri

2 nama_galeri

Varchar 35 Nama galeri

3 gambar Varchar 11 gambar

Tabel 4.6. Struktur tabel galeri

4.3. Rancangan Prototype

4.3.1. Rancangan Prototype Halaman Home

Gambar 4.10. Rancangan Prototype Halaman Home

Banner

Logo

Menu Utama Beranda Profil sekolah Pendaftaran Data pendaftar Hasil seleksi Pembayaran Menu Informasi Berita sekolah Syarat Galeri Panduan Contact us

Statistik pengunjung

Fhoto

Deskripsi berita berkaitan tentang sekolah, pendiidikan dan budaya.

Fhoto

Deskripsi berita berkaitan tentang sekolah, pendiidikan dan budaya.

87

4.3.2. Rancangan Prototype Halaman Profile

Gambar 4.11. Rancangan Prototype Halaman Profile

Banner

Logo

Menu Utama Beranda Profil sekolah Pendaftaran Data pendaftar Hasil seleksi Pembayaran Menu Informasi Berita sekolah Syarat Galeri Panduan Contact us Statistik pengunjung

Profile SMA Genta Syaputra

.: Sejarah

.: Visi

.: Misi

88

4.3.3. Rancangan Prototype Halaman Biaya Registrasi

Gambar 4.12. Rancangan Prototype Halaman Biaya Registrasi

Banner

Logo


Biaya registrasi SMA Genta Syaputra

No pendaftar : Nama : Nama bank : Atas Nama : Nominal : Bukti struk :

Submit

89

4.3.4. Rancangan Prototype Halaman Penerimaan calon siswa Baru

Gambar 4.13. Rancangan Prototype Halaman Penerimaan Calon Siswa Baru

Banner

Logo


Formulir Pendaftaran Siswa Baru SMA Genta Syaputra

Data Siswa A. Data Orang Tua B. Data Wali Murid C. Data Sekolah Asal

90

4.3.5. Rancangan Prototype Halaman Gallery

Gambar 4.14. Rancangan Prototype Halaman Gallery

Banner

Logo


Gallery

Foto 1 Foto 2 Foto 3

Foto 6 Foto 5 Foto 4

91

4.3.6. Rancangan Prototype Data pendaftaran

Gambar 4.15. Rancangan Prototype Halaman Data Pendaftar

Banner

Logo


Data Calon Siswa Baru SMA GENTA SYAPUTRA No. Pendaftaran Nama Calon Siswa Gelombang

92

4.3.7. Rancangan Prototype Halaman Hasil Seleksi

Gambar 4.16. Rancangan Prototype Halaman Hasil Seleksi

Banner

Logo


Hasil Seleksi Pendaftaran Siswa Baru No. Pendaftaran Nama Calon Siswa Asal Sekolah Status Calon Siswa Gelombang Aksi

93

4.4. Spesifikasi Hardware dan Software

a. Rancangan Perangkat Keras (Hardware)

Rancangan perangkat keras (hardware) yang diusulkan untuk sistem baru

ini adalah sebagai berikut :

1. Processor : Intel Core 2 Duo E7200 2.53 Ghz

2. Monitor : 19 Inci

3. Mouse : Komic Infrared

4. Harddisk : 85 GB

5. Keyboard : HQ Milenia

6. Printer : Samsung ML-2851ND

7. Memori RAM : 1 GB

8. Kabel UTP

9. Switch

b. Rancangan Perangkat Lunak (Software)

Perangkat lunak (software) merupakan penghubung antara komputer dan

intruksi yang dimasukkan agar komputer dapat menghasilkan

data/informasi yang diharapkan. Adapun usulan software pada rancangan

sistem baru ini adalah :

1. Sistem Operasi Windows XP/ Windows 7

2. Mozilla Firefox

3. XAMPP

4. Adobe Dreamweaver

94

c. Hak Akses (Brainware)

1. Admin (Tata Usaha)

Hak akses yang di lakkan oleh Admin: Update, input, save, edit, delete

dan cetak data.

2. Calon Siswa

Calon Siswa mempunyai akses untuk mendaftar secara online ataupun

langsung datang ke sekolah SMA Genta Syaputra

4.5. Implementasi Sistem Yang Diusulkan

4.5.1. Tampilan Home

Pertama-Tama untuk Membuka Websitenya silahkan Ketik pada

addresnya dengan: http://localhost/gentarevisi/. Setelah itu akan muncul

tampilan awal seperti di bawah ini:

Gambar 4.17. Tampilan Home

95

4.5.2. Tampilan Profile

Gambar 4.18. Tampilan Profil

96

4.5.3 Tampilan Form Pendaftran Online

Gambar 4.19. Tampilan Form Pendaftran Online

97

4.5.4. Tampilan Data Pendaftar

Gambar 4.20. Tampilan Data Pendaftar

98

4.5.5. Tampilan Surat Pernyataan Siswa

Gambar 4.21. Tampilan Surat Pernyataan Siswa

99

4.5.6. Tampilan Hasil seleksi

Gambar 4.22. Tampilan Hasil seleksi

100

4.5.7. Tampilan Menu Input Pembayaran

Gambar 4.23. Tampilan Menu Input Pembayaran

101

4.5.8. Tampilan Berita Sekolah

Gambar 4.24. Tampilan Berita Sekolah

102

4.5.9. Tampilan Syarat Panduan

Gambar 4.25. Tampilan Syarat Panduan

103

4.5.10. Tampilan Galeri

Gambar 4.26. Tampilan Galeri

104

4.5.11. Tampilan Login admin

Gambar 4.27. Tampilan Login admin

105

4.5.12. Tampilan Beranda Admin

Gambar 4.27. Tampilan Beranda Admin

106

4.5.13. Tampilan Data Siswa Mendaftar pada Admin

Gambar 4.28. Tampilan Data Siswa Mendaftar pada Admin

.

107

4.5.14. Tampilan Data Siswa Lolos Seleksi Pada Menu Admin

Gambar 4.29. Tampilan Siswa Lolos Seleksi Pada Menu Admin

108

4.6. Jadwal Pengolahan

Perancangan sistem yang diusulkan diperkirakan memakan waktu

kurang lebih 4 bulan, dan kegiatan yang dilakukan adalah :

No Kegiatan

Bulan

April Mei Juni Juli

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

1. Pengumpulan data

2. Analisa ulang sistem

3. Perancangan sistem

4. Pembuatan program

5. Test Program

6. Evaluasi Program

7. Perbaikan Program

8. Pelatihan User

9. Implementasi

10. Dokumentasi

4.7.Jadwal Pengolahan

4.8. Perkiraan Biaya Penelitian

Diberikan rincian biaya penelitian yang mengacu pada kegiatan penelitian

yang diuraikan dalam Metode Penelitian. Rekapitulasi biaya penelitian

Bahan dan Peralatan Penelitian, 2. Perjalanan, 3. Biaya Lain-Lain, yang

mencakup biaya untuk seminar, laporan, dan lain-lain.

109

No

Uraian Kegiatan

Biaya Yang Diusulkan

1. PENGUMPULAN

Analisa data 0

Identifikasi user requitment 0

Desain dan programming

system

0

Testing dan implementasi 0

Pembuatan program 500.000

2 Bahan dan Peralatan

Penelitian

Hardware :

Laptop ASUS 14”

3.000.000

Software :

Photoshop 0

Adobe Dreamweaver 0

XAMPP 0

Notepad++ 0

mozillafirefox 0

Lain-lain

Internet 100.000

Jumlah Biaya 600.000

4.8 Perkiraan Biaya Penelitian

bab iv fix

Documents