PENGEMBANGAN WEB PORTAL UNIVERSITAS...

PENGEMBANGAN WEB PORTAL UNIVERSITAS

MENGGUNAKAN JQUERY PADA STMIK ISLAM

INTERNASIONAL JAKARTA

Oleh;

Muhammad Iqbal

106091002951

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH

JAKARTA

2011 M/ 1432 H

Pengembangan Web Portal Universitas Menggunakan Jquery Pada

STMIK Islam Internasional Jakarta

Skripsi

Sebagai Salah Satu Syarat untuk Memperoleh Gelar

Sarjana Komputer

Fakultas Sains dan Teknologi

Universitas Islam Negeri Syarif Hidayatullah Jakarta

Oleh :

Muhammad Iqbal

106091002951

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH

JAKARTA

2011 M/ 1432 H

Pengembangan Web Portal Universitas Menggunakan JQuery

Pada STMIK Islam Internasional Jakarta

Skripsi

Sebagai Salah Satu Syarat untuk Memperoleh Gelar

Sarjana Komputer

Fakultas Sains dan Teknologi

Universitas Islam Negeri Syarif Hidayatullah Jakarta

Oleh:

Muhammad Iqbal

106091002951

Menyetujui,

Mengetahui,

Ketua Program Studi Teknik Informatika,

Yusuf Durrachman, M.sc., M.I.T.

NIP.197110522 200604 1 002

Pembimbing II

Arini, M.T

NIP. 19760131200912 2 001

Pembimbing I

Yusuf Durachman M.Sc, MIT

NIP. 19710522 200604 1 002

PENGESAHAN UJIAN

Skripsi yang berjudul “Pengembangan Web Portal Universitas Menggunakan

JQuery Pada STMIK Islam Internasional Jakarta”, telah diuji dan dinyatakan lulus

dalam Sidang Munaqosah Fakultas Sains dan Teknologi Universitas Islam Negeri

Syarif Hidayatullah Jakarta, pada hari Jumat tanggal 23 September 2011. Skripsi ini

telah diterima sebagai salah satu syarat untuk memperoleh gelar Sarjana Komputer

pada Program Teknik Informatika

Jakarta, 23 September 2011

Tim Penguji,

Tim Pembimbing,

Mengetahui,

Penguji I

Dewi Khairani, M.Sc

NIP. 19820522 201101 2 001

P. 19730402 200112 2 001

Penguji II

Fenty Eka Muzzayyana, M.Kom

NIP. 19760805 2009112 2 003

P. 19730402 200112 2 001

Pembimbing I

Yusuf Durrachman M.Sc, MIT

NIP. 19710522 200604 1 002

Pembimbing II

Arini, M.T

NIP. 19760131 200912 2 001

Dekan

Fakultas Sains Dan Teknologi

DR. Syopiansyah Jaya Putra, M.Sis

NIP. 19680117 200112 1 001

Ketua Program Studi

Teknik Informatika

Yusuf Durrachman M.Sc, M.I.T.

NIP. 19710522 200604 1 002

PERNYATAAN

DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI BENAR-BENAR

HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN SEBAGAI

SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI ATAU LEMBAGA

MANAPUN.

Jakarta, September 2011

Muhammad Iqbal

ABSTRAK

Muhammad Iqbal, Pengembangan Web Portal Universitas Menggunakan

JQuery Pada STMIK Islam Internasional Jakarta dibawah bimbingan Yusuf

Durachman M.Sc, MIT dan Arini, M.T

Informasi yang cepat, tepat dan menyajikan data-data yang lengkap adalah

suatu hal yang dibutuhkan oleh perguruan tinggi untuk mempermudah kelangsungan

kegiatan perkuliahan. Kesulitan pengelolaan web portal yang dialami oleh

administrator, dan belum adanya sistem pendaftaran mahasiswa baru di STMIK

Islam Internasional Jakarta, membuat dikembangkannya suatu sistem informasi yang

membantu dalam mengatasi permasalahan yang dialami oleh STMIK Islam

Internasional Jakarta. Sistem informasi tersebut bernama Web Portal yang

pembuatannya menggunakan teknologi JQuery sebagai library javascript yang dapat

mempermudah dan mempercepat developer web dalam membuat kode Javascript.

Penelitian yang penulis lakukan menggunakan metode pengembangan sistem FAST

(Framework for the Applications of Sytems Thinking) yang merupakan sebuah

metode yang memiliki pendekatan lebih detail dengan perencanaan yang baik

dan cocok untuk pembuatan berbagai jenis aplikasi. Sebagai hasil dari tugas akhir

ini adalah mengembangkan web portal STMIK Islam Internasional menjadi lebih

mudah digunakan dan juga mempermudah proses pendaftaran mahasiswa baru, yaitu

sistem pendaftaran mahasiswa baru secara online. Pengembangan ke depan dari

aplikasi ini diharapkan tidak hanya sebatas sistem web portal saja akan tetapi dapat

diintegrasikan ke sistem-sistem lainnya yaitu pada sistem dibuat satu buah sistem

login yang dapat mengakses ke semua sistem yang ada.

Kata Kunci: Pengelolaan Web, Sistem Pendaftaran Online, Web Portal,

JQuery, Framework for the Applications of Sytems Thinking. xxiv halaman + 172 halaman + 95 gambar + 4 Lampiran

Daftar pustaka : 24 (2004-2010)

KATA PENGANTAR

Segala puji hanya milik Allah Subhanahu wa Ta’aala. Shalawat dan salam

semoga senantiasa dilimpahkan kepada Rasulullah shallallaahu’alaihi wa sallam,

kepada keluarga, dan kepada para Sahabatnya.

Alhamdulillah, dengan taufiq, pertolongan, dan rahmat Allah Subhanahu wa

Ta’aala, skripsi yang berjudul “Pengembangan Web Portal Universitas

Menggunakan Jquery pada STMIK Islam Internasional Jakarta” telah dapat

penulis selesaikan dengan baik.

Adanya perbaikan dan berbagai tambahan dalam skripsi ini menunjukan

bahwa manusia bersifat lemah dan tidak dapat berbuat sempurna, karena

kesempurnaan itu hanya milik Allah Ta’aala. Imam al-Muzani, sahabat Imam asy-

Syafi’i pernah berkata “Seandainya sebuah kitab dilihat dan dibaca (berulang-ulang)

sebanyak tujuh puluh kali, niscaya akan tetap didapati kesalahan di dalamnya karena

Allah Ta’ala tidak menginginkan ada satu kitab manapun yang sempurna

keshalihannya kecuali Kitab-Nya yang mulia”

Dalam pelaksanaan pembuatan skripsi ini penulis mendapatkan banyak

bantuan baik dari segi moral dan material. Oleh karena itu penulis ingin

mengucapkan terimakasih kepada:

1. Bapak DR. IR. Syopiansyah Jaya Putra, M.Sis. selaku Dekan Fakultas Sains

dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta.

2. Bapak Yusuf Durachman, M.Sc dan Ibu Viva Arifin, MMSI selaku Ketua

dan Sekretaris Program Studi Teknik Informatika.

3. Bapak Yusuf Durachman, M.Sc dan Ibu Arini, M.T, M.Eng selaku dosen

pembimbing skripsi.

4. Kedua orang tua penulis H. Umar Fauzi dan Hj. Rosmaliati yang selalu

memberikan dukungan dan doa restu kepada penulis dalam berbagai bentuk.

Terimakasih telah menjadi penyemangat di setiap waktu.

5. Febrina Rizky Syaharani yang selalu memberikan semangat dalam pembuatan

skripsi ini.

6. Ferry Siswoyo, Imam Muzakkir, Wahyudianto, Arif Kunto, Iche Berlyanti,

Widodo, Widarto dan teman-teman lain yang telah mau membantu dan

bertukar ilmu dengan penulis.

7. Semua pihak yang telah membantu dan tidak bisa penulis sebutkan satu per

satu disini.

Penulis menyadari bahwa di dalam penulisan skripsi ini masih banyak

kekurangan. Maka dari itu saran yang membangun penulis harapkan untuk

perbaikan dimasa yang akan datang.

Ciputat, September 2011

Muhammad Iqbal

DAFTAR ISI

Halaman

Halaman Judul .................. ....... ..................................................................... ii

Lembar Persetujuan Pembimbing...... ............................................................ iii

Lembar Persetujuan Penguji........ .................................................................. iv

Lembar Pernyataan ........ .............................................................................. v

Abstrak ........ ................................................................................................ vi

Kata Pengantar ........ ..................................................................................... vii

Daftar Isi . ....... ............................................................................................... ix

Daftar Gambar ....... ...................................................................................... xvi

Daftar Tabel ........ ......................................................................................... xx

Daftar Simbol........ ........................................................................................ xxii

Daftar Istilah........ ......................................................................................... xxiv

BAB I PENDAHULUAN ........................................................................ .......1

1.1. Latar Belakang ..............................................................................1

1.2. Rumusan Masalah ........................................................................ 3

1.3. Batasan Masalah ......................................................................... 3

1.4. Tujuan Penelitian ..........................................................................4

1.5. Manfaat Penelitian ........................................................................5

1.5.1. Bagi Penulis ................................................................. ......5

1.5.2. Bagi Universitas ........................................................5

15.3. Bagi Pengguna ............................................................... 6

1.6. Metodologi Penelitian .......................................................................6

1.6.1. Metode Pengumpulan Data ........................................... 6

1.6.2. Metode Pengembangan Sistem ............................................... 8

1.7. Sistematika Penulisan ............................................................ .......... 8

BAB II LANDASAN TEORI ................................................................................ 10

2.1. Konsep Dasar Internet ......................................................................... 10

2.2. Konsep Dasar Web Portal ..................................................................... 10

2.3. Pengantar Pemograman Web ................................................................ 11

2.4. Konsep Metodologi ............................................................................. 12

2.4.1. Metode Pengumpulan Data ....................................................... 12

2.4.2. Framework for the Applications of Sytems Thinking................ 13

2.4.2.1. Definisi Ruang Lingkup ............................................... 15

2.4.2.2. Analisis Permasalahan .................................................. 16

2.4.2.3. Analisis Kebutuhan ....................................................... 16

2.4.2.4. Desain Logikal .............................................................. 17

2.4.2.5. Analisis Keputusan ....................................................... 18

2.4.2.6. Desain Fisik dan Integrasi ............................................. 19

2.4.2.7. Konstruksi dan Pengujian ............................................. 19

2.4.2.8. Instalasi dan Pengujian ................................................. 20

2.5. Bagan Alir (Flowchart) ....................................................................... 21

2.6. Tool Perancangan Sistem .................................................................... 22

2.6.1. Data Flow Diagram (DFD) ....................................................... 22

2.6.2. Entity Relationship Diagram (ERD) ......................................... 23

2.6.3. State Transition Diagram (STD) ............................................... 23

2.7. Desain Perancangan Sistem ................................................................ 23

2.7.1. Desain Data ............................................................................... 23

2.7.2. Desain Arsitektur ...................................................................... 24

2.7.3. Desain Prosedural ..................................................................... 24

2.7.4. Desain Interface ......................................................................... 24

2.8. Perangkat Lunak Pengembangan Sistem ............................................ 25

2.8.1. Javascript ................................................................................... 25

2.8.2. JQUERY ................................................................................... 25

2.8.3. PHP ............................................................................................ 33

2.8.4. MYSQL ..................................................................................... 34

2.8.5. Apache Web Server ................................................................... 35

2.8.6. Cascading Style Sheet(CSS) ...................................................... 36

2.8.7. Adobe Photoshop CS4 ............................................................... 37

2.9. Pengelolaan Database .......................................................................... 38

2.10. Studi Sejenis ...................................................................................... 40

BAB III METODOLOGI PENELITIAN ............................................................. 44

3.1. Metode Pengumpulan Data .................................................................. 44

3.1.1. Studi Lapangan .......................................................................... 44

a. Observasi ................................................................................ 44

b. Wawancara ............................................................................. 45

3.1.2. Studi Pustaka ............................................................................. 46

3.1.3. Studi Literatur ............................................................................ 46

3.1.4. Studi Kelayakan ......................................................................... 48

3.2. Metode Pengembangan Sistem ............................................................ 49

3.2.1. Definisi Ruang Lingkup …….................................................... 50

3.2.2. Analisis Permasalahan ............................................................... 50

3.2.3. Analisis Kebutuhan .................................................................... 51

3.2.4. Desain Logikal ........................................................................... 51

3.2.5. Analisis Keputusan .................................................................... 52

3.2.6. Desain Fisik dan Integrasi.......................................................... 52

3.2.7. Konstruksi dan Pengujian .......................................................... 53

3.2.8. Instalasi dan Pengiriman ............................................................ 53

3.3. Alasan Pemilihan Metode .................................................................... 54

3.3.1. Kelebihan Metode FAST ........................................................... 54

3.3.2. Kelemahan Metode FAST ......................................................... 55

3.4. Kerangka Berpikir ............................................................................ 59

BAB IV HASIL DAN PEMBAHASAN ……………………................................60

4.1. Gambaran STMIK Islam Internasional Jakarta ................................... 60

4.1.1. Kursus Yang Ditawarkan ........................................................... 60

4.1.2. Program Studi ............................................................................ 61

4.1.3. Tahun Akademik ....................................................................... 61

4.1.5. Visi dan Misi ............................................................................. 61

4.1.5.1. Visi ................................................................................ 61

4.1.5.2. Misi ............................................................................... 62

4.1.6. Strutur Organisasi ............................................................ 63

4.2. Definisi Ruang Lingkup ...................................................................... 64

4.3. Analisis Permasalahan ......................................................................... 65

4.3.1. Analisis Sistem Berjalan ............................................................ 65

4.3.1.1. Proses Web Portal Halaman User ................................. 66

4.3.1.2. Proses Web Portal Halaman Administrator .................. 67

4.3.1.3. Proses Pendaftaran Mahasiswa Baru ............................ 67

4.3.2. Identifikasi Masalah .......................................................... 68

4.3.3. Pemecahan Masalah .................................................................. 70

4.3.4. Uraian Singkat Sistem yang diusulkan ...................................... 70

4.3.4.1. Proses Web Portal Halaman User …............................. 70

4.3.4.2. Proses Web Portal Halaman Administrator................... 72

4.3.4.3. Proses Pendaftaran Mahasiswa Baru Secara Online ..... 73

4.4. Analisis Kebutuhan .............................................................................. 75

4.5. Desain Logikal ..................................................................................... 76

4.5.1. Perancangan Data Flow Diagram (DFD) .................................. 76

4.5.1.1. Rancangan Diagram Konteks......................................... 77

4.5.1.2. Rancangan Diagram Level 1 yang diusulkan ............... 78

4.5.1.3. Rancangan Diagram Level 2 yang diusulkan ................ 79

4.5.2. Perancangan Entity Relationship Diagram (ERD) .................... 92

4.5.3. Normalisasi ................................................................................ 94

4.5.4. Perancangan State Transition Diagram (STD) ............... ..100

4.5.4.1. Rancangan STD Menu Utama ........................ 100

4.5.4.2. Rancangan STD Masukan User ........................103

4.5.4.3. Rancangan STD Masukan Pada Admin ....... ..... 105

4.6. Analisa Keputusan .......................................................................111

4.6.1. Sistem Yang Digunakan ..................................................111

4.6.2. Kepemilikan Perangkat Lunak ..........................................112

4.6.3. Desain Sistem ................................................................112

4.6.4. Teknologi yang dihasilkan dari aplikasi ............................112

4.6.5. Analisis Kelayakan ........................................................112

4.7. Desain Fisik dan Integrasi ......................................................119

4.7.1. Spesifikasi Database 119

4.7.2. Perancangan Antarmuka .....................................................131

4.7.2.1. Rancangan Interface Halaman User ..................131

4.7.2.2. Rancangan Interface Halaman Admin ...............135

4.8. Konstruksi dan Pengujian .............................................................142

4.8.1. Konstruksi Perangkat Lunak .........................................142

4.8.2. Hardware .....................................................................143

4.8.3. Pengujian Mandiri ........................................................144

4.8.4. Pengujian Penerimaan ..................................................147

4.9. Instalasi dan Pengiriman ............................................................149

4.8.1. Login .....................................................................................149

4.8.2. Control Panel................................................................151

4.8.3. Membuat Database MySQL .........................................153

4.8.4. Konfigurasi Koneksi Database My SQL ........................157

BAB V KESIMPULAN DAN SARAN .......................................................170

DAFTAR PUSTAKA ................................................................................172

LAMPIRAN-LAMPIRAN

DAFTAR GAMBAR

Halaman

Gambar 2.1. Aliran Tiap-Tiap Fase Metodologi FAST...................................... 14

Gambar 2.2. Struktur Model Analisis . ............................................................. 22

Gambar 2.3. Perbandingan Framework Javascript ……………………. ........... 31

Gambar 2.4. Perbandingan Framework Javascript dari Segi Fitur …………. ... 32

Gambar 2.5. Perbandingan Framework Javascript dari Segi Dukungan Web Browser

..........................................................................................33

Gambar 2.6. Lingkungan Kerja Adobe Photoshop 4.0 ………………………...38

Gambar 3.1. Kerangka Berpikir...........................................................................59

Gambar 4.1. Struktur Organisasi IIUC ............................................................. 63

Gambar 4.2. Proses Sistem Berjalan Web Portal .............................................. 66

Gambar 4.3. Proses Sistem Berjalan Administrator Web Portal ....................... 67

Gambar 4.4. Proses Sistem Berjalan Pendaftaran Mahasiswa Baru ................... 68

Gambar 4.5. Proses Sistem Web Portal yang Diusulkan..................................... 72

Gambar 4.6. Proses Administrator Web Portal yang Diusulkan ........................ 73

Gambar 4.7. Proses Sistem Pendaftaran Mahasiswa Baru Secara Online yang

diusulkan ..................................................................................... 75

Gambar 4.8. Diagram Konteks Web Portal ...................................................... 78

Gambar 4.9. DFD Level 1 yang Diusulkan ....................................................... 79

Gambar 4.10. DFD Level 2 Proses 1.0 ...............................................................80

Gambar 4.11. DFD Level 3 Proses 1.1 ............................................................ 81


Gambar 4.13. DFD Level 3 Proses 1.3................................................................82


Gambar 4.15. DFD Level 3 Proses 2.1 ...............................................................83














Gambar 4.29. Model Entity Relationship Diagram (ERD) ............................... 94

Gambar 4.30. Model Logical Record Structure (LRS)...................................... 95

Gambar 4.31. STD Menu Utama User .............................................................. 106

Gambar 4.32. STD Menu Utama Admin ......................................................... 107

Gambar 4.33. STD Menu Utama Kiri .............................................................. 108

Gambar 4.34. STD Menu Why IIUC ................................................................ 108

Gambar 4.35. STD Menu Program Studi.............................................................109

Gambar 4.36. STD Menu Pendaftaran ............................................................. 109

Gambar 4.37. STD Menu Fasilitas ......................................................................110

Gambar 4.38. STD Menu Berita ...................................................................... 110

Gambar 4.39. STD Menu Tentang Kami ............................................................111

Gambar 4.40. STD Menu Galeri Foto .................................................................111

Gambar 4.41. STD Menu Hubungi Kami ...........................................................112

Gambar 4.42. STD Input Pendaftaran .................................................................113

Gambar 4.43. STD Input Pencarian ....................................................................113

Gambar 4.44. STD Input Komentar ....................................................................113

Gambar 4.45. STD Input Hubungi Kami.............................................................114

Gambar 4.46. STD Input Login ..........................................................................114

Gambar 4.47. STD Input Modul ....................................................................... 115

Gambar 4.48. STD Input Agenda ..................................................................... 115

Gambar 4.49. STD Input Berita ....................................................................... 116

Gambar 4.50. STD Input Validasi ...................................................................... 116

Gambar 4.51. STD Input Partner IIUC ............................................................ 117

Gambar 4.52. STD Input File Upload ............................................................. 117

Gambar 4.53. STD Input Sekilas Info ............................................................. 118

Gambar 4.54. STD Input Album ...................................................................... 118

Gambar 4.55. STD Input Galeri Foto .................................................................119

Gambar 4.56. STD Input Menu Utama ............................................................. 119

Gambar 4.57. STD Input Sub Menu ................................................................. 120

Gambar 4.58. STD Input Halaman Statis ............................................................120

Gambar 4.59. Rancangan Layar Halaman Home User ...................................... 141

Gambar 4.60. Rancangan Layar Halaman Why IIUC .........................................142

Gambar 4.61. Rancangan Layar Halaman Program Studi ................................. 142

Gambar 4.62. Rancangan Layar Halaman Pendaftaran .................................... 143

Gambar 4.63. Rancangan Layar Halaman Berita .............................................. 143

Gambar 4.64. Rancangan Layar Halaman Profil .............................................. 144

Gambar 4.65. Rancangan Layar Halaman Galeri Foto ..................................... 144

Gambar 4.66. Rancangan Layar Halaman Hubungi Kami ................................ 145

Gambar 4.67. Rancangan Layar Halaman Pendaftaran Online .......................... 145

Gambar 4.68. Rancangan Layar Halaman Home Admin................................... 146

Gambar 4.69. Rancangan Layar Halaman Admin Modul.................................. 147

Gambar 4.70. Rancangan Layar Halaman Admin Agenda ................................ 147

Gambar 4.71. Rancangan Layar Halaman Admin Berita .................................. 148

Gambar 4.72. Rancangan Layar Halaman Admin Komentar ............................ 148

Gambar 4.73. Rancangan Layar Halaman Admin Partner IIUC ....................... 149

Gambar 4.74. Rancangan Layar Halaman Admin Download ............................ 149

Gambar 4.75. Rancangan Layar Halaman Admin Hubungi Kami ..................... 150

Gambar 4.76. Rancangan Layar Halaman Admin Sekilas Info ......................... 150

Gambar 4.77. Rancangan Layar Halaman Admin Album ................................. 150

Gambar 4.78. Rancangan Layar Halaman Admin Galeri Foto .......................... 150

Gambar 4.79. Rancangan Layar Halaman Admin Menu Utama ....................... 152

Gambar 4.80. Rancangan Layar Halaman Admin Validasi ............................... 152

Gambar 4.81. Rancangan Layar Admin Halaman Statis.....................................153

Gambar 4.82. Halaman login Cpanel iiuc.ac.id................................................. 160

Gambar 4.83. Halaman awal Cpanel iiuc.ac.id....................................................161

Gambar 4.84. Menu Cpanel File Manager ....................................................... 163

Gambar 4.85. Pilih Direktori file Cpanel iiuc.ac.id..............................................163

Gambar 4.86. Menu Upload File Manager Cpanel ............................................164

Gambar 4.87. Menu MySQL Database Cpanel iiuc.ac.id ..................................165

Gambar 4.88. Memasukkan Database Portal di CPanel......................................165

Gambar 4.89. Membuat User Untuk database Portal di CPanel .........................166

Gambar 4.90. Memilih User Untuk Database Portal di Cpanel...........................166

Gambar 4.91. Tampilan Data Database dan Users di Cpanel iiuc.ac.id..............167

Gambar 4.92. Menu PhpMyadmin di Cpanel iiuc.ac.id.......................................167

Gambar 4.93. PhpMyadmin di Cpanel iiuc.ac.id ................................................168

Gambar 4.94. Web Portal STMIK Islam Internasional Jakarta...........................168

DAFTAR TABEL

Halaman

Tabel 3.1. Perbandingan dengan penelitian sebelumnya......................................47

Tabel 3.2. Penelitian yang dilakukan penulis ..................................................... 48

Tabel 3.3. Perbandingan Metode Pengembangan Sistem ................................. 55

Tabel 4.1. Cause and Effect Analysis....................................................................69

Tabel 4.2. Tabel data_pribadi Unnormalized .................................................... 95

Tabel 4.3. Tabel data_pribadi Normal 1 (1NF) .................................................. 97

Tabel 4.4. Tabel data_pribadi 2NF................ .................................................... 98

Tabel 4.5. Tabel pilihan_program 2NF ..............................................................99

Tabel 4.6. Tabel asal_sekolah 2NF ....................................................................99

Tabel 4.7. Tabel data_orang_tua 2NF.................................................................. 99

Tabel 4.8. Tabel alamat_orang_tua.2NF...............................................................99

Tabel 4.9. Candidate System Matrix ................................................................113

Tabel 4.10. Feasibility Analysis Matrix ...........................................................115

Tabel 4.11. Tabel Agenda ...............................................................................120

Tabel 4.12. Tabel berita ..................................................................................120

Tabel 4.13. Tabel kategori...............................................................................121

Tabel 4.14. Tabel album..................................................................................121

Tabel 4.15. Tabel gallery ................................................................................122

Tabel 4.16. Tabel banner .................................................................................122

Tabel 4.17. Tabel download ............................................................................123

Tabel 4.18. Tabel menu utama ........................................................................123

Tabel 4.19. Tabel sub menu ............................................................................124

Tabel 4.20. Tabel halaman statis .....................................................................124

Tabel 4.21. Tabel hubungi...............................................................................125

Tabel 4.22. Tabel komentar .............................................................................125

Tabel 4.23. Tabel modul ................................................................................ 126

Tabel 4.24. Tabel sekilas info.......................................................................... 126

Tabel 4.25. Tabel user .................................................................................... 127

Tabel 4.26. Tabel Status User.......................................................................... 127

Tabel 4.27. Tabel data_pribadi ........................................................................ 128

Tabel 4.28. Tabel pilihan_program.................................................................. 129

Tabel 4.29. Tabel asal_sekolah ....................................................................... 129

Tabel 4.30. Tabel data_orang_tua ................................................................... 130

Tabel 4.31. Tabel alamat_orang_tua ................................................................ 131

Tabel 4.32. Daftar Tools Pengembangan Perangkat Lunak Sistem................... 143

Tabel 4.33. Hasil Pengujian Mandiri Halaman User ........................................ 144

Tabel 4.34. Hasil Pengujian Mandiri Halaman Admin..................................... 147

Tabel 4.35. Pengujian Penerimaan Sistem ....................................................... 148

DAFTAR SIMBOL

Data Flow Diagram (DFD)

Simbol Nama Fungsi

Proses Mengubah suatu data dari suatu

bentuk menjadi bentuk yang

lain.

Data Flow Menunjukkan perpindahan data

dari satu bagian ke bagian lain

dalam suatu sistem

Data Store Tempat penyimpanan data

dalam suatu sistem

External Entity Menunjukkan suatu organisasi

atau perseorangan yang

memasukkan data ke sistem

Sumber : (Ladjamudin)

Entity Relationship Diagram (ERD)

Simbol Nama Fungsi

Entity Merupakan obyek yang

mewakili sesuatu dalam dunia

nyata dan dapat dibedakan

antara satu dengan lainnya

Atribute Merupakan karakteristik dari

sebuah entitas

Relasi Menghubungkan antar beberapa

entitas

Sumber : (http://blog.re.or.id/erd-entity-relationship-diagram.htm)

http://blog.re.or.id/erd-entity-relationship-diagram.htm

State Transition Diagram (STD)

Simbol Nama Fungsi

Aktifitas perilaku spesifikasi yang

menggambarkan

sekuensial serta

langkah-langkah prosedur

komputasi.

State Awal Menunjukkan tempat

dimana eksekusi program

dimulai ketika sebuah

activity dipanggil

State Akhir menyebabkan

penghentian eksekusi

paksa

semua flow dalam activity

dan berakhirnya

pelaksanaan activity

Flow Mendeskripsikan sumber

dan target dari berbagai

jenis informasi

Sumber : (http://blog.re.or.id/std-state-transition-diagram.htm)

http://blog.re.or.id/std-state-transition-diagram.htm

DAFTAR ISTILAH

Blackbox Suatu jenis pengujian perangkat lunak berdasarkan dengan

input, output pemakai.

Coding Tahapan dimana pengembangan software melakukan

pembangunan aplikasi.

Design Tahapan dimana pengembangan software melakukan

perancangan.

Testing Tahapan dimana pengembangan software melakukan uji coba

terhadap aplikasi.

User Pengguna dari sistem

User Friendly Bersahabat untuk digunakan, sehingga user mudah untuk

menggunakan.

FAST Framework for Application of System Thingking

Statis Tidak dapat diperbaharui oleh user. Hanya dapat di update

oleh Admin.

Pengembangan Melakukan perubahan pada sistem lama dengan sistem yang

baru.

Web Portal Merupakan sistem informasi berbasis web yang menyediakan

informasi serta akses ke beberapa fitur sistem lain

JQuery library (framework) javascript

BAB I

PENDAHULUAN

1.1. Latar Belakang Masalah

Dunia teknologi informasi saat ini semakin berkembang dan maju. Dalam

penyebaran informasi yang sangat cepat dan luas, salah satu media informasi yang

efektif adalah internet. Telah diakui banyak kalangan bahwa internet adalah salah

satu media informasi yang cukup efektif dan murah dalam hal penyebarluasan

informasi, baik dibidang pendidikan maupun dibidang berita. Untuk

menyebarluaskan informasi di internet adalah dengan menggunakan website

(Winanto, 2008:3).

Website yang baik adalah website yang banyak kunjungi oleh pengunjungnya.

Salah satu aspek yang harus dipertimbangkan adalah tampilan dari website tersebut

yang interaktif dan menarik atau lebih dikenal Web 2.0. Untuk membuat website

yang interaktif dan menarik diperlukan banyak modul dan fungsi yang terdiri dari

banyak baris kode. Diperlukan framework atau library untuk mempermudah dalam

pembuatan modul dan fungsi. Sehingga waktu pembuatan bisa lebih efisien. Salah

satu library yang sedang popular sekarang adalah JQuery (Hakim,2009:12).

JQuery adalah suatu library (framework) javascript yang menekankan

bagaimana interaksi antara javascript dengan HTML. JQuery pertama kali

dikembangkan pada tahun 2005 oleh John Resig dan dirilis pada 14 Januari 2006 dan

kemudian berkembang pesat dan populer digunakan di berbagai website sampai

dengan sekarang. Pada kenyataan seiring dengan perkembangannya jQuery tidak

hanya menjadi framework untuk javascript tetapi juga memiliki kelebihan dan 1

kehandalan yang lain, sehingga banyak digunakan oleh para pengembang web. Salah

satunya dapat diterapkan pada pembuatan website universitas.

STMIK Islam Internasional Jakarta adalah lembaga pendidikan swasta yang

terdaftar di Kopertis III Jakarta. STMIK Islam Internasional Jakarta memberikan

perhatian serius pada pendidikan dan pelajaran kehidupan, tidak hanya untuk

kebutuhan akademik mahasiswanya tetapi juga kehidupan agama dan

moral sebagai individu dan anggota masyarakat islam internasional. STMIK Islam

Internasional Jakarta juga memberikan pelayanan, kepedulian untuk mendidik,

melatih dan menanamkan nilai-nilai luhur untuk laki-laki dan perempuan muda.

Sebagai salah satu universitas yang baru berdiri pada tahun 2008, kebutuhan

akan informasi yang cepat dan tepat sangat diperlukan untuk menyajikan data-data

yang lengkap, mempermudah kelangsungan pembelajaran akademik, dan

mempercepat pengolahan data mahasiswa, khususnya pengelolaan web portal, dan

sistem pendaftaran online. Hal inilah yang mendasari pentingnya web portal sebagai

gerbang media informasi, sehingga penulis mengangkat permasalahan ini yang diberi

judul ”Pengembangan Web Portal Universitas menggunakan JQuery pada STMIK

Islam Internasional Jakarta”.

1.2. Rumusan Masalah

Didasari oleh latar belakang masalah tersebut, maka penulis mengambil tema

pembuatan web portal dengan menggunakan framework JQuery. Adapun masalah

yang dibahas adalah sebagai berikut ini:

a) Bagaimana membangun sebuah sistem yang menyajikan data-data yang

lengkap dan mempermudah kelangsungan pembelajaran yang dibutuhkan

STMIK Islam Internasional Jakarta?

b) Bagaimana membangun dan mengimplementasikan sebuah sistem web

berbasis JQuery yang lebih user freindly, serta aplikasi berita, kotak

saran, info akademik dan lain-lain sebagai pelayanannya?

c) Bagaimana membangun sistem pendaftaran secara online untuk

penerimaan mahasiswa baru?

1.3. Batasan Masalah

Penulis membatasi ruang lingkup permasalahan tugas akhir ini agar tidak

terjadi kerancuan dalam pembahasan yang meliputi :

1. Analisis dan perancangan proses bisnis yang akan digunakan pada sistem

ini disesuaikan dengan proses bisnis yang ada di STMIK Islam

Internasional Jakarta.

2. Proses yang akan penulis bahas yaitu proses yang berada pada halaman

user dan proses yang ada pada halaman admin.

3. Proses pendaftaran online hanya sampai administrator mengirim kartu

pendaftaran kepada mahasiswa, dan mahasiswa dapat melakukan ujian

masuk STMIK Islam Internasional Jakarta.

4. Dalam melakukan perancangan aplikasi, penulis menggunakan Data Flow

Diagram (DFD) sebagai tools desain aplikasinya.

5. Pengguna sistem ini nantinya adalah administrator website, mahasiswa dan

calon mahasiswa, dosen dan pegawai STMIK Islam Internasional Jakarta.

6. Sisi keamanan yang penulis lakukan adalah mendisable edit username,

menghindari Spam dengan Captcha, menghindari XSS Attack,

menghindari SQL Injection, mencegah browsing folder secara langsung,

menutup celah aplikasi download dan validasi data menggunakan

Javascript.

7. Pengembangan terhadap data-data yang disajikan adalah data mengenai

profil, info akademik, berita, gambaran program studi, fasilitas dan

hubungi kami.

8. Dalam hal mempermudah proses pembelajaran dilakukan pembuatan link

ke sistem e-learning.

1.4. Tujuan Penelitian

a. Adapun tujuan penelitian ini adalah untuk memberikan sumbangan pikiran

dalam penggunaan sistem komputer, yang ditujukan untuk pencarian

informasi yang mempunyai sifat online dalam efisiensi waktu, sehingga

pihak yang berwenang dan membutuhkan informasi tidak mengalami

kesulitan untuk memperolehnya.

b. Memberikan informasi Pendaftaran bagi mahasiswa baru dan juga

informasi-informasi lainnya yang dibutuhkan oleh mahasiswa dan

masyarakat pada umumnya.

c. Kehadiran Website Portal Informasi ini, diharapkan dapat membantu

masyarakat untuk mendapatkan informasi aktual seputar kegiatan-kegiatan

di Kampus STMIK Islam Internasional Jakarta.

d. Mengimplementasikan keilmuan yang didapat selama mengikuti

perkuliahan khususnya dalam pengembangan sistem web portal.

1.5. Manfaat Penelitian

Sesuai dengan permasalahan dan tujuan penelitian yang sudah disebutkan,

banyak manfaat yang dapat penulis petik dalam penyusunan skripsi ini,

diantaranya adalah:

1.5.1. Bagi Penulis

a. Dapat menerapkan ilmu-ilmu yang diperoleh selama kuliah.

b. Menambah pengetahuan penulis tentang teknologi informasi,

khususnya dalam membangun sebuah aplikasi web menggunakan

JQuery.

1.5.2. Bagi Universitas

a. Mengetahui kemampuan mahasiswa dalam menguasai materi teori

yang telah diperoleh selama kuliah.

b. Mengetahui kemampuan mahasiswa dalam menerapkan ilmunya dan

sebagai bahan evaluasi.

c. Memberikan gambaran tentang kesiapan mahasiswa dalam

menghadapi dunia kerja dari hasil yang diperoleh selama belajar /

kuliah.

1.5.3. Bagi Pengguna

a. Membantu pengguna mendapatkan informasi aktual seputar

kegiatan-kegiatan di Kampus STMIK Islam Internasional Jakarta.

b. Membantu STMIK Islam Internasional Jakarta dalam melakukan

pemasaran dan promosi.

c. Memberikan kemudahan kepada calon mahasiswa baru, dan pegawai

dalam proses pendaftaran dengan adanya fitur pendaftaran online.

d. Memberikan kemudahan kepada masyarakat pada umumnya dengan

adanya web portal STMIK Islam Internasional ini.

1.6. Metodologi Penelitian

Adapun metode penelitian yang penulis lakukan dalam pembuatan skripsi ini

penulis melakukan riset di STMIK Islam Internasioanal Jakarta adalah :

1.6.1. Metode Pengumpulan Data

a. Studi Lapangan

1. Observasi

Selama riset penulis melakukan pengamatan langsung

terhadap kegiatan yang dilakukan oleh staff pengurus

harian yang bertugas melaksanakan kegiatan pokok.

2. Wawancara

Penulis melakukan tanya jawab langsung dengan staf

pengurus, pegawai dan pimpinan STMIK Islam


b. Studi Pustaka

Dengan metode studi pustaka ini, penulis mendapat sumber

data dari buku-buku atau referensi yang berkaitan dengan

perancangan sistem.

c. Studi Literatur

Dengan metode studi literatur ini, penulis mendapat sumber

data dari makalah-makalah atau karya ilmiah yang

berhubungan dengan studi literatur pada skripsi, jurnal atau

referensi yang berkaitan dengan perancangan sistem.

.

d. Studi Kelayakan

Dengan metode studi kelayakan ini, penulis dapat menentukan

kemungkinan apakah pengembangan aplikasi/sistem layak

dilakukan.

1.6.2. Metode Pengembangan Sistem

Metode Penembangan sistem yang penulis lakukan

menggunakan metode FAST (Framework for the Applications of

Sytems Thinking) dan menggunakan perkakas utama dalam analisis

dan perancangannya yaitu Data Flow Diagram (DFD), Entity

Relationship Diagram (ERD), dan State Transition Diagram (STD).

1.7. Sistematika Penulisan

Dalam penulisan skripsi ini penulis akan membagi sistematika penulisan

dalam lima bab, dimana satu dan yang lainnya saling berhubungan. Adapun

sistematika penulisan skripsi ini adalah sebagai berikut :

BAB I PENDAHULUAN

Bab ini berisi pendahuluan yang terdiri dari latar belakang, rumusan masalah,

batasan masalah, tujuan penelitian, manfaat penelitian, metodologi penelitian,

tinjauan pustaka, dan sistematika penulisan.

BAB II LANDASAN TEORI

Pada bab ini diuraikan teori yang diperlukan dalam penyusunan dan penulisan

skripsi.

BAB III METODE PENELITIAN

Dalam bab ini penulis memaparkan mengenai metode yang penulis gunakan

dalam pencarian data maupun metode untuk pengembangan system yang dilakukan

pada penelitian ini.

BAB IV HASIL DAN PEMBAHASAN

Bab ini berisi tentang hasil yang dicapai setelah melalui tahapan-tahapan

yang telah dilalui sebelumnya serta memberikan tampilan-tampilan dari web yang

dibuat, tinjauan organisasi, permasalahan dan alternatif permasalahan dalam

“Pengembangan Web Portal Universitas Menggunakan JQuery pada STMIK Islam

Internasional Jakarta”. Dalam bab ini juga dibahas mengenai arsitektur dan proses

publikasi web yaitu berupa nama domain, kapasitas hosting dan analisa biaya.

BAB V PENUTUP

Pada bab ini penulis menyampaikan kesimpulan dari hasil penelitian yang

telah dilaksanakan serta saran-saran yang berhubungan dengan pembangunan

program yang dibutuhkan untuk pengembangan sistem yang lebih baik lagi.

Daftar Pustaka

Lampiran.

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Internet

Internet adalah sebuah sistem komunikasi global yang menghubungkan

komputer-komputer dan jaringan-jaringan komputer di seluruh dunia. Ketika

komputer terhubung secara global dengan menggunakan TCP / IP sebagai protocol

pertukaran paket data (packet switching communication protocol). (Melwin

Syafrizal, 2005:195).

Sedangkan menurut Budi Sutedjo Dharma Oetomo, Ester Wibowo, Edhie

Hartono, dan Samuel Prakoso (2007:117), Internet merupakan sekumpulan jaringan

yang terhubung satu dengan lainnya, dimana jaringan menyediakan sambungn

menuju global informasi. Dari definisi diatas dapat disimpulkan bahwa melalui

internet para pengguna dapat saling berhubungan melalui jaringan-jaringan komputer

yang terkoneksi.

2.2. Konsep Dasar Web Portal

Web Portal adalah situs web yang menyediakan kemampuan tertentu yang

dibuat sedemikian rupa mencoba menuruti selera para pengunjungnya. Web Portal

merupakan sistem informasi berbasis web yang menyediakan informasi serta akses

ke beberapa fitur sistem lain. Kemampuan portal yang lebih spesifik adalah

penyediaan kandungan informasi yang dapat diakses menggunakan beragam

10

perangkat, misalnya komputer pribadi, komputer jinjing (notebook), PDA (Personal

Digital Assistant), atau bahkan telepon genggam.

Web Portal merupakan media untuk mengakses informasi dari internet,

berbeda dengan blog, portal menyediakan beragam layanan/aplikasi seperti email,

berita, info harga, hiburan dan lain-lain.

2.3. Pengantar Pemograman Web

Ada 2 kategori dalam pemograman web, yaitu pemograman client side dan

server side (Wahana Komputer, 2006:3-7) :

1. Client Side

Pada pemograman client side, perintah-perintah program (script) dijalankan web

browser, sehingga ketika client meminta dokumen script maka script dapat

didownload dari server kemudian dijalankan pada web browser yang

bersangkutan. Program web yang tergolong dalam client side adalah HTML

dan XTHML.

2. Server Side

Pada pemograman server side, perintah-perintah program (script) dijalankan di web

server, kemudian hasil dikirimkan ke web browser dalam bentuk HTML

biasa. Program web yang tergolong server side adalah Page Hypertext

Prepocessor (PHP), Active Server Page (ASP).

2.4. Konsep Metodologi

2.4.1. Metode Pengumpulan Data

Metode pengumpulan data dalam penelitian ini meliputi dua aspek yaitu

(Nasir, 2003: 186):

1. Studi Lapangan

Penelitian lapangan adalah cara pengambilan data dengan

menggunakan mata, tanpa ada pertolongan alat standar untuk keperluan

tersebut.

2. Studi Kepustakaan

Studi kepustakaan ini merupakan penelitian yang dilakukan dengan

mengumpulkan data, membaca, mencatat, mempelajari buku-buku

literatur serta sumber data lainnya yang berkaitan dengan masalah yang

diteliti.

3. Studi Literatur

Studi literatur dalam sebuah penelitian berguna untuk mendapatkan

gambaran yang menyeluruh tentang apa yang sudah dikerjakan orang

lain dan bagaimana orang mengerjakannya, kemudian seberapa berbeda

penelitian yang akan kita lakukan.

Penting karena untuk menghindari usaha yang sebenarnya sudah pernah

dilakukan orang lain dan bisa digunakan pada penelitian kita untuk

menghemat waktu, tenaga dan biaya. Penting juga untuk memberi arah

penelitian selanjutnya yang perlu dilakukan untuk melanjutkan misi

penelitian (Gufron, 2009:3).

4. Studi Kelayakan

Tahapan studi kelayakan merupakan tahapan dimana dilakukan suatu

studi yang akan digunakan untuk menentukan kemungkinan apakah

pengembangan aplikasi/sistem layak dilakukan.

2.4.2. Framework for the Applications of Sytems Thinking (FAST)

Framework for the Applications of Sytems Thinking (FAST) adalah

sebuah kerangka cerdas untuk penerapan pemikiran sistem. FAST merupakan

metodologi hipotesis yang dibuat untuk tujuan pembelajaran. Selain itu, FAST

juga merupakan gabungan praktik-praktik terbaik yang ditemui dalam banyak

metodologi referensi dan komersial. Metode ini dapat menghasilkan sistem

informasi dengan kualitas yang baik dalam waktu yang singkat. (Whitten dan

Bentley, 2007:81).

Metode FAST mempunyai 8 tahapan utama yang terlihat pada Gambar 2.1

Gambar 2.1 Aliran tiap-tiap fase dalam metodologi FAST

Sumber: (whitten dan Bentley, 2007:89)

Model Pengembangan FAST memiliki 8 fase yaitu fase pendefinisian

ruang lingkup (Scope Definition), fase analisis masalah (Problem Analysis), fase

analisis kebutuhan (Requirement Analysis), fase perancangan logical (Logical

Design), fase analisis keputusan (Decision Analysis), fase perancangan fisik

(Physical Design), fase konstruksi dan pengujian (Construction and Testing),

dan fase instalasi dan pengiriman (Installation and Delivery). Berikut adalah

penjelasan masing-masing fase dalam penelitian ini (Whitten & Bentley,

2007:89) :

2.4.2.1. Scope Definition (Definisi Ruang Lingkup)

Fase pertama proyek adalah definisi lingkup. Pada fase ini

didefinisikan lingkup proyek dan masalah-masalah, kesempatan dan

perintah yang diterima yang memicu proyek tersebut. Fase definisi

lingkup juga menetapkan rencana proyek dalam artian skala, strategi

pengembangan, jadwal, persyaratan-persyaratan sumber daya, dan

anggaran (Whitten & Bentley, 2007:183).

Fase definisi lingkup didasari oleh kombinasi masalah,

kesempatan, dan perintah (batasan dan visi). Hasil terpenting dari definisi

lingkup adalah pernyataan masalah (problem statement), yaitu pandangan

umum yang diungkapkan dengan jelas dan singkat tentang masalah,

kesempatan, dan perintah yang memicu proyek.

Output dari tahap ini adalah kerangka PIECES. Kerangka ini

menyediakan sketsa yang bagus untuk problem statement. Tujuannya

bukan untuk memecahkan masalah, kesempatan dan perintah tetapi

hanya mengkatalogkan dan mengkategorisasikan. Selain itu juga

diidentifikasikan batasan proyek yang diusulkan. Contoh dari batasan

adalah batas anggaran, tenggat waktu, sumberdaya manusia, kebijakan

bisnis atau peraturan pemerintah, dan standar teknologi (Whitten &

Bentley, 2007:183).

2.4.2.2. Problem Analysis (Analisis Masalah)

Tahap problem analysis menganalisa mendalam tentang masalah

yang mendasari sehingga dikerjakannya proyek. Prasyarat untuk tahap

problem analysis adalah cakupan dan pernyataan masalah sebagaimana

didefinisikan dan disetujui pada tahap scope definition.

Hasil dari tahapan ini adalah peningkatan performa sistem yang

akan memberikan keuntungan dari segi bisnis perusahaan. Hasil lain dari

tahapan ini adalah sebuah laporan yang menerangkan tentang problems,

causes, effects, dan solution benefits.

2.4.2.3. Requirements Analysis (Analisis Kebutuhan)

Tahap requirements analysis ini mendefinisikan dan

memprioritaskan kebutuhan proyek. Secara sederhana, requirements

analysis adalah untuk mengetahui apa yang dibutuhkan atau diinginkan

dari sistem baru. Ini tahap yang paling penting dari sistem proyek.

Prasyarat untuk tahap analisis kebutuhan adalah tujuan-tujuan

perbaikan sistem hasil dari tahap problem analysis. Untuk mendapatkan

daftar kebutuhan-kebutuhan, tim proyek bekerja dengan para pengguna

sistem untuk mengidentifikasi kebutuhan dan prioritas. Informasi ini

dikumpulkan dengan cara wawancara, kuesioner, dan memfasilitasi

pertemuan.

Produk jadi dari fase analisis kebutuhan adalah pernyataan

persyaratan bisnis yang akan memenuhi sasaran peningkatan sistem yang

diidentifikasi didalam fase sebelumnya.

2.4.2.4. Logical Design (Desain Logikal)

Tahap logical design menerjemahkan kebutuhan ke dalam model

sistem. Tahapan ini menggambarkan suatu solusi dan teknis serta

metodologi. Metodologi yang berbeda-beda akan memerlukan atau

merekomendasikan jumlah dan derajat pemodelan desain sistem yang

berbeda pula. Prasyarat untuk logical design adalah daftar kebutuhan

yang didapatkan dari tahapan requirements analysis. Hal-hal yang

dilakukan dalam tahapan ini adalah:

1. Menggambar model data yang menggambarkan data dan

kebutuhan informasi.

2. Menggambarkan model proses yang menggambarkan kebutuhan

3. Menggambarkan model interface yang menggambarkan proyek

dan kebutuhan interface.

2.4.2.5. Decision Analysis (Analisis Keputusan)

Decision Analysis ialah melakukan analisa terhadap keputusan

yang akan diambil berdasarkan solusi-solusi yang ditawarkan. Dalam

analisis keputusan, umumnya terdapat berbagai alternatif untuk

mendesain sistem informasi yang baru.

Berdasarkan kebutuhan sistem dan model sistem yang didapatkan

pada tahapan requirements analysis dan logical design, maka akan ada

banyak cara untuk merancang suatu sistem untuk memenuhi kebutuhan

tersebut. Ada beberapa hal yang harus diperhatikan dalam tahapan ini

yaitu:

1. Berapa banyak sistem akan dikomputerisasi.

2. Apakah kita sebaiknya membeli software atau

mengembangkannya sendiri.

3. Apakah kita sebaiknya mendesain sistem untuk jaringan internal

atau berbasis web.

4. Teknologi informasi apa yang dapat digunakan dalam apilkasi ini.

Tujuan dari tahap ini adalah: (1) Mengidentifikasi beberapa solusi

teknis, (2) Analisis kelayakan, dan (3) Merekomendasikan sistem yang

akan dirancang.

Tim proyek biasanya mencari solusi-solusi yang paling layak

yang menawarkan kombinasi terbaik dari kalayakan teknis, operasional,

ekonomi, jadwal dan risiko. Keputusan dibuat tentang teknologi yang

akan digunakan sebagai bagian dari arsitektur aplikasi. Pada tahap ini

ditentukan bahasa pemrograman, tools dalam pembangunan dan

database yang akan digunakan.

2.4.2.6. Physical Design and Integration (Desain Fisik dan Integrasi)

Setelah mendapatkan persetujuan dari pemilik sistem pada

tahapan decision analysis, maka akhirnya sistem yang baru dapat

dirancang. Tujuan tahap physical design and integration adalah

mengubah kebutuhan ke dalam spesifikasi desain fisik yang akan

memandu sistem konstruksi.

Pada tahap ini dilakukan: (1) spesifikasi desain database fisik, (2)

proses bisnis fisik dan spesifikasi desainperangkat lunak, (3) spesifikasi

antarmuka pengguna.

Ada dua filosofi desain fisik ekstrem. (1) Desain spesifikasi:

model sistem fisik dan spesifikasi diproduksi sebagai serangkaian

tertulis, (2) Desain prototyping: lebih lengkap tapi aplikasi dibangun dan

disempurnakan berdasarkan masukan dari pengguna dan desainer

lainnya.

2.4.2.7. Construction and Testing (Konstruksi dan Pengujian)

Tujuan tahap construction and testing ada dua: (1) untuk

membangun dan menguji sistem yang memenuhi kebutuhan dan

spesifikasi desain fisik, dan (2) untuk mengimplementasikan interface

antara sistem baru dan sistem yang ada. Selain itu, membantu dalam

persiapan untuk pelatihan dan sistem operasi. Tahap konstruksi

melibatkan instalasi perangkat lunak yang dibeli. Tim proyek harus

membangun atau menginstal:

1. Database: untuk mendukung data operasional, analisis data dan

mendukung keputusan kebutuhan.

2. Paket perangkat lunak: Program aplikasi yang dibangun sesuai

dengan desain fisik dari tahap sebelumnya.

3. User interface sistem: User interface harus dibangun dan diuji

untuk kegunaan dan stabilitas. Sistem untuk interface sistem

harus dibangun atau diimplementasikan dengan menggunakan

teknologi aplikasi integrasi.

Salah satu aspek yang paling penting dari construction and testing

adalah melakukan pengujian dari kedua komponen sistem individual dan

sistem secara keseluruhan. Setelah diuji siap untuk instalasi dan

pengiriman. Pada tahapan construction penulis melakukan pembangunan

perangkat lunak yang biasa disebut coding dan melakukan pengujian

perangkat lunak kepada user yaitu pihak dari STMIK.

2.4.2.8. Installation and Delivery (Instalasi dan Pengiriman)

Tahap installation and delivery berfungsi untuk memasukan

sistem ke dalam operasi. Pembangun sistem menginstal sistem dari

lingkungan pengembangannya ke dalam lingkungan produksi. Para analis

sistem harus melatih para pengguna sistem, menuliskan berbagai macam

manual pnegguna dan kontrol produksi, mengkonversi database yang ada

menjadi database baru, dan melakukan pengujian sistem final.

Prasyarat fase Installation and delivery adalah fase konstruksi dan

pengujian. Installation and delivery juga melibatkan individu pelatihan

yang akan menggunakan sistem dan mengembangkan dokumentasi untuk

membantu para pengguna sistem. Tahap implementasi biasanya

mencakup beberapa bentuk kajian untuk menilai keberhasilan proyek

sistem selesai. Kegiatan ini mempromosikan perbaikan proses dan

manajemen proyek masa depan.

2.5. Bagan Alir (Flowchart)

Bagan alir (flowchart) adalah bagian yang menunjukkan alir didalam program

atau prosedur sistem secara logika. Bagan alir digunakan terutama untuk alat bantu

komunikasi dan untuk dokumentasi.

Bagan alir sistem (System Flowchart) merupakan bagan yang menunjukkan

arus pekerjaan secara keseluruhan dari sistem. Bagan ini menjelaskan urutan-urutan

dari prosedur-prosedur yang ada di dalam sistem. Bagan alir sistem menunjukkan

apa yang dikerjakan oleh sistem.

2.6. Tool Perancangan Sistem

Gambar 2.2 Struktur Model Analisis

(Pressman, 2002:354)

2.6.1. Data Flow Diagram (DFD)

Data Flow Diagram (DFD) adalah suatu grafis diagram yang

menggunakan beberapa symbol sederhana sampai pada menggambarkan alir

data diantara entitas eksternal, pengolahan aktifitas, dan mengatur penggunaan

dari alat-alat masukan atau pengeluaran (O’Brien, 2005:G-5).

DFD melayani dua tujuan : (1) untuk memberikan indikasi mengenai

bagaimana data ditransformasi pada saat bergerak melalui sistem, dan (2) untuk

Entity

Relationship

Diagram

Data Flow

Diagram

State

Transition

Diagram

Data

Dictionary

menggambarkan fungsi-fungsi yang mentransformasi aliran data (Pressman,

2002).

2.6.1.1. Diagram Konteks

Diagram konteks adalah diagram yang terdiri dari suatu proses

dan menggambarkan ruang lingkup suatu sistem. Diagram konteks

menggambarkan seluruh input ke sistem atau output ke sistem

(Ladjamudin, 2005:64).

2.6.2. Entity Relationship Diagram (ERD)

ERD menurut Jeffrey L. Whitten (2004:45). Diagram hubungan data

digunakan untuk menggambarkan hubungan antara data store yang ada di dalam

diagram aliran data.

Entity Relationship Diagram (ERD) adalah suatu data perencanaan dan

merupakan alat pengembangan sistem yang model hubungannya berada diantara

satu kesatuan dalam satu proses bisnis (O’Brien, 2005:G-7).

2.6.3. State Transition Diagram (STD)

State Transition Diagram (STD) mempresentasikan tingkah laku dari

suatu sistem dengan menggambarkan keadaannya dan kejadian yang

menyebabkan sistem mengubah keadaan. STD juga menunjukkan bahwa aksi

diambil sebagai akibat dari suatu kejadian khusus (Pressman, 2002:373).

2.7. Desain Perancangan Sistem

2.7.1. Desain Data

Desain data mentransformasi model domain informasi yang dibuat

selama analisis ke dalam struktur data yang akan diperlukan untuk

mengimplementasi perangkat lunak. Objek dan hubungan data yang ditetapkan

dalam diagram hubungan entitas (ERD) dan isi data detail yang digambarkan

didalam kamus data, menjadi basis bagi aktivitas desain data(Pressman,

2002:400).

2.7.2. Desain Arsitektur

Desain arsitektur menentukan hubungan diantara elemen-elemen

struktural utama dari program. Representasi desain tersebut kerangka kerja

modular dari sebuah program komputer dapat diperoleh dari model-model

analisis dan interaksi subsistem yang ditentukan dalam model analisis

(Pressman, 2002:400).

2.7.3. Desain Prosedural

Desain Prosedural mentransformasi elemen-elemen structural dari

arsitektur program ke dalam suatu deskripsi dari komponen-komponen

perangkat lunak. Informasi yang diperoleh dari STD berfungsi sebagai dasar

bagi desain procedural (Pressman, 2002:400).

2.7.4. Desain Interface

Desain interface menjelaskan internal dan eksternal antarmuka program

serta desain antarmuka manusia. Internal dan eksternal desain antarmuka yang

berdasarkan informasi yang diperoleh dari analisis model

(http://en.wikipedia.org/wiki/Design_document).

http://en.wikipedia.org/wiki/Design_document

2.8. Perangkat Lunak Pengembangan Sistem

2.8.1. Javascript

Javascript adalah bahasa yang berbentuk kumpulan skrip yang pada

fungsinya berjalan pada suatu dokumen HTML, Bahasa ini adalah bahasa

pemrograman untuk memberikan kemampuan tambahan terhadap bahasa HTML

dengan mengijinkan pengeksekusian perintah perintah di sisi user, yang artinya

di sisi browser bukan di sisi server web.

Javascript bergantung kepada browser(navigator) yang memanggil

halaman web yang berisi skrip skrip dari Javascript dan tentu saja terselip di

dalam dokumen HTML. Javascript juga tidak memerlukan kompilator atau

penterjemah khusus untuk menjalankannya (pada kenyataannya kompilator

Javascript sendiri sudah termasuk di dalam browser tersebut). Lain halnya

dengan bahasa “Java” (dengan mana JavaScript selalu di banding bandingkan)

yang memerlukan kompilator khusus untuk menterjemahkannya di sisi

user/klien.

2.8.2. JQUERY

JQuery adalah suatu library (framework) javascript yang menekankan

bagaimana interaksi antara javascript dengan HTML. JQuery mempermudah dan

mempercepat developer web dalam membuat kode Javascript. Secara standar,

apabila seseorang membuat kode Javascript, maka diperlukan kode yang cukup

panjang, bahkan terkadang sangat sulit dipahami. Disinilah peranan JQuery

sebagai Javascript Library, dimana pengembang web dapat langsung

memanggil fungsi yang terdapat di dalam Library tersebut. (Hakim, 2010:3).

JQuery mempersingkat Ajax (Asynchronous Javascript and XML).

Kemampuan favorit dari Ajax adalah mampu mengambil informasi dari server

tanpa melakukan refresh pada halaman web, artinya halaman web terlihat

berganti secara otomatis. Apabila kita menuliskan kode Ajax secara manual,

biasanya diperlukan baris yang cukup panjang, namun JQuery dapat

mempersingkatnya menggunakan Ajax call, perbandingannya 25 baris kode

Ajax dapat disingkat menjadi 5 baris kode saja dengan JQuery.

Alasan Penulis menggunakan Framework JQuery adalah karena JQuery

telah banyak digunakan oleh website-website terkemuka di dunia, selain itu

JQuery kompatibel dengan semua browser, File JQuery hanya satu dan

ukurannya kecil sehingga cepat aksesnya, Fitur JQuery paling lengkap

dibandingkan dengan Framework Javascript yang lain, JQuery dapat bekerja di

berbagai web browser, seperti Mozilla Firefox, Internet Explorer, Google

Chrome, Opera dan browser lainnya, JQuery Open source, sehingga dapat

dimodifikasi sesuai kebutuhan. (Hakim, 2010:4).

Untuk memberikan gambaran agar tidak terjadi kesalah pahaman

persepsi, berikut ini adalah teori perbandingan framework javascript lain yang

sering digunakan oleh pengembang web. Namun penulis hanya membandingkan

beberapa framework saja karena secara keseluruhan kurang lebih sama dengan

yang penulis bahas, antara lain yaitu :

1. Yahoo User Interface Library (YUI)

YUI adalah salah satu framework JavaScript terbesar dalam

daftar ini. YUI memiliki semua hal untuk membantu Anda membangun

aplikasi web interaktif menggunakan teknik seperti DOM scripting,

DHTML dan AJAX oleh satu set utilitas kuat dan kontrol. YUI

memiliki fitur canggih yang cukup banyak, plugin, ekstensi yang

membawa Anda pada waktu yang sangat lama untuk belajar.

(http://developer.yahoo.com/yui/)

2. Dojo Toolkit

Dojo toolkit adalah javascript framework yang menyediakan

library yang cukup banyak. Dibagi menjadi 3 bagian penting, yaitu

Dojo core, base, Dijit, DojoX.

Dojo base adalah bagian library yang mengatur tentang hal

dasar pada dojo, dan harus dipanggil setiap kali kita akan menggunakan

Dojo toolkit, bisa dikatakan ini adalah library wajib. Fungsi yang

terdapat di base ini adalah fungsi ajax, fungsi penting dojo, dan DOM.

Dojo core menyediakan fungsi untuk parsing widget, efek

animasi tingkat lanjut, drag and drop, history handling, dll. Core ini

menggunakan dojo base, namun dalam penggunaannya, hanya terdapat

sedikit perbedaan saja.

Dijit, sebuah kata singkat dari Dojo Widget, memokuskan

pengembangannya untuk tampilan, menyimpan library untuk container

(set layout), form, dialog, text editor, kalender, color palette, dll.

http://developer.yahoo.com/yui/

DojoX, disebut juga Dojo eXtension atau eXperimental,

disimpan library fungsi yang belum pantas disimpan di paket utama

base/core atau Dijit, namun tidak jarang juga library DojoX merupakan

kombinasi penggunaan kedua library tersebut. (http://dojotoolkit.org/)

3. DHTMLX

DHTMLX adalah GUI widget library JavaScript untuk

membangun aplikasi web dinamis dengan pengalaman pengguna

desktop dan Ajax loading data. Library DHTMLX dirilis di bawah

kedua open-source GNU General Public License dan lisensi komersial.

arsitektur library memungkinkan menggunakan komponen sebagai blok

terpisah atau menggabungkan mereka ke dalam sebuah antarmuka

berbasis Ajax umum.

Struktur Modul: filosofi yang terletak di bawah library

DHTMLX menyiratkan bahwa setiap komponen merupakan entitas

yang terpisah dan mandiri yang dapat digunakan secara individual

untuk memastikan beberapa bagian tertentu dari aplikasi, misalnya

navigasi menu, treeview, datagrid, atau pemilih tanggal. Meskipun,

komponen API memungkinkan mengorganisir mereka dalam tata letak

antarmuka yang umum.

Desktop-like functionality: drag-and-drop, in-line editing,

operasi clipboard, validasi data, interaktivitas melalui Ajax. Mulai dari

versi 2.5 komponen UI dapat memiliki tampilan dan perilaku yang

mirip dengan unsur-unsur Window standar UI.

Client-to server communication: library DHTMLX

sepenuhnya bekerja pada sisi client dan dapat digunakan dengan bahasa

back-end atau database. Selain itu, siap untuk menggunakan lapisan

komunikasi (dhtmlxConnector) dapat digunakan untuk mengelola

komunikasi client-server dengan PHP,. Net atau Java.

Theming: mewarnai komponen antarmuka dapat dikustomisasi

melalui SkinBuilder online, yang menghasilkan file CSS yang

diperlukan dan gambar untuk menyediakan tema warna yang dipilih

oleh pengembang. Mulai dari versi 2.6 - ada kulit beberapa preset yang

tersedia.

Touch UI support: DHTMLX merilis sebuah kerangka

HTML5 JavaScript dioptimalkan untuk perangkat touchscreen dan

mobile (saat ini tersedia di alfa, rilis final direncanakan pada bulan

Pebruari 2011).

Cross-browser: library bekerja di semua browser modern: Safari,

Internet Explorer, Mozilla Firefox, Opera, dan Chrome.

(http://dhtmlx.com/docs/services.shtml)

4. Ample SDK

Ample SDK adalah sebuah standar javascript UI Framework

berbbasis cross-browser untuk membangun Rich Internet Application

(RIA). Ample SDK menggunakan teknologi XML (Seperti XUL, SVG

http://dhtmlx.com/docs/services.shtml

atau HTML5) untuk layout User Interface, CSS untuk Style UI, dan

Javascript dengan standar DOM / API JQuery untuk logika aplikasi.

Ample SDK menyetarakan browser dan membawa dukungan teknologi

jika ada kehilangan.

Ample SDK sepenuhunya ditulis dalam javascript dan

karenanya tidak memerlukan komponen khusus yang dipasang di

browser untuk beroperasi dengan baik. Ample SDK tidak memodifikasi

infrastruktur browser melainkan mengisi fungsi yang hilang.

Ample SDK terdiri dari sebuah Ample Runtime, implementasi

User INterface Markup language, dan satu set plugin. Ample SDK free

open source, didistribusikan menggunakan pendekatan dua lisensi

dibawah lisensi MIT dan GPL.

Ample SDK Runtime berfungsi penuh di semua browser web

yang modern. User Interface bahasa masih sedang dilaksanakan / diuji

dan beberapa kebiasaan dapat diamati.

(http://www.amplesdk.com/about/)

Dibawah ini adalah screenshot perbandingan framework javascript yang ada :

Gambar 2.3. Perbandingan Framework Javascript

(sumber: http://en.wikipedia.org/wiki/Comparison_of_JavaScript_frameworks)

http://en.wikipedia.org/wiki/Comparison_of_JavaScript_frameworks

Adapun dari segi ketersediaan/kelengkapan fitur, berikut adalah gambaran

perbandingan framework JQuery dengan framework lainnya :

Gambar. 2.4. Perbandingan Framework Javascript Dari Segi Fitur


Perbandingan dari segi dukungan web browser :


Gambar 2.5. Perbandingan Framework Javascript Dari Segi Dukungan web browser


2.8.3. PHP

PHP merupakan kependekan dari kata Page Hypertext Preprocessor.

PHP tergolong sebagai perangkat lunak open source yang diatur dalam aturan

General Purpose Licences (GPL). Dikatakan preprocessing karena pada proses

skrip PHP diminta oleh pengguna maka PHP hanya mengeksekusi kode yang

diminta dan mengirim hasil ke web server untuk dilanjutkan ke klien. PHP dapat

berjalan di Apache maupun IIS (Internet Information Services).

Pemograman PHP sangat cocok di kembangkan dalam lingkungan web,

karena php bisa dilekatkan pada script HTML atau sebaliknya. PHP dikhususkan

untuk pengembangan web dinamis. Menurut Madcoms (2004:2) PHP memiliki

keunggulan diantaranya yaitu:

a. Memiliki tingkat akses yang lebih cepat.

b. Memiliki tingkat lifecycle yang cepat sehingga selalu mengikuti

perkembangan teknologi internet.


c. PHP dapat mengakses ke beberapa database yang sudah ada, baik yang

bersifat gratis maupun berbayar. Database tersebut antara lain MySql,

PosgreSql, dan lain-lain.

d. Mampu berjalan di platform sistem operasi Windows, Linux, Solaris, dan

lain-lain.

2.8.4. MYSQL

Salah satu aplikasi basis data adalah MySql yang merupakan sebuah

program pembua basis data yang bersifat open source, artinya siapa saja boleh

menggunakan tanpa dicekal (Bunafit Nugroho, 2004:29). Sedangkan menurut

Wahana Komputer (2006:181) MySql merupakan sistem manajemen basis data

yang fungsinya untuk menambah, mengakses, dan memproses data yang

disimpan dalam sebuah basis data komputer. Kelebihan MySql menurut Wahana

Komputer(2006:182) antara lain:

a. Mampu berjalan di berbagai platform (misalnya Windows, Mac OS,

Solaris, dan lain-lain).

b. Menyediakan mesin penyimpanan (engine storage) transaksi dan non

transaksi.

c. Server tersedia sebagai program yang terpisah untuk digunakan pada

lingkungan jaringan klien/server.

d. Mempunyai library yang dapat ditempelkan pada aplikasi berdiri sendiri

(standalone application) sehingga aplikasi tersebut dapat digunakan pada

komputer yang tidak mempunyai jaringan.

e. Mempunyai sistem password yang aman dan fleksibel.

2.8.5. Apache Web Server

Web Server adalah sebuah bentuk server yang khusus digunakan untuk

menyimpan halaman website atau homepage (Bunafit Nugroho, 2004:6). Web

server menunggu permintaan dari client yang menggunakan browser, seperti

Mozilla, Internet Explorer, Opera, Google Chrome, Netscape dan lain-lain.

Web server dalam berkomunikasi dengan kliennya menggunakan

protocol HTTP (Hyper Text Transfer Protokol). Apache berada dibawah GNU,

General Public License yang bersifat free sehingga sehingga apache dapat di

download gratis pada alamat (http://apache.org) saat ini Apache banyak

digunakan sebagai web server untuk portal-portal besar.

Adapun pertimbangan dalam memilih Apache adalah :

a. Apache termasuk dalam kategori free software.

b. Instalasi Apache sangat mudah

c. Mampu beroperasi pada banyak platform sistem operasi seperti AUX,

Free BSD, HP-UX, IRIX, Linux, Solaris, Windows dan lain-lain.

d. Apache mudah dalam penambahan pheriferal lainnya hanya ke dalam

platform web server, misalnya menambahkan modul.

2.8.6. Cascading Style Sheet (CSS)

Cascading Style Sheets (CSS) adalah suatu bahasa stylesheet yang

digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa

markup. Penggunaan yang paling umum dari CSS adalah untuk memformat

http://apache.org/

halaman web yang ditulis dengan HTML dan XHTML. Walaupun demikian,

bahasanya sendiri dapat dipergunakan untuk semua jenis dokumen XML

termasuk SVG dan XUL. Spesifikasi CSS diatur oleh World Wide Web

Consortium (W3C).

CSS digunakan oleh penulis maupun pembaca halaman web untuk

menentukan warna, jenis huruf, tata letak, dan berbagai aspek tampilan

dokumen. CSS digunakan terutama untuk memisahkan antara isi dokumen (yang

ditulis dengan HTML atau bahasa markup lainnya) dengan presentasi dokumen

(yang ditulis dengan CSS). Pemisahan ini dapat meningkatkan aksesibilitas isi,

memberikan lebih banyak keleluasaan dan kontrol terhadap tampilan, dan

mengurangi kompleksitas serta pengulangan pada stuktur isi.

CSS memungkinkan halaman yang sama untuk ditampilkan dengan cara

yang berbeda untuk metode presentasi yang berbeda, seperti melalui layar, cetak,

suara (sewaktu dibacakan oleh browser basis-suara atau pembaca layar), dan

juga alat pembaca braille. Halaman HTML atau XML yang sama juga dapat

ditampilkan secara berbeda, baik dari segi gaya tampilan atau skema warna

dengan menggunakan CSS.

2.8.7. Adobe Photoshop CS4

Adalah perangkat lunak editor citra buatan Adobe Systems yang

dikhususkan untuk pengeditan foto/gambar dan pembuatan efek. Aplikasi Adobe

Photoshop CS 4.0 selain tangguh dalam mengedit, memodifikasi bitmap atau

foto, juga banyak lagi menyediakan fasilitas-fasilitas lain yang menarik.

Untuk memenuhi setiap kebutuhan yang menarik, seperti pengaturan

warna yang semakin akurat, penggunaan fasilitas efek dan filter yang semakin

canggih, dan fasilitas pemodifikasian tipografi teks yang unik dan fantastik.

(Khaerudin, 2005:13).

Gambar 2.6. Lingkungan Kerja Adobe Photoshop CS 4.0

2.9. Pengelolaan Database

Database adalah kumpulan data yang terdiri atas satu atau lebih tabel yang

terintegrasi satu sama lain, dimana setiap pemakai (user) diberi wewenang (otoritas)

untuk dapat mengakses (mengubah, menghapus, menganalisis, menambah, dan

memperbaiki) data dalam tabel tersebut (O’Brien, 2005:G-5).

Ada dua cara data dikelola yaitu flat file (file datar) dan relational

(berhubungan). Pada flat file data diimasukkan dalam tabel tunggal yang berisi

kolom dan baris. Biasanya data secara flat file dapat menimbulkan masalah.

Pengelolaan database dimana beberapa tabel dimasukkan dalam satu file dan tabel

satu dengan yang lainnya saling berhubungan melalui field yang sama (kunci)

disebut pengelolaan database secara relational.

Hubungan antara tabel satu dengan tabel lainnya melalui field yang sama

disebut relasi. Relasi dibuat menggunakan kunci. Ada dua macam kunci : pertama

primary key(kunci utama) yaitu suatu kolom atau sekumpulan kolom yang akan

digunakan untuk mengidentifikasi secara tunggal setiap baris dari suatu tabel

(Kasiman, 2006:383). Kedua foreign key (kunci tamu) yaitu field yang berisi nilai

identifikasi dengan record yang berkaitan dalam tabel lainnya. Ada tiga bentuk relasi

antarkabel (Kasiman, 2006:383):

a. Relasi one-to-one (satu ke satu), menghubungkan secara tepat dua entitas

dengan satu kunci (key). Misalnya dalam suatu perusahaan satu orang

memiliki satu computer kerja.

b. Relasi one-to-many (satu ke banyak), hubungan antar entitas dimana kunci

(key) pada suatu tabel muncul berkali-kali dalam tabel lainnya. Misalnya

banyak pegawai bekerja untuk satu departemen.

c. Relasi many-to-many (banyak ke banyak), merupakan hubungan yang sering

menyebabkan permasalahan dalam prakteknya. Dalam hubungan many-to-

many, kunci utama (primary key) dari tabel kedua dapat muncul beberapa kali

tabel pertama.

2.10. Studi Sejenis

Berdasarkan pengamatan penulis pada penelitian sebelumnya terdapat

beberapa penelitian yang hampir serupa dengan judul pengembangan web portal

menggunakan JQuery. Sebagai perbandingan dengan penelitian sebelumnya,

diantaranya dikemukakan oleh Duwiyatno(2010), didalam penelitiannya menjelaskan

tentang pembuatan web portal Kabupaten Bangka Barat yang merupakan salah satu

kabupaten di Provinsi Bangka Belitung. Latar belakang penelitiannya karena pengenalan

potensi daerah Kabupaten Bangka Barat belum menggunakan media portal informasi.

Oleh karena itu, dibutuhkan portal informasi yang dapat digunakan sebagai alternatif

media periklanan dalam memperkenalkan berbagai potensi tersebut. Metode

pengembangan yang digunakan menggunakan waterfall, perangkat pemrograman open

source yang berbasis web PHP versi 5.25, basis data MySQL versi 5.0.51, dan pengujian

perangkat lunak dilakukan dengan metode BlackBox. Portal informasi yang dihasilkan

dapat digunakan untuk mengakses informasi pemerintahan, informasi potensi daerah,

peluang investasi, fasilitas pesan singkat, link, polling, dan kontak admin.

Pada penelitian Rifandi (2010), menjelaskan tentang pembuatan website

portal komunitas mengenai teknologi informasi dengan menggunakan PHP, JQuery

dan MYSQL dimana website ini dapat digunakan sebagai media informasi bagi user

untuk mencari informasi mengenai teknologi informasi seperti tentang antivirus,

jaringan, database, windows, dan lain-lain. Dalam penulisan ini, menggunakan PHP

sebagai bahasa pemrograman, JQuery sebagai framework untuk tampilan, MySQL

sebagai database-nya dan APACHE sebagai server lokalnya. Website ini dibuat

dengan tujuan untuk menambah informasi untuk user yang membutuhkan artikel

tentang perkembangan teknologi informasi. Serta membuat website yang interaktif,

artinya pengunjung dapat secara langsung interaktif dengan pengunjung lain atau

dengan admin melalui fitur chat, hubungi kami, polling dan komentar atau

menggunakannya sebagai sumber artikel dengan RSS (Really Simple Syndication)

atau news Feed yang merupakan sebuah file dokumen dengan format XML, dimana

informasi tersebut dapat diambil dan ditampilkan pada website lain.

Pada Penelitian Haerul Zaman (2008), menjelaskan tentang pembuatan

aplikasi web portal Hukum Perhimpunan Advokat berbasis web PHP dan MQSQL.

Penelitian ini bertujuan untuk memberikan kecepatan akses informasi, terutama

informasi yang berkaitan dengan perkembangan dunia hukum, baik di kalangan

anggota maupun publik. Serta menyediakan wadah untuk menampung pesan,

keluhan atau komentar dari anggota maupun publik mengenai kinerja organisasi

HAPI. Pada penelitian ini menggunakan software aplikasi pembuatan web yaitu

HTML editor Dreamweaver MX, PHP Triad dan database MySQL, serta ditambah

penggunaan aplikasi grafis Adobe Photoshop dan aplikasi teks animasi Swish.

Pada Penelitian Ilham Wahyu Danil (2009), menjelaskan tentang pembuatan

portal berbasis web menggunakan PHP dan MYSQL Pada SMA Negeri 18 Medan.

Portal ini dimaksudkan agar sekolah dapat menyediakan informasi yang lebih cepat dan

akurat pada siswa maupun masyarakat yang juga dapat membantu dalam

mempromosikan sekolah ini. Portal ini dirancang dengan menggunakan bahasa program

web, yaitu PHP 5.0 dan MySQL 5.0 sebagai server database serta Apache 2.0 sebagai

web server. Portal ini dirancang sedemikian rupa agar dapat menarik minat siswa dalam

memperoleh niformasi yang lebih cepat dan akurat serta menarik. Portal ini bersifat

dinamis, yaitu berarti bahwa informai yang diberikan tersebut dapat berubah sewaktu-

waktu berdasarkan keadaan yang sedang terjadi. Portal ini meliputi banyak informasi

seperti profil sekolah, data pegawai dan data siswa. Objektif utama Portal ini adalah

untuk menyediakan jendela bagi masing-masing siswa dalam mendapatkan informasi

secara lengkap dan jelas.

Dengan melihat penelitian-penelitian sebelumnya, ada beberapa kelebihan

dari sistem yang akan dikembangkan oleh penulis yaitu Portal ini dirancang dengan

menggunakan bahasa program web, yaitu PHP 5.0 dan MySQL 5.0 sebagai server

database serta Apache 2.0 sebagai web server. Menggunakan Framework JQuery

untuk desain tampilan yang dapat mempermudah proses pengembangan karena

tersedia banyak fitur untuk menunjang proses pembuatan web portal. Serta membuat

website yang interaktif, artinya pengunjung dapat secara langsung interaktif dengan

pengunjung lain atau dengan admin melalui fitur chat, hubungi kami, dan komentar

atau menggunakannya sebagai sumber artikel dengan RSS (Really Simple

Syndication). Kemudian pada penelitian ini web portal yang penulis buat dapat

dihubungkan ke beberapa system, yaitu sistem E-learning, sistem informasi

Keuangan dan sistem informasi akademik (SIMAK). Content Management System

(CMS) yang user friendly sehingga mempermudah seorang administrator dalam

melakukan pengelolaan web portal. Menggunakan metode pengembangan sistem

FAST yaitu metodologi pengembangan suatu sistem dengan waktu pengembangan

yang relatif singkat, sehingga proses pengembangan dapat selesai lebih cepat dan

efisien. Aplikasi web portal yang penulis buat merupakan web 2.0 atau representasi

dari website modern yang sedang berkembang pada saat ini.

BAB III

METODOLOGI PENELITIAN

Dalam melakukan penelitian terhadap Pengembangan Web Portal

menggunakan JQuery pada STMIK Islam Internasional Jakarta, penulis

menggunakan metode penelitian sebagai berikut:

3.1. Metode Pengumpulan Data

3.1.1. Studi Lapangan

Penelitian lapangan dilakukan dengan mengumpulkan dan menelaah

informasi mengenai sistem yang telah maupun belum diterapkan di STMIK

Islam Internasional Jakarta, dengan metode :

a. Observasi

Pada metode ini, penulis melakukan pengamatan langsung terhadap

kegiatan yang dilakukan oleh staff pengurus harian yang bertugas

melaksanakan kegiatan pokok untuk memperoleh dan mengumpulkan data.

Observasi dilakukan pada STMIK Islam Internasional, Jl. Melawai

Raya No.8c Blok M Kebayoran Baru Jakarta, dengan saudari Shinta

Mardhotillah selaku manajer akademik IIUC pada tanggal 12 Oktober 2010

Pukul 10.00-13.00. Observasi dilakukan untuk mengumpulkan informasi

mengenai kebutuhan sistem (system requirements).

b. Wawancara

44

Penulis melakukan tanya jawab langsung dengan bapak Taufik

Muhammad Guntur selaku ketua IIUC dan saudari Shinta Mardhotillah selaku

manajer akademik IIUC pada tanggal 14 Oktober 2010 Pukul 10.00 – 13.00

untuk melengkapi dokumen dan informasi bagi penulisan ini. dalam hal ini

penulis menggunakan metode wawancara bebas, yaitu pewawancara bebas

menanyakan apa saja yang relevan dengan data yang dikumpulkan.

Berdasarkan observasi dan wawancara yang penulis lakukan, penulis

mengumpulkan informasi mengenai :

a. Gambaran Umum STMIK Islam Internasional Jakarta

Memuat tentang sejarah berdirinya STMIK Islam Internasional Jakarta,

tujuan pendirian, serta penyelenggaraan pendidikan di STMIK Islam

Internasional.

b. Struktur Organisasi

Menunjukkan tentang hubungan kerja, wewenang dan tanggung jawab

antara pimpinan dan bawahan secara formal.

c. Prosedur yang berjalan

Gambaran tentang rangkaian prosedur yang berjalan pada web portal

STMIK Islam Internasional saat ini.

d. Permasalahan sistem yang berjalan

Permasalahan sistem yang sedang berjalan pada web portal STMIK Islam

Internasional Jakarta saat ini .

3.1.2. Studi Pustaka

Pada tahap pengumpulan data dengan cara studi pustaka, penulis mencari

referensi-referensi yang sesuai dengan objek yang akan diteliti. Dengan metode

studi pustaka ini, penulis mengumpulkan data dan informasi dengan mencari,

membaca, mencatat intisari dan mempelajari buku-buku, referensi, situs-situs

internet serta tinjauan pustaka yang berkenaan dengan topik yang dapat

dijadikan acuan pembahasan dalam penyusunan skripsi ini. Dari hasil

membaca buku-buku referensi, penulis dapatkan bagaimana membangun suatu

web portal yang antara lain meliputi konsep pengembangan sistem, serta alat

perancangan sistem. Buku-buku dan data-data tersebut dapat dilihat pada daftar

pustaka.

3.1.3. Studi Literatur

Dengan metode studi literatur ini, penulis mengumpulkan data dan

informasi dengan mencari, membaca, mencatat intisari dan mempelajari karya

ilmiah, jurnal, skripsi serta tinjauan literatur yang berkenaan dengan topik yang

dapat dijadikan acuan pembahasan dalam penyusunan skripsi ini. Dari hasil

metode studi literatur yang sudah penulis peroleh serta dijabarkan pada sub bab

2.4.1, penulis dapatkan bagaimana membangun suatu web portal yang

terintegrasi yang antara lain meliputi konsep pengembangan sistem, serta alat

perancangan sistem. Dibawah ini penulis sertakan tabel perbandingan

penelitian sejenis sebelumnya :

Tabel 3.1 Perbandingan dengan penelitian sebelumnya

No Sumber Judul Pembahasan Kelemahan

1 Duwiyatno

(2010),

Universitas

Diponegoro,

Semarang

Rancang Bangun

Portal Informasi

Kabupaten

Bangka Barat

Sebagai Alternatif

Media Periklanan

Perancangan dan

pembuatan

Website Portal

Informasi sebagai

alternatif Media

informasi

Pada sistem ini

terdapat beberapa

kelemahan dalam

hal fungsinya.

Yakni belum

menggunakan

framework yang

dapat membantu

mempercepat dan

mempermudah

dalam pembuatan

website.

2 Rifandi (2010),

Universitas

Gunadarma,

Jakarta

Pembuatan

Website Portal

Fanz Community

dengan

menggunakan

PHP, JQuery dan

MySql

Menjelaskan

tentang

pembuatan

website portal

komunitas

mengenai

teknologi

informasi dengan

menggunakan

PHP, JQuery dan

MYSQL

Tidak terdapat

sistem yang

menunjang

kebutuhan web

portal. Sehingga

tidak dapat

terintegrasi.

3 Ilham Wahyu

Danil (2009),

Universitas

Sumatera

Utara, Medan

Perancangan

Portal berbasis

web

menggunakan

PHP dan MySql

pada SMA Negeri

18 Medan.

Menjelaskan

tentang

perancangan web

portal untuk

keperluan

Informasi Sekolah

berbasis PHP dan

MySql.

Belum

menggunakan

JQuery dalam

proses pembuatan

websitenya. Belum

terintegrasi dengan

sistem lainnya.

4 Kapadia, N.H;

Figueiredo,

R.J.; Fortes,

J.A.B; (2006)

Purdue Univ.,

West

Lafayette, IN

Punch: web portal

for running tools

Menjelaskan

pendistribusian

jaringan computer

dengan cara user

mengakses web

portal kapan saja.

Tidak terdapat

sistem yang

menunjang

kebutuhan web

portal. Sehingga

tidak dapat

terintegrasi.

5 Haerul Zaman

(2008),

Universitas

Aplikasi Web

Portal Hukum

Himpunan

Menjelaskan

tentang

pembuatan portal

Belum

menggunakan

Jquery dalam

Andalas

Padang

Advokat

Indonesia

Berbasis PHP dan

MYSQL

himpunan advokat

indonesia

menggunakan

PHP dan MYSQL

pembuatan

apilkasinya. Tidak

menggunakan

CMS.

Berdasarkan hasil perbandingan dari penelitian sebelumnya, penulis

mengambil kesimpulan yaaitu :

Tabel 3.2 Penelitian yang dilakukan Penulis

No Sumber Judul Pembahasan Pengembangan ke

depan

1. Muhammad

Iqbal, (2010)

UIN Jakarta

Pengembangan

Web Portal

Universitas

Menggunakan

JQuery Pada

STMIK Islam

Internasional

Jakarta

Menjelaskan

tentang

pengembangan

web portal yaitu

berupa

pengembangan

Administrator

Web Portal dan

Sistem

Pendaftaran

Online.

Sistem belum

terintegrasi dengan

sistem lainnya

secara keseluruhan,

hanya sebatas link

ke sistem lainnya.

3.1.4. Studi Kelayakan

Tahapan studi kelayakan merupakan tahapan dimana dilakukan suatu

studi yang akan digunakan untuk menentukan kemungkinan apakah

pengembangan aplikasi/sistem layak dilakukan. Faktor-faktor yang

mempengaruhi kelayakan suatu aplikasi yaitu:

a. Teknis

Kelayakan jika dinilai berdasarkan penerapan aplikasi/sistem yang

dikembangkan terhadap teknologi yang ada saat ini.

b. Ekonomi

Kelayakan aplikasi/sistem berdasarkan faktor keuntungan secara

ekonomi.

c. Operasional/Organisasi

Kelayakan penerapan aplikasi/sistem yang sedang dikembangkan

terhadap sistem atau organisasi yang sedang berjalan.

d. Hukum

Kelayakan aplikasi/sistem berdasarkan etika serta hukum yang berlaku.

Adapun uraian secara lengkap mengenai studi kelayakan penelitian ini

akan di bahas pada sub bab 4.5.2.

3.2. Metode Pengembangan Sistem

Seperti yang disebutkan pada bab sebelumnya, dalam merancang

Pengembangan Web Portal menggunakan JQuery, penulis menggunakan metode

FAST yang memiliki fase yaitu fase pendefinisian ruang lingkup, fase analisis

masalah, fase analisis kebutuhan, fase perancangan logical, fase analisis keputusan,

fase perancangan fisik, fase konstruksi dan pengujian, dan fase instalasi dan

pengiriman.

Berikut adalah penjelasan secara singkat dari setiap tahap metode

pengembangan FAST (Framework for the Application of System Thinking) yang

penulis lakukan:

3.2.1. Scope Definition (Definisi Ruang Lingkup)

Tahap ini merupakan tahap awal dari pengembangan sistem. Lingkup

masalah yang ditetapkan dari tahap ini menyatakan seberapa besar proyek ini

akan dilaksanakan. Dengan adanya lingkup seperti ini maka analis dapat

mengetahui permasalahan dan menentukan kebutuhan untuk tahap-tahap

selanjutnya. Hasil terpenting dari definisi lingkup adalah pernyataan masalah

(problem statement). Adapun uraian secara lengkap mengenai Scope

Definition ini akan di bahas pada sub bab 4.2.

3.2.2. Problem Analysis (Analisis Masalah)

Tahap problem analysis menganalisa masalah untuk memberikan

gambaran pemahaman yang lebih mendalam tentang masalah yang mendasari

sehingga dikerjakannya proyek.

Hasil dari tahapan ini adalah peningkatan performa sistem yang akan

memberikan keuntungan dari segi bisnis perusahaan. Hasil lain dari tahapan

ini adalah sebuah laporan yang menerangkan tentang problems, causes,

effects, dan solution benefits. Pada penulisan ini penulis melakukan Analisis

sistem berjalan, identifikasi masalah, pemecahan masalah, dan uraian singkat

sistem yang diusulkan.

Adapun uraian secara lengkap mengenai Problem Analysis ini akan di

bahas pada sub bab 4.3.

1.2.3. Requirements Analysis (Analisis Kebutuhan)

Requirement Analysis ialah melakukan analisa terhadap kebutuhan

perusahaan. Tahap ini akan dilakukan bila manajemen menyetujui untuk

melanjutkan proyek. Pekerjaan pada tahap ini adalah mendefinisikan apa saja

yang perlu dilakukan oleh sistem, apa yang dibutuhkan dan diinginkan oleh

pengguna dari sistem baru. Pada tahap ini, tim akan mengumpulkan dan

mendiskusikan kebutuhan dan prioritas berdasarkan informasi yang diperoleh

dari observasi, wawancara, dan pertemuan-pertemuan yang telah dilakukan.

Output yang dihasilkan dari tahap ini adalah business requirement

statement. Adapun uraian secara lengkap mengenai Requirement Analysis ini

akan di bahas pada sub bab 4.3.

3.2.4. Logical Design (Desain Logis)

Tahap logical design menerjemahkan kebutuhan ke dalam model

sistem. Tahapan ini menggambarkan suatu solusi dan teknis serta metodologi.

Prasyarat untuk logical design adalah daftar kebutuhan yang

didapatkan dari tahapan requirements analysis. Pada penelitian ini penulis

menggunakan tools Data Flow Diagram (DFD), Entity Relationship Diagram

(ERD), dan State Transition Diagram (STD) sebagai logical desain.

Dalam perancangan dengan DFD, ERD dan STD ini, penulis

menggunakan Microsoft Visio. Pada tahap ini, penulis juga melakukan

perancangan terhadap user interface dari aplikasi ini. Perancangan yang

dilakukan yaitu halaman-halaman yang ada di dalam sistem.

Adapun uraian secara lengkap mengenai Logical Design ini akan di

bahas pada sub bab 4.4.

3.2.5. Decision Analysis (Analisis Keputusan)

Decision Analysis ialah melakukan analisa terhadap keputusan yang

akan diambil berdasarkan solusi-solusi yang ditawarkan. Pada tahap ini

ditentukan sistem yang digunakan, kepemilikan perangkat lunak, desain

sistem, teknologi informasi yang akan dihasilkan dari aplikasi, dan analisis

kelayakan. Adapun uraian secara lengkap mengenai Decision Analysis ini


3.2.6. Physical Design and Integration (Desain Fisik dan Integrasi)

Setelah mendapatkan persetujuan dari pemilik sistem pada tahapan

decision analysis, maka akhirnya sistem yang baru dapat dirancang. Tujuan

tahap physical design and integration adalah mengubah kebutuhan ke dalam

spesifikasi desain fisik yang akan memandu pembangunan sistem. Pada

tahapan ini penulis melakukan spesifikasi database dan melakukan

perancangan tampilan.

Adapun uraian secara lengkap mengenai Physical Design and

Integration ini akan di bahas pada sub bab 4.6.

3.2.7. Construction and Testing (Konstruksi dan Pengujian)

Pada tahapan ini, penulis melakukan pembangunan perangkat lunak

yang biasa disebut pengkodean (coding) dan melakukan pengujian

menggunakan teknik Black box Testing. Yaitu pengujian yang dilkakukan

oleh user, yaitu pihak dari STMIK Islam Internasional Jakarta.

Adapun uraian secara lengkap mengenai Construction and Testing ini


3.2.8. Installation and Delivery (Instalasi dan Pengiriman)

Tahap installation and delivery berfungsi untuk memasukan sistem ke

dalam operasi. Pada tahapan ini penulis melakukan penginstalan sistem dari

mulai login di cpanel, upload file dan konfigurasi database.

Adapun uraian secara lengkap mengenai Installation and delivery ini

akan di bahas pada sub bab 4.8

3.3. Alasan Pemilihan Metode

Alasan penulis memilih metode ini karena kelengkapan dan lebih detail

dalam proses penelitian dan pembangunan sistem. Setiap tahap dari penelitian dapat

terkontrol secara sistematis. Adapun kelebihan dan kelemahan metode Framework

for the Applications of Sytems Thinking (FAST) ini adalah sebagai berikut (Whitten

& Bentley, 2007:72) :

3.3.1. Kelebihan Metode FAST :

a. Mendukung teknik-teknik pengembangan aplikasi dalam waktu yang

singkat.

b. Mendukung teknik-teknik lain seperti analisis terstruktur, teknik

informasi, dan analisis berorientasi objek.

c. Metode FAST ini merupakan gabungan praktik-praktik terbaik dari

metodologi referensi dan komesial.

d. Metode ini juga memiliki kelebihan yakni lebih fleksibel, dapat

disesuaikan dengan standar kita dan dapat dikembangkan dengan

metode lain yang sedang berkembang seperti object oriented.

e. Merupakan metodologi terbaru yang merupakan pengembangan dari

metodologi sebelumnya.

3.3.2. Kelemahan Metode FAST

a. Penekanan pada kecepatan dapat berdampak buruk terhadap kualitas

yang disebabkan jalan pintas yang disarankan dengan buruk melalui

metode ini. (Whitten, 2004:106).

b. Cenderung saling tindih pada fase dan aktifitas pengembangan sistem

(Whitten & Bentley, 2004:82).

c. Bagi proyek berskala besar, FAST memerlukan sumber daya yang

memadai untuk menciptakan jumlah tim FAST yang baik. (Pressman,

2002:39)

d. Proyek bisa gagal jika waktu yang disepakati tidak terpenuhi

(Sudarmawan, 2007:160).

Berikut ini merupakan perbandingan antara model-model proses yang

telah dijabarkan dari berbagai sumber :

Tabel 3.3. Perbandingan metode pengembangan sistem

Metodologi Kelebihan Kekurangan

FAST (Framework

for the Applications

of Sytems Thinking)

(Whitten &

Bentley, 2007:76)

Mendukung teknik-teknik

pengembangan aplikasi

dalam waktu yang

singkat.(Whitten, 2004:76)

Metode ini juga memiliki

kelebihan yakni lebih

fleksibel, dapat disesuaikan

dengan standar kita dan

dapat dikembangkan

dengan metode lain seperti

object oriented.

Merupakan metodologi

terbaru yang merupakan

pengembangan dari

metodologi sebelumnya.

Lebih aktif melibatkan

pengguna sistem dalam

dalam setiap tahapan

pengembangan sistem.

(Whitten, 2007:76)

Metode FAST ini

merupakan gabungan

praktik-praktik terbaik dari

Penekanan pada

kecepatan dapat

berdampak buruk

terhadap kualitas yang

disebabkan jalan pintas

yang disarankan dengan

buruk melalui metode

ini. (Whitten, 2004:106)

Bagi proyek berskala

besar, FAST

memerlukan sumber

daya yang memadai

untuk menciptakan

jumlah tim FAST yang

baik. (Pressman,

2002:39)

Cenderung saling tindih

pada fase dan aktifitas

pengembangan sistem

(Whitten & Bentley,

2004:82)

Proyek bisa gagal jika

waktu yang disepakati

tidak terpenuhi

(Sudarmawan,

metodologi referensi dan

komesial.

Metode ini bisa lebih cepat

dari Waterfall jika

kebutuhan dan batasan

proyek sudah diketahui

dengan baik. Dan bisa

untuk dimodularisasi.

(James Martin, 1991)

Model ini cocok untuk

proyek yang resiko

teknisnya rendah

(Sudarmawan, 2007:160)

2007:160).

Rapid Application

Development

(RAD) (James

Martin, 1991)

Sederhana dan mudah

untuk diterapkan

Sebagai salah satu alternatif

dari SDLC maka RAD

dapat dijadikan acuan

untuk mengembangkan

suatu sistem informasi yang

unggul dalam hal

kecepatan, ketepatan dan

biaya yang lebih rendah.

Model ini cocok untuk

proyek skala rendah.

RAD cocok untuk

aplikasi yang tidak

mempunyai resiko

teknis yang tinggi.

RAD cocok untuk

proyek yang memiliki

SDM yang baik dan

sudah berpengalaman.

Sequence Linier /

Waterfall Metode ini merupakan

metode yang sudah

digunakan secara luas

sehingga telah terbukti

kehandalannya dalam

pengembangan suatu

sistem. (Pressman 2002:30)

Jarang sekali proyek

nyata mengikuti aliran

sekuensial yang

dianjurkan oleh model.

(Pressman, 2002:39)

Kesulitan untuk

mengakomodasi

kebutuhan yang ada

pada bagian awal

proyek. (Pressman,

2002:39)

Fase sebelumnya harus

sudah lengkap dan

selesai dikerjakan

sebelum menginjak ke

fase berikutnya

(Sudarmawan, 2007).

Prototype Metode ini cukup efektif

dengan mendapatkan

Pengembang kadang-

kadang membuat

kebutuhan dan aturan yang

jelas dan pelanggan bisa

langsung melihat sistem

yang sebenarnya.

implementasi

sembarang, karena ingin

working version selesai

dengan cepat.

Incremental Mampu mengakomodasi

perubaha secara fleksibel

(Sudarmawan, 2007:156)..

Hasil proses berupa produk

yang semakin lama

semakin lengkap hingga

versi terlengkap dihasilkan

sebagai produk akhir

(Sudarmawan, 2007:155)

Semua kebutuhan tidak

dikumpulkan pada tahap

awal sehingga

menimbulkan masalah

serta sulit untuk

mengukur progress

karena tidak ada

milestone.

Memungkinkan terjadi

kesulitan untuk

memetakan kebutuhan

pengguna kedalam

rencana spesifikasi

masing-masing hasil

incrementasi

(Sudarmawan,

2007:157).

Iterative Fase desain, pengkodean,

dan pengujian lebih cepat.

Butuh waktu yang

banyak untuk

menganalisis dan terlalu

banyak langkah yang

dibutuhkan model.

Spiral Model ini digunakan untuk

sistem skala besar.

Membutuhkan konsiderasi

langsung terhadap resiko

teknis, sehingga dapat

mengurangi terjadinya

resiko yang lebih besar.

Resiko utama tidak

ditemukan, maka

masalah bisa muncul

kemudian. Sehingga

membutuhkan

kemampuan manajemen

dan perkiraan resiko

(risk assesment) yang

cukup tinggi.

Membutuhkan waktu

yang cukup panjang

(Sudarmawan,

2007:159).

3.4. Kerangka Berpikir

Dalam melakukan penelitian ini, penulis melakukan tahapan-tahapan

kegiatan dengan mengikuti rencana kegiatan yang tertuang dalam kerangka berpikir

penelitian ini.

Pemilihan Awal Penelitian

Merumuskan Masalah dan

Judul Penelitian

Studi Lapangan, Studi Pustaka

dan Studi Literatur

Scope DefinitionAnalisis Sistem Berjalan

Analisis Sistem yang diusulkan

Perancangan Data Flow Diagram

Problem Analysis

Requirement

Analysis

Logical Design

Decision Analysis

Physical Design

anf Integration

Construction and

Testing

Installation and

Delivery

Perancangan Entity Relationship Diagram

Perancangan State Transition Diagram

Spesifikasi Database

Perancangan Antarmuka

Kesimpulan dan Saran

Identifikasi Masalah

Pemecahan Masalah

Normalisasi

Sistem Yang Di Gunakan

Kepemilikan Perangkat Lunak

Teknologi yang dihasilkan

Desain Sistem

Teknologi yang dihasilkan

Konstruksi Perangkat Lunak

Hardware

Pengujian Penerimaan

Pengujian

Gambar 3.1. Kerangka Berpkir

BAB IV

HASIL DAN PEMBAHASAN

4.1. Gambaran STMIK Islam Internasional Jakarta

International Islamic University College (IIUC), yang dikenal sebagai

STMIK Islam Internasional Jakarta adalah lembaga pendidikan swasta yang terdaftar

di Kopertis III, Jakarta dan didukung sepenuhnya oleh International Islamic

University Malaysia (IIUM) atau Universitas Islam Antar Bangsa Malaysia.

Siswa diberikan nilai-nilai luhur pengetahuan dan profesionalisme,

dilengkapi dengan pengembangan intelektual dari segi fisik dan emosional. IIUC

memberikan pendidikan dan sumber daya manusia yang terampil untuk kemajuan

islam, masyarakat dan negara. IIUC melayani dan memberikan kepedulian untuk

mendidik, melatih dan menanamkan nilai-nilai luhur untuk laki-laki dan perempuan

muda yang bercita-cita, yang ingin, yang berharap untuk menjadi generasi berikutnya

yang profesional.

4.1.1. Kursus yang Ditawarkan

IIUC menawarkan beberapa program akademik diarahkan

membangun keterampilan dan hasil karya akademis, yang dibangun di atas

keyakinan bahwa pengetahuan harus dikejar dan disebarluaskan sebagai

tindakan ibadah, dalam pengakuan penuh bahwa itu adalah kepercayaan yang

Yang Mahakuasa telah ditempatkan di atas manusia.

IIUC memiliki dua jenis program: program reguler dan 2+1 program.

Semua program akan dikirimkan dalam bahasa Inggris dan tidak ada 60

persyaratan untuk TOEFL atau IELTS, karena semua siswa harus mengikuti

kelas persiapan bahasa Inggris selama 4 bulan sebelum semester dimulai.

4.1.2. Program Studi

Untuk menjadikan STMIK Islam Internasional sebagai pusat yang

mampu menyediakan keterampilan dan keahlian dalam bidang aplikasi

komputer, program studi yang ditawarkan oleh STMIK Islam Internasional

Jakarta adalah Program Studi Teknik Informatika, Program Studi Sistem

Informasi, dan Program Studi Manajemen Informatika.

4.1.3. Tahun Akademik

Tahun akademik dibagi menjadi dua semester normal dan satu

semester pendek, sehingga akan memungkinkan siswa untuk menyelesaikan

studi mereka lebih cepat. Setiap semester memiliki 14 sesi / minggu

mengajar. Untuk semester pendek dua kali seminggu, sehingga memiliki

tujuh minggu untuk menyelesaikan.

4.1.4. Visi dan Misi

4.1.4.1. Visi

Menjadi institusi yang terbaik untuk pengembangan

profesional islam global.

4.1.4.2. Misi

1. Untuk mendirikan sistem pembelajaran yang fleksibel dengan

memberikan sesuatu yang berkualitas tinggi dan program-

program inovatif yang mencerminkan permintaan saat ini.

2. Untuk melanjutkan dukungan akademis, karir dan

pengembangan profesional staf dan mahasiswa.

3. Untuk menyediakan lingkungan belajar yang kondusif untuk

meningkatkan pertumbuhan bagi mahasiswa dan staf.

4. Untuk mendapatkan kepercayaan dari para pemangku

kepentingan melalui penanaman nilai-nilai islam inti dan

untuk menyeimbangkan keuntungan dan kewajiban sosial

tanpa mengorbankan nilai-nilai akademis.

5. Untuk mempertahankan standar kualitas pendidikan yang

terbaik.

Gambar 4.1. Struktur Organisasi

IIUC

4.1.5. Struktur Organisasi

Yayasan Universitas Islam

AntarBangsa

Ketua & Anggota Pembina

Yayasan

1. Taufik Muhammad Guntur

2. Agus Rizal Bahasan

Ketua & Anggota Pengawas 1. Drs. Mohammad Sidik

2. H. Saiful Bahri

3. Tuan Ahmad Sanusi Personal Assistant

Wiwin Hadi

Ketua Yayasan

Yusuf Durachman MSc, MIT

Ketua STMIK Islam Internasional

Zainuddin Bey Fanannie, MSc

Wakil Ketua Akademik

Drs. H. Bambang Mardianto, MM Wakil Ketua Kemahasiswaan

Moehammad Faizal B.IRK

Wakil Ketua Kooperasi &

Pengembangan

Siti Nurfi’ah, MEd

Language Center

Manager

Imam Mashudi

Lab Computer

Manager

Syahril

Akademik Manager

Shinta Mardhotillah Marketing

1. Aryandi

2. Syafruddin

Dewan Penyantun

Jamaludin Bin Karim

Dr. Norhizham

4.2. Definisi Ruang Lingkup (Scope Definition)

Sebagai salah satu universitas yang baru berdiri pada tahun 2008, kebutuhan

akan informasi yang cepat dan tepat sangat diperlukan untuk menyajikan data-data

yang lengkap, mempermudah kelangsungan pembelajaran, dan mempercepat proses

mendapatkan informasi yang dibutuhkan dalam sebuah institusi perguruan tinggi.

Pada sistem web portal sebelumnya belum secara maskimal memenuhi kebutuhan

yang terdapat di STMIK Islam Internasional Jakarta.

Dalam tahap ini diidentifikasikan dua permasalaham utama pada sistem web

portal STMIK Islam Internasional Jakarta yaitu administrator web portal kesulitan

melakukan pengelolaan website, dan belum ada sistem pendaftaran mahasiswa baru

secara online. Hal inilah yang mendasari pentingnya suatu Pengembangan Web

Portal di STMIK Islam Internasional Jakarta.

Dalam tahap ini juga diidentifikasikan batasan pembuatan proyek yang

diusulkan yaitu pengerjaan proyek dikerjakan oleh tim yang terdiri dari 5 orang yang

masing-masing memiliki tugasnya. Kemudian pengerjaan proyek web portal ini di

laksanakan dalam waktu 1 bulan terhitung dari tanggal 1 November 2010 sampai

dengan 1 Desember 2010. Biaya yang dibutuhkan untuk pengerjaan proyek adalah

kurang lebih Rp.800.000. dan standar teknologi yang digunakan adalah standar web

2.0.

Pengembangan Web Portal STMIK Islam Intenasional ini dimaksudkan untuk

memberikan gambaran umum tentang profil STMIK Islam Islam Internasional serta

memberikan pelayanan kepada mahasiswa yang meliputi gambaran tentang

organisasi, program studi, kegiatan perkuliahan, pengawasan dan pelayanan. Selain

itu juga diharapkan website portal ini dapat dijadikan sebagai bahan pertimbangan

bagi pimpinan untuk membuat kebijakan dan mengambil keputusan.

4.3. Analisis Permasalahan (Problem Analysis)

Setelah melakukan observasi serta wawancara terhadap pihak STMIK Islam

Internasional Jakarta, penulis melihat ada beberapa sistem yang berjalan saat ini.

Berikut penulis jabarkan analisa sistem yang berjalan, identifikasi masalah,

pemecahan masalah, dan sistem yang diusulkan pada Web Portal STMIK Islam


4.3.1. Analisis Sistem Berjalan

Alur sistem web portal yang diterapkan di IIUC masih bersifat

konvensional yaitu hanya terdapat fitur-fitur yang belum sepenuhnya

memenuhi kebutuhan informasi web portal seperti sebagai media promosi,

media publikasi kegiatan, media pendaftaran mahasiswa baru dan fitur-fitur

lainnya yang dapat menunjang proses kegiatan pembelajaran.

Adapun proses sistem yang berjalan pada STMIK Islam Internasional

Jakarta adalah sebagai berikut :

4.3.1.1. Proses web portal Halaman User

Permulaan user mengunjungi web portal IIUC di alamat

www.iiuc.ac.id. Sistem menampilkan halaman home yang terdapat

beberapa menu dan fitur. User memilih menu dan fitur yang tersedia

http://www.iiuc.ac.id/

pada halaman home. User masuk ke halaman sesuai dengan

menu/fitur yang dipilih. Setelah selesai, user keluar dari web portal.

Proses Web portal

User

Mulai

User masuk halaman web

iiuc.ac.id

Pilih menu

user

Tampil

halaman

Selesai

Gambar 4.2. Proses Sistem Berjalan Web portal

4.3.1.2.Proses web portal Halaman Administrator

Permulaan Administrator mengunjungi cpanel web portal

IIUC di alamat www.iiuc.ac.id/cpanel. Admin melakukan perubahan

halaman dengan melakukan update secara manual yaitu merubah kode

html. Halaman yang diupdate akan ditampilkan dihalaman user.

Setelah selesai, admin keluar dari web portal.

http://www.iiuc.ac.id/cpanel

Proses Admnistrator Web Portal

UserAdministrator

Mulai

Membuat kode

program

Tidak Ada

Error

Tampil di halaman

User

Gambar 4.3. Proses Sistem Berjalan Administrator Web portal

4.3.1.3. Proses Pendaftaran Mahasiswa Baru

User mengunjungi kampus STMIK Islam Internasional

Jakarta. User membeli formulir pendaftaran mahasiswa baru. User

mengisi formulir. User memberikan formulir dan berkas-berkas lain

yang diperlukan. User mendapatkan kartu ujian. Petugas akademik

memasukkan data pendaftaran secara manual kedalam sistem.

Proses Pendaftaran Mahasiswa Baru

Petugas

PendaftaranCalon Mahasiswa

Calon Mahasiswa

Menyerahakn

Formulir Ke petugas

Calon Mahasiswa

Membeli formulir

pendaftaran

Calon

Mahasiswa

Mengisi Formulir

Mulai

Memberiakan

kartu ujian ke

calon mahasiswa

Selesai

Gambar 4.4. Proses Sistem Berjalan Pendaftaran Mahasiswa Baru

4.3.2. Identifikasi Masalah

Setelah melakukan survey atau interview maka dapat diidentifikasi

permasalahan yang berhubungan dengan kelemahan sistem yang sedang

berjalan pada STMIK Islam Internasional Jakarta yang dibuat ke dalam tabel

Cause and Effect sebagai berikut :

Tabel 4.1. Cause And Effect Analysis

CAUSE AND EFFECT ANALYSIS

Permasalahan Cause and Effect

Sistem Web portal masih

bersifat statis,

Dikarenakan User tidak bisa

melakukan perubahan pada

halaman website.

Akibatnya halaman web portal

menjadi monoton dan kurang

menarik.

Seorang Administrator kesulitan

melakukan pengelolaan web

portal

Dikarenakan harus melakukan

perubahan pada kode program

untuk melakukan proses update

dan menampilkannya di halaman

user.

Akibatnya dibutuhkan waktu

yang lama dan menjadi tidak

efisien.

Proses penerimaan mahasiswa

baru, belum memiliki sistem

pendaftaran yang lebih cepat,

efisien, dan terkini.

Dikarenakan masih dilakukan

sistem pendaftaran mahasiswa

baru secara manual.

Akibatnya calon mahasiswa

membutuhkan waktu dan biaya

lebih banyak untuk melakukan

pendaftaran.

Pembuatan web portal masih

menggunakan pengkodean

HTML

Proses pembuatan web portal

rumit dan membutuhkan waktu

yang lama.

Belum menggunakan Library

JQuery yang dapat membantu

mempermudah, mempercepat,

dan memperindah tampilan web

portal.

Sistem yang ada tidak dirancang

agar bisa dikembangkan oleh

orang lain selain pembuat

aplikasi.

Sistem yang ada tidak dapat

dikembangkan oleh orang selain

pembuat sistem, jika pembuat

web portal sudah tidak

menangani lagi, maka web portal

tidak dapat dikembangkan.

4.3.3. Pemecahan Masalah

Dengan melihat permasalahan dan kendala yang terjadi dalam sistem

web portal STMIK Islam Internasional yang telah ada, maka dibutuhkan

suatu media yang menanggulangi web portal tersebut secara lebih efektif dan

efisien dalam menunjang kinerja bagian administrator, mahasiswa dan staff.

Oleh karena itu penulis mengusulkan pengembangan web portal dengan

menggunakan JQuery yang menjadi gerbang dari berbagai kebutuhan

informasi.

4.3.4. Uraian Singkat Sistem yang Diusulkan

Untuk menjawab permasalahan-permasalahan yang dihadapi dalam

pengembangan sistem yang masih manual tersebut, penulis bermaksud

mengusulkan sebuah Web Portal yang menyajikan data-data yang lengkap,

untuk mempermudah kelangsungan pembelajaran, dan mempercepat proses

mendapatkan informasi yang dibutuhkan dalam sebuah institusi perguruan

tinggi. Pada pengembangannya, penulis melakukan studi kasus pada STMIK

Islam Internasional Jakarta.

Adapun sistem web portal yang diusulkan pada STMIK Islam

Internasional Jakarta adalah sebagai berikut:

4.3.4.1.Proses Web Portal Halaman User



beberapa menu dan fitur. User memilih menu dan fitur yang tersedia


pada halaman home. User masuk ke halaman sesuai dengan

menu/fitur yang dipilih. Setelah selesai, user keluar dari web portal.

Proses Web portal

User

Pilih menu

user

Selesai

Tampil

halaman

Mulai

User masuk halaman web

iiuc.ac.id

Melakukan

update

halaman

Gambar 4.5. Proses Sistem Web portal yang diusulkan

4.3.4.2.Proses Web Portal Halaman Administrator

Permulaan Admin mengunjungi halalaman administrator web

portal IIUC di alamat www.iiuc.ac.id/adminweb. Sistem menampilkan

halaman home yang terdapat beberapa menu dan fitur. Admin memilih

http://www.iiuc.ac.id/adminweb

menu dan fitur yang tersedia pada halaman Admin. Admin masuk ke

halaman sesuai dengan menu/fitur yang dipilih. Admin mengupdate

web portal menggunakan fitur-fitur yang telah disediakan. Kemudian

akan ditampilkan dihalaman user. Setelah selesai, admin keluar dari

administrator web portal.

Proses Admin Web portal

UserAdmin

Mulai

Admin masuk

halaman Admin

Cek Username &

password

salah

Pilih menu admin

Update KontenTampil dihalaman

User

Selesai

Gambar 4.6. Proses Administrator Web portal yang diusulkan

4.3.4.2.1. Proses Pendaftaran Mahasiswa Baru Secara Online



beberapa menu dan fitur. User memilih menu pendaftaran. Sistem


menampilkan halaman pendaftaran. User memilih menu “Daftar

Sekarang”. User mengisi formulir pendaftaran. Setelah selesai

mengisi formulir, sistem menampilkan halaman pemberitahuan bahwa

pengisian telah berhasil. User melakukan pembayaran formulir

pendaftaran ke bank. User masuk ke web IIUC. User memilih menu

pendaftaran. User memilih menu konfirmasi. User Mengisi Form

Konfirmasi. Sistem menampilkan halaman pengisian form konfirmasi

berhasil. Admin melakukan validasi dan aktifasi username. User login

untuk cetak kartu. Sistem menampilkan halaman cetak kartu. User

Cetak Kartu Ujian. User Logout. User mengikuti ujian.

Proses Pendaftaran Online

AdminSistemUser

Selesai

Pilih menu Pendaftaran

Mulai

Tampil halaman Pendaftaran

User masuk web iiuc.ac.id

Form Pendaftaran

Tampil halaman Sukses

Pengisian Formulir

Pengisian benar

Tidak

Ya

Membayar ke bank

Validasi & Aktifasi

Username

Konfirmasi Pembayaran Form Konfirmasi

Login Cetak Kartu

Tidak

Ya

Pengisian benar

Tampil halaman Sukses

Pengisian Form Konfirmasi

Tampil Halaman

Cetak Kartu

Logout

Gambar 4.7. Proses Sistem Pendaftaran Mahasiswa Baru Secara

Online yang diusulkan

4.4. Analisa Kebutuhan (Requirement Analysis)

Analisa kebutuhan Pengembangan Web Portal STMIK Islam Internasional

Jakarta ini adalah sebagai berikut :

1. Web Portal User

Bagi user web portal ini diharapkan dapat memberikan kemudahan dalam

mencari informasi mengenai kegiatan akademik dan kegiatan perkuliahan

secara mudah dan up to date. Konten dari web portal ini adalah profil IIUC,

berita kampus, agenda, info akademik, pendaftaran online, akses atau link ke

sistem lain seperti SIMAK, E-Learning, dan Sistem Keuangan.

2. Administrator Web Portal

Bagi Administrator web portal ini diharapkan memiliki sebuah Content

Management System (CMS) agar dapat memberikan kemudahan dalam

mengelola dan memberikan informasi kepada user informasi up to date yang

terjadi di STMIK Islam Internasional. Konten dari administrator web portal

ini adalah modul pengelolaan berita, agenda, info akademik, partner IIUC,

download, galeri foto, menu, halaman statis, dan validasi pendaftaran.

3. Sistem Pendaftaran Online

Sistem Pendaftaran Online ini diharapkan dapat memberikan kemudahan

dalam hal melakukan pendaftaran mahasiswa baru, perubahan sistem dari

manual menjadi Online dapat mempermudah calon mahasiswa melakukan

pendaftaran dan dapat lebih banyak calon mahasiswa yang beriminat untuk

melaksanakan kuliah di STMIK Islam Internasional Jakarta. Konten dari

Sistem Pendaftaran Online ini adalah mengisi formulir pendaftaran,

konfirmasi pembayaran, login dan mencetak kartu.

4.5. Perancangan Logikal (Desain Logical)

Dalam penelitian ini tahap perancangan logikal meliputi beberapa hal yang

diuraikan sebagai berikut :

4.5.1. Perancangan Data Flow Diagram (DFD)

Data Flow Diagram digunakan untuk menggambarkan pembagian

sistem ke modul yang lebih kecil. Data Flow Diagram ini terbagi atas diagram

konteks, diagram level 1, diagram level 2 dan seterusnya (Ladjamudin,

2005:64).

Ada beberapa tahapan atau level dalam DFD agar didalam memahami

proses pada suatu sistem informasi atau perangkat lunak yang dibangun

menjadi lebih mudah, dimana antara satu level ke level yang lain akan saling

berkaitan, mulai dari tahapan yang memperlihatkan proses-proses utama yang

terjadi dalam sistem, atau yang disebut dengan DFD level 0 sampai dengan

tahapan-tahapan berikutnya.

4.5.1.1. Rancangan Diagram Konteks

Gambar 4.8. Diagram Konteks Web Portal

IIUC

WEB PORTAL

IIUCUser Admin

Pendaftaran

Pencarian_berita

Komentar

Hubungi_Kami

Kartu_pendaftaranHasil_Pencarian

Hasil_Komentar

File_ModulFile_Agenda

file Berita

file_partner_iiucfile_upload

file_Sekilas Infofile_Album

File_Galeri Fotofile_Menu Utama

file_Sub Menufile_Halaman Statis

Download Agenda

Halaman Statis Berita

partner_iiucSekilas Info

Album Galeri_Foto

Menu_Utama Sub_Menu

file_Hubungi_KamiFile_Pendaftaran

File_Komentar

list_Agendalist_Berita

list_partner_iiuclist_Downloadlist_Sekilas_Info

list_Albumlist_Galeri_Fotolist_Menu_Utama

list_Sub_Menulist_Halaman_Statis

list_modul

Hasil_validasi

Dalam diagram konteks diatas terdapat dua entitas yang

menunjang proses-proses yang terdapat pada Web Portal yaitu user

sebagai pengguna web portal yang menggunakan aplikasi dan admin

sebagai pengelola web portal yang mengelola web portal. Dalam hal

ini yang bisa mengupdate data-data yang akan ditampilkan di halaman

user adalah admin saja, sedangkan user tidak bisa mengupdate seluruh

data yang ada dalam web portal.

4.5.1.2. Rancangan Diagram Level 1 yang Diusulkan

User

1.0

Mengolah

Request User

Admin

3.0

Mengolah

Gambar

2.0

Mengolah Info

STMIK

4.0

Mengolah

Halaman

5.0

Mengolah

Ruang Media

6.0

Mengelola

Modul

Hubungi Kami

Download

File Pendaftaran

Pendaftaran File Hubungi Kami

File Download

File_Pendaftaranfile_Hubungi_Kami

File_upload

Agenda

Sekilas_Info Agenda

Sekilas Info

File_AlbumFile_Galeri_Foto

Galeri_foto

Album_Foto

Partner

AlbumGaleri_Foto

Partner_iiuc

file_Menu_utamaFile_Sub_menu

File_Halaman_statis

Sub Menu

Menu

Halaman Statis

list_menu_utamalist_sub_menu

list_Halaman_statis

menu_utamasub_menuhalaman_statis

File_Berita

Komentar

Berita

List_beritafile_komentar

berita

Komentar

File_modul

Modul

List_file_modul

Pencarian_berita

Kartu_pendaftaran

Hasil_pencarian

Hasil_komentar

List_download

File_agendaFile_sekilas_info

List_agendaList_sekilas_info

File_partner_iiuc

List_albumList_galeri_foto

List_partner_iiuc

Hasil_validasi

Gambar 4.9. DFD Level 1 yang diusulkan

Dalam diagram Level 1 diatas terdapat enam proses. Semua proses

tersebut dapat dilakukan oleh user yang berstatus admin. Sedangkan user

yang berstatus user hanya bisa melihat isi web portal, melakukan pendaftaran,

komentar, hubungi kami dan melakukan pencarian berita. Penjelasan

mendetail dari setiap proses akan dijelaskan berikut ini.

4.5.1.3. Rancangan Diagram Level 2 yang diusulkan

Diagram ini untuk mendetailkan setiap proses yang terjadi pada

diagram Level 2 sistem web portal.

1. Diagram Level 2 Proses 1.0

1.1

Mendaftar Mahsiswa baruuser Admin

1.2

Menghubungi kami

pendaftaran

Hubungi_kami

File_pendaftaran

1.3

Olah Download

download

Data

pendaftaran

Hubungi kami

download

Kartu_pendaftaran

File_hubungi_kami

File_upload

List_download

Hasil_validasi

Gambar 4.10. DFD Level 2 Proses 1.0 (Request data user)

Proses 1.0 adalah proses yang berhubungan dengan request

data user. Yang bisa mengakses proses ini adalah user dan admin.

Didalamnya terdapat tiga proses, mendaftar mahasiswa baru,

menghubungi kami dan mengolah download. Berikut adalah detail

dari proses mendaftar mahasiswa baru, menghubungi kami dan

mengolah download.

1.1.1*

Mengisi formulir

pendaftaran

1.1.2*

Validasi pendaftaran

user Adminpendaftaran

Kartu_pendaftar

pendaftaran

File_pendaftaran

Hasil_validasi

Gambar 4.11. DFD Level 3 Proses 1.1

Dalam proses mendaftar mahasiswa baru, pertama user

melakukan pengiriman data pendaftaran. Kemudian admin akan

memvalidasi data tersebut, dan mengirimkan kartu pendaftaran

kepada user.

1.2.1*

Mengirim Pesanuser AdminHubungi_kami File_hubungi_kami

Hubungi Kami


Dalam proses menghubungi kami, pertama user melakukan

pengiriman data hubungi kami. Kemudian admin akan menjawab

data tersebut.

1.3.1*

Mengupload Fileuser Admin

download

1.3.2*

Mendownload File

File_upload

download

List_download


Dalam proses mengolah download, pertama admin

melakukan pengiriman file download. Kemudian user akan

medownload data tersebut.


2.1

Olah Agendauser Admin

2.1

Olah Sekilas Info

File_agenda

File_sekilas_info

Agenda

Sekilas Info

List_agenda

sekilas_info

List_agenda

List_sekilas_info

Gambar 4.14. DFD Level 2 Proses 2.0 (Mengolah Info STMIK)

Proses 2.0 adalah proses yang berhubungan dengan

pengelolaan Info STMIK. Yang bisa mengakses proses ini adalah

user dan admin. Didalamnya terdapat dua proses, mengolah agenda

dan mengolah sekilas info. Berikut adalah detail dari proses

mengolah agenda dan mengolah sekilas info.

2.1.1*

Tambah Agendauser AdminFile_agenda

2.1.2*

Edit Agenda

2.1.3*

Hapus Agenda

File_agenda

File_agenda

agenda

agenda

Agenda

List_agenda

List_agenda


Dalam proses mengolah agenda, proses ini dilakukan oleh

admin didalamnya terdapat tiga proses, yaitu menambah, meng-edit,

dan menghapus agenda. Kemudian user akan melihat data agenda

IIUC.

2.2.1*

Tambah sekilas infouser AdminFile_sekilas info

2.2.2*

Edit sekilas info

2.2.3*

Hapus sekilas info

File_sekilas info

File_sekilas info

sekilas info

sekilas info

sekilas info

List_sekilas_info

List_sekilas_info


Dalam proses mengolah sekilas info, proses ini dilakukan oleh


dan menghapus agenda. Kemudian user akan melihat data sekilas

info IIUC.


3.1

Olah albumuser Admin

3.2

Olah galeri foto

File_album

File_galeri_foto

album

galeri foto

album

galeri_foto

3.3

Olah Partner IIUC partner_iiuc

partner

File_partner_iiuc

List_album

List_galeri_foto

List_partner_iiuc

Gambar 4.17. DFD Level 2 Proses 3.0 (Mengolah Gambar)


pengelolaan Gambar yang di tampilkan di halaman user. Yang bisa

mengakses proses ini adalah user dan admin. Didalamnya terdapat

tiga proses, mengolah album, mengolah galeri foto dan mengolah

partner IIUC. Berikut adalah detail dari proses mengolah album,

mengolah galeri foto dan mengolah partner IIUC.

3.1.1*

Tambah albumuser AdminFile_album

3.1.2*

Edit albumFile_album

album

album

album

List_album

List_album


Dalam proses mengolah album, proses ini dilakukan oleh

admin didalamnya terdapat dua proses, yaitu menambah dan meng-

edit album. Kemudian user akan melihat data album.

3.2.1*

Tambah galeri fotouser AdminFile_galeri foto

3.2.2*

Edit galeri foto

3.2.3*

Hapus galeri foto

File_galeri foto

File_galeri foto

galeri foto

galeri foto

galeri foto

List_galeri_foto

List_galeri_foto


Dalam proses mengolah galeri foto, proses ini dilakukan oleh


dan menghapus galeri foto. Kemudian user akan melihat data galeri

foto IIUC.

3.3.1*

Tambah partner_iiucuser AdminFile_partner_iiuc

3.3.2*

Edit partner_iiuc

3.3.3*

Hapus partner_iiuc

File_partner_iiuc

File_partner_iiuc

partner_iiuc

partner_iiuc

partner_iiuc

List_partner_iiuc

List_partner_iiuc


Dalam proses mengolah gambar partner IIUC, proses ini

dilakukan oleh admin didalamnya terdapat tiga proses, yaitu

menambah, meng-edit, dan menghapus gambar partner IIUC.

Kemudian user akan melihat data partner IIUC.


4.1

Olah menu Utamauser Admin

4.2

Olah sub menu

File_menu_utama

File_sub_menu

Menu_utama

galeri foto

Menu_utama

Sub menu

4.3

Olah halaman statisHalaman_statis

Halaman

statis

File_halaman_statis

List_halaman_statis

List_sub_menu

List_menu_utama

Gambar 4.21. DFD Level 2 Proses 4.0 (Mengolah Halaman)


pengelolaan menu dan halaman. Yang bisa mengakses proses ini

adalah user dan admin. Didalamnya terdapat tiga proses, mengolah

menu utama, mengolah sub menu dan mengolah halaman statis.

Berikut adalah detail dari proses mengolah menu utama, mengolah

sub menu dan mengolah halaman statis.

4.1.1*

Tambah

menu_utama

user AdminFile_menu_utama

4.1.2*

Edit menu_utama

4.1.3*

Hapus menu_utama

File_menu_utama

File_menu_utama

menu_utama

menu_utama

menu_utama

List_menu_utama

List_menu_utama


Dalam proses mengolah menu utama, proses ini dilakukan oleh


dan menghapus menu utama. Kemudian user akan melihat data

menu utama.

4.2.1*

Tambah sub_menuuser AdminFile_sub_menu

4.2.2*

Edit sub_menu

4.2.3*

Hapus sub_menu

File_sub_menu

File_sub_menu

sub_menu

sub_menu

sub_menu

List_sub_menu

List_sub_menu


Dalam proses mengolah sub menu, proses ini dilakukan oleh


dan menghapus sub menu. Kemudian user akan melihat data sub

menu.

4.3.1*

Tambah

halaman_statis

user AdminFile_halaman_statis

4.3.2*

Edit halaman_statis

4.3.3*

Hapus

halaman_statis

File_halaman_statis

File_halaman_statis

halaman_statis

halaman_statis

halaman_statis

List_halaman_statis

List_halaman_statis


Dalam proses mengolah halaman statis, proses ini dilakukan

oleh admin didalamnya terdapat tiga proses, yaitu menambah, meng-

edit, dan menghapus halaman statis. Kemudian user akan melihat

data halaman statis.

5. DFD Level 2 proses 5.0

5.1

Olah beritauser Admin

5.2

Olah komentar

File_berita

berita

komentar

berita

Hasil_komentar

List_komentar

List_berita

5.3*

Pencarian Berita

Berita

komentar

Hasil_pencarian

pencarian

Gambar 4.25. DFD Level 2 Proses 5.0 (Mengolah Ruang Media)


pengelolaan menu dan halaman. Yang bisa mengakses proses ini

adalah user dan admin. Didalamnya terdapat tiga proses, mengolah

berita, mengolah komentar dan mengolah pencarian berita. Berikut

adalah detail dari proses mengolah berita dan mengolah komentar.

5.1.1*

Tambah beritauser AdminFile_berita

5.1.2*

Edit berita

5.1.3*

Hapus berita

File_berita

File_berita

berita

berita

berita

List_berita

List_berita


Dalam proses mengolah berita, proses ini dilakukan oleh


dan menghapus berita. Kemudian user akan melihat data berita.

5.2.1*

Tambah komentaruser Admin

5.2.2*

Edit komentar

5.2.3*

Hapus komentar

File_komentar

File_komentar

Hasil_komentar

komentar

List_komentar

List_komentar

komentar


Dalam proses mengolah komentar, proses ini dilakukan oleh

admin didalamnya terdapat dua proses, yaitu menambah, meng-edit,

dan menghapus komentar. Kemudian user akan melihat data

komentar.

4.5.2. Perancangan Entity Relationship Diagram (ERD)

Tujuan perancangan ERD adalah untuk menunjukkan objek-objek

(entitas) apa saja yang ingin dilibatkan dalam sebuah database dan

bagaimana hubungan yang terjadi diantara objek tersebut (Ladjamudin,

2005). Setelah ERD dibuat maka dilakukan normalisasi. Berikut hasil

perancangan ERD :

Gambar 4.28. Model Entity Relationship Diagram (ERD)

Gambar 4.29. Model Logical Record Structure (LRS)

Seperti terlihat diatas, terdapat 20 tabel. Tabel yang memiliki relasi

adalah tabel berita, data_pribadi, gallery, dan main_menu. Tabel kategori dan

komentar adalah foreign key dari tabel berita. Tabel submenu adalah foreign

key dari tabel main_menu. Tabel gallery adalah foreign key dari tabel album.

Sedangkan tabel data pribadi memiliki foreign key yaitu tabel

pilihan_program, asal_sekolah, data_orang_tua dan alamat_orang_tua.

4.5.3. Normalisasi

Berikut akan dijelaskan proses normalisasi, mulai dari tabel yang

belum dinormalisasi sampai 3NF. Tabel yang akan di normalisasi

adalah tabel data_pribadi, sedangkan tabel lainnya tidak dilakukan

normalisasi karena sudah dalam bentuk normal. Adapun proses

normalisasinya adalah sebagai berikut :

1. Unnormalized Form

Tahap pertama ini, semua data pendaftaran akan dicatat. Syarat

Normal kesatu (1NF) adalah menghilangkan redudansi data dan

semua field sudah bernilai atomik. Pada tabel 4.2 adalah tabel

yang berbentuk tidak normal, dimana kolom id_pilihan, program,

pilihan, id_asal_sekolah, nama_sekolah, jurusan, tahun_lulus,

id_data_orang_tua, nama_ayah, agama_ayah, pendidikan_ayah,

id_alamat_orang_tua, alamat dan kota belum memiliki nilai

atomik dan memiliki redudansi data. Hal ini akan diperbaharui

pada bentuk 1NF. Berikut adalah tabel yang belum dinormalisasi

tersebut:

2. First Normal Form (1NF)

Syarat pada 1NF adalah semua kolom data harus memiliki nilai

atomik. Maka dari itu, kolom id_pilihan, program, pilihan,

id_asal_sekolah, nama_sekolah, jurusan, tahun_lulus,

id_data_orang_tua, nama_ayah, agama_ayah, pendidikan_ayah,

id_alamat_orang_tua, alamat dan kota harus diubah nilainya untuk

mendapatkan nilai atomik. Untuk mendapatkan nilai atomik itu, maka

data kedua yang terdapat pada kolom tersebut akan dipindahkan untuk

dibuat baris baru. Berikut ini adalah komposisi tabel yang sudah

berada pada 1NF.

3. Second Normal Form (2NF)

Syarat pada bentuk normal kedua (2NF) adalah harus berada dalam

1NF dan menghilangkan dependensi parsial. Data yang bukan primary

key harus memiliki dependensi fungsional terhadap primary key.

Berikut adalah primary key tersebut beserta kolom yang

dipengaruhinya :

a. id_data_pribadi nama_lengkap, jns_klmn, tmpt_lahir, no_ktp

b. id_pilihan program, pilihan

c. id_asal_sekolah nama_sekolah, jurusan, tahun_lulus

d. id_data_orang_tua nama_ayah, agama_ayah, pendidikan_ayah

e. id_alamat_orang_tua alamat, kota

Maka dari itu tabel data_pribadi, akan dipecah dan dibuat empat tabel

baru, yaitu tabel pilihan_program, asal_sekolah, data_orang_tua, dan

alamat_orang_tua. Berikut adalah tabel-tabel tersebut :

Tabel 4.4. Tabel data_pribadi 2NF

Id_data_pribad

i

Nama_lengka

p

Jns_klm

n

Tmpt_lahi

r

No_ktp

1 Andre L Bekasi

1234567

8

1 Andre L Bekasi

1234567

8

Tabel 4.5. Tabel pilihan_program 2NF

Id_data_pribadi Id_pilihan Program Pilihan

1 1 Reguler TI

1 2 Non Reg SI

Tabel 4.6. Tabel asal_sekolah 2NF

Id_asal

_

Sekolah

Nama_Sekolah Jurusan Tahun_lulus

1 SMAN 10 IPA 2006

2 SMAN 47 IPS 2007

Tabel 4.7. Tabel data_orang_tua 2NF

Id_data_

orang_tua

Nama_Aya

h

Agama_aya

h

Pendidikan_

ayah

1 Umar Islam S1

2 Umar Islam S1

Tabel 4.8. Tabel alamat_orang_tua 2NF

Id_alamat_Orang_tua Alamat Kota

1 Jl. Cemara Bekasi

2 Jl. Cemara Bekasi

4.5.4. Perancangan State Transition Diagram (STD)

Program aplikasi web portal ini menggunakan STD untuk membantu

dalam pembuatan program. Berikut ini merupakan gambar STD yang

digunakan :

4.5.4.1.Rancangan STD Menu Utama

Rancangan modul menu berfungsi untuk memanggil sub-

program lain (modul-modul lain) untuk dijalankan. STD rancangan

modul menu dapat digambarkan di bawah ini:

1. State Transition Diagram (STD) Menu Utama User

Menu Utama

Klik menu Home

Masuk Halaman Home

Menu Why IIUC

Menu Home

Menu Program

Studi

Menu Pendaftaran

Menu Fasilitas

Menu Berita

Tentang Kami

Galeri Foto

Menu Hubungi

Kami

Klik menu Why IIUC

Masuk Halaman Why IIUC

Klik menu Program Studi

Masuk Halaman Program Studi

Klik menu Pendaftaran

Masuk Halaman Pendaftaran

Klik menu Fasilitas

Masuk Halaman Fasilitas

Klik menu Berita

Masuk Halaman Berita

Klik menu Tentang Kami

Masuk Halaman Tentang Kami

Klik menu Galeri Foto

Masuk Halaman Galeri Foto

Klik menu Hubungi Kami

Masuk Halaman Hubungi Kami

Keluar

Klik menu Home

Masuk Halaman Home

Klik menu Home

Masuk Halaman Home

Gambar 4.30. STD Menu Utama Admin

2. State Transition Diagram (STD) Menu Utama Admin

Menu Utama

Klik menu Home

Masuk Halaman Home

Menu Manajemen

Modul

Menu Home

Menu Agenda

Menu Kategori

Menu Komentar

Menu Partner

IIUC

Menu Download

Menu Hubungi

Kami

Klik menu Manajemen Modul

Masuk Halaman Manajemen Modul

Klik menu Agenda

Masuk Halaman Agenda

Klik menu Kategori

Masuk Halaman Kategori

Klik menu Komentar

Masuk Halaman Komentar

Klik menu Partner IIUC

Masuk Halaman Partner IIUC

Klik menu Download

Masuk Halaman Download



Keluar

Klik menu Home

Masuk Halaman Home

Klik menu Home

Masuk Halaman Home

Menu Sekilas Info

Klik menu Sekilas Info

Masuk Halaman Sekilas Info

MenuAlbum

Klik menu Album

Masuk Halaman Album

Menu Galeri Foto


Masuk Halaman Galeri Foto

Menu Menu

Utama

Klik menu Menu Utama

Masuk Halaman Menu Utama

Menu Sub Menu

Klik menu Sub Menu

Masuk Halaman Sub Menu

Menu Halaman

Statis

Klik menu Halaman Statis

Masuk Halaman Halaman Statis

Menu Validasi

Klik menu Validasi

Masuk Halaman Validasi

Klik menu Logout

Masuk Halaman Logout

Menu Logout

Gambar 4.31. STD Menu Utama Admin

3. State Transition Diagram (STD) Menu Pendaftaran

Menu Home


Tampil sub menu PendaftaranMenu Pendaftaran

Keluar

Klik menu Home

Masuk Halaman Home

Klik menu Home

Masuk Halaman Home

Menu Syarat

Pendaftaran

Menu Pendaftaran

Online

Klik menu Syarat Pendaftaran

Masuk Halaman Syarat Pendaftaran

Klik menu Pendaftaran Online

Masuk Halaman Pendaftaran Online

Menu Alur

Pendaftaran

Klik menu Alur Pendaftaran

Masuk Halaman Alur Pendaftaran

Gambar 4.32. STD Menu Pendaftaran

4. State Transition Diagram (STD) Menu Berita

Menu Home

Klik menu Berita

Masuk Halaman BeritaMenu Berita

Keluar

Klik menu Home

Masuk Halaman Home

Klik menu Home

Masuk Halaman Home

Menu Mahasiswa

Menu Teknologi

Klik menu Mahasiswa

Masuk Halaman Mahasiswa

Klik menu Teknologi

Masuk Halaman Teknologi

Menu Sistem

Multimedia

Klik menu Ekonomi

Masuk Halaman Mahasiswa

Menu Hiburan

Menu Olah Raga

Klik menu Hiburan

Masuk Halaman Hiburan

Klik menu Olah Raga

Masuk Halaman Olah Raga

Gambar 4.33. STD Menu Berita

5. State Transition Diagram (STD) Menu Galeri Foto

Menu Home


Masuk Halaman Galeri FotoMenu Galeri Foto

Keluar

Klik menu Home

Masuk Halaman Home

Klik menu Home

Masuk Halaman Home

Menu Alumni

Menu Kegiatan

Mahasiswa

Klik menu album Alumni

Masuk Halaman Alumni

Klik menu Kegiatan Mahasiswa

Masuk Halaman Kegiatan Mahasiswa

Gambar 4.34. STD Menu Galeri Foto

4.5.4.2. Rancangan STD Masukan User

Rancangan modul masukan dilakukan agar tingkatan

keakuratan data tinggi dan proses pemasukan data benar sehingga

dapat diterima dan dimengerti oleh pengguna sistem.

Ada 2 rancangan modul masukan yang akan didefinisikan

pada User, yaitu Input Pendaftaran dan Input Hubungi Kami. Ada 12

rancangan modul masukan yang didefinisikan pada Admin, yaitu

Input Modul, Input Agenda, Input Berita, Input validasi, Input partner

IIUC, Input Upload, Input Sekilas Info, Input Album, Input Galeri

Foto, Input Menu Utama, Input Sub Menu, Input Halaman Statis.

Rancangan masukan tersebut dapat dijelaskan sebagai berikut:

1. State Transition Diagram (STD) Input Pendaftaran

Pendaftaran

Klik menu Pendaftaran Online

Menunggu input

Form data

pendaftaran





Cek validasi

Peringatan input

salah

Input form klik

tombol ‘submit’

Klik ‘OK’

kembali ke

form

pendaftaran

Sukses

Keluar

Menampilkan halaman

sukses

Gambar 4.35. STD Input Pendaftaran

2. State Transition Diagram (STD) Input Hubungi Kami

Hubungi kami


Menunggu input

Form data

Hubungi Kami

Klik menu hubungi kami

Masuk Halaman hubungi kami



Cek validasi

Peringatan input

salah

Input form klik

tombol ‘submit’

Klik ‘OK’

kembali ke

form hubungi

kami

Sukses

Keluar

Menampilkan halaman

sukses

Gambar 4.36. STD Input Hubungi Kami

4.5.4.3.Rancangan STD Masukan pada Admin

1. State Transition Diagram (STD) Input Login

Menampilkan

halaman login

Input valid

memanngil

authentificationKlik menu/alamat baru

Memanggil pengalih

Baca dan cek

Input Username

dan Password

Menampilkan

kesalahan input

Input not valid

memaanngil

window alert

Klik ‘OK’

memanngil

display login

Memeriksa userMengalihkan

halaman

Menampilkan

halaman

Kesalahan Input

User terdaftar

memanggil Pengalih

Klik ‘Ulangi Lagi’

Memanggil display

Klik login

Memanggil cek Input

Gambar 4.37. STD Input Login

2. State Transition Diagram (STD) Input Modul

modul

Klik ‘Tambah modul’

Menunggu input

Form data modul

Klik ‘Simpan’

Memanggil display

Klik menu modul

Masuk Halaman modul

Klik menu modul

Masuk Halaman modul

List Modul

Menampilkan

halaman suksesKlik ‘Batal’

Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.38. STD Input Modul

3. State Transition Diagram (STD) Input Agenda

agenda

Klik ‘Tambah agenda’

Menunggu input

Form data agenda

Klik ‘Simpan’

Memanggil display

Klik menu agenda

Masuk Halaman agenda

Klik menu agenda

Masuk Halaman agenda

List agenda

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.39. STD Input Agenda

4. State Transition Diagram (STD) Input Berita

berita

Klik ‘Tambah berita’

Menunggu input

Form data berita

Klik ‘Simpan’

Memanggil display

Klik menu berita

Masuk Halaman berita

Klik menu berita

Masuk Halaman berita

List berita

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit berita’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.40. STD Input Berita

5. State Transition Diagram (STD) Input Validasi

validasi

Klik ‘Edit’

Menunggu input

Form Edit data

Pendaftaran

Klik ‘Simpan’

Memanggil display

Klik menu validasi

Masuk Halaman validasi

Klik menu validasi

Masuk Halaman validasi

List validasi

Menampilkan


Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.41. STD Input Validasi Pendaftaran

6. State Transition Diagram (STD) Input Partner IIUC

partner IIUC

Klik ‘Tambah Partner’

Menunggu input

Form data partner

IIUC

Klik ‘Simpan’

Memanggil display

Klik menu partner IIUC

Masuk Halaman partner IIUC

Klik menu partner IIUC

Masuk Halaman partner IIUC

List partner IIUC

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.42. STD Input Partner IIUC

7. State Transition Diagram (STD) Input File Upload

download

Klik ‘tambah download’

Menunggu input

Form data

download

Klik ‘Simpan’

Memanggil display

Klik menu download

Masuk Halaman download

Klik menu download

Masuk Halaman download

List download

Menampilkan


Memanggil display

Form Edit

Klik ‘edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.43. STD Input File Upload

8. State Transition Diagram (STD) Input Sekilas Info

sekilas Info

Klik ‘ tambah sekilas Info’

Menunggu input

Form data sekilas

Info

Klik ‘Simpan’

Memanggil display

Klik menu sekilas Info

Masuk Halaman sekilas Info

Klik menu sekilas Info

Masuk Halaman sekilas Info

List sekilas Info

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.44. STD Input Sekilas Info

9. State Transition Diagram (STD) Input Album

album

Klik ‘Tambah album’

Menunggu input

Form data album

Klik ‘Simpan’

Memanggil display

Klik menu album

Masuk Halaman album

Klik menu album

Masuk Halaman album

List album

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Gambar 4.45. STD Input Album

10. State Transition Diagram (STD) Input Galeri Foto

galeri foto

Klik ‘ tambah galeri foto’

Menunggu input

Form data galeri

foto

Klik ‘Simpan’

Memanggil display

Klik menu galeri foto

Masuk Halaman galeri foto

Klik menu galeri foto

Masuk Halaman galeri foto

List galeri foto

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.46. STD Input Galeri Foto

11. State Transition Diagram (STD) Input Menu Utama

menu utama

Klik ‘Tambah menu utama’

Menunggu input

Form data menu

utama

Klik ‘Simpan’

Memanggil display

Klik menu menu utama

Masuk Halaman menu utama

Klik menu menu utama

Masuk Halaman menu utama

List menu utama

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Gambar 4.47. STD Input Menu Utama

12. State Transition Diagram (STD) Input Sub Menu

sub menu

Klik ‘ tambah sub menu’

Menunggu input

Form data sub

menu

Klik ‘Simpan’

Memanggil display

Klik menu sub menu

Masuk Halaman sub menu

Klik menu sub menu

Masuk Halaman sub menu

List sub menu

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.48. STD Input Sub Menu

13. State Transition Diagram (STD) Input Halaman Statis

halaman statis

Klik ‘ tambah halaman statis’

Menunggu input

Form data

halaman statis

Klik ‘Simpan’

Memanggil display

Klik menu halaman statis

Masuk Halaman halaman statis

Klik menu halaman statis

Masuk Halaman halaman statis

List halaman statis

Menampilkan


Memanggil display

Form Edit

Klik ‘Edit’

Menunggu input

Klik ‘Batal’

Memanggil display

Klik ‘Simpan’

Memanggil display

Keluar

Klik ‘Hapus’

Memanggil display

Gambar 4.49. STD Input Halaman Statis

4.6. Analisa Keputusan (Decision Analysis)

Berdasarkan kebutuhan sistem dan model sistem yang didapatkan pada

tahapan requirements analysis dan logical design, maka ada beberapa cara untuk

memenuhi kebutuhan tersebut, diantaranya:

4.6.1. Sistem yang digunakan

Sistem yang dikembangkan dalam penelitian diantaranya: (1). Sistem

untuk pengkasesan info dan berita terbaru yang terjadi di kampus (2). Sistem

pendaftaran secara online (3). Pengaksesan e-learning yang terhubung dengan

web portal.

4.6.2. Kepemilikan perangkat lunak

Dalam proyek Pengembangan Web portal ini dibangun menggunakan

CMS Lokomedia yang di kembangkan agar sesuai dengan kebutuhan Web

Portal di STMIK Islam Internasional Jakarta.

4.6.3. Desain Sistem

Desain sistem yang digunakan dalam proyek Web Portal adalah

berbasis web.

4.6.4. Teknologi informasi yang akan dihasilkan dari aplikasi

Teknologi informasi yang akan dihasilkan dari aplikasi adalah suatu

Sistem berbasis web yang bernama Web Portal, yang berguna untuk

mempercepat proses mendapatkan informasi yang dibutuhkan dalam sebuah

institusi perguruan tinggi, dan sebagai penghubung dengan sistem-sistem lain

yang pada STMIK Islam Internasional Jakarta sehingga mempermudah

proses perkuliahan di STMIK Islam Internasional Jakarta.

4.6.5. Analisis Kelayakan ( feasibility analisys)

Penganalisaan dari kandidat solusi-solusi tersebut sehingga pada

akhirnya nanti dapat dipilih suatu solusi yang terbaik untuk mendesain,

mengembangkan dan mengimplementasikan suatu sistem yang sesuai dengan

yang dibutuhkan.

Berbagai kemungkinan alternatif kandidat solusi ini diperoleh dari ide

atau pendapat dari system owner, dalam hal ini STMIK Islam Internasional

Jakarta, maupun system user. Dari berbagai ide dan opini yang yang terima

itu, akhirnya dapat disusun daftar kandidat-kandidat solusi tersebut dalam

tabel Candidate System Matrix di bawah ini.

Tabel 4.9. Candidate system matrix

Karakteristik Kandidat 1 Kandidat 2

Software yang digunakan

untuk pengembangan

sistem

Perangkat lunak yang

dibutuhkan dalam

merancang dan

mengembangkan kandidat

sistem yang bersangkutan,

misalnya untuk basis data,

sistem operasi, bahasa

pemrograman, dan

sebagainya.

Untuk interface

digunakan PHP,

JQuery,HTML dan CSS.

Sedangkan untuk

database menggunakan

mySQL sebagai DBMS

(Data Base Management

System)

Untuk server

menggunakan MS

Windows Server 2003,

apache web serve dan,

Oracle sebagai DBMS.

Servers and Workstations

Deskripsi dari server dan

workstation yang

dibutuhkan untuk

mendukung kandidat yang

bersangkutan.

Hosting di sebuah tempat

di internet dengan jumlah

quota yang cukup besar.

IBM Server, memory

2 GB dan 2 buah

Hardisk SCSI 80 GB

dan monitor 15”

(Server), Pentium 4,

memory 128 MB dan

Hardisk ATA 40 GB

Keuntungan

Deskripisi singkat

mengenai keuntungan

yang akan direalisasikan

untuk kandidat yang

bersangkutan.

Solusi ini dapat

diimplementasikan relatif

lebih cepat karena sistem

ini cukup sederhana,

harga lebih murah dan

dapat memenuhi

kebutuhan user.

Solusi ini dapat lebih

terjamin

keamanannya ,

server dikendalikan

penuh oleh admin

dapat memenuhi

kebutuhan user

Output Devices and

Implications

Deskripsi dari peralatan

yang akan digunakan oleh

user untuk menghasilkan

keluaran dari sistem,

sesuai dengan kebutuhan

yang ada.

Printer standard dan dot

Matrix.

Sama seperti

Kandidat 1.

Input Devices and

Implications

Deskripsi dari peralatan

yang akan digunakan oleh

Keyboard dan mouse Sama seperti

Kandidat 1.

user untuk memberi

masukan ke sistem.

Storage Devices and

Implications

Deskripsi singkat

mengenai data yang akan

disimpan dan diakses,

media penyimpan yang

akan digunakan, besar

kapasitas untuk

penyimpanan data, dan

bagaimana penyimpanan

data tersebut dapat

terorganisir dengan baik.

Tersedia pada server

tempat hosting. Dengan

minimum quota yang

dibutuhkan sebesar 1 GB

Pada servermilik

sendiri, yaitu sebuah

Hardisk SCSI 250

GB. Dengan

menggunakan sistem

RAID 0

Bagian yang

terkomputerisasi

Pemilihan bagian yang

akhirnya dikomputerisasi

oleh pengembangan

system

Penerimaan Mahasiswa

Baru secara Online,

Sistem Informasi

Akademik, E-Learning,

Sistem Informasi

Keuangan

Sama seperti

kandidat 1

Teknologi pemrosesan

data

Sarana yang dipakai untuk

pemrosesan data

Pengaksesan data lewat

Internet

Pengaksesan data

lewat LAN

Analisis kelayakan terdiri dari 5 analisis kelayakan, yaitu: (1)

Kelayakan teknis, (2) Kelayakan operasional, (3) Kelayakan ekonomi, (4)

Kelayakan jadwal, dan (5) Kelayakan resiko. Penjelasan kelima analisis

kelayakan ini terperinci pada

Tabel 4.10. Feasibility analysis matrix

Kriteria

Kelayakan

Bobot Kandidat 1 Kandidat 2

Kelayakan

operasional

yaitu

berhubungan

dengan

25 % Memenuhi kebutuhan-

kebutuhan fungsional

utama user STMIK Islam

Internasional Jakarta,

seperti, Berita terbaru

Memenuhi user’s

requirement secara

penuh, seperti Update

Berita terbaru,

Penerimaan

manfaat

sistem

terhadap

pengguna

Kampus, Agenda

Kegiatan Kampus,

Penerimaan Mahasiswa

Baru secara Online,

Terhubung dengan E-

Learning dan SIMAK.

Nilai: 90

Mahasiswa Baru

secara Online,

Terhubung dengan E-

Learning dan SIMAK

serta Kendali penuh

Terhadap pengawasan

serta kamanan server.

Nilai: 95

Kelayakan

teknis yaitu

solusi teknis

menyangkut

masalah

kemampuan

atau

keahlian

teknis staf

untuk

merancang

dan

membangun

sistem.

25 % - Software yang

digunakan hanya sebuah

software editor untuk

menulis bahasa

pemrograman yang akan

digunakan dan software-

nya pun yang bersifat

gratis.

- Bahasa pemrogram yang

digunakan merupakan

bahasa yang tergolong

umum digunakan dan

mudah, yaitu PHP,

HTML, JQuery dan

CSS, serta SQL

Nilai: 90

- Software yang

digunakan memang

dikenal sangat

tangguh, namun harga

untuk membeli sebuah

software tersebut

sangat mahal.

Nilai: 50

Kelayakan

ekonomi

yaitu biaya

yang

dikeluarkan

untuk

membangun

sistem.

25 % - Sekitar $ 3,550

- Meningkatkan efisiensi

waktu, meningkatkan

kinerja STMIK Islam

Internasional Jakarta

dan mengurangi

terjadinya kesalahan

(error).

- Meningkatkan

kredibilitas STMIK

Islam Internasional

Jakarta

- Sekitar $ 12,380

- Meningkatkan

efisiensi waktu,

meningkatkan

kinerja STMIK Islam

Internasional Jakarta

dan menngurangi

terjadinya kesalahan

(error) dan

meningkatkan

pengontrolan

terhadap aset

sehingga mencegah

terjadinya kehilangan

Nilai: 80

aset.

- Meningkatkan

kredibilitas STMIK

Islam Internasional

Jakarta dan

mengontrol

keberadaan dan

penggunaan aset

yang dimiliki.

Nilai: 60

Kelayakan

jadwal yaitu

waktu yang

dihabiskan

untuk

merancang

dan

membangun

system

10% - 6 bulan

Nilai : 90

- 6 sampai 7 bulan

Nilai : 85

Kelayakan

risiko yaitu

kemungkinan

sebuah

implementasi

berhasil atau

tidak dalam

penggunaan

teknologi dan

metodologi.

15 % - Keamanannya rentan

karena diakses melalui

internet

- Implementasi dan

Akses data lebih

lambat akan tetapi

jangkauan lebih luas

dapat diakses dimana

saja.

Nilai:90

- Keamanannya lebih

terjamin karena

diakses melalui LAN

- Implementasi dan

Akses data lebih

relative lebih mudah

dan cepat

Nilai:90

Nilai total 100% 87.75 73

Catatan:

Untuk mencari yang terbaik maka perlu dilihat Nilai Total. Adapun

dari hasil total penilaian dari feasibility analysis (Nilai Total) ini diperoleh

kesimpulan bahwa kandidat 1 lebih baik daripada kandidat 2. Walaupun pada

dasarnya kandidat solusi 1 tidak terlalu jauh berbeda dengan kandidat 2

(kandidat 2 hanya jangkauan aksesnya saja yang berbeda), tetapi nilai total

keduanya berbeda cukup siginifikan.

Kandidat 1 dengan nilai total 87,75 memiliki nilai overall kombinasi

dari teknis, ekonomi dan penjadwalan yang lebih baik daripada kandidat 2

yang hanya mempunyai nilai total 73. Hal ini terutama disebabkan karena

adanya keunggulan mutlak dalam teknologi atau teknis yang ditawarkan

kandidat 1 terhadap sistem ini dimana kandidat 1 menawarkan teknologi

software yang gratis dan juga mudah digunakan sedangkan kandidat 2

membutuhkan perangkat lunak yang mahal.

Bobot dari tiap kriteria feasibility diatas tentukan berdasarkan hasil

observasi yang dilakukan oleh system analyst yang bekerja bersama-sama

dengan system designers dan system builder untuk hal-hal yang bersifat teknis

serta dengan system user dan system owner untuk hal rekomendasi akhir.

Sehingga pada akhirnya menetapkan bobot dari masing-masing kriteria

feasiblity diatas sebagai berikut, yaitu operational feasibility (25%), technical

feasibility (25%), economic feasibility (25%), schedule feasibility (10%), risk

feasibility (15%).

Adapun alasan menetapkan bobot yang sama sebesar 25% pada

operational feasibility, technical feasibility, dan economic feasibility

dikarenakan ketiganya sama-sama penting dan critical dalam pembandingan

kedua kandidat solusi. Sedangkan untuk schedule feasibiilty hanya

menetapkan bobot sebesar 10% karena kedua kandidat solusi diatas

mempunyai lama waktu pengembangan yang tidak jauh berbeda, yakni

sekitar 6-7 bulan dan risk feasibility hanya menetapkan bobot sebesar 15%

dikarenakan faktor bisa ditanggulangi.

4.7. Physical Design and Integration (Desain Fisik dan Integrasi)

4.7.1. Spesifikasi Database

Adapun spesifikasi data dari database yang dirancang adalah sebagai

berikut :

Nama database : db_iiuc

Berikut ini adalah tabel yang terdapat di database ini :

a. Tabel Agenda

Nama Tabel : agenda

Primary Key : id_agenda

Tabel 4.11. Tabel Agenda

b. Tabel Berita

Nama Tabel : berita

Primary Key : id_berita

Foreign Key : id_kategori

Tabel. 4.12. Tabel Berita

c. Tabel Kategori

Nama Tabel : kategori

Primary Key : id_kategori

Tabel. 4.13. Tabel Kategori

d. Tabel Album

Nama Tabel : album

Primary Key : id_agenda

Tabel. 4.14. Tabel Album

e. Tabel Gallery

Nama Tabel : gallery

Primary Key : id_gallery

Tabel. 4.15. Tabel Gallery

f. Tabel Banner

Nama Tabel : banner

Primary Key : id_banner

Tabel. 4.16. Tabel Banner

g. Tabel Download

Nama Tabel : download

Primary Key : id_download

Tabel. 4.17. Tabel Download

h. Tabel Menu Utama

Nama Tabel : mainmenu

Primary Key : id_main

Tabel 4.18. Tabel Main Menu / Menu Utama

i. Tabel Sub menu

Nama Tabel : submenu

Primary Key : id_sub

Tabel 4.19. Tabel Sub Menu

j. Tabel Halaman Statis

Nama Tabel : halamanstatis

Primary Key : id_halaman

Tabel. 4.20. Tabel Halaman Statis

k. Tabel Hubungi

Nama Tabel : hubungi

Primary Key : id_hubungi

Tabel. 4.21. Tabel Hubungi

l. Tabel Komentar

Nama Tabel : komentar

Primary Key : id_komentar

Tabel 4.22. Tabel Komentar

m. Tabel Modul

Nama Tabel : modul

Primary Key : id_modul

Tabel 4.23. Tabel Modul

n. Tabel Sekilas Info

Nama Tabel : sekilasinfo

Primary Key : id_sekilas

Tabel 4.24. Tabel Sekilas Info

o. Tabel User

Nama Tabel : user

Primary Key : id_sub

Foreign Key : id_status_user

Tabel 4.25. Tabel User

p. Tabel Status User

Nama Tabel : status_user

Primary Key : id_status_user

Tabel 4.26. Tabel Status User

q. Tabel Data Pribadi

Nama Tabel : data_pribadi

Primary Key : id_data_pribadi

Tabel 4.27. Tabel Data Pribadi

r. Tabel Pilihan Program

Nama Tabel : pilihan_program

Primary Key : id_pilihan_program

Foreign Key : id_data_pribadi

Tabel 4.28. Tabel Pilihan Program

s. Tabel Asal Sekolah

Nama Tabel : asal_sekolah

Primary Key : id_asal_sekolah


Tabel 4.29. Tabel Asal Sekolah

t. Tabel Data Orang Tua

Nama Tabel : data_orang_tua

Primary Key : id_data_orang_tua


Tabel 4.30. Tabel Data Orang Tua

u. Tabel alamat Orang Tua

Nama Tabel : alamat_orang_tua

Primary Key : id_alamat_orang_tua


Tabel 4.31. Tabel Alamat Orang Tua

4.7.2. Perancangan Layar Antarmuka (Interface)

Perancangan antarmuka (Interface) dibuat agar user dapat dengan

mudah mengoperasikan dan mengerti bagaimana sistem dapat digunakan.

4.7.2.1. Rancangan Interface Halaman User

Pada halaman user terdapat beberapa halaman yang dapat

digunakan oleh user, antara lain :

1. Home : Halaman ini sebagai halaman utama User.

Gambar 4.50. Rancangan Layar Halaman Home User

1. Program Studi

Gambar 4.51. Rancangan Layar Halaman Program Studi

Header

Headline News Sekilas

Info

Akademik Search

Engine

Short

Course

Kemahasi

swaan

Fasilitas

Online

Online

Chating

Link Partner

Agenda

Kegiata

n

Iklan

Iklan

News Tab

Terpop

uler

Terk

ini

Sebelu

mnya

Kome

ntar

News

Search

Form

Footer

Home Program

Studi

Pendafta

ran

Berita Fasilita

s

Profil

e

Gallery Contact

Us

Why

STMIK

Konten Program Studi IIUC

Jakarta

Gambar

Header

Sekilas

Info

Akademik

Search Form

Footer

Link Partner

Konten Program Studi IIUC

Jakarta

Gambar

Home Program

Studi

Pendaftaran Berita Fasilitas Profile Gallery Contact

Us

Why

STMI

K

2. Pendaftaran dan Konfirmasi

Gambar 4.52. Rancangan Layar Halaman Pendaftaran

3. Berita

Gambar 4.53. Rancangan Layar Halaman Berita

Hea

der

Ho

me

Why

STMI

K

Program

Studi

Pendaft

aran

Gall

ery

Be

rita

Fasi

litas

Pro

file

Contac

t Us

Sekilas

Info

Akademik

Search

Form

Foot

er

Link Partner

Berita 1

Konten 8 Alasan memilih IIUC Jakarta

Berita 2


Berita 3


Kategori

Berita

Tanggal

Posting

Header

Sekilas Info

Akademik

Search

Form

Footer

Link Partner

Isi Halaman Pendaftaran dan konfirmasi

Home Program

Studi

Pendaftaran Berita Fasilitas Profile Gallery Contact

Us

Why

STMIK

4. Profil

Gambar 4.54. Rancangan Layar Halaman Profil

5. Galeri Foto

Gambar 4.55. Rancangan Layar Halaman Galeri Foto

Hea

der

Ho

me

Why

STMI

K

Program

Studi

Pendaft

aran

Gall

ery

Be

rita

Fasi

litas

Pro

file

Conta

ct Us

Sekilas

Info

Akademik

Search

Form

Foot

er

Link Partner

Album 1

Album 2

Album 3

Album 4

Album 5

Album 6

Header

Sekilas

Info

Akademik

Search

Form

Footer

Link Partner

Home Program

Studi

Pendafta

ran

Berita Fasilita

s

Profil

e

Gallery Contact

Us

Why

STMIK

Konten Profil STMIK Islam Internasional

6. Hubungi Kami

Header

Home Why IIUCProgram

StudiPendaftaran Fasilitas Berita Profil Galeri

Hubungi

Kami

Search Form

Kontak 1

Kontak 2

Form Hubungi Kami

Info Akademik

Partner

Footer

Gambar 4.56. Rancangan Layar Halaman Hubungi Kami

4.7.2.2. Rancangan Interface Halaman Admin

Pada halaman Admin terdapat beberapa komponen, antara lain :

1. Home : Halaman ini sebagai halaman utama admin, terdapat

pada gambar 4.57.

Gambar 4.57. Rancangan Layar Halaman Home Admin

Header

Footer

Manaje

men

User

Manaje

men

Modul

Berita Komen

tar

Icon

menu Downloa

d

Icon

menu

Agenda

Icon

menu

Banner

Icon

menu

Galeri

Foto

Icon

menu

Hubung

i Kami

Icon

menu

Logout

Control Panel

Welcome Message

Menu Kiri

2. Manajemen Modul : Komponen ini berfungsi untuk menambah

modul dan mengatur status modul.

Gambar 4.58. Rancangan Layar Halaman Modul

3. Agenda : komponen ini berfungsi untuk menambah agenda,

mengedit agenda, dan menghapus agenda yang akan dilakukan

di STMIK Islam Internasional Jakarta.

Gambar 4.59. Rancangan Layar Halaman Agenda

Header

Footer

Menu

Tambah

Modul

Nama

modul

Link

Pub

lish

Akti

f

Stat

us

Aksi

Edit Hapus

Header

Footer

Menu

Tambah

Agenda

Tema

Tgl

Mulai

Tgl

Selesai

Aksi

Edit Hapus

4. Berita : Komponen ini berfungsi untuk menambah berita,

mengupdate berita, dan menghapus berita.

Gambar 4.60. Rancangan Layar Halaman Berita

5. Komentar : Komponen ini berfungsi untuk mengedit,

menghapus, dan mengatur status komentar.

Gambar 4.61. Rancangan Layar Halaman Komentar

Header

Footer

Menu

Tambah

Berita

Judul

Tgl

Posting

Aksi

Edit Hapus

Header

Footer

Menu

Nama

Komentar

Akti

f

Aksi

Edit Hapus

6. Partner IIUC : Komponen ini berfungsi untuk menambah

banner, mengedit, dan menghapus banner.

Gambar 4.62. Rancangan Layar Halaman Partner IIUC

7. Download : Komponen ini berfungsi untuk menambah

download, mengedit, dan menghapus download.

Gambar 4.63. Rancangan Layar Halaman Download

Header

Footer

Menu Judul

URL

Tgl

Posting

Aksi

Edit

Hapus

Tambah

Banner

Header

Footer

Menu

Tambah

Download

Judul

Tgl

Posting

Aksi

Edit

Hapus

Nama File

8. Hubungi Kami : Komponen ini berfungsi untuk menjawab

pertanyaan atau keperluan user yang telah menghubungi STMIK

Islam Internasional Jakarta.

Gambar 4.64. Rancangan Layar Halaman Hubungi Kami

9. Sekilas Info : Komponen ini berfungsi untuk menambah info,

mengedit, dan menghapus sekilas info.

Gambar 4.65. Rancangan Layar Halaman Sekilas Info

Header

Footer

Menu Nama

Subjek

Aksi

Edit Hapus

Email

Tang

gal

Header

Footer

Menu

Tambah Info

Info

Tgl

Posting

Aksi

Edit Hapus

10. Album : Komponen ini berfungsi untuk menambah album dan

mengedit album.

Gambar 4.66. Rancangan Layar Halaman Album

11. Galeri Foto : Komponen ini berfungsi untuk menambah foto dan

memasukkan kedalam kategori album. Serta untuk mengedit dan

menghapus galeri foto.

Gambar 4.67. Rancangan Layar Halaman Galeri Foto

Header

Footer

Menu

Tambah

Album

Judul

Aksi

Edit Hapus

Header

Footer

Menu

Tambah

Galeri Foto

Judul

Foto

Album

Aksi

Edit Hapus

12. Menu Utama : Komponen ini berfungsi untuk menambah menu

utama yang terdapat di halaman user. Mengedit dan mengatur

status menu utama.

Gambar 4.68. Rancangan Layar Halaman Menu Utama

13. Validasi : Komponen ini berfungsi untuk memvalidasi peserta

pendaftaran, mengedit, dan menghapus peserta.

Gambar 4.69. Rancangan Layar Halaman Validasi

Header

Footer

Menu

Tambah Menu

Utama

Menu

Utama

Aktif

Aksi

Edit

Hapus

Link

Header

Footer

Menu

No. Ujian

Validasi

Nama

Lengka

p

Aksi

Edit Hapus

Cetak Kirim

14. Halaman Statis : Komponen ini berfungsi untuk menambah

halaman statis di halaman user, mengedit dan menghapus

halaman statis.

Gambar 4.70. Rancangan Layar Halaman Statis

4.8. Construction and Testing (Konstruksi dan Pengujian)

4.8.1. Konstruksi Perangkat Lunak

Blueprint (cetak biru) sistem yang telah dimodelkan dan dirancang

sebelumnya dieksekusi menjadi sebuah set kode program dengan

menggunakan bahasa pemograman PHP 5 guna mengimplementasikan

sistem informasi manajemen surat keputusan.

Sejumlah tools digunakan untuk mengembangkan perangkat lunak

sistem informasi manajemen surat keputusan. Pada tabel berikut

ditunjukkan daftar tools yang digunakan dalam pengembangan.

Header

Footer

Menu

Tambah Halaman

Statis

Judul

Tgl

Posting

Aksi

Edit Hapus

Tabel 4.32 Daftar Tools Pengembangan Perangkat Lunak Sistem

No. Tools Kegunaan

1 Microsoft Visio Mendesain diagram-diagram DFD, STD

2 DBDesigner 4 Menggambarkan database schema

aplikasi

3 PHP 5 Bahasa pemograman untuk

mengembangkan aplikasi sistem

informasi manajeman Surat Keputusan

4 MySQL Database yang digunakan dalam sistem

5 XAMPP Apache

HTTP Server

Web Server

6 PHP MyAdmin Perangkat untuk mengakses database

yang terdapat pada XAMPP Apache

7 Mozilla Firefox

3.5

Web Browser

4.8.2. Hardware

Perangkat keras yang dibutuhkan aplikasi ini agar dapat

dijalankan adalah sebagai berikut:

1. Sebuah komputer yang digunakan aplikasi Web Portal.

Spesifikasi minimum komputer yang disarankan adalah:

a. Processor dengan kecepatan 1 GHz

b. RAM 128 MB

c. Monitor Super VGA minimum 15”

d. Harddisk 20 GB

e. Keyboard

f. Mouse

g. Modem / Jaringan Internet

2.8.3 Pengujian Mandiri

Pada tahap ini, penulis melakukan uji coba terhadap sistem yang

telah dikembangkan dengan hasil sebagai berikut dengan bukti dapat

dilihat pada lampiran B :

Tabel 4.33. Hasil pengujian mandiri halaman Admin

1. Administrator

No. Modul Prasyarat Hasil yang Diharapkan Hasil Uji

Coba

1. Tambah

Agenda

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menambah data agenda

kegiatan

OK

Gbr (1)

2. Edit agenda Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengubah data agenda

OK

Gbr (2)

3. Hapus

agenda

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data

agenda

OK

Gbr (3)

4. Tambah

berita

Login sebagai

admin

Admin dapat

menambah berita

OK

Gbr (4)

5. Edit berita Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengubah data tentang

berita

OK

Gbr (5)

6. Hapus berita Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data berita

OK

Gbr (6)

7. Tambah

partner

Login sebagai

admin

Admin dapat

menambah partner

OK

Gbr (7)

8. Edit partner Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengubah data tentang

partner

OK

Gbr (8)

9. Hapus

partner

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data

partner

OK

Gbr (9)

10. Tambah

download

Login sebagai

admin

Admin dapat

menambah download

OK

Gbr (10)

11. Edit

download

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengubah data

download

OK

Gbr (11)

12. Hapus

download

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data

download

OK

Gbr (12)

13. Tambah

Sekilas info

Login sebagai

admin

Admin dapat

menambah sekilas info

OK

Gbr (13)

14. Edit Sekilas

info

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengubah sekilas info

OK

Gbr (14)

15. Hapus

Sekilas info

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus sekilas info

OK

Gbr (15)

16. Tambah

album

Login sebagai

admin

Menambah album OK

Gbr (16)

17. Edit album Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengganti ataupun

menonaktifkan album

OK

Gbr (17)

18. Tambah

galeri foto

Login sebagai

admin

Menambah galeri foto OK

Gbr (18)

19. Edit galeri

foto

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menambah, mengganti

data galeri foto

OK

Gbr (19)

20. Hapus galeri

foto

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data galeri

foto yang tidak

digunakan

OK

Gbr (20)

21. Tambah

menu utama

Login sebagai

admin

Menambah menu

utama

OK

Gbr (21)

22. Edit menu

utama

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengganti ataupun

menonaktifkan menu

utama

OK

Gbr (22)

23. Tambah sub

menu

Login sebagai

admin

Menambah sub menu OK

Gbr (23)

24. Edit sub

menu

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menambah ataupun

mengganti data sub

menu

OK

Gbr (24)

25. Hapus sub

menu

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data sub

menu yang salah

OK

Gbr (25)

26. Tambah

halaman

statis

Login sebagai

admin

Menambah halaman

statis

OK

Gbr (26)

27. Edit

halaman

Login sebagai

admin, data sudah

Admin dapat

menambah ataupun

OK

Gbr (27)

statis ada dalam database mengganti data

halaman statis

28. Hapus

halaman

statis

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data

halaman statis yang

salah

OK

Gbr (28)

29. Tambah

validasi

Login sebagai

admin

Menambah validasi OK

Gbr (29)

30. Edit validasi Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menambah ataupun

mengganti data

validasi

OK

Gbr (30)

31. Hapus

validasi

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

menghapus data

validasi yang salah

OK

Gbr (31)

32. Cetak Kartu Login sebagai

admin, data sudah

ada dalam database

Admin dapat mencetak

kartu pendaftaran

OK

Gbr (32)

33. Kirim Email Login sebagai

admin, data sudah

ada dalam database

Admin dapat mengirim

Kartu Pendaftaran ke

email calon mahasiswa

OK

Gbr (33)

34. Cek

Konfirmasi

pembayaran

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

mengecek data calon

mahasiswa yang

melakukan konfirmasi

pembayaran

OK

Gbr (34)

35. Aktivasi

Username &

Password

Login sebagai

admin, data sudah

ada dalam database

Admin dapat

melakukan aktivasi

username & password

calon mahasiswa

OK

Gbr (35)

Tabel 4.34. Hasil pengujian mandiri halaman User

2. User

No. Modul Prasyarat Hasil yang Diharapkan Hasil Uji Coba

1. Halaman Home User dapat menampilkan

halaman utama Web

Portal

OK

Gbr User (1)

2. Pendaftaran Online User melakukan pendaftaran OK

Gbr User (2)

3. Formulir

Pendaftaran

User Mengisi Formulir

pendaftaran

OK

Gbr User (3)

4. Form Konfirmasi Sudah melakukan

pembayaran

User melakukan konfirmasi

pembayaran

OK

Gbr User (4)

5. Login Cetak Kartu Username & password

sudah aktif

User melakukan login OK

Gbr User (5)

6. Halaman Cetak

Kartu

User telah login User mencetak kartu ujian OK

Gbr User (6)

4.8.4. Acceptance Testing (Pengujian Penerimaan)

Pengujian penerimaan sistem dilakukan oleh Ketua STMIK Islam

Internasional Jakarta yaitu Bapak Taufik Guntur dan staff manager

akademik yaitu Saudari Shinta Mardhotillah, pada tanggal 26 Juli 2011

Pukul 10.00 WIB. Pengujian dilakukan dengan menggunakan metode

blackbox testing. Bukti terlampir uji coba yang dilakukan dapat dilihat

pada bagian lampiran. Secara ringkas, hasil pengujian yang dapat penulis

simpulkan adalah sebagai berikut dengan bukti dapat dilihat pada

lampiran D:

Tabel 4.35 Pengujian Penerimaan Sistem

No Pengujian Penilaian

1. Fitur aplikasi secara keseluruhan Baik

2. Fitur untuk admin Baik

3. Fitur untuk User Baik

4. Fitur untuk Menu Admin Baik

5. Fitur untuk Menu User Baik

6. Fitur untuk pendaftaran Online Baik

5. Tampilan aplikasi Baik

6. Kestabilan aplikasi Baik

7. Keamanan aplikasi Baik

8. Kesesuaian dengan kebutuhan Baik

9. Kemudahan penggunaan aplikasi Baik

4.9. Instalasi dan Delivery (Instalasi dan Pengiriman)

Berikut ini adalah langkah instalasi pada hosting website di Cpanel

Idwebhost :

4.8.1. Login CPanel

Untuk login ke panel kontrol, pertama kunjungi alamat URL berikut

di browser: http://iiuc.ac.id

Gambar 4.71. Halaman login cpanel iiuc.ac.id

(Sumber: http://iiuc.ac.id/cpanel)

Ketika domain belum aktif, expired, atau sedang bermasalah,

maka bisa menggunakan: http://IP_Server/Cpanel. Di

mana IP_server adalah alamat IP server tempat account iiuc.ac.id yaitu

Server IP address: 174.120.70.134. Jika mengalami kesulitan :

http://IP_server/spanel/spanel.cgi?https=0

http://iiuc.ac.id/

http://iiuc.ac.id/cpanel

http://ip_server/Cpanel

Gambar 4.72. Halaman Awal Cpanel iiuc.ac.id

(Sumber: http://iiuc.ac.id:2082/cpsess5277297524)

1. Upload File

Dalam Upload file ke Cpanel yaitu dengan FTP ( file transfer

protocol .FTP.FTP adalah protokol yang sejak lama digunakan untuk

mengupload atau mendownload file lewat Internet.

1. FileZilla

Salah satu software FTP yaitu FileZilla. FileZilla adalah

program FTP client gratis yang tersedia di Windows dan Linux.

1. Buka FileZilla

2. Klik File -> Site Manager maka akan muncul window Site

Manager seperti pada Gambar di bawah ini.

3. Klik Button New Site, kemudian rename My FTP Sites dengan

nama domain Anda, misalkan menjadi mysite.com kemudian

http://iiuc.ac.id:2082/cpsess5277297524/frontend/x3/index.html?post_login=13888594563783

http://filezilla.sourceforge.net/

klik button Advanced. Pilih radio button Use passive mode

untuk Passive transfer mode settings. Untuk Default remote

directory silakan isikan /sites/mysite.com/www/. Maka akan

seperti Gambar di bawah ini

4. Isikan mysite.com untuk Host, FTP untuk Servertype. Pada

Logontype, pilih Normal. Masukkan unixuser Anda dan

Password kemudian klik button Connect. Hasilnya akan seperti

pada Gambar di bawah ini.

5. Isikan password tersebut dengan password hosting anda.

Setelah itu, maka account anda akan terbuka seprti di bawah

ini.

6. Bagian kiri adalah Local Site, yaitu letak file sebelum diupload

(berada di PC anda), di kanan adalah Remote Site, yaitu letak

folder tempat file akan anda upload. Anda bisa drang and drop

file yang mau diupload dari Local Site ke folder yang tepat di

remote Site.

4.8.2. Control Panel

Selain menggunakan tools atau software FTP uplode file ke

webhosting bisa dilakukan dengan file manager. Cpanel Masuk ke File

Manaer, lalu berpindah ke folder yang diinginkan, lalu gunakan pilihan

Upload File atau tekan link Upload File untuk ke halaman upload (dapat

mengupload lebih banyak file, 10 secara sekaligus).

1. Klik menu File manager

Gambar 4.73. Menu File Manager

(Sumber:http://iiuc.ac.id:2082/cpsess5277297524)

2. Pilih Directory File Domain iiuc.ac.id berada

Gambar 4.74. Pilih Direktori file Cpanel iiuc.ac.id


3. Klik menu Upload



Gambar 4.75. Menu Upload file manager Cpanel iiuc.ac.id


4.8.3. Membuat Database Mysql

Setelah upload file web portal STMIK Islam internasional

seluruhnya maka langkah selanjutnya adalah konfigurasi database

Mysqlnya yaitu dengan mengklik menu Mysql databases selanjutnya

Mysql.

http://iiuc.ac.id:2082/cpsess5277297524

1. Klik Menu Mysql Database

Gambar 4.76. Menu Mysql Database Cpanel iiuc.ac.id


2. Masukkan nama database lalu klik tombol create

database

Gambar 4.77. Memasukkan Database portal di Cpanel


3. Buat user untuk data base


http://iiuc.ac.id:2082/cpsess5277297524/frontend/x3/sql/index.html

Gambar 4.78. Membuat user untuk Database Portal di Cpanel


4. Pilih user untuk database yang sudah dibuat

Gambar 4.79. Memilih User untuk Database di Cpanel



http://iiuc.ac.id:2082/cpsess5277297524

5. Data user dan databse yang telah dibuat

Gambar 4.80. Tampilan Data Database dan Users di Cpanel

iiuc.ac.id


6. Klik menu PhpMydmin

Gambar 4.81. Menu PhpMyadmin di Cpanel iiuc.ac.id

(Sumber: http://iiuc.ac.id:2082/cpsess5277297524l)

7. Akun masuk ke halaman PhpMyadmin Cpanel


http://iiuc.ac.id:2082/cpsess5277297524l

Gambar 4.82. PhpMyadmin di Cpanel iiuc.ac.id

(Sumber:http://iiuc.ac.id:2082/cpsess5277297524)

4.8.4. Konfigurasi Koneksi Database Mysql

Langkah terakhir yaitu Konfigurasi Koneksi database mysql dengan

menyesuaikan nama username,password dan nama databasenya dengan

yang ada di Cpanel pada file connectdb.php

<?php

$db_username = " mysql_username_yang_digunakan ";

$db_hostname = " namahost ";

$db_password = " password_dari_username” ";

$db_name = " namadatabase ";

$con = _connect($db_hostname, $db_username, $db_password);

$db = _select_db($db_name, $con);

http://iiuc.ac.id:2082/cpsess5277297524/3rdparty/phpMyAdmin/index.php

?>

Instalasi Berhasil

Gambar 4.83. Web Portal STMIK Islam Internasional Jakarta

(Sumber: iiuc.ac.id)

BAB V

KESIMPULAN DAN SARAN

Setelah melakukan serangkaian penelitian, maka pada bab ini penulis akan

menguraikan kesimpulan dan saran yang dapat diambil dari rangkaian penelitian

tersebut. Saran yang diberikan diharapkan dapat bermanfaat bagi pihak-pihak yang

akan melanjutkan pengembangan penelitian ini.

5.1. Kesimpulan

Dari penelitian dan penulis yang telah penulis uraikan, maka dapat

ditarik kesimpulan sebagai berikut:

1. Dengan adanya Sistem Web Portal IIUC yang penulis kembangkan dapat

mempermudah mahasiswa mendapatkan data-data yang lengkap yang

dibutuhkan mengenai seputar kampus IIUC melalui web portal seperti

informasi pendaftaran, info akademik, berita seputar kampus, dan agenda

kegiatan, dapat dilihat pada lampiran pengujian mandiri

(gambar(1),gambar (4),gambar(13)) dan penerimaan sistem (point 5,8, dan

17).

2. Dengan adanya Sistem Web Portal IIUC dapat mempermudah

kelangsungan dalam proses belajar mengajar di STMIK Islam

Internasional yakni dengan melalui link ke sistem e-learning dari Web

Portal IIUC, dapat dilihat pada lampiran pengujian mandiri (Gambar user

1).

159

3. Dengan adanya Sistem Web Portal IIUC dapat di ketahui bagaimana

membangun dan mengimplementasikan sebuah sistem web berbasis

JQuery yang lebih user friendly, yaitu diantaranya aplikasi berita, info

akademik, galeri foto dan pendaftaran online, dapat dilihat pada lampiran

pengujian mandiri (Gambar user 1, 4, dan 8).

4. Dengan adanya Sistem Pendaftaran Online yang penulis kembangkan

calon mahasiswa dapat melakukan pendaftaran secara online dengan cepat

dan mudah, dapat dilihat pada lampiran pengujian mandiri (Gambar user

2,3,4,5, dan 6).

5. Sistem yang semakin User Friendly dan mudah digunakan, dapat

membantu kerja Administrator, Staff dan Mahasiswa STMIK Islam

Internasional Jakarta dalam melakukan pengelolaan web portal, dapat

dilihat pada lampiran penerimaan sistem.

5.2. Saran

Sistem ini tentu saja masih belum sempurna. Masih banyak hal yang

dapat dilakukan untuk mengembangkan sistem ini agar menjadi lebih baik

lagi, antara lain:

1. Diharapkan pengembangan tidak hanya sebatas sistem web portal saja

akan tetapi sistem web portal dapat diintegrasikan dengan sistem-sistem

yang lain.

2. Diharapkan sistem dibuat satu buah sistem login yang dapat mengakses ke

semua sistem yang ada.

DAFTAR PUSTAKA

Astamal, Rio. 2006. Menjadi Web Master dalam 30 Hari. [Online] Tersedia:

www.rahasia-webmaster.com. [15 Mei 2010]

Aswandi. 2006. Aplikasi Berbasis Web. [Online] Tersedia:

http://aswandi.or.id/2006/01/20/aplikasi-berbasis-web. [10 April 2010]

Duwiyanto. 2010. Rancang Bangun Portal Informasi Kabupaten Bangka Barat

Sebagai Alternatif Media Periklanan. Skripsi Tidak Diterbitkan.

Hakim, Lukmanul. 2009. Trik Rahasia Master PHP Terbongkar Lagi. Yogyakarta:

Lokomedia.

Hariyanto, Bambang. 2004. Sistem Manajemen Basis Data : Pemodelan,

Perancangan, dan Terapannya. Bandung : Informatika.

Jogianto, HM. 2005. Analisis dan Desain Sistem Informasi : Pendekatan Terstruktur

Teori dan Praktek Aplikasi Bisnis. Yogyakarta: Andi.

Juju, Dominikus. 2007. Buku Latihan Dreamweaver CS3. Jakarta: PT. Elex Media

Komputindo.

Kadir, Abdul. 2003. Pengenalan Sistem Informasi. Yogyakarta: Andi.

Kendall, Kenneth E. dan Kendall, Julie E. 2003. Analisis dan Perancangan Sistem.

Jakarta : Pearson Education Asia Pte. Ltd dan PT. Prenhallindo.

Ladjamudin, Albahra. 2005. Analisis dan Desain Sistem Informasi. Yogyakarta

Graha Ilmu.

Limar, Janus. 2010. Perencanaan dan Perancangan Web Portal Informasi

Perdagangan Manggaduashop.com. Skripsi Tidak Diterbitkan.

http://www.rahasia-webmaster.com/

http://aswandi.or.id/2006/01/20/aplikasi-berbasis-web

Marko Publishing McLeod, Raymond Jr., dan George Schell. 2008. Sistem Informasi

Manajemen Jilid 10. PT. Prenhallindo dan Index: Jakarta

Mulyanto, Agus. 2009. Sistem Informasi Konsep dan Aplikasi. Yogyakarta: Pustaka

Pelajar.

Pramono, Andi dan M. Syafii. 2006. Kolaborasi Flash, Dreamweaver, dan PHP

untuk Aplikasi Website. Yogyakarta: Andi.

Raghu, Ramakrishnan dan Gehrke, Johannes. 2004. Sistem Manajemen Database

Edisi 3. Jogjakarta : Andi & McGraw-Hill Education.

Restianti, Mega. 2009. Pembuatan Web Portal My Wedding Dengan Menggunakan

PHP dan MYSQL. Skripsi Tidak Diterbitkan.

Rifandi. 2010. Pembuatan Web Portal Fanz Community dengan Menggunakan PHP

dan MYSQL. Skripsi Tidak Diterbitkan.

Sutabri, Tata. 2005. Sistem Informasi Manajemen. Yogyakarta: Andi.

Umar, Rusydi. 2008. Implementasi Content Mangement System (CMS) pada situs

Portal Berita. Skripsi Tidak Diterbitkan.

Wahyu Danil, Ilham. 2009. Perancangan Portal Berbasis Web Dengan

Menggunakan PHP dan MYSQL Pada SMAN 18 Medan. Skripsi Tidak

Diterbitkan.

Whitten L, Jeffrey. 2007. System Analysis and Design Methods E. 7th. Yogyakarta:

McGraw-Hill.

Zaman, Haerul. 2008. Aplikasi Web Portal Hukum Himpunan Advokat / Pengacara

Indonesia Berbasis PHP dan MYSQL. Skripsi Tidak Diterbitkan.

LAMPIRAN-LAMPIRAN

1. LAMPIRAN A : HASIL WAWANCARA

2. LAMPIRAN B : PENGUJIAN MANDIRI

3. LAMPIRAN C : SOURCE CODE

4. LAMPIRAN D : PENGUJIAN PENERIMAAN SISTEM

LAMPIRAN A

HASIL WAWANCARA

Dalam pengumpulan data (Collecting Data), penulis melakukan wawancara dengan

Shinta Mardhotillah selaku kepala BAAK STMIK Islam Internasional Jakarta.

Berikut beberapa petikan hasil wawancara yang dilakukan oleh penulis:

1. Ceritakan sejarah atau profil STMIK Islam Internasional Jakarta !

International Islamic University College (IIUC), yang dikenal sebagai

STMIK Islam Internasional Jakarta adalah lembaga pendidikan swasta yang

terdaftar di Kopertis III, Jakarta dan didukung sepenuhnya oleh International

Islamic University Malaysia (IIUM) atau Universitas Islam Antar Bangsa

Malaysia.

2. Apa visi dan misi STMIK Islam Internasional Jakarta ?

- Visi : Menjadikan program studi teknik informatika STMIK Islam

Internasional sebagai pusat penyelenggaraan pengajaran, penelitian yang

ditujukan bagi pengembangan teknologi berbasis informasi yang

kompeten dan kompetitif

- Misi :

1. Menyiapkan tenaga-tenaga terampil yang kreatif, inovatif dan mandiri

di bidang teknologi informasi yang dapat bersaing di dunia kerja.

2. Menggunakan, memanfaatkan dan mengembangkan ilmu dan

teknologi yang inovatif.

3. Bagaimana STMIK Islam Internasional melakukan pemasaran?

STMIK IIUC melakukan pemasaran secara langsung turun ke lapangan

dengan menyebarkan brosur ke tempat-tempat yang tertentu dan melakukan

pemasaran menggunakan media Web Portal.

4. Bagaimana pendapat anda tentang Web Portal STMIK Islam Internasional

Jakarta saat ini?

Web Portal yang ada sekarang ini kurang optimal dalam pengelolaannya

dikarenakan sistem pengelolaannya yang rumit dan hanya bisa meng-update

fitur-fitur tertentu saja. Dan juga fitur-fiturnya tidak mendukung proses

kegiatan perkuliahan.

5. Bagaimana prosedur pengelolaan Web Portal STMIK Islam Internasional

Jakarta sekarang?

Prosedur pengelolaan Web Portal yaitu seorang administrator melakukan

pembaruan Web Portal dengan merubah kode HTML nya kemudian setelah

di update dapat dilihat di halaman user.

6. Apakah sistem yang ada sekarang cukup membantu pemasaran?

Lumayan membantu, tetapi kurang optimal.

7. Apa permasalahan yang ada dalam sistem Web Portal STMIK IIUC

sekarang?

Sistem Web Portal sekarang belum sepenuhnya memenuhi kebutuhan kampus

seperti sebagai media promosi, media publikasi kegiatan, media pendaftaran

mahasiswa baru dan fitur-fitur lainnya yang dapat menunjang proses kegiatan

pembelajaran.

8. Bagaimana cara STMIK Islam Internasional Jakarta melakukan pendaftaran

mahasiswa baru?

STMIK Islam Internasional melakukan pendaftaran mahasiswa baru secara manual,

yaitu calon mahasiswa datang langsung ke kampus STMIK. Belum terkomputerisasi.

9. Bisa Anda jelaskan alur pendaftaran mahasiswa baru di STMIK Islam Internasional

Jakarta?

Calon mahasiswa membeli formulir pendaftaran, mengisi formulir, menyerahkan ke

petugas, mendapatkan kartu ujian dan mengikuti ujian sesuai waktu yang di

tentukan.

10. Apa permasalahan yang ada dalam sistem pendaftaran mahasiswa baru sekarang?

Sistem pendaftaran mahasiswa baru sekarang masih dilakukan secara manual dan

kami berharap bisa menggunakan sistem pendaftaran yang lebih modern agar dapat

menjangkau calon mahasiswa yang terdapat di tempat yang jauh.

LAMPIRAN B

PENGUJIAN MANDIRI

Halaman Administrator

1. Tambah Agenda

Gambar (1)

2. Hapus Agenda

Gambar (2)

3. Edit Agenda

Gambar (3)

4. Tambah Berita

Gambar (4)

5. Edit Berita

Gambar (5)

6. Hapus Berita

Gambar (6)

7. Tambah Partner

Gambar (7)

8. Edit Partner

Gambar (8)

9. Hapus Partner

Gambar (9)

10. Tambah Download

Gambar (10)

11. Edit Download

Gambar (11)

12. Hapus Download

Gambar (12)

13. Tambah Sekilas Info

Gambar (13)

14. Edit Sekilas Info

Gambar (14)

15. Hapus Sekilas Info

Gambar (15)

16. Tambah Album

Gambar (16)

17. Edit Album

Gambar (17)

18. Tambah Galeri Foto

Gambar (18)

19. Edit Galeri Foto

Gambar (19)

20. Hapus Galeri Foto

Gambar (20)

21. Tambah Menu Utama

Gambar (21)

22. Edit Menu Utama

Gambar (22)

23. Tambah sub menu

Gambar (23)

24. Edit sub menu

Gambar (24)

25. Hapus sub menu

Gambar (25)

26. Tambah halaman statis

Gambar (26)

27. Edit Halaman Statis

Gambar (27)

28. Edit Validasi

Gambar (28)

29. Hapus Calon Mahasiswa

Gambar (29)

30. Cetak Kartu

Gambar (30)

31. Kirim Email

Gambar (31)

32. Konfirmasi Pembayaran

Gambar (32)

32. Aktivasi Username dan Password

Gambar (35)

Halaman User

1. Home

Gambar User (1)

2. Pendaftaran Online

Gambar User (2)

3. Formulir Pendaftaran

Gambar User (3)

4. Tampilan Jquery Validation

Gambar User (4)

5. Form Konfirmasi

Gambar User (5)

6. Login

Gambar User (6)

7. Halaman Cetak Kartu Ujian

Gambar User (7)

8. Halaman galeri foto

Gambar User (8)

LAMPIRAN C

SOURCE CODE

Kiri.php

<?php

session_start();

function encrypted($string){

$key = 'iiuc';

return

base64_encode(mcrypt_encrypt(MCRYPT_RI

JNDAEL_256, md5($key), $string,

MCRYPT_MODE_CBC, md5(md5($key))));

}

function decrypted($string){ $key = 'iiuc';

return

rtrim(mcrypt_decrypt(MCRYPT_RIJNDAEL_

256, md5($key), base64_decode($string),

MCRYPT_MODE_CBC, md5(md5($key))),

"\0");

}

if ($_GET['module']=='home'){

?>

 <div id="sidebar2">

<ul id="menu">

<li>

<a

href="#"><b>Fasilitas Online</b></a>

<ul>

<li><a

href="http://localhost/web_iiuc/statis-17-

under-construction.html"

target=_blank>Digital Library</a></li>

<li><a

href="http://localhost/skripsi/iiuc/login/index.p

hp" target=_blank>E-Learning</a></li>

<li><a

href="http://localhost/iiuc_center"

target=_blank>IIUC Center</a></li>

<li><a

href="http://localhost/web_iiuc/semua-

download.html"

target=_blank>Download</a></li>

<li><a

href="http://localhost/web_iiuc/statis-17-under-construction.html"

target=_blank>Website Yayasan</a></li>

<li><a


under-construction.html" target=_blank>Web

Mail</a></li>

</ul>

</li>

<li>

<a href="#"><b>Kemahasiswaan</b></a>

<ul>

<li><a

href="http://localhost/sisfokampus35"

target=_blank>Sistem Informasi

Akademik</a></li>

<li><a



target=_blank>Kalender Akademik</a></li>

<li><a

href="http://localhost/financial"

target=_blank>Sistem Informasi

Keuangan</a></li>

<li><a



target=_blank>Peraturan Kampus</a></li>

<li><a



target=_blank>Alumni</a></li> <li><a



target=_blank>Forum Mahasiswa</a></li>

</ul>

</li>

<li>

<a

href="#"><b>Short Course</b></a> <ul>

<li><a

href="http://www.apple.com/"

target=blank>Oracle</a></li>

<li><a

href="http://www.nikon.com/"

target=blank>CISCO</a></li>

<li><a

href="http://www.xbox.com/en-US/"

target=blank>Intensive English</a></li>

</ul>

</li>

<li>

<a

href="#"><b>Search Engines</b></a>

<ul>

<li><a

href="http://search.yahoo.com/"

target=blank>Yahoo!</a></li>

<li><a

href="http://www.google.com/" target=blank>Google</a></li>

<li><a

href="http://www.ask.com/"

target=blank>Ask.com</a></li>

<li><a

href="http://www.live.com/?searchonly=true"

target=blank>Live Search</a></li>

</ul>

</li>

</ul> </div> <div id="sidebar3">

<?php

echo "<p align='center'> <a

href='halaman-63-e-learning.html'> <img

src='$f[folder]/images/e_learning1.gif'></a>

</p>";

?></div>

<div id="content-welcome"><?php

echo"<img

src=$f[folder]/images/welcome_to.gif>";?></d

iv>

<div id="content">



<div id="content-

headline">

<div id="divTrigger">

<a href="javascript:;"

onClick="bukaContent(this,'div1')"

id="slideAwal">1</a>

<a href="javascript:;" onClick="bukaContent(this,'div2')">2</a>


onClick="bukaContent(this,'div3')">3</a>





</div><br />

<div id="divContent">

<?php $terkini=mysql_query("SELECT *

FROM berita

WHERE headline='Y'

ORDER BY id_berita DESC LIMIT 5");

$no=1;

while($t=mysql_fetch_array($terkini)

){

echo "<div id='div$no'>

<img

src=foto_berita/medium_$t[gambar]

width='450' height='250' />

<span class='t'><a

href='berita-$t[id_berita]-

$t[judul_seo].html'>$t[judul]</a></span>

</div>";

$no++;

}

?>

</div>

</div>

<p></p><p></p><p></p><p></p><p></p><p

></p><p></p><p></p><p></p><p></p><p><

/p><p></p><p></p><p></p><p></p><p></p>

<p></p><p></p><p></p><p></p><p></p><p

></p><p></p><p></p><p></p><p></p><p><

/p><p></p><p></p><p></p>



<div id="content-kanan">

<div id="tabsview">

<div id="tab1" class="tab_sel" onclick="javascript:

displayPanel('1');" align="center">

Terpopuler </div>

<div id="tab2"

class="tab" style="margin-left: 1px;"

onclick="javascript: displayPanel('2');"

align="center"> Terkini </div>

<div id="tab4"

class="tab" style="margin-left: 1px;"

align="center"> Sebelumnya

</div>

<div

id="tab3" class="tab" style="margin-left: 1px;"


align="center"> Komentar

</div>

</div>

<div class="tab_bdr"></div>

 <div class="panel" id="panel1"

style="display: block;">

<span>

<div class="tips">

<ul>

<?php

$populer=mysql_query("SELECT *

FROM berita ORDER BY dibaca DESC

LIMIT 7");

while($p=mysql_fetch_array($populer)){

$isi_berita =

strip_tags($p['isi_berita']); // membuat paragraf

pada isi berita dan mengabaikan tag html

$isi = substr($isi_berita,0,200); //

ambil sebanyak 200 karakter

$isi =

substr($isi_berita,0,strrpos($isi," ")); // potong

per spasi kalimat

echo "<li class='garisbawah'><a

href=berita-$p[id_berita]-$p[judul_seo].html

title='$isi ...'>$p[judul]</a> ($p[dibaca])</li>";

}

?>

</ul>

</div>

</span>

</div>

 <div class="panel" id="panel2"

style="display: none;">

<span>

<div class="tips">

<ul>

<?php

$terkini=mysql_query("SELECT *

FROM berita ORDER BY id_berita DESC

LIMIT 7");

while($t=mysql_fetch_array($terkini)){

$isi_berita =

strip_tags($t['isi_berita']); // membuat paragraf




$isi =


per spasi kalimat


href=berita-$t[id_berita]-$t[judul_seo].html

title='$isi ...'>$t[judul]</a></li>";

}

?>

</ul>

</div>

</span>

</div>



<div class="panel" id="panel3" style="display: none;">

<span>

<div class="tips">

<ul>

<?php

$komentar=mysql_query("SELECT

* FROM berita,komentar

WHERE

komentar.id_berita=berita.id_berita

ORDER BY

id_komentar DESC LIMIT 7");

while($k=mysql_fetch_array($komentar)){

$isi_komentar =

strip_tags($k['isi_komentar']); // membuat

paragraf pada isi komentar dan mengabaikan

tag html

$isi =

substr($isi_komentar,0,200); // ambil sebanyak

200 karakter

$isi =

substr($isi_komentar,0,strrpos($isi," ")); //

potong per spasi kalimat


href='http://$k[url]'

target='_blank'><b>$k[nama_komentar]</b></

a>

pada <a href='berita-

$k[id_berita]-

$k[judul_seo].html#$k[id_komentar]' title='$isi

...'>$k[judul]</a></li>"; }

?>

</ul>

</div>

</span>

</div>



<div class="panel" id="panel4"

style="display: none;"> <span>

<div class="tips">

<ul>

<?php

$sebelum=mysql_query("SELECT

* FROM berita ORDER BY id_berita DESC

LIMIT 7");

while($s=mysql_fetch_array($sebelum)){

$isi_berita =

strip_tags($s['isi_berita']); // membuat paragraf




$isi =


per spasi kalimat

echo "<li

class='garisbawah'><a href='berita-

$s[id_berita]-$s[judul_seo].html' title='$isi ...'>$s[judul]</a></li>";

}

?>

</ul>

</div>

</span>

</div><br />

</div>

<div id="content-sebelumnya"> <?php

$p = new Paging2;

$batas = 4;

$posisi = $p->cariPosisi($batas);

// Tampilkan semua berita

$sql=mysql_query("select

count(komentar.id_komentar) as jml, judul,

judul_seo, jam,

berita.id_berita, hari, tanggal,

gambar, isi_berita

from berita left join komentar

on

berita.id_berita=komentar.id_berita

and aktif='Y'

group by berita.id_berita DESC

LIMIT $posisi,$batas");

while($r=mysql_fetch_array($sql)){

$tgl = tgl_indo($r[tanggal]);

echo "<table><tr><td>

<span class=tanggal>$r[hari], $tgl -

$r[jam] WIB</span><br />";

echo "<span class=judul><a

href=berita-$r[id_berita]-$r[judul_seo].html>$r[judul]</a></span><br

/>";

// Tampilkan hanya sebagian isi berita

$isi_berita =

htmlentities(strip_tags($r[isi_berita])); //

membuat paragraf pada isi berita dan

mengabaikan tag html

$isi = substr($isi_berita,0,220); // ambil

sebanyak 150 karakter

$isi = substr($isi_berita,0,strrpos($isi," "));

// potong per spasi kalimat

echo "$isi ... <a href=berita-$r[id_berita]-

$r[judul_seo].html>Selengkapnya</a>

(<b>$r[jml] komentar</b>)

</td></tr></table>

<hr color=#CCC noshade=noshade />";

}

?>

<?php

/* // Berita Sebelumnya (tampilkan 10

berita sebelumnya)

echo "<br /><img

src=$f[folder]/images/berita_sebelumnya1.jpg

><br />

<div class='tips'><ul>";

$sebelum=mysql_query("SELECT *

FROM berita ORDER BY id_berita DESC

LIMIT 8,10");

while($s=mysql_fetch_array($sebelum)){

$isi_berita =

strip_tags($s['isi_berita']); // membuat paragraf pada isi berita dan mengabaikan tag html



$isi =


per spasi kalimat

echo "<li><b><a

href='berita-$s[id_berita]-$s[judul_seo].html'

title='$isi ...'>$s[judul]</a></b></li>";

} echo "</div></ul><br />";

*/

// Galeri Foto (tampilkan 6

foto secara horizontal)

/* echo "<img

src='$f[folder]/images/galeri.jpg' /><br />";

// Tentukan kolom

$col = 3;

$g = mysql_query("SELECT * FROM

gallery ORDER BY id_gallery DESC LIMIT

6");

*/

echo "<div

class='tipsatas'><table><tr>";

$cnt = 0;

while ($w = mysql_fetch_array($g)) {

if ($cnt >= $col) {

echo "</tr><tr>";

$cnt = 0;

} $cnt++;

echo "<td align=center

valign=top><br />

<a id='galeri'

href='img_galeri/$w[gbr_gallery]'

title='$w[keterangan]'>

<img alt='galeri'

src='img_galeri/kecil_$w[gbr_gallery]'

/></a><br />

<a id='galeri'

href='img_galeri/$w[gbr_gallery]' title='$w[keterangan]'><b>$w[jdl_gallery]</b

></a></td>";

}

echo "</tr></table></div>";

?>

</div>

<div id="sidebar2">

<div id="kotakjudul2">

<span

class="judulhead">Login</span>

</div>

<div id="kotakisi2">

<table cellpadding="2"

width="100%" border="0" cellspacing="4">

<tbody>

<?php

echo

'<form method="post"

action=proses_login.php>

<table><tr><td><label>Username </lab

el></td><td><input type="text"

name="username" size="17"/><p></td></tr>

<tr><td><label

>Password </label></td><td><input

type="password" name="password" size="17"

/></td></tr>

<tr><td colspan=2 align=right><input type="submit" value="Login"

/></td></tr></table></form>';

?>

</tbody>

</table>

</div>

<div

id="kotakjudul3">

<span

class="judulhead">Agenda</span>

</div>

<div id="kotakisi3">

<table cellpadding="2"

width="100%" border="0" cellspacing="4">

<tbody>

<?php

$agenda=mysql_query("SELECT

* FROM agenda ORDER BY id_agenda

DESC LIMIT 3");

while($a=mysql_fetch_array($agenda)){

$tgl_agenda = tgl_indo($a[tgl_mulai]);

echo "<tr><td

class='tanggal'>• $tgl_agenda</td></tr>

<tr><td

class='garisbawah'><a href=agenda-

$a[id_agenda]-$a[tema_seo].html>

$a[tema]</a></td></tr>";

}

?>

</tbody>

</table> </div>

</div>

</div> 

<?php /*

<div id="kotakjudul">

<span class="judulhead">Kategori

Berita</span>

</div>

<div id="kotakisi">

<table cellpadding="2" width="100%"

border="0" cellspacing="4">

<tbody>

<div class="tips">

<ul>

<?php

$kategori=mysql_query("SELECT

nama_kategori, kategori.id_kategori,

kategori_seo,

COUNT(berita.id_kategori) AS jml

FROM kategori

LEFT JOIN berita

ON

berita.id_kategori=kategori.id_kategori

WHERE

kategori.aktif='Y'

GROUP BY

nama_kategori");

while($k=mysql_fetch_array($kategori)){

$nama_kategori=strtoupper($k[nama_kategori]

);


href=kategori-$k[id_kategori]-

$k[kategori_seo].html title='Ada $k[jml] berita

pada kategori $k[nama_kategori]'>

$nama_kategori</a></li>";

}

?>

</ul>

</div>

</tbody>

</table>

</div><br /> <!-- / end kategori berita -

->

<div id="kotakjudul">

<span

class="judulhead">Download</span>

</div>

<div id="kotakisi">

<table cellpadding="2" width="100%" border="0" cellspacing="4">

<tbody>

<div class="tips">

<ul>

<?php

$download=mysql_query("SELECT * FROM

download ORDER BY id_download DESC

LIMIT 5");

while($d=mysql_fetch_array($download)){


href='downlot.php?file=$d[nama_file]'

title='Sudah didownload sebanyak $d[hits]

kali'>$d[judul]</a></li>";

}

?>

</ul>

</div>

</tbody>

</table>

</div><br /> 

*/ ?>

<?php

}

elseif ($_GET['module']=='tes'){

echo "tes";

}

elseif ($_GET['module']=='detailberita'){

echo "<div id='content'>

<div id='content-detail'>";

$detail=mysql_query("SELECT *

FROM berita,users,kategori

WHERE

users.username=berita.username

AND

kategori.id_kategori=berita.id_kategori

AND id_berita='$_GET[id]'");

$d = mysql_fetch_array($detail);

$tgl = tgl_indo($d[tanggal]);

$baca = $d[dibaca]+1; echo "<span class=tanggal><img

src=$f[folder]/images/clock.gif> $d[hari], $tgl

- $d[jam] WIB</span><br />";

echo "<span

class=judul>$d[judul]</span><br />";

echo "<span class=posting>Diposting

oleh : <b>$d[nama_lengkap]</b><br />

Kategori: <a href=kategori-

$d[id_kategori]-

$d[kategori_seo].html><b>$d[nama_kategori]

</b></a>

- Dibaca: <b>$baca</b> kali</span><br

/>";

// Apabila ada gambar dalam berita,

tampilkan

if ($d[gambar]!=''){

echo "<p><span

class=image><img

src='foto_berita/medium_$d[gambar]'

border=0></span></p>";

}

//$isi_berita=nl2br($d[isi_berita]); //

membuat paragraf pada isi berita echo "$d[isi_berita] <br />";

// Tampilkan judul berita yang terkait (maks:

5)

echo "<img

src=$f[folder]/images/berita_terkait.jpg><br

/><ul>";

// pisahkan kata per kalimat lalu hitung

jumlah kata

$pisah_kata = explode(",",$d[tag]); $jml_katakan = (integer)count($pisah_kata);

$jml_kata = $jml_katakan-1;

$ambil_id = substr($_GET[id],0,4);

// Looping query sebanyak jml_kata

$cari = "SELECT * FROM berita WHERE

(id_berita<'$ambil_id') and

(id_berita!='$ambil_id') and (" ;

for ($i=0; $i<=$jml_kata; $i++){

$cari .= "tag LIKE '%$pisah_kata[$i]%'";

if ($i < $jml_kata ){

$cari .= " OR ";

}

}

$cari .= ") ORDER BY id_berita DESC

LIMIT 5";

$hasil = mysql_query($cari);

while($h=mysql_fetch_array($hasil)){

echo "<li><a href=berita-

$h[id_berita]-

$h[judul_seo].html>$h[judul]</a></li>"; }

echo "</ul>";

// Apabila detail berita dilihat, maka

tambahkan berapa kali dibacanya

mysql_query("UPDATE berita SET

dibaca=$d[dibaca]+1

WHERE id_berita='$_GET[id]'");

// Hitung jumlah komentar $komentar = mysql_query("select

count(komentar.id_komentar) as jml from

komentar WHERE id_berita='$_GET[id]'

AND aktif='Y'");

$k = mysql_fetch_array($komentar);

echo "<span class=judul><b>$k[jml]</b>

Komentar : </span><br /><hr color=#CCC

noshade=noshade />";

// Paging komentar

$p = new Paging7;

$batas = 10;


// Komentar berita

$sql = mysql_query("SELECT * FROM

komentar WHERE id_berita='$_GET[id]'

AND aktif='Y' LIMIT $posisi,$batas");

$jml = mysql_num_rows($sql);

// Apabila sudah ada komentar, tampilkan

if ($jml > 0){

while ($s = mysql_fetch_array($sql)){

$tanggal = tgl_indo($s[tgl]); // Apabila ada link website diisi, tampilkan

dalam bentuk link

if ($s[url]!=''){

echo "<span class=komentar><a

name=$s[id_komentar]

id=$s[id_komentar]><a href='http://$s[url]'

target='_blank'>$s[nama_komentar]</a></a></

span><br />";

}

else{

echo "<span class=komentar>$s[nama_komentar]</span><

br />";

}

echo "<span

class=tanggal>$tanggal - $s[jam_komentar]

WIB</span><br /><br />";

$isian=nl2br($s[isi_komentar]); //

membuat paragraf pada isi komentar

$isikan=sensor($isian);

echo autolink($isikan);

echo "<hr color=#CCC noshade=noshade

/>";

}

$jmldata =

mysql_num_rows(mysql_query("SELECT *

FROM komentar WHERE

id_berita='$_GET[id]' AND aktif='Y'"));

$jmlhalaman = $p-

>jumlahHalaman($jmldata, $batas);

$linkHalaman = $p->navHalaman($_GET['halkomentar'],

$jmlhalaman);

echo "$linkHalaman";

}

// Form komentar

echo "<br /><br /><b>Isi Komentar :</b>

<table width=100% style='border: 1pt

dashed #0000CC;padding: 10px;'>

<form name='form' action=simpan-

komentar.html method=POST onSubmit=\"return validasi(this)\">

<input type=hidden name=id

value=$_GET[id]>

<tr><td>Nama</td><td> : <input

type=text name=nama_komentar size=40

maxlength=50></td></tr>

<tr><td>Website</td><td> : <input

type=text name=url size=40


<tr><td valign=top>Komentar</td><td>

<textarea name='isi_komentar' style='width:

300px; height: 100px;'></textarea></td></tr>

<tr><td> </td><td><img

src='captcha.php'></td></tr>

<tr><td> </td><td>(Masukkan 6

kode diatas)<br /><input type=text name=kode

size=6 maxlength=6><br /></td></tr>

<tr><td> </td><td><input

type=submit name=submit

value=Kirim></td></tr>

</form></table><br />"; echo "</div>

</div>";

}

elseif($_GET['module']== 'simpankomentar') {



include "config/koneksi.php";

include "config/library.php";

$nama=trim($_POST['nama_komentar']); $komentar=trim($_POST['isi_komentar']);

if (empty($nama)){

echo "<center>Anda belum mengisikan

NAMA<br />

<a href=javascript:history.go(-

1)><b>Ulangi Lagi</b>";

}

elseif (empty($komentar)){


KOMENTAR<br />



}

elseif (strlen($_POST['isi_komentar']) > 1000)

{

echo "<center>KOMENTAR Anda terlalu

panjang, kurangi atau dibagi jadi beberapa

bagian.<br />



}

else{ function antiinjection($data){

$filter_sql =

mysql_real_escape_string(stripslashes(strip_ta

gs(htmlspecialchars($data,ENT_QUOTES))));

return $filter_sql;

}

$nama_komentar =

antiinjection($_POST['nama_komentar']);

$url = antiinjection($_POST['url']);

$isi_komentar = antiinjection($_POST['isi_komentar']);

if(!empty($_POST['kode'])){

if($_POST['kode']==$_SESSION['cap

tcha_session']){

// Mengatasi input komentar tanpa spasi

$split_text = explode(" ",$isi_komentar);

$split_count = count($split_text);

$max = 57;

for($i = 0; $i <= $split_count; $i++){

if(strlen($split_text[$i]) >= $max){

for($j = 0; $j <= strlen($split_text[$i]); $j++){

$char[$j] = substr($split_text[$i],$j,1);

if(($j % $max == 0) && ($j != 0)){

$v_text .= $char[$j] . ' ';

}else{

$v_text .= $char[$j];

}

}

}else{ $v_text .= " " . $split_text[$i] . " ";

}

}

$sql = mysql_query("INSERT INTO

komentar(nama_komentar,url,isi_komentar,id_

berita,tgl,jam_komentar)

VALUES('$nama_komentar','$url','$v_text','$_

POST[id]','$tgl_sekarang','$jam_sekarang')");

echo "<meta http-equiv='refresh' content='0;

url=berita-$_POST[id].html'>";

}else{

echo

"<center>Kode yang Anda masukkan tidak

cocok<br />

<a

href=javascript:history.go(-1)><b>Ulangi

Lagi</b></a>";

}

}else{

echo "<center>Anda belum

memasukkan kode<br />


1)><b>Ulangi Lagi</b></a>";

}

}

echo "</div></div>";

}

// Modul berita per kategori

elseif ($_GET['module']=='detailkategori'){ echo "<div id='content'>


// Tampilkan nama kategori

$sq = mysql_query("SELECT nama_kategori

from kategori where

id_kategori='$_GET[id]'");

$n = mysql_fetch_array($sq);

echo "<span class=judul_head>»

Kategori :

<b>$n[nama_kategori]</b></span><br /><br

/>";

$p = new Paging3;

$batas = 6;


// Tampilkan daftar berita sesuai dengan

kategori yang dipilih

$sql = "SELECT * FROM berita

WHERE id_kategori='$_GET[id]'

ORDER BY id_berita DESC LIMIT

$posisi,$batas";

$hasil = mysql_query($sql);

$jumlah = mysql_num_rows($hasil);

// Apabila ditemukan berita dalam

kategori

if ($jumlah > 0){

while($r=mysql_fetch_array($hasil)){


echo "<table><tr><td><span

class=tanggal><img

src=$f[folder]/images/clock.gif> $r[hari], $tgl -

$r[jam] WIB</span><br />"; echo "<span class=judul><a

href=berita-$r[id_berita]-

$r[judul_seo].html>$r[judul]</a></span><br

/>";

// Apabila ada gambar dalam

berita, tampilkan

if ($r[gambar]!=''){

echo "<span

class=image><img

src='foto_berita/small_$r[gambar]' width=110

border=0></span>"; }


$isi_berita =

htmlentities(strip_tags($r[isi_berita])); //





$isi = substr($isi_berita,0,strrpos($isi," ")); //

potong per spasi kalimat



<br /></td></tr></table><hr

color=#CCC noshade=noshade />";

}

$jmldata =


FROM berita WHERE

id_kategori='$_GET[id]'"));

$jmlhalaman = $p-

>jumlahHalaman($jmldata, $batas); $linkHalaman = $p-

>navHalaman($_GET[halkategori],

$jmlhalaman);

echo "Hal: $linkHalaman";

}

else{

echo "Belum ada berita pada kategori ini.";

}

echo "</div>

</div>"; }

// Modul detail agenda

elseif ($_GET['module']=='detailagenda'){




FROM agenda

WHERE

id_agenda='$_GET[id]'");


$tgl_posting = tgl_indo($d[tgl_posting]);

$tgl_mulai = tgl_indo($d[tgl_mulai]);

$tgl_selesai = tgl_indo($d[tgl_selesai]);

$isi_agenda=nl2br($d[isi_agenda]);

echo "<span

class=judul>$d[tema]</span><br />";

echo "<span class=tanggal>Diposting

tanggal: $tgl_posting</span><br /><br />";

echo "<b>Topik</b> : $isi_agenda

<br />"; echo "<b>Tanggal</b> : $tgl_mulai

s/d $tgl_selesai <br /><br />";

echo "<b>Tempat</b> : $d[tempat]

<br /><br />";

echo "<b>Pukul</b> : $d[jam] <br

/><br />";

echo "<b>Pengirim (Contact

Person)</b> : $d[pengirim] <br />";

echo "</div>

</div>"; }

// Modul hasil pencarian berita

elseif ($_GET['module']=='hasilcari'){




<b>Hasil Pencarian</b></span><br />";

// menghilangkan spasi di kiri dan kanannya

$kata = trim($_POST['kata']);

// mencegah XSS

$kata = htmlentities(htmlspecialchars($kata),

ENT_QUOTES);

// pisahkan kata per kalimat lalu hitung

jumlah kata

$pisah_kata = explode(" ",$kata);

$jml_katakan = (integer)count($pisah_kata);

$jml_kata = $jml_katakan-1;

$cari = "SELECT * FROM berita WHERE " ;

for ($i=0; $i<=$jml_kata; $i++){ $cari .= "judul OR isi_berita LIKE

'%$pisah_kata[$i]%'";

if ($i < $jml_kata ){

$cari .= " OR ";

}

}

$cari .= " ORDER BY id_berita DESC

LIMIT 7";

$hasil = mysql_query($cari);

$ketemu = mysql_num_rows($hasil);

if ($ketemu > 0){

echo "<p>Ditemukan <b>$ketemu</b>

berita dengan kata <font style='background-

color:#00FFFF'><b>$kata</b></font> : </p>";

while($t=mysql_fetch_array($hasil)){

echo "<table><tr><td><span

class=judul><a href=berita-$t[id_berita]-

$t[judul_seo].html>$t[judul]</a></span><br

/>";


$isi_berita =

htmlentities(strip_tags($t[isi_berita])); //







echo "$isi ... <a href=berita-$t[id_berita]-

$t[judul_seo].html>Selengkapnya</a>

<br /></td></tr> </table><hr color=#CCC


}

}

else{

echo "<p></p><p align=center>Tidak

ditemukan berita dengan kata

<b>$kata</b></p>";

}

echo "</div> </div>";

}

// Modul hasil poling

elseif ($_GET['module']=='hasilpoling'){



if (isset($_COOKIE["poling"])) {

echo "Sorry, anda sudah pernah melakukan

voting terhadap poling ini.";

}

else{

// membuat cookie dengan nama poling

// cookie akan secara otomatis terhapus dalam

waktu 24 jam

setcookie("poling", "sudah poling", time() +

3600 * 24);


<b>Hasil Poling</b></span><br /><br />";

$u=mysql_query("UPDATE poling SET rating=rating+1 WHERE

id_poling='$_POST[pilihan]'");

echo "<p align=center>Terimakasih atas

partisipasi Anda mengikuti poling kami<br

/><br />

Hasil poling saat ini: </p><br />";

echo "<table width=100% style='border: 1pt

dashed #0000CC;padding: 10px;'>";

$jml=mysql_query("SELECT SUM(rating) as

jml_vote FROM poling WHERE aktif='Y'");

$j=mysql_fetch_array($jml);

$jml_vote=$j[jml_vote];

$sql=mysql_query("SELECT * FROM poling

WHERE aktif='Y' and status='Jawaban'");

while ($s=mysql_fetch_array($sql)){

$prosentase =

sprintf("%2.1f",(($s[rating]/$jml_vote)*100));

$gbr_vote = $prosentase * 3;

echo "<tr><td width=120>$s[pilihan]

($s[rating]) </td><td>

<img src=$f[folder]/images/blue.png

width=$gbr_vote height=18 border=0>

$prosentase %

</td></tr>";

}

echo "</table> <p>Jumlah Voting:

<b>$jml_vote</b></p>";

}

echo "</div>

</div>";

}

// Modul hasil poling

elseif ($_GET['module']=='lihatpoling'){

echo "<div id='content'> <div id='content-detail'>";


<b>Hasil Poling</b></span><br /><br />";

echo "<p align=center>Terimakasih atas

partisipasi Anda mengikuti poling kami<br

/><br />

Hasil poling saat ini: </p><br />";


dashed #0000CC;padding: 10px;'>";

$jml=mysql_query("SELECT SUM(rating) as

jml_vote FROM poling WHERE aktif='Y'");

$j=mysql_fetch_array($jml);

$jml_vote=$j[jml_vote];

$sql=mysql_query("SELECT * FROM poling

WHERE aktif='Y' and status='Jawaban'");

while ($s=mysql_fetch_array($sql)){

$prosentase =

sprintf("%2.1f",(($s[rating]/$jml_vote)*100));

$gbr_vote = $prosentase * 3;

echo "<tr><td width=120>$s[pilihan]

($s[rating]) </td><td>

<img src=$f[folder]/images/blue.png

width=$gbr_vote height=18 border=0>

$prosentase %

</td></tr>";

} echo "</table>

<p>Jumlah Voting:

<b>$jml_vote</b></p>";

echo "</div>

</div>";

}

// Menu utama di header

// Modul profil

elseif ($_GET['module']=='profilkami'){




<b>Profil</b></span><br /><br />";

$profil = mysql_query("SELECT *

FROM modul WHERE id_modul='37'");

$r = mysql_fetch_array($profil);

echo "<tr><td class=isi>";

if ($r[gambar]!=''){

echo "<span class=image><img

src='foto_banner/$r[gambar]'></span>";

}

echo "$r[static_content]";

echo "</div>

</div>";

}

// Modul halaman statis

elseif ($_GET['module']=='halamanstatis'){



FROM halamanstatis

WHERE

id_halaman='$_GET[id]'");



echo "<span

class=judul>$d[judul]</span><br />";

echo "<span class=tanggal>Diposting

tanggal: $tgl_posting</span><br /><br />";

if ($d[gambar]!=''){

echo "<span

class=image><img

src='foto_banner/$d[gambar]'></span>";

}

echo "$d[isi_halaman] <br />";

echo "</div>

</div>";

}

// Modul semua berita

elseif ($_GET['module']=='semuaberita'){




<b>Berita</b></span><br /><br />";

$p = new Paging2;

$batas = 12;


// Tampilkan semua berita $sql=mysql_query("select

count(komentar.id_komentar) as jml, judul,

judul_seo, jam,

berita.id_berita, hari, tanggal,

gambar, isi_berita

from berita left join komentar

on

berita.id_berita=komentar.id_berita

and aktif='Y'

group by berita.id_berita DESC




echo "<table><tr><td>

<span class=tanggal>$r[hari], $tgl -

$r[jam] WIB</span><br />";

echo "<span class=judul><a

href=berita-$r[id_berita]-

$r[judul_seo].html>$r[judul]</a></span><br

/>";


$isi_berita =

htmlentities(strip_tags($r[isi_berita])); // membuat paragraf pada isi berita dan








(<b>$r[jml] komentar</b>)

</td></tr></table> <hr color=#CCC noshade=noshade />";

}

$jmldata =


FROM berita"));

$jmlhalaman = $p-


$linkHalaman = $p-

>navHalaman($_GET[halberita],

$jmlhalaman);

echo "Hal: $linkHalaman <br /><br />";

echo "</div>

</div>";

}

// Modul semua agenda

elseif ($_GET['module']=='semuaagenda'){




<b>Agenda</b></span><br /><br />"; $p = new Paging4;

$batas = 6;


// Tampilkan semua agenda

$sql = mysql_query("SELECT *

FROM agenda

ORDER BY id_agenda DESC


while($d=mysql_fetch_array($sql)){


$tgl_mulai = tgl_indo($d[tgl_mulai]); $tgl_selesai = tgl_indo($d[tgl_selesai]);

$isi_agenda = nl2br($d[isi_agenda]);

echo "<table>";

echo "<tr><td

colspan=2><span

class=tanggal>$tgl_posting</span></td></tr>"

;

echo "<tr><td colspan=2><span

class=judul>$d[tema]</span></td></tr>";

echo "<tr><td

valign=top><b>Topik</b> </td><td> :

$isi_agenda </td></tr>";

echo "<tr><td><b>Tanggal</b>

</td><td> : $tgl_mulai s/d $tgl_selesai

</td></tr>";

echo "<tr><td><b>Pukul</b>

</td><td> : $d[jam] </td></tr>";

echo "<tr><td><b>Tempat</b>

</td><td> : $d[tempat] </td></tr>";

echo "<tr><td><b>Pengirim</b>

</td><td> : $d[pengirim] </td></tr></table><hr color=#CCC


}

$jmldata =


FROM agenda"));

$jmlhalaman = $p-


$linkHalaman = $p-

>navHalaman($_GET[halagenda], $jmlhalaman);


echo "</div>

</div>";

}

// Modul semua download

elseif ($_GET['module']=='semuadownload'){




<b>Download</b></span><br /><br />";

$p = new Paging5;

$batas = 20;


// Tampilkan semua download

$sql = mysql_query("SELECT *

FROM download

ORDER BY id_download DESC


echo "<ul>";

while($d=mysql_fetch_array($sql)){

echo "<li><a

href='downlot.php?file=$d[nama_file]'>$d[jud

ul]</a> ($d[hits])</li>";

}

echo "</ul><hr color=#CCC


$jmldata =

mysql_num_rows(mysql_query("SELECT * FROM download"));

$jmlhalaman = $p-


$linkHalaman = $p-

>navHalaman($_GET[haldownload],

$jmlhalaman);


echo "</div>

</div>";

}

// Modul semua album

elseif ($_GET['module']=='semuaalbum'){




<b>Album</b></span><br />";

// Tentukan kolom

$col = 3;

$a = mysql_query("SELECT jdl_album, album.id_album, gbr_album, album_seo,

COUNT(gallery.id_gallery) as

jumlah

FROM album LEFT JOIN gallery

ON

album.id_album=gallery.id_album

WHERE album.aktif='Y'

GROUP BY jdl_album");

echo "<table><tr>";

$cnt = 0;

while ($w = mysql_fetch_array($a)) { if ($cnt >= $col) {

echo "</tr><tr>";

$cnt = 0;

}

$cnt++;

echo "<td align=center valign=top><br />

<a href=album-$w[id_album]-

$w[album_seo].html>

<img class='img2'

src='img_album/kecil_$w[gbr_album]'

border=0 width=120 height=90><br />

$w[jdl_album]</a><br />($w[jumlah]

Foto)<br /></td>";

}

echo "</tr></table>";

echo "</div>

</div>";

}

// Modul galeri foto berdasarkan album

elseif ($_GET['module']=='detailalbum'){



echo "<span class=judul_head>» <a

href=semua-album.html><b>Album</b></a>

» <b>Galeri Foto</b></span><br />";

$p = new Paging6;

$batas = 10;


// Tentukan kolom

$col = 5;

$g = mysql_query("SELECT * FROM

gallery WHERE id_album='$_GET[id]'

ORDER BY id_gallery DESC LIMIT

$posisi,$batas");

$ada = mysql_num_rows($g);

if ($ada > 0) {

echo "<table><tr>";

$cnt = 0;

while ($w = mysql_fetch_array($g)) {

if ($cnt >= $col) {

echo "</tr><tr>";

$cnt = 0;

}

$cnt++;

echo "<td align=center valign=top><br />

<a id='galeri'

href='img_galeri/$w[gbr_gallery]'

title='$w[keterangan]'> <img alt='galeri'

src='img_galeri/kecil_$w[gbr_gallery]'

/></a><br />

<a

href=#><b>$w[jdl_gallery]</b></a></td>";

}

echo "</tr></table><br />";

$jmldata =


FROM gallery WHERE id_album='$_GET[id]'"));

$jmlhalaman = $p-


$linkHalaman = $p-

>navHalaman($_GET[halgaleri],

$jmlhalaman);


}else{

echo "<p>Belum ada foto.</p>";

}

echo "</div>

</div>";

}

// Modul hubungi kami

elseif ($_GET['module']=='hubungikami'){




<b>Hubungi Kami</b></span><br /><br /><br />";

echo

"<b> Inter

national Islamic University College (STMIK

Islam Internasional)</b><br />";


;padding: 10px;'>

<tr><td>Alamat</td><td>Jl. Melawai

Raya No.8c Blok M Kebayoran Baru

Jakarta</td></tr>

<tr><td>Telepon</td><td>[021] 7251885</td></tr>

<tr><td>Faksimil</td><td>[021]

7406757</td></tr>

<tr><td>Email</td><td>[email protected]

.id, [email protected] </td></tr>

</table>";

echo

"<b> Yaya

san Universitas Antarabangsa</b><br />";

echo "<table width=100%

style='border: 1pt ;padding: 10px;'>

<tr><td>Alamat</td><td>Jl. Melawai

Raya No.8c Blok M Kebayoran Baru

Jakarta</td></tr>

<tr><td>Telepon</td><td>[021]

7251885</td></tr>

<tr><td>Faksimil</td><td>[021]

7406757</td></tr>

<tr><td>Email</td><td>[email protected], [email protected]

</td></tr>

</table>";

echo

"<b> Inter

national Islamic College</b><br />";

echo "<table width=100%

style='border: 1pt ;padding: 10px;'>

<tr><td>Alamat</td><td>No.1 Jalan

31/10A Taman Batu Muda 61800 Kuala

Lumpur Malaysia</td></tr> <tr><td>Telepon</td><td>03-

61876900</td></tr>

<tr><td>Faksimil</td><td>03-

61888200</td></tr>

<tr><td>Email</td><td>admission@i

ic.edu.my </td></tr>

</table>";

echo "<b>Hubungi kami secara online

dengan mengisi form dibawah ini:</b><br

/><br />";


dashed #0000CC;padding: 10px;'>

<form action=hubungi-aksi.html

method=POST>

<tr><td>Nama</td><td> : <input

type=text name=nama size=40></td></tr>

<tr><td>Email</td><td> : <input

type=text name=email size=40></td></tr>

<tr><td>Subjek</td><td> : <input type=text name=subjek size=55></td></tr>

<tr><td valign=top>Pesan</td><td>

<textarea name=pesan style='width: 315px;

height: 100px;'></textarea></td></tr>

<tr><td> </td><td><img


<tr><td> </td><td>(Masukkan 6

kode diatas)<br /><input type=text name=kode

size=6 maxlength=6><br /></td></tr>

</td><td colspan=2><input type=submit

name=submit value=Kirim></td></tr> </form></table><br />";

echo "</div>

</div>";

}

// Modul hubungi aksi

elseif ($_GET['module']=='hubungiaksi'){



$nama=trim($_POST[nama]);

$email=trim($_POST[email]);

$subjek=trim($_POST[subjek]);

$pesan=trim($_POST[pesan]);

if (empty($nama)){

echo "Anda belum mengisikan NAMA<br />



}

elseif (empty($email)){

echo "Anda belum mengisikan EMAIL<br />

<a href=javascript:history.go(-1)><b>Ulangi Lagi</b>";

}

elseif (empty($subjek)){

echo "Anda belum mengisikan SUBJEK<br

/>



}

elseif (empty($pesan)){

echo "Anda belum mengisikan PESAN<br />

<a href=javascript:history.go(-1)><b>Ulangi Lagi</b>";

}

else{



tcha_session']){

mysql_query("INSERT INTO hubungi(nama,

email,

subjek,

pesan,

tanggal)

VALUES('$_POST[nama]',

'$_POST[email]',

'$_POST[subjek]',

'$_POST[pesan]',

'$tgl_sekarang')");

echo "<span class=posting>»

<b>Hubungi Kami</b></span><br /><br />";

echo "<p align=center><b>Terimakasih telah

menghubungi kami. <br /> Kami akan segera

meresponnya.</b></p>"; }else{

echo "Kode yang

Anda masukkan tidak cocok<br />

<a


Lagi</b></a>";

}

}else{

echo "Anda belum


<a href=javascript:history.go(-1)><b>Ulangi Lagi</b></a>";

}

}

echo "</div>

</div>";

}

//modul registrasi

elseif($_GET['module']=='homependaftaran'){



echo "<center><h3><b>Selamat

Datang Di Pendaftaran Online

Mahasiswa</b><br> <br>

STMIK ISLAM INTERNASIONAL

JAKARTA<br> <br>

</h3>";

echo "<a href='pendaftaran-

online.html'><img

src='$f[folder]/images/daftar.gif'></a>";

echo "<a href='konfirmasi.html'><img

src='$f[folder]/images/konfirmasi.gif'></a>";


}

elseif($_GET['module']=='registrasi'){



include

"mod_registrasi/registrasi.php";


}

elseif($_GET['module']== 'sukses') {



$e=mysql_query("SELECT

id_data_pribadi, nama_lengkap FROM

data_pribadi

ORDER BY id_data_pribadi

DESC LIMIT 1");

$f = mysql_fetch_array($e);

$data = $_POST["[id_data_pribadi]"];

echo "<center>Nomor Registrasi anda

: ".$f['id_data_pribadi']." <br> Nama Calon

Mahasiswa : ".$f['nama_lengkap']. "<br>";

echo

"<center><h3><b><br><br>Terima Kasih

Telah Melakukan Registrasi..!<br>";

echo "Silahkan Melakukan

Pembayaran dan Konfirmasi ke Petugas

Pendaftaran IIUC<br>";

echo "<a href='media.php?module=halamanstatis&id=1

0'>Alur Pendaftaran</a>";

echo " | ";

echo "<a

href='media.php?module=halamanstatis&id=2

3'>Informasi Pendaftaran</a>";

echo "<img

src='$f[folder]/images/salam1.jpg'>";

$data_id = $_GET[id_data_pribadi];

//echo "<a

href=\"../../web_iiuc/fpdf/fpdf_database.php?id_data_pribadi=$data_id\"

target=\"_blank\">Cetak Kartu

Ujian</a></b></center></h3>";


}

elseif($_GET['module']== 'cetakkartu') {



$sesiku = $_SESSION['namalengkap1'];

$id_user = $_SESSION['id_data_pribadi'];

if(isset($sesiku))

{

$c=mysql_query("SELECT

id_data_pribadi FROM data_pribadi WHERE

id_data_pribadi = $id_user

ORDER BY id_data_pribadi

DESC LIMIT 1");

$f = mysql_fetch_array($c);

echo "<h3><center>Cetak Kartu Ujian</h3> <br>";

echo "<center>Selamat datang

<h2>$sesiku</h2> di Halaman Cetak Kartu

Ujian <br>";

echo "<center>Silahkan klik link

dibawah ini Untuk mencetak kartu <br><br>";

//$replace = str_replace(' ', '+',

$f['id_data_pribadi']);

$data_id =

encrypted($f['id_data_pribadi']);

echo "<center><a href=\"../../web_iiuc/fpdf/fpdf_database.php?id

_data_pribadi=$data_id\"

target=\"_blank\">Cetak Kartu

Ujian</a><br><br>";

echo '<right><a

href="logout.php">LOGOUT</a>';

}

else

{

echo 'Anda Belum Login <a

href="http://localhost/web_iiuc/index.php">Lo

gin</a> Dulu';

}


}

elseif($_GET['module']== 'logingagal') {



echo "<center>LOGIN GAGAL! <br>

Username atau Password Anda tidak benar.<br>

Atau account Anda sedang diblokir.<br>

";

echo "<div id='content-button-login'>";

echo "<center><a

href='index.php'><img

src='$f[folder]/images/login2.jpg'></a></p>";

//echo "<p align='center'><a

href='index.php'><img

src='$f[folder]/images/icon_support.gif'></a><

/p>"; //echo "<a href=index.php><b>ULANGI

LAGI</b></a></center>";

echo "</div></div></div>";

}

elseif($_GET['module']== 'logout') {



$sesiku = $_SESSION['namalengkap1'];

if(isset($sesiku))

{

unset($_SESSION[id_data_pribadi]);

unset($_SESSION[namauser1]);

unset($_SESSION[namalengkap1]);

unset($_SESSION[passuser1]);

// session_destroy();

include "index.php";


}

}

elseif($_GET['module']== 'konfirmasi') {


echo "<center><h3>Formulir

Konfirmasi Pembayaran<br> <br>

Pendaftaran Online Mahasiswa Baru <br>

<br>

STMIK ISLAM INTERNASIONAL

JAKARTA</h3><br> <br>";

echo "

<table width=100%>

<form name='form' action=konfirmasi-

aksi.html method=POST onSubmit=\"return validasi(this)\">

<input type=hidden name=id

value=$_GET[id]>

<tr><td align=right>Nomor

Registrasi</td><td> : <input type=text

name=no_registrasi size=40


<tr><td align=right>Nomor

Rekening</td><td> : <input type=text

name=no_rekening size=40


<tr><td align=right>Atas Nama

Rekening</td><td> : <input type=text

name=atas_nama size=40


<tr><td align=right>Transfer

Via</td><td> : <select name=transfer_via

><option value=''></option> <option

value='ATM' >ATM</option> <option

value='Bank'>Bank</option><option

value='Internet Banking'>Internet

Banking</option> <option value='Mobile

Banking'>Mobile Banking</option></select></td></tr>

<tr><td>  </td><td>&nb

sp;  <img


<tr><td>  </td><td> &nbs

p; (Masukkan 6 kode diatas)<br

/>   <input type=text

name=kode size=6 maxlength=6><br

/></td></tr>

<tr><td>  </td><td> &nbs

p; <input type=submit name=submit

value= Kirim Konfirmasi></td></tr>

</form></table><br />";


}

elseif($_GET['module']== 'konfirmasiaksi') {



include "config/koneksi.php";

include "config/library.php";

$no_registrasi=trim($_POST['no_registrasi']);

$rekening=$_POST['no_rekening'];

$atas_nama=trim($_POST['atas_nama']);

$transfer_via=trim($_POST['transfer_via']);

if (empty($no_registrasi)){


Nomor Registrasi Calon Mahasiswa<br /> <a href=javascript:history.go(-


}

elseif (empty($rekening)){


Nomor Rekening<br />



}

elseif (empty($atas_nama)){

echo "<center>Anda belum mengisikan Atas Nama Pemilik Rekening<br />



}

elseif (empty($transfer_via)){

echo "<center>Anda belum mengisikan Jenis

Transfer<br />



}

else{

function antiinjection($data){

$filter_sql =

mysql_real_escape_string(stripslashes(strip_ta

gs(htmlspecialchars($data,ENT_QUOTES))));

return $filter_sql;

}

$no_registrasi =

antiinjection($_POST['no_registrasi']);

$no_rekening =

antiinjection($_POST['no_rekening']);

$atas_nama = antiinjection($_POST['atas_nama']);

$transfer_via =

antiinjection($_POST['transfer_via']);



tcha_session']){

$sql = mysql_query("INSERT INTO konfirmasi(no_registrasi,no_rekening,atas_na

ma,transfer_via)

VALUES('$no_registrasi','$no_rekening','$atas

_nama','$transfer_via')");

// echo "<meta http-equiv='refresh'

content='0;

url=media.php?module=sukseskonfirmasi'>";

}else{

echo

"<center>Kode yang Anda masukkan tidak

cocok<br />

<a


Lagi</b></a>";

}

}else{

echo "<center>Anda belum



1)><b>Ulangi Lagi</b></a>"; }

header('location:media.php?module=sukseskon

firmasi');

}


}

elseif($_GET['module']== 'sukseskonfirmasi')

{


echo "<center><h3>Terima Kasih

Telah Melakukan Konfirmasi<br> <br>

Data yang anda masukkan telah terkirim

dan akan segera di proses<br> <br>

</h3>";

echo "<img

src='$f[folder]/images/salam1.jpg'>";


}

?>

Template.php

<?php

error_reporting(0);

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD

XHTML 1.0 Transitional//EN"

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

transitional.dtd">

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

<head>

<title><?php include "dina_titel.php";

?></title>

<meta http-equiv="Content-Type"

content="text/html; charset=utf-8" />

<meta name="robots" content="index,

follow">

<meta name="description" content="<?php

include "dina_meta1.php"; ?>"> <meta name="keywords" content="<?php

include "dina_meta2.php"; ?>">

<meta http-equiv="Copyright"

content="lokomedia">

<meta name="author" content="muhammad

iqbal">

<meta http-equiv="imagetoolbar"

content="no">

<meta name="language" content="Indonesia">

<meta name="revisit-after" content="7">

<meta name="webcrawlers" content="all">

<meta name="rating" content="general">

<meta name="spiders" content="all">

<link rel="shortcut icon" href="iiuc.jpg" />

<link rel="alternate"

type="application/rss+xml" title="RSS 2.0"

href="rss.xml" />

<link rel="stylesheet" href="<?php echo

"templates/eljquery/css/style.css" ?>"

type="text/css" />

<script src="<?php echo

"templates/eljquery/js/jquery-1.4.js" ?>"

type="text/javascript"></script>


"templates/eljquery/js/menu.js" ?>"



"templates/eljquery/js/jquery.tipsy.js" ?>"


<script type='text/javascript'> $(function($) {

$('.tips a').tipsy({fade: true, gravity:

'w'});

$('.tipsatas a').tipsy({fade: true,

gravity: 's'});

});

</script>

<script src="templates/eljquery/js/superfish.js"


} else {

return true;

}

}

function

checkRegexp(o,regexp,n) {

if ( !( regexp.test(

o.val() ) ) ) {

o.addClass('ui-state-error');

updateTips(n);

return

false;

} else {

return true;

}

}

$("#dialog").dialog({

bgiframe: true,

autoOpen: false,

height: 500,

width: 600,

modal: true,

buttons: {

'Confirm':

function() {

var bValid = true;

allFields.removeClass('ui-state-error');

bValid = bValid &&

checkLength(name,"name",3,16);

bValid = bValid &&

checkLength(tempat_lahir,"tempat_lahir",3,16)

;

bValid = bValid && checkLength(email,"email",6,80);

bValid = bValid &&

checkRegexp(name,/^[a-z]([0-9a-

z_])+$/i,"Username may consist of a-z, 0-9,

underscores, begin with a letter.");

//

From jquery.validate.js (by joern), contributed

by Scott Gonzalez: http://projects.scottsplayground.com/email_ad

dress_validation/

bValid = bValid &&

checkRegexp(email,/^((([a-z]|\d|[!#\$%&'\*\+\-

\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-

\uFDCF\uFDF0-\uFFEF])+(\.([a-

z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-

\uD7FF\uF900-\uFDCF\uFDF0-

\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))

?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-

\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-


\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-

\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-

\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x

09)+)?(\x22)))@((([a-z]|\d|[\u00A0-

\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-

z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-

\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-

\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-

z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-

\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-

\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-

z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-

\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-


\uFFEF])))\.?$/i,"eg. [email protected]");

if

(bValid) {

//$('#users tbody').append('<tr>' +

//'<td>' + name.val() + '</td>'

+

//'<td>' + tempat_lahir.val()

+ '</td>' +

//'<td>' + tanggal_lahir() +

'</td>' +

//'<td>' + jenis_kelamin.val()

+ '</td>' +

//'<td>' + email.val() +

'</td>' +

//'<td>' + alamat.val() +

'</td>' +

//'<td>' + no_telepon.val() +

'</td>' +

//

'</tr>');

document.form.submit();

$(this).dialog('close');

}

},

Cancel:

function() {

$(this).dialog('close');

}

},

close: function() {

allFields.val('').removeClass('ui-state-

error');

}

});

$('#create-

user').click(function() {

$('#dialog').dialog('open');

})

.hover(

function(){

$(this).addClass("ui-state-hover");

}, function(){

$(this).removeClass("ui-state-hover");

}

).mousedown(function(){

$(this).addClass("ui-state-active");

})

.mouseup(function(){

$(this).removeClass("ui-state-active");

});

});

</script>


src="<?php echo

"templates/eljquery/js/jquery.ketchup.js"

?>"></script>

<script type="text/javascript" src="<?php

echo

"templates/eljquery/js/jquery.ketchup.messages

.js" ?>"></script>


src="<?php echo

"templates/eljquery/js/jquery.ketchup.validatio

ns.basic.js" ?>"></script>


$(document).ready(function() {

$('#contoh').ketchup();

}); </script>

</head>

<body onload="startclock()">

<div id="container">

<div id="wrapper">

<div id="top">

<?php

/*<div class="logo"><a

href="index.php"><span>STMIK</span> IIUC JAKARTA</a></div> */?>



<ul

class="motto">

<li

class="left"> </li>

<li><span

id="date"></span>, <span id="clock"></span>

</li>

</ul> 

</div> 



<ul class="nav">

<li

class="left"> </li>

<?php

$main=mysql_query("SELECT * FROM mainmenu WHERE aktif='Y'");

while($r=mysql_fetch_array($main)){

echo "<li><a

href='$r[link]'>$r[nama_menu]</a>

<ul>";

$sub=mysql_query("SELECT *

FROM submenu, mainmenu

WHERE

submenu.id_main=mainmenu.id_main

AND submenu.id_main=$r[id_main]");

while($w=mysql_fetch_array($sub)){

echo "<li><a

href='$w[link_sub]'>»

$w[nama_sub]</a></li>";

}

echo "</ul>

</li>";

}

?>

<li

class="sep"> </li>

<li

class="right"> </li>

</ul>



<div id="header">

<div

class="intro">

<form

method="POST" id="searchform"

action="hasil-pencarian.html"> 

<div>

<input class="searchField" type="text"

name="kata" maxlength="50"

value="Pencarian..." onblur="if(this.value=='') this.value='Pencarian...';"

onfocus="if(this.value=='Pencarian...')

this.value='';" />

<input class="searchSubmit" type="submit"

value="" />

</div>

</form>

<div

class="rssicon">

<a

href="rss.xml" target="_blank"><img

src="<?php echo

"templates/eljquery/images/rss.png" ?>"

border="0" /></a> 

</div>

</div> 

</div> 



<?php

include "templates/eljquery/kiri.php";

?>



<div id="sidebar">

<h2>Info

Akademik</h2>

<ul id="listticker">

<?php

$sekilas=mysql_query("SELECT *

FROM sekilasinfo ORDER BY id_sekilas

DESC LIMIT 4");

while($s=mysql_fetch_array($sekilas)){

echo "<li><img

src='foto_info/kecil_$s[gambar]' width='54'

height='54' />

<span class='news-

text'>$s[info]</span></li>";

}

?>

</ul>

<?php /*

<h2>Statistik

User</h2>

<ul id="listsidebar">

$ip =

$_SERVER['REMOTE_ADDR']; //

Mendapatkan IP komputer user

$tanggal = date("Ymd"); //

Mendapatkan tanggal sekarang

$waktu = time(); //

// Mencek berdasarkan IPnya, apakah

user sudah pernah mengakses hari ini

$s = mysql_query("SELECT * FROM

statistik WHERE ip='$ip' AND tanggal='$tanggal'");

// Kalau belum ada, simpan data user

tersebut ke database

if(mysql_num_rows($s) == 0){

mysql_query("INSERT INTO

statistik(ip, tanggal, hits, online)

VALUES('$ip','$tanggal','1','$waktu')");

}

else{

mysql_query("UPDATE statistik

SET hits=hits+1, online='$waktu' WHERE

ip='$ip' AND tanggal='$tanggal'");

}

$pengunjung =


FROM statistik WHERE tanggal='$tanggal'

GROUP BY ip"));

$totalpengunjung =

mysql_result(mysql_query("SELECT

COUNT(hits) FROM statistik"), 0); $hits =

mysql_fetch_assoc(mysql_query("SELECT

SUM(hits) as hitstoday FROM statistik

WHERE tanggal='$tanggal' GROUP BY

tanggal"));

$totalhits =


SUM(hits) FROM statistik"), 0);

$tothitsgbr =


SUM(hits) FROM statistik"), 0); $bataswaktu = time() - 300;

$pengunjungonline =


FROM statistik WHERE online >

'$bataswaktu'"));

$path = "counter/";

$ext = ".png";

$tothitsgbr = sprintf("%06d",

$tothitsgbr);

for ( $i = 0; $i <= 9; $i++ ){

$tothitsgbr = str_replace($i,

"<img src='$path$i$ext' alt='$i'>", $tothitsgbr);

}

echo "<br /><p

align=center>$tothitsgbr </p>

<table>

<tr><td class='news-title'><img

src=counter/hariini.png> Pengunjung hari ini

</td><td class='news-title'> : $pengunjung

</td></tr> <tr><td class='news-title'><img

src=counter/total.png> Total pengunjung

</td><td class='news-title'> : $totalpengunjung

</td></tr>


src=counter/hariini.png> Hits hari ini </td><td

class='news-title'> : $hits[hitstoday] </td></tr>


src=counter/total.png> Total Hits </td><td

class='news-title'> : $totalhits </td></tr>

<tr><td class='news-title'><img src=counter/online.png> Pengunjung Online

</td><td class='news-title'> :

$pengunjungonline </td></tr>

</table>";

*/?>

</ul>

<?php /*

<h2>Polling</h2>


$tanya=mysql_query("SELECT *

FROM poling WHERE aktif='Y' and

status='Pertanyaan'");

$t=mysql_fetch_array($tanya);

echo "<br /><span class='news-

title'> $t[pilihan]</span><br /><br />";

echo "<form method=POST

action='hasil-poling.html'>";

$poling=mysql_query("SELECT *

FROM poling WHERE aktif='Y' and status='Jawaban'");

while

($p=mysql_fetch_array($poling)){

echo "<span class='news-

text'><input type=radio name=pilihan

value='$p[id_poling]' />$p[pilihan]</span><br

/>";

}

echo "<p align=center><input

type=submit value=vote /></p>

</form> <a href=lihat-poling.html><span

class='news-title2'>Lihat Hasil

Poling</span></a>";

*/ ?>

</ul><br />

<h2>Online

Support</h2>


<p align="center">

<span style="color: #000;">Admin

:</span><br/><a

href="ymsgr:sendIM?abay_or_qbell"><img

src="http://opi.yahoo.com/online?u=abay_or_q

bell&m=g&t=2" border="0"></a><br/>

<span style="color: #000;">Staff

Akademik:</span><br/><a

href="ymsgr:sendIM?shintabintiraf"><img

src="http://opi.yahoo.com/online?u=sintabintir

af&m=g&t=2" border="0"></a><br/>

<span style="color: #000;">Staff

Keuangan:</span><br/><a href="ymsgr:sendIM?taufikguntur"><img

src="http://opi.yahoo.com/online?u=taufikgunt

ur&m=g&t=2" border="0"></a>

</p></ul>

<h2>Partner</h2>


<?php

// Tampilkan banner $banner=mysql_query("SELECT *

FROM banner ORDER BY id_banner DESC

LIMIT 4");

while($b=mysql_fetch_array($banner)){

echo "<p align=center><a

href=$b[url] target='_blank' title='$b[judul]'>

<img

src='foto_banner/$b[gambar]'

border='0'></a></p>";

}

?>

</div> 



<div id="footer">

<div

class="foot_l"></div>

<div

class="foot_content">

<p>STMIK Islam International

Jakarta<br>

Jl. Melawai Raya No.8c Blok M Kebayoran

Baru Jakarta<br>

Tlp. [021] 7251885, Fax. [021] 7406757 |

Email: [email protected],

[email protected] </p>

</div>

<div

class="foot_r"></div>

</div>

</div>

</div>

</body>

</html>

Fpdf_database.php

<?php

include "../config/koneksi.php";

define('FPDF_FONTPATH', 'font/');

require('fpdf.php');

$data = $_REQUEST["$data"];

// Untuk header dan footer

function encrypted($string){

$key = 'iiuc';

return

base64_encode(mcrypt_encrypt(MCRYPT_RI

JNDAEL_256, md5($key), $string,

MCRYPT_MODE_CBC, md5(md5($key)))); }

function decrypted($string){

$key = 'iiuc';

return

rtrim(mcrypt_decrypt(MCRYPT_RIJNDAEL_

256, md5($key), base64_decode($string),

MCRYPT_MODE_CBC, md5(md5($key))),

"\0");

}

class PDF extends FPDF{

function Header(){

$this->Image('iiuc.jpg',3,1,1.6);

$this->SetTextColor(128,0,0);

$this->SetFont('Arial','B','12');

$this->Cell(15,0.8,'KARTU PESERTA

UJIAN',0,0,'C');

$this->Ln();

$this->Cell(15,1,'STMIK ISLAM

INTERNASIONAL JAKARTA',0,0,'C');

$this->Ln();

}

function Footer(){

$this->SetY(-2,5);

}

}

//$data_id_1 = $_GET[id_data_pribadi];

$replace = str_replace(' ', '+',

$_GET['id_data_pribadi']); $data_id = decrypted($replace);

//echo $data_id.' '.$_GET['id_data_pribadi'];

$query = "SELECT

data_pribadi.nama_lengkap,

data_pribadi.no_ktp,

pilihan_program.id_data_pribadi,

pilihan_program.pilihan, data_pribadi.foto

FROM data_pribadi, pilihan_program where

data_pribadi.id_data_pribadi =

pilihan_program.id_data_pribadi AND data_pribadi.id_data_pribadi = $data_id

ORDER BY id_data_pribadi ";

$sql = mysql_query($query);

// echo $query; exit;


//print_r($r);

$pdf=new PDF('P','cm',array(19,14.5));

$pdf->SetMargins(3,1,3);

$pdf->Open();

$pdf->AliasNbPages();

$pdf->AddPage();

$pdf->SetFont('Arial','B','9');

$pdf->SetFillColor(192,192,192); // Warna sel

tabel header

$pdf->Ln();

$pdf->SetXY(3,4);

$pdf->Image("../foto_siswa/$r[foto]");

$pdf->Ln(); $pdf->SetXY(7.5,4);

$pdf->Cell(3,0.4,'No Ujian

:',0,0,'L',0);

$pdf->Cell(3,0.4,$r[id_data_pribadi],0,2,'L',0);

$pdf->Ln();

$pdf->SetXY(7.5,5);

$pdf->Cell(3,0.4,'Nama Lengkap :',0,0,'L',0);

$pdf->Cell(3,0.4,$r[nama_lengkap],0,2,'L',0);

$pdf->Ln();

$pdf->SetXY(7.5,6); $pdf->Cell(3,0.4,'Nomor KTP

:',0,0,'L',0);

$pdf->Cell(3,0.4,$r[no_ktp],0,2,'L',0);

$pdf->Ln();

$pdf->SetXY(7.5,7);

$pdf->Cell(3,0.4,'Pilihan Program :',0,0,'L',0);

$pdf->Cell(3,0.4,$r[pilihan],0,2,'L',0);

$pdf->Ln();

$pdf->SetXY(3,10);

$pdf->Cell(13.2,1,'Catatan :',0,1,'L',0);

$pdf->SetXY(3,10.5);

$pdf->Cell(13.2,1,'Cetak Kartu Ujian Ini

Dengan Printer Berwarna',0,2,'L',0);

$pdf->SetXY(3,11);

$pdf->Cell(13.2,1,'Ketika ujian, Anda perlu

membawa : Kartu Peserta Ujian, KTP dan

Perlengkapan Tulis',0,2,'L',0);

$pdf->Ln();

$pdf->Rect(3,4,3.9,5.3,'D');

$pdf->Rect(2.2,0.5,14.5,11.5,'D');

$pdf->SetFont('Arial','','8');

$i++;

}

$pdf->Output();

?>

Koneksi.php

<?php

$server = "localhost";

$username = "root";

$password = "";

$database_1= "sisfokampus";

$database_2 = "iiucaci1_portal";

//Koneksi dan memilih database di server

$dbserverconn_1=mysql_connect($server,

$username , $password)

or die(mysql_error());

mysql_select_db($database_1,

$dbserverconn_1)


$dbserverconn_2=mysql_connect($server,

$username , $password)


mysql_select_db($database_2,

$dbserverconn_2)

or die(mysql_error()); ?>

LAMPIRAN D

PENGUJIAN PENERIMAAN SISTEM

HASIL TESTING APLIKASI

........................ 2011, .......... WIB, Kantor STMIK Islam Internasional Jakarta

Peserta :

No. Unit Perusahaan 1. Admin Web portal

No. Modul Prasyarat Hasil yang Diharapkan Hasil Uji

Coba

1. Tambah

modul

Login sebagai

admin

Menambah Modul

2. Edit modul Login sebagai

admin, data

sudah ada dalam

database

Admin dapat menambah

ataupun mengganti data

modul

3. Hapus

modul

Login sebagai

admin, data

sudah ada dalam

database

Admin dapat menghapus

data modul yang tidak

digunakan

4. Melihat

Modul

Login sebagai

admin, data

sudah ada dalam

database

Admin dapat melihat

Modul yang telah dibuat

dalam sistem beserta

data-datanya

5. Tambah

Agenda

Login sebagai

admin


data agenda kegiatan

6. Edit agenda Login sebagai

admin, data

sudah ada dalam

database

Admin dapat mengubah

data agenda

7. Hapus

agenda

Login sebagai

admin, data

sudah ada dalam

database


data agenda

8. Tambah

berita

Login sebagai

admin


berita

9. Edit berita Login sebagai

admin, data

sudah ada dalam

database


data tentang berita

10. Hapus berita Login sebagai

admin, data

sudah ada dalam

database


data berita

11. Tambah Login sebagai Admin dapat menambah

partner admin partner

12. Edit partner Login sebagai

admin, data

sudah ada dalam

database


data tentang partner

13. Hapus

partner

Login sebagai

admin, data

sudah ada dalam

database


data partner

14. Tambah

download

Login sebagai

admin


download

15. Edit

download

Login sebagai

admin, data

sudah ada dalam

database


data download

16. Hapus

download

Login sebagai

admin, data

sudah ada dalam

database


data download

17. Tambah

Sekilas info

Login sebagai

admin


sekilas info

18. Edit Sekilas

info

Login sebagai

admin, data

sudah ada dalam

database


sekilas info

19. Hapus

Sekilas info

Login sebagai

admin, data

sudah ada dalam

database


sekilas info

20. Tambah

album

Login sebagai

admin

Menambah album

21. Edit album Login sebagai

admin, data

sudah ada dalam

database

Admin dapat mengganti

ataupun menonaktifkan

album

22. Tambah

galeri foto

Login sebagai

admin

Menambah galeri foto

23. Edit galeri

foto

Login sebagai

admin, data

sudah ada dalam

database



galeri foto

24. Hapus galeri

foto

Login sebagai

admin, data

sudah ada dalam

database


data galeri foto yang

tidak digunakan

25. Tambah

menu utama

Login sebagai

admin

Menambah menu utama

26. Edit menu

utama

Login sebagai

admin, data

sudah ada dalam

database

Admin dapat mengganti

ataupun menonaktifkan

menu utama

27. Tambah sub

menu

Login sebagai

admin

Menambah sub menu

28. Edit sub

menu

Login sebagai

admin, data

sudah ada dalam

database



sub menu

29. Hapus sub

menu

Login sebagai

admin, data

sudah ada dalam

database


data sub menu yang salah

30. Tambah

halaman

statis

Login sebagai

admin

Menambah halaman

statis

31. Edit

halaman

statis

Login sebagai

admin, data

sudah ada dalam

database



halaman statis

32. Hapus

halaman

statis

Login sebagai

admin, data

sudah ada dalam

database


data halaman statis yang

salah

33. Tambah

validasi

Login sebagai

admin

Menambah validasi

34. Edit validasi Login sebagai

admin, data

sudah ada dalam

database



validasi

35. Hapus

validasi

Login sebagai

admin, data

sudah ada dalam

database


data validasi yang salah

35. Cetak Kartu Login sebagai

admin, data

sudah ada dalam

database

Admin dapat mencetak

kartu pendaftaran

36. Kirim Email Login sebagai

admin, data

sudah ada dalam

database

Admin dapat mengirim

Kartu Pendaftaran ke

email calon mahasiswa

37. Lihat Ijasah Login sebagai Admin dapat melihah

admin, data

sudah ada dalam

database

ijasah calon mahasiswa

38. Konfirmasi

pembayaran

Login sebagai

admin, data

sudah ada dalam

database

Admin dapat melihat

data pembayaran yang

dikirimkan oleh calon

mahasiswa

39. Akivasi

Username &

Password

Login sebagai

admin, data

sudah ada dalam

database

Admin dapat melakukan

aktivasi username &

password calon

mahasiswa

ACCEPTANCE TESTING

Pengujian Penerimaan Sistem

Nama User Penguji :

Jabatan :

1. Menurut anda, apakah sistem ini mudah dijalankan (user friendly) ?

a. Mudah

b. Cukup mudah, karena ..........................................................................

................................. ..........................................................................

c. Kurang mudah, karena .........................................................................

................................. ..........................................................................

2. Menurut anda bila dilihat dari segi pemilihan warna Layout, jenis, maupun

ukuran Font, bagaimana tampilan sistem ini secara keseluruhan?

a. Bagus

b. Cukup bagus, karena ...........................................................................

..................... ......................................................................................

c. Kurang bagus, karena ..........................................................................

..................... ......................................................................................

3. Apa pendapat anda setelah melihat sistem ini secara keseluruhan?

a. Bagus

b. Cukup bagus, karena ..........................................................................

................................. ..........................................................................

c. Kurang bagus, karena ..........................................................................

................................. ..........................................................................

4. Menurut anda, apakah sistem ini telah cukup baik dalam menjawab

permasalahan yang ada khususnya mengenai sistem pendaftaran online?

a. Baik

b. Cukup baik, karena .............................................................................

.............................. .............................................................................

c. Kurang baik, karena ............................................................................

.............................. .............................................................................

5. Apakah sudah cukup membantu dalam proses pendaftaran?

a. Ya

b. Kurang, karena ....................................................................................

....................... ....................................................................................

c. Tidak, karena .. ....................................................................................

....................... ....................................................................................

6. Apakah sistem ini dapat membantu anda untuk memperoleh dan memelihara

data informasi mengenai web portal STMIK islam Internasional ?

a. Ya

b. Kurang, karena ....................................................................................

....................... ....................................................................................

c. Tidak, karena .. ....................................................................................

....................... ....................................................................................

7. Menurut anda, apakah sistem ini bila dikembangkan akan lebih membantu

anda?

a. Sangat membantu

b. Kurang membantu, karena ...................................................................

....................... ....................................................................................

c. Tidak membantu, karena .....................................................................

....................... ....................................................................................

Keterangan Penilaian:

Sangat Baik : 80-100

Baik : 70-80

Cukup : 60-70

Buruk : 50-60

Sangat Buruk : <50

Jakarta, ..........................2011

HASIL TESTING APLIKASI

......................... 2011, ..........WIB, Kantor STMIK Islam Internasional Jakarta

Peserta :

No Unit Perusahaan

1. Pegawai / Dosen

No. Sistem Prasyarat Hasil yang Diharapkan

Hasil

Uji

Coba

1. Pendaftaran

Online

Validasi

pendaftaran

Mencetak kartu

pendaftaran

2. Administrator

Web Portal

Login sebagai

admin

Meng-update Web Portal

dan menampilkannya pada

halaman User

ACCEPTANCE TESTING

Pengujian Penerimaan Sistem

Nama User Penguji :

Jabatan :

8. Menurut anda, apakah sistem ini mudah dijalankan (user friendly) ?

d. Mudah

e. Cukup mudah, karena ..........................................................................

................................. ..........................................................................

f. Kurang mudang, karena .......................................................................

................................. ..........................................................................

9. Menurut anda bila dilihat dari segi pemilihan warna Layout, jenis, maupun

ukuran Font, bagaimana tampilan sistem ini secara keseluruhan?

d. Bagus

e. Cukup bagus, karena ...........................................................................

..................... ......................................................................................

f. Kurang bagus, karena ..........................................................................

..................... ......................................................................................

10. Apa pendapat anda setelah melihat sistem ini secara keseluruhan?

d. Bagus

e. Cukup bagus, karena ..........................................................................

................................. ..........................................................................

f. Kurang bagus, karena ..........................................................................

................................. ..........................................................................

11. Menurut anda, apakah sistem ini telah cukup baik dalam menjawab

permasalahan yang ada khususnya mengenai sistem pendaftaran online?

d. Baik

e. Cukup baik, karena .............................................................................

.............................. .............................................................................

f. Kurang baik, karena ............................................................................

.............................. .............................................................................

12. Apakah sudah cukup membantu dalam proses pendaftaran?

d. Ya

e. Kurang, karena ....................................................................................

....................... ....................................................................................

f. Tidak, karena .. ....................................................................................

....................... ....................................................................................

13. Apakah sistem ini dapat membantu anda untuk memperoleh dan memelihara

data informasi mengenai web portal STMIK islam Internasional ?

b. Ya

d. Kurang, karena ....................................................................................

....................... ....................................................................................

e. Tidak, karena .. ....................................................................................

....................... ....................................................................................

14. Menurut anda, apakah sistem ini bila dikembangkan akan lebih membantu

anda?

b. Sangat membantu

d. Kurang membantu, karena ...................................................................

....................... ....................................................................................

e. Tidak membantu, karena .....................................................................

....................... ....................................................................................

Keterangan Penilaian:

Sangat Baik : 80-100

Baik : 70-80

Cukup : 60-70

Buruk : 50-60

Sangat Buruk : <50

Jakarta, ..........................2011

PENGEMBANGAN WEB PORTAL UNIVERSITAS...

Documents

Transcript of PENGEMBANGAN WEB PORTAL UNIVERSITAS...