analisis dan perancangan sistem e-binus pada … · melihat informasi dan modul pelajaran yang...
TRANSCRIPT
Universitas Bina Nusantara
Jurusan Teknik Informatika Skripsi Sarjana Komputer
Semester Ganjil tahun 2006/2007
ANALISIS DAN PERANCANGAN SISTEM E-BINUS PADA UNIVERSITAS BINA NUSANTARA
Jeffry Tambari 0700687766 Ricky Lomanta 0700688573 Wely 0700725663
Abstrak: Universitas Bina Nusantara adalah universitas yang cukup terkenal terutama di bidang teknologi dan informasi. Divisi dari Universitas Bina Nusantara yang akan khusus menjalankan e-learning adalah E-BiNus. Alasan dan tujuan skripsi ini adalah untuk menyediakan sebuah aplikasi yang mendukung kegiatan e-learning. Metodologi pengembangan perangkat lunak yang digunakan adalah waterfall yang secara singkat memiliki tahap analisi, desain, implementasi, dan testing. Aplikasi yang dihasilkan berupa aplikasi front-end (www.ebinus.com) dan back-end. Front-end adalah aplikasi yang dipublish ke internet, yang boleh diakses oleh siapa saja. Pengunjung dapat melihat informasi dan modul pelajaran yang ditawarkan di aplikasi front-end. Pengunjung (registrant) yang berminat dengan modul pelajaran tertentu dapat langsung mendaftar melalui pendaftaran online. Siswa yang telah mendaftar dapat mengakses aplikasi student services, Learning Management System (LMS), dan Forum. Aplikasi back-end hanya boleh digunakan oleh administrator tertentu untuk mengatur segala kegiatan akademis maupun isi (content) dari LMS. Masalah perlunya sebuah aplikasi yang mendukung kegiatan e-learning telah dapat dipecahkan oleh aplikasi yang dibuat pada skripsi ini. Saran yang telah diperoleh adalah penambahan fitur-fitur lain seperti live chatting. Kata Kunci : e-learning, waterfall, front-end, back-end, student services, learning management system
PRAKATA
Puji syukur kepada Tuhan Yang Maha Esa, atas rahmat dan berkat-Nya, kami
dapat menyelesaikan laporan skripsi ini. Tanpa penyertaan dan bantuan dari-Nya, maka
semua usaha dan kerja keras ini tidak akan ada hasilnya.
Penulisan skripsi dengan judul “Analisis dan Perancangan Sistem E-BiNus pada
Universitas Bina Nusantara” ini disusun sebagai salah satu persyaratan akademik untuk
menyelesaikan jenjang studi Strata 1 Jurusan Teknik Informatika di Universitas Bina
Nusantara.
Penulis menyadari sepenuhnya dalam penulisan skripsi ini masih terdapat
kekurangan dan kelemahan. Untuk itu, penulis mengharapkan kritik, saran, masukan,
dan tanggapan dari para pembaca.
Tidak lupa penulis ingin mengucapkan terima kasih yang sebesar-besarnya
kepada semua pihak atas segala bantuan dan dorongan yang telah diberikan. Adapun
ucapan terima kasih ini penulis berikan kepada:
1. Bapak Prof. Dr. Gerardus Polla, M.App.Sc., selaku Rektor Universitas Bina
Nusantara yang telah memberikan kesempatan kepada kami untuk membuat
penulisan laporan skripsi ini.
2. Bapak Ir. Sablin Yusuf, M.Sc, M.Comp.Sc., selaku Dekan Fakultas Ilmu Komputer.
3. Bapak Mohammad Subekti, BE., M.Sc., selaku Ketua Jurusan Teknik Informatika.
4. Bapak Fredy Purnomo, S.Kom., M.Kom., selaku Sekretaris Jurusan Teknik
Informatika.
5. Bapak Soni, S.Kom.,MM., selaku dosen pembimbing kami yang telah dengan sabar
dan tulus memberikan bimbingan, masukan, pedoman dan nasehat-nasehat yang
berguna dalam penyusunan skripsi ini.
6. Bapak Hanny Santoso, S.Kom., M.Sc., selaku penanggung jawab organisasi E-
BiNus yang telah memberikan saran dan masukan terhadap sistem E-BiNus ini
7. Bapak Wawan Saputra, S.Kom., selaku administrator E-BiNus yang telah
meluangkan waktunya untuk memberikan informasi yang dibutuhkan dalam
penulisan skripsi ini.
8. Segenap staf pengajar Universitas Bina Nusantara yang telah memberikan
bantuannya demi kelancaran penulisan skripsi ini.
9. Serta pihak-pihak lain yang tidak dapat penulis sebutkan sata-persatu yang telah
memberikan nasehat, bantuan, dan dukungan dalam menyelesaikan skripsi ini.
Akhir kata, penulis berharap semoga skripsi ini dapat berguna dan bermanfaat
bagi semua pihak yang bersangkutan, khususnya pihak E-BiNus.
Jakarata, Januari 2007
Penulis
Daftar Isi
Halaman Judul Luar ································································································ i
Halaman Judul Dalam······························································································ ii
Halaman Persetujuan Softcover ··············································································· iii
Abstrak ···················································································································· iv
Prakata ····················································································································· v
Daftar Isi ·················································································································· vii
Daftar Tabel ············································································································· xiii
Daftar Gambar ········································································································· xiv
Daftar Lampiran······································································································· xxix
BAB 1 PENDAHULUAN ······················································································· 1
1.1 Latar Belakang ····························································································· 1
1.2 Ruang Lingkup ···························································································· 5
1.3 Tujuan dan Manfaat ····················································································· 6
1.4 Metodologi Pengembangan Aplikasi···························································· 6
1.5 Sistematika Penulisan··················································································· 8
BAB 2 LANDASAN TEORI··················································································· 11
2.1 Distance Learing ·························································································· 11
2.2 E-Learning (Electronic Learing) ·································································· 11
2.3 Sistem Informasi ·························································································· 12
2.3.1 Pengertian Sistem·········································································· 12
2.3.2 Informasi ······················································································· 12
2.3.3 Pengertian Sistem Informasi·························································· 13
2.4 Teknologi Informasi····················································································· 14
2.5 Software (Perangkat Lunak)········································································· 16
2.5.1 Pengertian Software ······································································ 16
2.5.2 Jenis Software Komputer······························································· 17
2.5.3 Bahasa Pemrograman (Programming Language) ·························· 17
2.6 Software Engineering··················································································· 19
2.6.1 Pengertian Software Engineering ·················································· 19
2.6.2 Fase Sofware Engineering ····························································· 21
2.6.3 Pengertian Model Proses Software ················································ 22
2.6.4 Model Proses Waterfall Software Engineering······························ 22
2.7 Object-Oriented Programming (Pemrogramanan Berorientasi Objek) ········· 25
2.8 Bahasa Pemrograman UML (Unified Modelling Language)························ 27
2.9 Database (Basis Data) ·················································································· 31
2.9.1 Data ······························································································· 31
2.9.2 Pengertian Database ······································································ 31
2.9.3 Database Relasional ······································································ 33
2.10 Internet ········································································································· 34
2.10.1 Pengertian Internet ········································································ 34
2.10.2 World Wide Web (WWW)···························································· 35
2.10.3 Web Site ························································································ 35
2.10.4 IP Address (Internet Protocol Address) ········································· 36
2.10.5 Browser ························································································· 36
2.11 Server··········································································································· 36
2.11.1 Pengertian Server ·········································································· 36
2.11.2 Web Server···················································································· 37
2.11.3 Database Server············································································· 37
2.12 DBMS (Database Management System) ······················································ 37
2.13 RDBMS (Relational DBMS)········································································ 38
2.14 SQL (Structured Query Language)······························································· 39
2.15 Microsoft SQL Server 2000 ········································································· 40
2.16 Stored Procedure ·························································································· 40
2.17 Internet Information Service ········································································ 41
2.18 .NET Framework ························································································· 41
2.19 Visual Studio .NET ······················································································ 43
2.20 Bahasa Pemrograman C# ············································································· 43
2.21 ASP .NET (Active Server Page .NET)························································· 44
2.22 R.a.d. Control – Telerik················································································ 44
2.23 N-Tier Solution ···························································································· 44
2.24 Terminologi Sistem E-BiNus ······································································· 47
BAB 3 ANALISIS DAN DESAIN ·········································································· 48
3.1 Latar Belakang Universitas Bina Nusantara ················································· 48
3.1.1 Sejarah··························································································· 48
3.1.2 Program Studi················································································ 50
3.1.3 Semboyan······················································································ 50
3.1.4 Visi································································································ 51
3.1.5 Misi ······························································································· 51
3.2 Struktur Organisasi Universitas Bina Nusantara ·········································· 52
3.3 Sistem yang sedang Berjalan di Universitas Bina Nusantara························ 52
3.3.1 Sistem Perkuliahan ········································································ 52
3.3.2 Infrastruktur IT·············································································· 55
3.4 Analisis Permasalahan dan Kebutuhan························································· 59
3.5 Kebutuhan (Requirement) Sistem E-BiNus·················································· 61
3.6 Aplikasi yang Akan Dibuat ·········································································· 67
3.6.1 Tinjauan Aplikasi Secara Umum··················································· 61
3.6.2 Arsitektur Abstrak Aplikasi E-BiNus ············································ 69
3.6.3 Skenario Proses Registrasi····························································· 71
3.6.4 UML······························································································ 79
3.6.4.1 UML untuk Front End ···················································· 83
3.6.4.2 UML untuk Back End····················································· 105
3.6.4.3 UML untuk Payment Agent System ······························· 131
3.6.5 Desain Tampilan ··········································································· 138
3.6.5.1 Conceptual Site Map Front End······································ 138
3.6.5.2 Conceptual Site Map Back End ······································ 142
3.6.5.3 Desain Front End ···························································· 143
3.6.5.4 Desain Back End ···························································· 160
3.6.5.4.1 Login dan Main Menu··································· 160
3.6.5.4.2 Lecturer Module Assignment ························ 164
3.6.5.4.3 Module Category Management ····················· 167
3.6.5.4.4 Module Management ···································· 169
3.6.5.4.5 Lecturer Personal Info Management ············· 174
3.6.5.4.6 Student Personal Info Management··············· 181
3.6.5.4.7 User Management ········································· 184
3.6.5.4.8 Announcement Management························· 188
3.6.5.4.9 Event Management ······································· 191
3.6.5.4.10 News Management········································ 196
3.6.5.5 Payment Agent ······························································· 200
BAB 4 IMPLEMENTASI DAN EVALUASI·························································· 202
4.1 Deployment Diagram··················································································· 202
4.2 Kebutuhan Sistem ························································································ 204
4.2.1 Web Server E-BiNus ····································································· 204
4.2.1.1 Kebutuhan Software ······················································· 204
4.2.1.2 Kebutuhan Hardware ······················································ 204
4.2.2 Database Server E-BiNus ······························································ 204
4.2.2.1 Kebutuhan Software ······················································· 204
4.2.2.2 Kebutuhan Hardware ······················································ 204
4.2.3 Content (File) Server E-BiNus ······················································ 205
4.2.3.1 Kebutuhan Software ······················································· 205
4.2.3.2 Kebutuhan Hardware ······················································ 205
4.3 Hasil Tampilan Layar··················································································· 205
4.3.1 E-BiNus Front End Public····························································· 205
4.3.2 E-BiNus Front End Student ··························································· 218
4.3.3 E-BiNus Back End ······································································· 235
4.4 Evaluasi········································································································ 271
4.4.1 Evaluasi Aplikasi E-BiNus Front End ··········································· 271
4.4.2 Evaluasi Aplikasi E-BiNus Back End············································ 274
BAB 5 KESIMPULAN DAN SARAN···································································· 275
5.1 Kesimpulan ·································································································· 275
5.2 Saran ············································································································ 276
Daftar Tabel
2.25 Program Studi E-BiNus··········································································50
Tabel 4.1 Hasil Evaluasi Kuisioner ········································································271
Daftar Gambar
2.26 Perangkat Dari Teknologi Informasi ················································16
2.27 Software Engineering Layers ···························································21
2.28 Model Proses Waterfall ····································································24
2.29 Class dan Instance dari Class····························································27
2.30 Simbol-simbol Class Diagram dalam UML······································29
2.31 Simbol-simbol Use Case dalam UML ··············································30
2.32 Simbol-simbol Sequence Diagram dalam UML ·······························30
2.33 Jenjang Data ·····················································································32
2.34 World Wide Web Page Structure······················································34
2.35 DBMS ······························································································38
2.36 NET Framework···············································································42
2.37 N-Tier Solution Framework ·····························································46
Gambar 3.1 Struktur Organisasi Universitas Bina Nusantara·······························52
Gambar 3.2 Rich Picture Analisis Permasalahan dan Kebutuhan ························59
Gambar 3.3 Rich Picture Sistem E-BiNus ···························································62
Gambar 3.4 Arsitektur Abastrak Aplikasi E-BiNus ·············································69
Gambar 3.5 Format TransactionId dari Data Pembayaran ···································73
Gambar 3.6 Aktor yang Terlibat dalam Proses Registrasi····································73
Gambar 3.7 Langkah-langkah Proses Registrasi ··················································74
Gambar 3.8 Proses Registrasi ··············································································75
Gambar 3.9 Tanda Akhir dari Proses Registrasi untuk Tiap Jenis User ···············75
Gambar 3.10 Contoh Isi Email Meminta Konfirmasi Registrasi ····························76
Gambar 3.11 Contoh Isi Email Setelah Konfirmasi ···············································77
Gambar 3.12 Contoh Isi Email Setelah Pembayaran··············································78
Gambar 3.13 Class Diagram E-BiNus ···································································80
Gambar 3.14 Use Case E-BiNus Front End ···························································84
Gambar 3.15 Sequence View Event List (View All)··············································86
Gambar 3.16 Sequence View Event List (Go To HOME Page)·····························86
Gambar 3.17 Sequence View Event Detail Sequence View···································87
Gambar 3.18 Sequence View News List (View All)··············································87
Gambar 3.19 Sequence View News List (Go To HOME Page) ·····························88
Gambar 3.20 Sequence View News Detail ····························································88
Gambar 3.21 Sequence Cek BiNusianId (Siswa) ···················································89
Gambar 3.22 Sequence Cek BiNusianId (BiNusian Bukan Siswa) ························90
Gambar 3.23 Data Class yang Digunakan Dalam Sequence Register ····················90
Gambar 3.24 Sequence Registrasi Pertama Kali (Module dan Diri) NonBiNusian/
Umum ·········································································································92
Gambar 3.25 Sequence Registrasi Pertama Kali (Module dan Diri) BiNusian·······94
Gambar 3.26 Sequence Registration Confirmation (Setelah Email1 Dikirim) ·······94
Gambar 3.27 Sequence View Module (Available Module List)·····························95
Gambar 3.28 Sequence View Module Detail ·························································96
Gambar 3.29 Sequence View Student Personal Information··································96
Gambar 3.30 Sequence Edit Student Personal Information····································97
Gambar 3.31 Data Class yang Digunakan dalam Student Personal Information····97
Gambar 3.32 Sequence Edit (Change) Password ···················································98
Gambar 3.33 Sequence Upload Photo····································································98
Gambar 3.34 Sequence View Score History (Studies) ···········································99
Gambar 3.35 Sequence Registrasi Ulang (Siswa) ··················································101
Gambar 3.36 Sequence View Announcement List·················································101
Gambar 3.37 Sequence View Announcement Detail ·············································102
Gambar 3.38 Sequence View Payment History (Financial) ···································102
Gambar 3.39 Sequence View Payment Detail························································103
Gambar 3.40 Sequence Logout ··············································································103
Gambar 3.41 Sequence Login ················································································104
Gambar 3.42 Sequence Edit (Forget) Password ·····················································105
Gambar 3.43 Use Case Lecturer Module Assignment System·······························106
Gambar 3.44 Sequence Search Module List ··························································106
Gambar 3.45 Sequence Search Lecturer List To Be Assigned ·······························107
Gambar 3.46 Sequence View Lecturer Assignment Detail ····································107
Gambar 3.47 Sequence Edit Lecturer Assignment·················································108
Gambar 3.48 Use Case Module Category Management System ····························108
Gambar 3.49 Sequence Create Module Category···················································109
Gambar 3.50 Sequence View/Search Module Category List (Searching) ··············109
Gambar 3.51 Sequence Edit Module Category ·····················································110
Gambar 3.52 Use Case Module Management System ··········································110
Gambar 3.53 Sequence Create Module ·································································111
Gambar 3.54 Sequence Search Module List ·························································111
Gambar 3.55 Sequence View Module Detail ························································112
Gambar 3.56 Sequence Module Edit······································································112
Gambar 3.57 Sequence Module Edit With New Revision ····································113
Gambar 3.58 Use Case Lecturer Personal Info Management System ···················113
Gambar 3.59 Sequence Create Lecturer·································································114
Gambar 3.60 Sequence View/Search Lecturer List (Go To Lecturer Personal Info
Management Page)·····························································································114
Gambar 3.61 Sequence View/Search Lecturer List (Searching) ····························115
Gambar 3.62 Sequence View Lecturer Detail ························································115
Gambar 3.63 Sequence Edit Lecturer·····································································116
Gambar 3.64 Use Case Student Personal Info System ···········································116
Gambar 3.65 Sequence Search Student List···························································117
Gambar 3.66 Sequence View Student Detail ·························································117
Gambar 3.67 Sequence Student Edit······································································118
Gambar 3.68 Use Case User Management System ················································118
Gambar 3.69 Sequence Create User·······································································119
Gambar 3.70 Sequence View/Search User List······················································119
Gambar 3.71 Sequence View User Detail ······························································120
Gambar 3.72 Sequence Edit User ··········································································120
Gambar 3.73 Use Case Announcement Management System································121
Gambar 3.74 AnnouncementData ··········································································121
Gambar 3.75 Sequence Create Announcement ······················································121
Gambar 3.76 Sequence View/Search Announcement List (Go To Announcement
Management System Page) ················································································122
Gambar 3.77 Sequence View/Search Announcement List (Seaching) ···················122
Gambar 3.78 Sequence View Announcement Detail ·············································123
Gambar 3.79 Sequence Edit Announcement ··························································123
Gambar 3.80 Use Case Event Management ···························································124
Gambar 3.81 EventData dan Komponen Event······················································124
Gambar 3.82 Sequence Create Event ·····································································125
Gambar 3.83 Sequence View/Search Event List (By Go To EventManagement
Page) ·········································································································125
Gambar 3.84 Sequence View/Search Event List (By Searching) ···························126
Gambar 3.85 Sequence View Event Detail ····························································126
Gambar 3.86 Sequence Edit Event·········································································127
Gambar 3.87 Use Case News Management System···············································128
Gambar 3.88 NewsData dan Komponen News ······················································128
Gambar 3.89 Sequence Create News ·····································································129
Gambar 3.90 Sequence View/Search News List (By Go To NewsManagementSystem
Page) ·········································································································129
Gambar 3.91 Sequence View/Search News List (By Searching) ···························130
Gambar 3.92 Sequence View News Detail ····························································130
Gambar 3.93 Sequence Edit News·········································································131
Gambar 3.94 Use Case Payment Agent System·····················································132
Gambar 3.95 Aktivitas dari Payment Agent···························································132
Gambar 3.96 Data-data yang dipergunakan dalam Payment Agent ·······················133
Gambar 3.97 Database yang digunakan Payment Agent········································133
Gambar 3.98 Sequence Processing Payment Data untuk Registrant pengunjung···134
Gambar 3.99 Sequence Processing Payment Data untuk Registrant BiNusian ······135
Gambar 3.100 Sequence Processing Payment Data untuk Registrant Student ·········136
Gambar 3.101 Sequence Processing Payment Data untuk Registrant pengunjung Bila
Belum Lunas ······································································································131
Gambar 3.102 Conceptual Site Map Sebelum Login ···············································139
Gambar 3.103 Conceptual Site Map Setelah Login ·················································140
Gambar 3.104 Conceptual Site Map Back End Setelah Login ·································142
Gambar 3.105 Tata Letak Halaman FrontEnd··························································144
Gambar 3.106 Pembagian Daerah yang Mengalami Perubahan·······························144
Gambar 3.107 Tata Letak Halaman Registered User (siswa)···································145
Gambar 3.108 Content Halaman HOME ·································································146
Gambar 3.109 View All News & View All Event ···················································147
Gambar 3.110 View News Detail & View Event Detail ··········································147
Gambar 3.111 Halaman PROFILE ··········································································148
Gambar 3.112 Halaman CONTACT US··································································148
Gambar 3.113 Halaman FORGET PASSWORD·····················································149
Gambar 3.114 Halaman PRODUCT CATALOG (bagi pengunjung)/Halaman
MODULE (bagi siswa) ······················································································149
Gambar 3.115 Pop Up Page ModuleDetail ······························································150
Gambar 3.116 Halaman ModuleRegistrationConfirmation······································150
Gambar 3.117 Proses CheckBiNusianID ·································································151
Gambar 3.118 Halaman StudentRegistration ···························································152
Gambar 3.119 Halaman StudentRegistrationConfirmation······································153
Gambar 3.120 Halaman RegistrationResult ·····························································153
Gambar 3.121 Halaman RegistrationConfirmation Setelah Email ···························154
Gambar 3.122 Halaman HOME siswa ·····································································154
Gambar 3.123 Halaman AnnouncementList siswa ··················································155
Gambar 3.124 Pop Up Page AnnouncementDetail ··················································155
Gambar 3.125 Halaman MY MODULE ··································································155
Gambar 3.126 Bagian LMS pada Halaman Halaman Registered User (siswa) ········156
Gambar 3.127 Halaman MY PROFILE ···································································156
Gambar 3.128 Halaman ViewMyProfile··································································157
Gambar 3.129 Halaman EditMyProfile····································································157
Gambar 3.130 Halaman UploadPhoto······································································158
Gambar 3.131 Halaman ChangePassword ·······························································158
Gambar 3.132 Halaman FINANCIAL ·····································································158
Gambar 3.133 Halaman PaymentHistory·································································159
Gambar 3.134 Halaman PaymentDetail ···································································159
Gambar 3.135 Halaman STUDIES ··········································································159
Gambar 3.136 Halaman ViewAllStudentScoreHistory ············································160
Gambar 3.137 Tombol Logout·················································································160
Gambar 3.138 Halaman Login E-BiNus Back End (Default) ··································160
Gambar 3.139 Tata Letak Halaman E-BiNus Back End (Setelah Login)·················161
Gambar 3.140 Tata Letak Halaman E-BiNus Back End 2 ·······································161
Gambar 3.141 Privilege Logic ·················································································163
Gambar 3.142 Menu Navigasi E-BiNus Back End ··················································164
Gambar 3.143 Halaman ViewLecturerModuleAssignment ·····································165
Gambar 3.144 Halaman EditLecturerModuleAssignment ·······································166
Gambar 3.145 Format Penulisan List Box ·······························································166
Gambar 3.146 Halaman EditLecturerModuleAssignmentConfirmation ··················167
Gambar 3.147 Desain Halaman MODULE CATEGORY MANAGEMENT (View
Module Category) ······························································································167
Gambar 3.148 Halaman CreateModuleCategory, CreateModuleCategoryConfirmation
dan CreateModuleCategoryResult ·····································································168
Gambar 3.149 Halaman EditModuleCategory, EditModuleCategoryConfirmation dan
EditModuleCategoryResult ················································································169
Gambar 3.150 Halaman MODULE MANAGEMENT (View Module)···················170
Gambar 3.151 Halaman CreateModule 1·································································170
Gambar 3.152 Halaman CreateModule 2 (Create Module Detail) ···························172
Gambar 3.153 Aturan Pengisian Grading Policy ·····················································173
Gambar 3.154 Halaman View Module·····································································173
Gambar 3.155 Halaman Edit Module ······································································174
Gambar 3.156 Halaman LECTURE PERSONAL INFO MANAGEMENT (View
Lecturer List) ·····································································································175
Gambar 3.157 Halaman Pop Up ViewLecturerDetail ··············································176
Gambar 3.158 Halaman CreateLecturer Bagian Personal Info·································177
Gambar 3.159 Halaman CreateLecturer Bagian Email ············································177
Gambar 3.160 Halaman CreateLecturer Bagian Formal Education ·························178
Gambar 3.161 Bagian Add New Formal Education·················································178
Gambar 3.162 Bagian Formal Education Setelah tombol “Edit These Data” diklik·maka
Formal Education Data Bisa Diedit (Edit Formal Education Data ·····················179
Gambar 3.163 Halaman EditLecturer Bagian Personal Info ····································180
Gambar 3.164 Halaman EditLecturer Bagian Email ················································180
Gambar 3.165 Halaman EditLecturer Bagian Formal Education ·····························181
Gambar 3.166 Halaman STUDENT PERSONAL INFO MANAGEMENT (View dan
Search) ·········································································································182
Gambar 3.167 Halaman ViewStudentPersonalInfo··················································182
Gambar 3.168 Halaman EditStudentPersonalInfo····················································183
Gambar 3.169 Halaman USER MANAGEMENT (View User List) ······················184
Gambar 3.170 Halaman Pop Up View User ····························································184
Gambar 3.171 Halaman CreateUser·········································································185
Gambar 3.172 Halaman CreateUserConfirmation ···················································186
Gambar 3.173 Halaman CreateUserResult·······························································186
Gambar 3.174 Halaman EditUser ············································································187
Gambar 3.175 Halaman EditUserConfirmation ·······················································187
Gambar 3.176 Halaman EditUserResult ··································································188
Gambar 3.177 Halaman ANNOUCEMENT MANAGEMENT (ViewAnnouncement
List) ·········································································································188
Gambar 3.178 Komponen Telerik r.a.d. date picker ················································189
Gambar 3.179 Halaman Pop Up ViewAnnouncementDetail ···································189
Gambar 3.180 Halaman Proses Create Announcement············································190
Gambar 3.181 Halaman Proses Edit Announcement················································191
Gambar 3.182 Halaman EVENT MANAGEMENT (View Event List)··················192
Gambar 3.183 Halaman Pop Up EventDetail···························································192
Gambar 3.184 Halaman Proses Create Event Bagian 1············································193
Gambar 3.185 Halaman Proses Create Event Bagian 2············································194
Gambar 3.186 Halaman EditEvent···········································································194
Gambar 3.187 Halaman UploadEvent untuk Edit ····················································195
Gambar 3.188 Halaman EditEventConfirmation ·····················································195
Gambar 3.189 Halaman EditEventResult ································································195
Gambar 3.190 Halaman NEWS MANAGEMENT (View News List)····················196
Gambar 3.191 Halaman Pop Up News Detail··························································197
Gambar 3.192 Halaman Proses Create News Bagian 1············································197
Gambar 3.193 Halaman Proses Create News Bagian 2············································198
Gambar 3.194 Halaman EditNews···········································································199
Gambar 3.195 Halaman UploadNews······································································199
Gambar 3.196 Halaman EditNewsConfrimation······················································200
Gambar 3.197 Halaman EditNewsResult·································································200
Gambar 3.198 Tampilan Console (Command Prompt) Payment Agent···················201
Gambar 3.199 Tampilan log file yang dihasilkan oleh Payment Agent ···················201
Gambar 4.1 Deployment Diagram E-BiNus·························································202
Gambar 4.2 Site Link ··························································································206
Gambar 4.3 Header pada E-BiNus Front End ······················································206
Gambar 4.4 Login Box ·······················································································207
Gambar 4.5 Navigasi Untuk Pengunjung ····························································207
Gambar 4.6 Link Anchor ····················································································207
Gambar 4.7 Halaman Home ················································································208
Gambar 4.8 Paging Facility ·················································································209
Gambar 4.9 Halaman News List (View All) ························································210
Gambar 4.10 Halaman News Detail·······································································211
Gambar 4.11 Halaman Event List (View All) ························································212
Gambar 4.12 Halaman Event Detail ······································································213
Gambar 4.13 Halaman Profile················································································214
Gambar 4.14 Halaman Module List ·······································································214
Gambar 4.15 Halaman ModuleRegistrationConfirmation······································215
Gambar 4.16 Halaman FormRegistration.······························································216
Gambar 4.17 Halaman Contact ··············································································217
Gambar 4.18 Waktu dan Navigasi Umum Siswa ···················································220
Gambar 4.19 Student Navigation ···········································································221
Gambar 4.20 Photo, UserName, BinusianID, tombol Change Password dan
LogOut ·········································································································221
Gambar 4.21 My Module Navigation ····································································221
Gambar 4.22 Halaman Home (News – Event – Announcement List) ···················221
Gambar 4.23 Halaman Announcement List (View All) ·········································222
Gambar 4.24 Halaman Announcement List (View By Category) ··························222
Gambar 4.25 Halaman AnnouncementDetail ························································223
Gambar 4.26 Halaman Profile E-BiNus·································································224
Gambar 4.27 Halaman Contact Us ········································································224
Gambar 4.28 Halaman My Profile ·········································································225
Gambar 4.29 Halaman View My Profile································································225
Gambar 4.30 Halaman Edit My Profile··································································226
Gambar 4.31 Halaman Upload Photo·····································································227
Gambar 4.32 Dialog Box untuk Browsing foto yang akan di-upload·····················227
Gambar 4.33 Halaman Change Password ······························································228
Gambar 4.34 Halaman Academic Record ······························································229
Gambar 4.35 Halaman Student Score History························································230
Gambar 4.36 Halaman Financial············································································230
Gambar 4.37 Halaman Payment History································································231
Gambar 4.38 Halaman Pop Up Window Payment Detail/Transaction Detail ·······231
Gambar 4.39 Halaman Modules ············································································232
Gambar 4.40 Halaman My Module Taken·····························································233
Gambar 4.41 Halaman View Module Available ····················································233
Gambar 4.42 Halaman Module Detail ···································································234
Gambar 4.43 Halaman Module Registration··························································234
Gambar 4.44 Login Box Back End ········································································235
Gambar 4.45 Halaman Main Menu admin ·····························································236
Gambar 4.46 Halaman Change Password admin ···················································237
Gambar 4.47 Halaman LecturerModuleAssignment_MainMenu admin················237
Gambar 4.48 Halaman LecturerModuleAssignment_ViewLecturerAssignment
admin ·········································································································238
Gambar 4.49 Halaman LecturerModuleAssignment_EditLecturerAssignment 1
admin ·········································································································239
Gambar 4.50 Halaman LecturerModuleAssignment_EditLecturerAssignment 2
admin ·········································································································240
Gambar 4.51 Halaman ModuleCategoryManagement_MainMenu admin ·············241
Gambar 4.52 Module Category Management ketika link “Edit” diklik··················242
Gambar 4.53 Halaman ModuleManagement_MainMenu admin ···························243
Gambar 4.54 Halaman ModuleManagement_ViewModuleDetail admin ··············244
Gambar 4.55 Halaman ModuleManagement_EditModule 1 admin ·······················245
Gambar 4.56 Halaman ModuleManagement_EditModule 2 admin ·······················245
Gambar 4.57 Halaman ModuleManagement_CreateModule admin ······················246
Gambar 4.58 Halaman ModuleManagement_CreateModuleDetail 1 admin··········247
Gambar 4.59 Halaman ModuleManagement_CreateModuleDetail 2 admin··········247
Gambar 4.60 Halaman LecturerPersonalInformationManagement_MainMenu
admin ·········································································································248
Gambar 4.61 Halaman LecturerPIManagement_ViewLecturerDetail admin·········249
Gambar 4.62 Halaman LecturerPIManagement_EditLecturer 1 admin ·················250
Gambar 4.63 Halaman LecturerPIManagement_EditLecturer 2 admin ·················250
Gambar 4.64 Formal Education Lecturer ketika Tombol “Edit These Data”
Diklik ·········································································································252
Gambar 4.65 Formal Education Lecturer ketika Baru Ditambahkan······················252
Gambar 4.66 Halaman LecturerPIManagement_CreateLecturer 1 admin··············253
Gambar 4.67 Halaman LecturerPIManagement_CreateLecturer 2 admin··············254
Gambar 4.68 Halaman StudentPIManagement_MainMenu admin ························254
Gambar 4.69 Halaman StudentPIManagement_ViewStudentDetail admin ···········255
Gambar 4.70 Halaman StudentPIManagement_EditStudent admin ·······················256
Gambar 4.71 Halaman UserManagement_MainMenu admin ································257
Gambar 4.72 Halaman UserManagement_ViewUserDetail admin ························257
Gambar 4.73 Halaman UserManagement_EditUser admin····································258
Gambar 4.74 Halaman UserManagement_CreateUser admin ································259
Gambar 4.75 Halaman AnnouncementManagement_MainMenu admin················260
Gambar 4.76 Halaman AnnouncementManagement_ViewAnnouncement
admin ·········································································································261
Gambar 4.77 Halaman AnnouncementManagement_ EditAnnouncement
admin ·········································································································261
Gambar 4.78 Halaman AnnouncementManagement_CreateAnnouncement
admin ·········································································································262
Gambar 4.79 Halaman EventManagement_MainMenu admin ······························263
Gambar 4.80 Halaman EventManagement_ViewEvent admin ······························264
Gambar 4.81 Halaman EventManagement_EditEvent admin ································265
Gambar 4.82 Halaman EventManagement_CreateEvent admin ····························266
Gambar 4.83 Halaman EventManagement_UploadEvent admin ···························266
Gambar 4.84 Halaman NewsManagement_MainMenu admin·······························267
Gambar 4.85 Halaman NewsManagement_ViewNews admin·······························268
Gambar 4.86 Halaman NewsManagement_EditNews admin·································269
Gambar 4.87 Halaman NewsManagement_CreateNews admin·····························270
Gambar 4.88 Halaman NewsManagement_UploadNews admin····························270
Daftar Lampiran
2.38 Kuesioner Aplikasi E-BiNus Front End ··············································L01
2.39 Wawancara dengan Administrator E-BiNus tentang Aplikasi Back End
············································································································L03
2.40 Surat Keterangan Survey·····································································L04