BAB 3 ANALISIS DAN PERANCANGAN SISTEM 3.1 Analisis Sistem Sebelum merancang sebuah aplikasi yang akan dibangun, faktor yang harus diperhatikan adalah tahap analisis. Tahap analisis merupakan tahap pemahaman dengan perangkat lunak yang akan digunakan, kebutuhan fungsional, diagram alir data, kamus alir data dan enkripsi proses. Tahap analisis bertujuan untuk mengetahui mekanisme sistem, proses proses yang terlibat dalam sistem serta hubungan antara proses tersebut. 3.2 Perancangan Sistem Perancangan sistem adalah upaya suatu organisasi atau lembaga untuk memulai memiliki suatu sistem yang lebih baik lagi dari sistem yang sebelumnya. Perancangan sistem dilakukan setelah mendapat gambaran dengan jelas apa yang harus dikerjakan. Tujuan dari perancangan sistem adalah untuk memenuhi kebutuhan user (pemakai) mengenai gambaran yang jelas tentang perancangan sistem yang akan dibuat serta diimplementasikan.
33 3.2.1 Diagram Konteks Model yang diusulkan dalam proses sistem dirancang untuk mendapatkan informasi dari siswa (student) dan guru (teacher). Keduanya menganalisis, memberikan input dan menyimpan data untuk administrator (manager). Dalam sistem ini siswa dapat memilih mata kelas, mengunduh file materi, dan sebagainya. Juga para siswa dapat menjawab kuis dan ujian secara on-line. Para guru dapat memberikan materi pelajaran dan soal tugas, kuis, maupun ujian online. Sedangkan Administrator tidak berhak mengenai penerimaan atau penolakan dari isi pelajaran. Ia hanya berhak mendaftarkannya masing-masing baik sebagai guru ataupun sebagai siswa. Diagram konteks sistem dapat disajikan dalam Gambar 3.1. Data Siswa Data Guru Siswa Hak Akses Hak Akses Guru File materi pelajaran File tugas Laporan nilai siswa Mencari Data Sistem Aplikasi Elearning Materi Jadwal Mengajar Mata Pelajaran Jadwal Mengajar Admin Gambar 3.1 Diagram Konteks Elearning
34 3.2.2 Data Flow Diagram (DFD) Beberapa detil mungkin akan dimasukkan ke dalam sistem utama untuk menutup seluruh persyaratan sebuah e-learning. Siswa akan masuk ke sistem registrasinya atau membuat profil. Setelah registrasi, maka siswa akan diberi hak akses untuk bisa mengakses sistem elearning. Kemudian guru harus memberikan datanya terlebih dahulu kepada admin, selanjutnya admin akan mendaftarkan guru tersebut pada sistem. Setelah terdaftar maka guru dapat mengakses serta meng-upload file materi pada sistem elearning. Para administrator dapat memantau seluruh kegiatan, dan apabila terdapat user-user yang tidak berkepentingan maka administrator dapat menghapus akun user tersebut. Laporan user dan instruktur disimpan di dalam penyimpanan data base. Guru dapat memberikan nilai kepada siswa melalui tugas dan ujian online. Data flow diagram ini dapat diilustrasikan dalam Gambar 3.2.
35 Data Siswa Data Guru Siswa Hak Akses Hak Akses Guru 1.0 Input Data Guru Siswa Jadwal Mengajar 2.0 Input Mata Pelajaran Input Jadwal Mengajar Mata Pelajaran Jadwal Mengajar Mata Pelajaran Jadwal Mengajar 3.0 Input Materi Materi Materi Elearning Mencari Data 4.0 File materi pelajaran File tugas Laporan nilai siswa Pengelolaan Elearning Materi Admin Gambar 3.2 Data Flow Diagram (DFD)
36 3.2.3 Perancangan Antarmuka Perancangan antar muka yang akan di buat meliputi beberapa perancangan, diantaranya perancangan struktur menu dan spesifikasi antarmuka. Perancangan antarmuka dibuat untuk menggambarkan tampilan program yang akan digunakan oleh pengguna untuk berinteraksi dengan aplikasi yang dibuat. Perancnagan dibuat berdasarkan tampilan antarmuka input saat aplikasi diimplementasikan. Perancangan antarmuka dapat dilihat pada gambar 3.3 berikut ini. Form Utama Home Profile Info Pendaftaran Pendaftaran Login Tambah Data Siswa Menu Admin Menu Guru Menu Siswa Kelola Kelas Tambah Kelas Print Laporan Edit/delete Kelas Data Guru Edit Data Data Siswa Edit Data Kelola Mata Pelajaran Kelola Jadwal Mengajar Ganti Password Tambahkan Mapel Print Laporan Edit/delete Mapel Tambah Jadwal Baru Print Laporan Jadwal Edit/delete Jadwal Edit/delete Jadwal Ganti Password Upload Materi Tugas Ganti Password Tambahkan Bahan Baru Lihat Jadwal Mengajar Hapus File Materi Tambahkan Tugas Baru Jadwal Mata Pelajaran Ganti Password Materi Ajar Print Jadwal Ganti Password Download File Kelola Profile Edit/delete Jadwal Laporan nilai Laporan Nilai Tugas Tugas Kerjakan Tugas Edit/delete Jadwal Laporan Nilai Kelola Siswa Edit/delete Jadwal Edit/delete Jadwal Edit/delete Jadwal Kelola Guru Edit/delete Jadwal Edit/delete Jadwal logout Logout Logout Gambar 3.3 Perancangan Antarmuka Elearning
37 3.2.4 Entity Relationship Diagram (ERD) Dalam perancangan suatu sistem sangat diperlukan sebuah gambaran ERD untuk mempermudah dilakukannya analisis dan memberikan gambaran alur kerja yang jelas untuk mempermudah pengerjaan sistem sejak awal. ERD berikut akan menjelaskan setiap entitas yang dipakai dalam sistem dan atribut-stribut apa saja yang terdapat dalam setiap entitas tersebut. level golongan tamatan jabatan agama Nip password Tbl_guru Nm_guru TTL alamat Jenis_kelamin upload tanggal Kd_pelajaran Id_mater_ajar nip Materi_ajar keterangan Kd_kelas File_materi_ajar foto Id_admin password input Tbl_admin telepon Nama_lengkap username upload nip Id_tugas Kd_pelajaran Kd_kelas Tbl_tugas Batas_waktu level Jenis_kelamin mengajar memberi input Kd_kelas Tlb_kelas nip mengunduh mengerjakan Tbl_nilai_tugas Id_nilai_tugas No_induk Id_tugas Nilai_tugas kapasitas melihat input Nm_kelas memilih No_induk password Nm_siswa alamat Sekolah_asal jk Tbl_siswa level TTL foto Kd_kelas agama Tbl_page judul melihat isi Id_page Id_jadwal Kd_kelas Kd_pelajaran input Tbl_jadwal_pelajaran melihat hari nip Jam_selesai Jam_mulai Gambar 3.4 Entity Relationship Diagram
38 3.2.5 Perancangan Database Pada tahapan ini dipersiapkan tempat untuk menampung data di server, data tersebut nantinya akan diproses oleh program yang kita buat pada tahap pemrograman, baik penambahan, pengeditan, panghapusan dan menampilkan isi database ke halaman website. Database terdiri atas tabel-tabel yang dibuat dengan menggunakan program MySQL. Adapun database yang dibuat oleh penulis adalah database db_alumni dengan tabel-tabel sebagai berikut: Tabel 3.1 Tabel Admin Nama Field Type Size Keterangan id_admin Int 5 primary key Username Varchar 40 Password Varchar 40 nama_lengkap Varchar 35 jenis_kelamin Varchar 10 level Varchar 10 Tabel 3.2 Tabel Guru Nama Field Type Size Keterangan Nip Varchar 20 Primary key Password Varchar 20
39 nm_guru Varchar 40 Alamat Varchar 150 tempat_lahir Varchar 30 tanggal_lahir Varchar 20 jenis_kelamin Varchar 10 Foto Varchar 40 Telepon Varchar 12 Agama Varchar 10 Jabatan Varchar 40 Golongan Varchar 7 Tamatan Varchar 150 Level Varchar 10 Tabel 3.3 Jadwal Pelajaran Nama Field Type Size Keterangan id_ jadwa_pelajaran Int 11 Primary key kd_kelas Varchar 11 kd_pelajaran Varchar 11 Nip Varchar 20 Hari Varchar 20 jam_mulai jam_selesai Time Time
40 Tabel 3.4 kelas Nama Field Type Size Keterangan kd_kelas Varchar 4 Primary key Nip Varchar 20 nm_kelas Varchar 203 Kapasitas Int Tabel 3.5 Materi Ajar Nama Field Type Size Keterangan id_mata_pelajaran Int 5 Primary key kd_pelajaran Varchar 5 Nip Varchar 20 kd_kelas Varchar 5 Keterangan Text file-materi_ajar Varchar 255 Tanggal Date Tabel 3.6 Nilai Tugas Nama Field Type Size Keterangan id_nilai_tugas Int 5 Primary key id_tugas Int 5 no_induk Int 11 nilai_tugas Int 5
41 Tabel 3.7 Page Nama Field Type Size Keterangan id_page Int 5 Primary key Judul Varchar 255 Isi Text Tabel 3.8 Siswa Nama Field Type Size Keterangan no_induk Varchar 10 Primary key Password Varchar 15 nm_siswa Varchar 20 Alamat Varchar 30 tempat_lahir Varchar 15 tanggal_lahir Varchar 20 Jk Varchar 10 Agama Varchar 10 Foto Text sekolah_asal Varchar 20 nm_ortu Varchar 20 Pekerjaan Varchar 20 kd-kelas Varchar 5 Level Varchar 10
42 Tabel 3.9 Tugas Nama Field Type Size Keterangan id_tugas Int 10 Primary key Nip Varchar 50 kd_pelajaran Varchar 20 kd_kelas Varchar 4 batas_waktu Datetime 3.2.6 Flowchart Dalam perancangan sistem elearning, penggunaan flowchart merupakan alat yang tepat untk menggambarkan alur kerja dari sistem. Flowchart menjelaskan alur kerja mulai dari awal sampai akhir dari sistem yang akan dibuat. Flowchart berikut menjelaskan secara rinci alur kerja sistem elerning SMP. START Home Profile Info Pendaftaran Pendaftaran Login Isi data diri siswa Input NIP/ NIS/ Username, Level, & Password N Simpan? Benar N Y Y Menu Elearning Selamat datang di Sistem Elearning SMP Finish Gambar 3.5 Flowchart e-learning
43 3.3 Pembangunan Halaman Sistem Desain dapat didefinisikan sebagai tahap setelah analisis dari siklus pengembangan sistem: pendefinisian dari kebutuhan-kebutuhan fungsional dan persiapan untuk rancang bangun implementasi, menggambarkan bagaimana suatu sistem dibentuk. Menurut John Burch dan Garry Grudnitski dalam buku Analisa dan Desain, Sistem Informasi Pendekatan Terstruktur adalah Desain Sistem dapat didefinisikan sebagai penggambaran dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah ke dalam satu kesatuan yang utuh dan berfungsi. Tahap desain sistem mempunyai dua maksud atau tujuan utama, yaitu: 1. Untuk memenuhi kebutuhan para pemakai sistem. 2. Untuk memberikan gambaran yang jelas dan rancang bangun yang lengkap kepada pemrogram komputer dan ahli-ahli teknik lainnya yang terlibat. Tujuannya lebih condong pada desain sistem yang terinci, yaitu pembuatan rancang bangun yang jelas dan lengkap untuk nantinya digunakan untuk pembuatan program komputernya. 3.3.1 Desain Home Desain home adalah tampilan utama sisem yang muncul pertama kali di layar komputer dan digunakan untuk menerangkan menu-menu pada sistem.
44 Logo Elearning Header Tentang elearning Right side Body Kalender Footer Gambar 3.6 Desain Home 3.3.2 Desain Pendaftaran Elearning Desain pendaftaran elearning adalah halaman yang menampilkan formulir online kosong, dimana pendaftar baru harus mengisi formulir tersebut dengan data dirinya agar pendaftar dapat bergabung dengan sistem. Logo Elearning Tambah data siswa No induk Password Nama Lengkap Alamat TTL Jenis Kelamin Agama Asal sekolah Nama orangtua Kelas Upload foto Header Simpan Tentang elearning Right side Kalender Footer Gambar 3.7 Desain Pendaftaran E-learning
BAB 4 IMPLEMENTASI SISTEM 4.1 Pengertian Implementasi Sistem Implementasi sistem adalah langkah-langkah atau prosedur-prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui, untuk menguji, menginstall dan memulai sistem baru atau sistem yang diperbaiki untuk menggantikan sistem yang lama. 4.2 Tujuan Implementasi Sistem Tujuan Implementasi sistem adalah sebagai berikut: 1. Menyelesaikan desain sistem yang telah disetujui sebelumnya. 2. Memastikan bahwa pemakai (user) dapat mengoperasikan sistem baru. 3. Menguji apakah sistem baru tersebut sesuai dengan pemakai. 4. Memastikan bahwa konversi ke sistem baru berjalan yaitu dengan membuat rencana, mengontrol dan melakukan instalasi baru secara benar.
46 4.3 Komponen Utama dalam Sistem Dalam pembuatan sistem elearning SMP yang sudah dirancang membutuhkan perangkat keras (hardware), perangkat lunak (software), dan tenaga pelaksana (brainware). a. Perangkat keras (hardware) Perangkat keras yang dibutuhkan dalam pembuatan sistem elearning SMP ini antara lain: 1. Prosesor 2. Harddisk 3. Memori 4. Monitor 5. Keyboard 6. Mouse 7. Dan lain-lain b. Perangkat Lunak (software) 1. PHP, MySQL, dan Sublime Text 2 2. XAMPP Control v3.2.1 3. Anti virus untuk mengetahui terjadinya kerusakan sistem. c. Tenaga Pelaksana (Brainware) Yaitu orang yang memiliki keahlian yang baik dan mengerti sistem operasi komputer untuk menjalankan program.
47 4.4 Instalasi Apache, PHP dan MySQL Dalam menginstalasi Apache, PHP dan MySQL dilakukan secara satu per satu. Adapun softwarenya dapat diperoleh dari situs http://www.apache.org untuk Apache, http://www.php.net untuk PHP dan http://www.mysql.com untuk MySQL. Tahap instalasinya dimulai dengan menginstalasi Apache, kemudian disusul dengan menginstalasi PHP dan MySQL. Setelah instalasi selesai dilanjutkan dengan melakukan pengaturan konfigurasi yang diberikan setelah instalasi selesai. Namun hal ini memerlukan pengaturan yang sedikit rumit. 4.4.1 Menjalankan Apache, MySQL, dan PHP Untuk Menjalankan ketiga software yang digunakan dapat dilakukan dengan cara sebagai berikut: 1. Untuk menjalankan Apache, Klik Start > Programs > Apache HTTP Server 5.0.55 > Control Apache Server > Monitor Apache Servers. 2. Kemudian untuk melihat Apache telah ter-install dengan baik, tuliskan http://localhost/ di URL. Jika telah berhasil akan terlihat seperti gambar berikut ini:
48 Gambar 4.1 Uji Apache 3. Uji apakah PHP telah dapat dijalankan dengan cara tuliskan script berikut pada notepad : <?php phpinfo();?> Simpan dengan nama info.php dan letakkan di folder htdocs pada Apache. 4. Buka internet explorer dan tulis http://localhost/info.php di URL address. Jika berhasil akan tampil sebagai berikut: Gambar 4.2 Uji PHP
49 5. Uji apakah MySQL telah dapat dijalankan dengan cara jalankan command prompt dan ketikan seperti gambar berikut: Gambar 4.3 Uji MySQL 6. Maka Apache, MySQL dan PHP telah dijalankan. 4.4.2 Pengujian Website di Browser Setelah selesai mengerjakan semua halaman website yang dibuat, maka website tersebut harus di uji terlebih dahulu di browser sebelum di-upload di internet. Adapun cara menguji website di browser sebagai berikut: 1. Simpan website yang telah dibuat pada folder htdocs yang terdapat pada apache dalam folder tersendiri, misalnya C:\Program Files\Apache Group\Apache2\htdocs\elearninggun 2. Buka google chrome kemudian ketikan http://localhost/elearninggun pada URL. Jika berhasil akan tampil seperti berikut ini:
50 Gambar 4.4 Halaman Index Elearning SMP 4.5 Memperbarui Web Memperbarui situs web adalah salah satu cara untuk mempertahankan situs agar tetap dikunjungi oleh pengunjung. Dalam memperbarui situs kita harus melihat dan mengetahui apa yang sekiranya dibutuhkan oleh pengunjung. Ada beberapa hal yang dapat kita lakukan dalam memperbarui web kita yaitu : 1. Memperbarui Isi Web Suatu situs web yang baik akan selalu memperbarui isi (content) dengan baik. Dengan semakin seringnya content diperbarui (ditambah, diganti, dikoreksi) menunjukkan kepada pengunjung situs bahwa situs kita memang benar-benar terpelihara.
51 2. Mengubah Tampilan Desain Web Situs dengan wajah baru dapat menyegarkan rasa bosan pengunjung terhadap situs yang telah kita buat. Mengubah desain situs web sangat disarankan terutama jika situs web kita banyak dikunjungi dan memiliki banyak artikel didalamnya. 3. Menambah Fitur-Fitur Yang Menarik Dari berbagai teknologi web yang telah dikenal maka kita dapat membuat layanan atau fitur khusus dari situs web yang dapat menarik hati pengunjung dengan pelayanan atau fasilitas yang disediakan kemudian membuat mereka penasaran dan mengeksplorasi lebih lanjut situs web kita. Karena mungkin pengunjung akan senang dengan inovasi yang kita terapkan pada situs kita. 4.6 Demonstrasi Program Adapun tampilan program yang dirancang penulis adalah sebagai berikut: 4.6.1 Tampilan Homepage Halaman utama menampilkan sambutan dan pengenalan umum tentang apa itu Sekolah Menengah Pertama beserta kegiatan umum yang dilakukan di sekolah
52 Gambar 4.5 Tampilan Bagian Homepage 4.6.2 Tampilan Info Pendaftaran Info pendaftaran menampilkan informasi mengenai apa itu e-learning dan tujuannya bagi Sekolah Menengah Pertama. Gambar 4.6 Tampilan Info Pendaftaran
53 4.6.3 Tampilan Halaman login Halaman login menyediakan form login baik sebaga admin, guru, maupun siswa. Halaman ini harus diisi dengan username dan password yang benar sesuai level masingmasing. Gambar 4.7 Tampilan Halaman Admin 4.6.4 Tampilan Halaman Pendaftaran Menampilkan form isian yang wajib di isi siswa dengan data-datta diri yang benar agar dapat terdaftar di sistem e-learning. Gambar 4.8 Tampilan Halaman login
54 4.6.5 Tampilan Halaman Admin Halaman admin berisi form input mata pelajaran dan jadwal mengajar, serta form untuk mengelola kelas dan guru. Gambar 4.9 Tampilan Halaman Admin 4.6.6 Tampilan Halaman Guru Gambar 4.10 Tampilan Halaman Login Guru
55 4.6.7 Tampilan Halaman Login Siswa Gambar 4.11 Tampilan Halaman Login Siswa 4.6.8 Tampilan Unduh Materi Gambar 4.12 Halaman Unduh Materi
56 4.6.9 Tampilan Halaman Tugas Siswa Halaman tugas siswa menampikan soal-soal tugas siswa yang telah di-upload oleh guru. Soal-soal tersebut harus dikerjakan oleh setiap siswa, dan dikerjakan secara online. Gambar 4.13 Halaman Tugas Siswa
BAB 5 KESIMPULAN DAN SARAN 5.1 Kesimpulan Setelah dilakukannya pembahasan kembali oleh penulis, penulis akhirnya dapat membuat kesimpulan sebagai berikut : 1. Website sistem elearning SMP ini adalah sarana pembelajaran secara online yang dapat diakses oleh pihak-pihak yang terdaftar dalam sistem. 2. Website Sistem elearning SMP ini menyajikan halaman berbagi pakai file yang dapat di-upload oleh guru dan diunduh oleh siswa 3. Website sistem elearning SMP ini juga menyajikan tempat untuk mengerjakan tugas, mengerjakan ujian, dan menghitung nilai siswa secara online. 5.2 Saran Dalam mengakhiri penulisan Tugas Akhir, penulis menyampaikan saran yaitu jadikanlah website ini sebagai sarana pengembangan sistem belajar-mengajar yang efektif bagi semua pihak yang berkepentingan, khususnya di lingkungan Sekolah Menengah Pertama,serta pergunakanlah website ini untuk kepentingan pendidikan yang benar-benar berisi nilai edukasi yang posistif demi kemajuan pendidikan Indonesia.