ºÝºÝߣ

ºÝºÝߣShare a Scribd company logo

Bab 4 les online

•Download as DOC, PDF•
•
Thion PlusMinus
Thion PlusMinus

bab 4 tentang les online

1 of 22
Downloaded 20 times
BAB IV HASIL DAN PEMBAHASAN 4.1 Pemaparan Hasil Analisis dan Desain 4.1.1 Analisis Sistem Analisis dilakukan terhadap permasalahan untuk mengetahui batasan- batasan sistem pembelajaran yang ada pada LKP MEC Kraksaan dan menentukan cara yang paling efektif dan efisien dalam penyelesaian masalahnya. 4.1.1.1 Analisis Permasalahan Sistem yang Berjalan Analisa sistem ini akan menguraikan sistem secara utuh ke dalam bagian komponen-komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan, kesempatan, hambatan yang terjadi dan kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan. Penguraian akan dimulai dari sistem yang berjalan dengan menjabarkan identifikasi masalah serta peluang dari pemecahan solusi. Identifikasi masalah yang didapat penulis adalah sebagai berikut : 1. Sistem pembelajaran yang dilakukan masih manual seperti pencatatan data siswa dan instruktur ke dalam buku besar, proses pembelajaran hanya terjadi di ruang kelas sehingga setelah kelas selesai tidak terdapat interaksi antara murid di luar jam dan tempat kursus. 2. Siswa mendapatkan materi pelajaran dari instruktur, buku paket dari Lembaga maupun referensi buku di perpustakaan daerah atau sekolahnya, sehingga terjadi keterbatasan tempat dan waktu untuk mengaksesnya. 3. Siswa kurang dapat mengeksplorasi kemampuan mereka dalam melakukan pemanfaatan koneksi internet. Permasalahan yang ada dapat diatasi dengan pekerjaan yang melibatkan teknologi komputer. Sistem perlu mengalami perubahan dan perkembangan karena tidak dapat memenuhi kebutuhan. Berdasarkan analisis sistem yang dilakukan, penulis menemukan kelemahan dari sistem yang sedang berjalan dalam sistem pembelajaran pada LKP MEC Kraksaan, yaitu : 29
1. Sistem pembelajaran terkesan monoton sehingga perlu dirancang alternatif sistem pembelajaran yang baru dan kreatif. 2. Sistem pembelajaran masih bersifat satu arah sehingga kurang merangsang kreatifitas dan minat siswa dalam belajar. 3. Kurangnya waktu untuk mendiskusikan materi sehingga perlu adanya media diskusi yang lebih efisien. 4.1.1.2 Analisis Kebutuhan Sistem Baru Pembelajaran di LKP MEC Kraksaan sudah cukup bagus, akan tetapi sistem yang ada akan lebih maksimal jika dikombinasikan dengan sistem pembelajaran yang baru berbasis web. Berdasarkan permasalahan- permasalahan yang telah dikemukakan sebelumnya, maka perlu dibangun sebuah sistem yang dapat mengatasi permasalahan-permasalahan tersebut. Sistem yang akan dibangun diharapkan: a. Informasi yang telah diolah bersifat akurat dan relevan sehingga minim kesalahan atau bahkan tanpa kesalahan. b. Sistem diharapkan dapat mengamankan data dari kerusakan, kehilangan dan pengaksesan data dari orang yang tidak berkepentingan. c. Sistem informasi yang disajikan bisa lebih interaktif. Informasi- informasi pembelajaran juga bisa real time. Begitu pula dengan komunikasinya, meskipun tidak secara langsung tatap muka, tetapi forum diskusi bisa dilakukan. d. Tampilan yang menarik dan user friendly sehinngga memudahkan pengguna dalam mengoperasikan. 4.1.2 Desain Sistem Perancangan suatu sistem atau desain sistem bertujuan untuk memberikan gambaran secara umum kepada user tentang sistem yang baru. Proses mengerjakan, mengilustrasikan, merencanakan, membuat gambar atau menyusun beberapa elemen kedalam suatu kesatuan unit yang utuh. Dari uraian sebelumnya dapat diketahui sasaran yang harus dicapai diantaranya adalah: 1. Desain sistem harus lebih tepat dan akurat dari sistem sebelumnya. 2. Desain sistem berfungsi mendukung pengolahan data 30
3. Desain sistem harus bermanfaat dan mudah dimengerti oleh user. 4. Desain sistem harus mampu mendukung tujuan pokok dan misi lembaga. Dalam mendesain sistem perlu adanya formulasi model untuk menggambarkan data fisik sistem dan hubungan prosedur yang saling berinteraksi. Perangkat akan dipakai dalam mendesain sistem yaitu System Flow Chart, Data Flow Diagram dan Entity Relationship Diagram 4.1.2.1 System Flow Chart System Flow Chart menggambarkan alur kerja dari sistem informasi LKP MEC Kraksaan. Berikut ini gambar System Flow Chart Terkomputerisasi yang akan dihasilkan pada software sistem informasinya. 31
a. Sistem Flowchart Pengelolaan Administrator Gambar 4.1 Flowchart Pengelolaan Administrator 32
b. Sistem Flowchart Pengelolaan Instruktur 7 Gambar 4.2 Flowchart Pengelolaan Instruktur c. Sistem Flowchart Pengelolaan Peserta didik Gambar 4.2 Flowchart Pengelolaan Peserta didik 33
4.1.2.2 Arus Data Arus data merupakan aliran yang menunjukan arus data yang dapat berupa masukan untuk sistem dan dapat di gambarkan dengan menggunakan simbo-simbol standart yang telah di tetapkan. 4.1.2.2.1 Context Diagram Context diagram dalam level ini menggambarkan bagaimana hubungan antara entity, proses dan data secara global, dalam level ini, proses yang ada hanya di gambarkan dalam sebuah sistem dengan mengasumsikan sistem tersebut sebagai sebuah proses yang terdiri dari sekumpulan proses. View Daftar Nilai Daftar Nilai View Vocabulary View Materi Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi Jawaban diskusi upload vocabulary nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal Baca materi pencarian vocabulary View data peserta didik View data instruktur View data admin data peserta didik data instruktur data admin 0 SI Kursus Online + Admin Peserta didik Instruktur Gambar 4.3 Context Diagram 34
4.1.2.2.2 Bagan Berjenjang Setelah penggambaran Context Diagram kemudian akan dilanjutkan dengan penggambaran yang lebih terinci lagi dengan menggambarkan bagan berjenjang. Gambar 4.4 Bagan Berjenjang 35
4.1.2.2.3 DFD (Data Flow Diagram) Data Flow Diagram adalah diagram yang menggambarkan alir data dari suatu sistem yang diperinci menjadi beberapa level. a. DFD (Data Flow Diagram) Level 1 Daftar nilai View Daftar Nilai View Vocabulary View Materi soal detail soal detail listening nilai nilai listening materi data instruktur data peserta didilk data admin data peserta didik data instruktur vocabulary diskusi komentar Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi Jawaban diskusi upload vocabulary nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal Baca materi pencarian vocabulary View data peserta didik View data instruktur View data admin data peserta didik data instruktur data admin Admin Peserta didik Instruktur 1 Pemeliharaan Data + 2 Pembelajaran + 3 Laporan + Admin Siswa Guru Vocab Materi Dtllistening Listening Komen Diskusi Dtlsoal Soal Nilai Gambar 4.5 Data Flow Diagram Level 1 36
b. DFD (Data Flow Diagram) Level 2 a. Proses Pemeliharaan Data data instruktur data peserta didilk View data peserta didik data peserta didik View data instruktur data instruktur View data admin data admin data admin Admin Admin Siswa Guru 1 Administrator 2 Instruktur 3 Peserta Didik Gambar 4.6 DFD Level 2 Proses Pemeliharaan Data b. Proses Pembelajaran View Vocabulary View Materi detail listening listening soal detail soal detail listeninglistening materi nilai data peserta didik data instruktur vocabulary diskusi komentar Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi upload vocabulary Jawaban diskusi nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal pencarian vocabulary Baca materi Peserta didik Instruktur Komen Diskusi Vocab Guru Siswa Materi Listening Nilai Dtllistening Dtlsoal Soal 1 Materi 2 Vocabulary 3 Soal 4 Diskusi 37
Gambar 4.7 DFD Level 2 Proses Pembelajaran c. Proses Laporan View Daftar Nilai Daftar nilai nilai Nilai 1 Nilai Admin Gambar 4.8 DFD Level 2 Proses Laporan 4.1.2.3 Entity Relationship Diagram ER-Diagram (Entity Relationship Diagram) dirancang untuk dapat memahami hubungan antar tabel yang ada pada perancangan sistem informasi kursus online. Dalam hubungan entitas akan dijelaskan beberapa pola, baik hubungan banyak ke banyak, banyak ke satu dan satu ke satu. Berikut gambar bentuk ER-Diagram : 38 merespo n Diskusi melakuk an Komen memiliki Instruktur Materi memberi Vocab memberi dtllistening Listeningmemberi memiliki dtlsoal memberi memilikiSoal PesertaDidik Nila i n n 1 1 1 m 1 n 1 n1 1 1 n n 1 n n 1 1
Gambar 4.9 Entity Relationship Diagram Kamus Data: Instruktur : {id_guru, nama, alamat, jekel, no_hp, ijazah, thn_masuk, username, password, foto, aktif } PesertaDidik : {id_siswa, nama, alamat, no_hp, jekel, ijazah, sekolah, thn_masuk, tgl_lahir, level, username, password, foto, aktif } Materi : {id_materi, id_guru, judul, tanggal, jam, total, isi, foto, file, aktif} Vocab : {id_vocab, id_guru, nama, arti, bunyi} Soal : {id_soal, id_guru, judul, jam, menit, tanggal, level, aktif} Dtlsoal : {id_dtlsoal, id_soal, tanya, A, B, C, D, benar, bunyi, aktif} Nilai : {id_siswa, id_soal, level, tanggal, nilai} Listening : {id_listening, id_guru, judul, tanggal, jam, menit, level, aktif} Dtllistening : {id_dtllistening, id_listening, tanya, A, B, C, D, benr, bunyi, aktif} Diskusi : { id_diskusi, id, status, tanggal, jam, isi} Komen : {id_komen, id_diskusi, id, status, tanggal, jam, isi } 4.1.3 Desain Program Setelah seluruh kebutuhan sistem dianalisis dengan tiga perangkat analisis di atas, langkah selanjutnya yang harus dilakukan adalah membuat desain fisik sistem yang mencakup desain database, desain input, desain output, dan desain menu. 4.1.3.1 Desain Database Dalam database yang akan menampung seluruh jenis data, maka harus ada pola struktur database yang baik agar tidak terjadi redudansi dan inkonsistensi data. Dalam perancangan sistem informasi penjualan yang akan dirancang, database dibuat dengan menggunakan aplikasi MySQL phpMyAdmin yang terdiri dari beberapa tabel. Untuk lebih 39
memudahkan pemetaan, maka diklasifikasikan tabel-tabel tersebut antara lain: c. Struktur Database Database yang diusulkan dalam program sistem informasi kursus di LKP MEC adalah sebagai berikut : 1. Tabel Admin Tabel 4.1 Tabel Admin 2. Tabel Diskusi Tabel 4.2 Tabel Diskusi 3. Tabel Dtllistening Tabel 4.3 Tabel Dtllistening 40
4. Tabel Dtlsoal Tabel 4.4 Tabel Dtlsoal 5. Tabel Guru Tabel 4.5 Tabel Guru 6. Tabel Komen Tabel 4.6 Tabel Komen 41
7. Tabel Listening Tabel 4.7 Tabel Listening 8. Tabel Materi Tabel 4.8 Tabel Materi 9. Tabel Nilai Tabel 4.9 Tabel Nilai 42
10. Tabel Siswa Tabel 4.10 Tabel Siswa 11. Tabel Soal Tabel 4.11 Tabel Soal 12. Tabel Vocab Tabel 4.12 Tabel Vocab 43
4.1.3.2 Design Input Output Dari perancangan yang ada, maka dapat kita buat beberapa form sebagai masukan adalah sebagai berikut: a. Perancangan Menu Perekaman Data b. Form Pendataan Administrator c. Design Input Data Administrator Tambah Data Admin Nama : XXXXXXXXXXXXXXXX Username* : XXXXXXXXXXXXXXX *default password sama dengan username No. HP : XXXXXXXX Jekel : YY/MM/DD Level : XXXXXXX Foto : XXXXXX Alamat : XXXXXXXXXXXXXXXXXXX Asal_Sklh : XXXXXXX Kode_Krsus : 12X Tgl_Masuk : YY/MM/DD No_Telp : 123 Nama_ortu : XXXXXXX KOREKSI SIMPA N HAPU S KELUAR Tabel 4.10 Design Input Pendaftaran Siswa 44
Tambah Data Admin Nama : XXXXXXXXXXXXXXXX Username* : XXXXXXXXXXXXXXX *default password sama dengan username No. HP : XXXXXXXX Jekel : YY/MM/DD Level : XXXXXXX Foto : XXXXXX Alamat : XXXXXXXXXXXXXXXXXXX Asal_Sklh : XXXXXXX Kode_Krsus : 12X Tgl_Masuk : YY/MM/DD No_Telp : 123 Nama_ortu : XXXXXXX d. Form Paket Kursus Design Input Perekaman Data Paket Kursus Input Paket Kursus Kode_Krsus : 12X Nama_Krsus : XXXXXXXXXXX Jenjang : XXXXXXX Jadwal_Krsus : XXXX Waktu_Krsus : 00:00:00 45
Biaya_Krsus : 2333333333 KOREKSI SIMPA N HAPU S KELUAR Tabel 4.11 Design Input Data Paket Kursus e. Form Instruktur Design Input Perekaman Data Instruktur Input Instruktur Kode_Instr : 123XX Nama_Instr : XXXXXXXXXXXXXXXXX Tempat_Lhr : YY/MM/DD 46
Tgl_lhr : XXXXXXXX Pendidikan : MM/DD/YY Agama : XXXXXXX Jen_Kel : XXXXXXXXXXXXX Alamat : XXXXXX Keahlian_Inst : XXXXXXX Tgl_Masuk : YY/MM/DD No_Telp : 123 KOREKSI SIMPA N HAPU S KELUAR Tabel 4.12 Design Input Data Instruktur 4.5.1. Perancangan Sub Menu Transaksi a. Form Absensi 47
Design Input Transaksi Absensi Siswa Input Absensi NIS : 123XX Kd_Kursus : X123 Masuk : 10XX Ijin : 12XX Absent : 2XX Total_Pertemuan : 24X KOREKSI SIMPA N HAPU S KELUAR Tabel 4.13 Design Input Absensi Siswa b. Form Transaksi Nilai Siswa Design Input Transaksi Nilai Siswa Input Nilai Nm_Siswa : 123XX Kd_Kursus : X123 Nilai : 89 Keterangan : XXXXXXXXX KOREKSI SIMPA N HAPU S KELUAR Tabel 4.14 Design Input Nilai Siswa 48
4.5.2. Perancangan Form Sub Menu Laporan. a. Design input Laporan Data Siswa Kursus. NIS Nama Alamat Telp Kd_Krsus Tgl_Msuk 123 XXXXX XXXX 123 XXXX yy-mm-dd 124 XXXXXX XXXX 1245 XXXXX yy-mm-dd Tabel 4.15 Design Laporan Data Siswa Kursus b. Design input Laporan Data Kehadiran Siswa (Absensi). Kd_Instr Nama Alamat Telp Keahlian Kd_Krsus XXX XXXXX XXXX 123 XXXX XXXX XXX XXXXXX XXXX 1245 XXXXX XXXX Tabel 4.16 Design Laporan Data Kehadiran Siswa c. Design input Laporan Data Nilai. NIS Kd_Kursus Nilai Ket 123 XXXXX 12 XXX 124 XXXXXX 13 XXX Tabel 4.17 Design Laporan Data Nilai 5.3.2 Desain Input Desain input akan menggambarkan rancangan tampilan interface perangkat lunak dalam proses memasukkan data. Desain input untuk master data diaplikasikan pada: 5.3.3 Desain Output Desain output merupakan bentuk keluaran yang berisi informasi hasil pengolahan data sebagai media laporan yang berisikan nota penjualan barang beserta stok akhir dan laporan penjualan dalam periode tertentu. 49
5.3.4 Desain Menu/Navigasi Setelah desain input dan output diimplementasikan dalam bentuk modul program, langkah selanjutnya yang harus ditempuh adalah mengorganisasikan modul melalui sistem navigasi. Navigasi juga menjadi hal yang sangat penting dalam sebuah sistem program yang berfungsi untuk membantu pengguna (user) dalam menjelajah sistem kita untuk mencari informasi yang diinginkan secara mudah. Navigasi yang bagus mencerminkan struktur website yang sangat baik. Kadangkala ditemukan beberapa format navigasi, diantaranya: Papan Navigasi (Navigation Panel) - Bisanya dalam bentuk menu-menu yang tersusun rapi. - Sebaiknya diatur link pada bagian kiri (dari tangan Anda) atau di bagian atas dari sebuah halaman web. - Dapat berupa teks maupun grafik. - Harus mengambil ruang yang tidak terlalu banyak. - Posisi navigasi sebaiknya konsisten pada setiap halamannya. Jika terpaksa menggunakan warna yang berbeda, pastikan bagian tersebut masih merupakan satu kesatuan. Navigasi didesain dengan pola menu drop down yaitu menu horisontal yang terdapat di bawah header program. Dan apabila mouse kita letakkan ke salah satu menu tersebut akan muncul sub menu yang susunannya ke bawah. yang tentunya menu yang berkaitan. Berikut desain interface menu sistem : 1. Interface Halaman Depan 2. Interface Halaman Admin 4.2 Implementasi 4.3 Hasil Uji 50

More Related Content

Bab 4 les online

  • 1. BAB IV HASIL DAN PEMBAHASAN 4.1 Pemaparan Hasil Analisis dan Desain 4.1.1 Analisis Sistem Analisis dilakukan terhadap permasalahan untuk mengetahui batasan- batasan sistem pembelajaran yang ada pada LKP MEC Kraksaan dan menentukan cara yang paling efektif dan efisien dalam penyelesaian masalahnya. 4.1.1.1 Analisis Permasalahan Sistem yang Berjalan Analisa sistem ini akan menguraikan sistem secara utuh ke dalam bagian komponen-komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan, kesempatan, hambatan yang terjadi dan kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan. Penguraian akan dimulai dari sistem yang berjalan dengan menjabarkan identifikasi masalah serta peluang dari pemecahan solusi. Identifikasi masalah yang didapat penulis adalah sebagai berikut : 1. Sistem pembelajaran yang dilakukan masih manual seperti pencatatan data siswa dan instruktur ke dalam buku besar, proses pembelajaran hanya terjadi di ruang kelas sehingga setelah kelas selesai tidak terdapat interaksi antara murid di luar jam dan tempat kursus. 2. Siswa mendapatkan materi pelajaran dari instruktur, buku paket dari Lembaga maupun referensi buku di perpustakaan daerah atau sekolahnya, sehingga terjadi keterbatasan tempat dan waktu untuk mengaksesnya. 3. Siswa kurang dapat mengeksplorasi kemampuan mereka dalam melakukan pemanfaatan koneksi internet. Permasalahan yang ada dapat diatasi dengan pekerjaan yang melibatkan teknologi komputer. Sistem perlu mengalami perubahan dan perkembangan karena tidak dapat memenuhi kebutuhan. Berdasarkan analisis sistem yang dilakukan, penulis menemukan kelemahan dari sistem yang sedang berjalan dalam sistem pembelajaran pada LKP MEC Kraksaan, yaitu : 29
  • 2. 1. Sistem pembelajaran terkesan monoton sehingga perlu dirancang alternatif sistem pembelajaran yang baru dan kreatif. 2. Sistem pembelajaran masih bersifat satu arah sehingga kurang merangsang kreatifitas dan minat siswa dalam belajar. 3. Kurangnya waktu untuk mendiskusikan materi sehingga perlu adanya media diskusi yang lebih efisien. 4.1.1.2 Analisis Kebutuhan Sistem Baru Pembelajaran di LKP MEC Kraksaan sudah cukup bagus, akan tetapi sistem yang ada akan lebih maksimal jika dikombinasikan dengan sistem pembelajaran yang baru berbasis web. Berdasarkan permasalahan- permasalahan yang telah dikemukakan sebelumnya, maka perlu dibangun sebuah sistem yang dapat mengatasi permasalahan-permasalahan tersebut. Sistem yang akan dibangun diharapkan: a. Informasi yang telah diolah bersifat akurat dan relevan sehingga minim kesalahan atau bahkan tanpa kesalahan. b. Sistem diharapkan dapat mengamankan data dari kerusakan, kehilangan dan pengaksesan data dari orang yang tidak berkepentingan. c. Sistem informasi yang disajikan bisa lebih interaktif. Informasi- informasi pembelajaran juga bisa real time. Begitu pula dengan komunikasinya, meskipun tidak secara langsung tatap muka, tetapi forum diskusi bisa dilakukan. d. Tampilan yang menarik dan user friendly sehinngga memudahkan pengguna dalam mengoperasikan. 4.1.2 Desain Sistem Perancangan suatu sistem atau desain sistem bertujuan untuk memberikan gambaran secara umum kepada user tentang sistem yang baru. Proses mengerjakan, mengilustrasikan, merencanakan, membuat gambar atau menyusun beberapa elemen kedalam suatu kesatuan unit yang utuh. Dari uraian sebelumnya dapat diketahui sasaran yang harus dicapai diantaranya adalah: 1. Desain sistem harus lebih tepat dan akurat dari sistem sebelumnya. 2. Desain sistem berfungsi mendukung pengolahan data 30
  • 3. 3. Desain sistem harus bermanfaat dan mudah dimengerti oleh user. 4. Desain sistem harus mampu mendukung tujuan pokok dan misi lembaga. Dalam mendesain sistem perlu adanya formulasi model untuk menggambarkan data fisik sistem dan hubungan prosedur yang saling berinteraksi. Perangkat akan dipakai dalam mendesain sistem yaitu System Flow Chart, Data Flow Diagram dan Entity Relationship Diagram 4.1.2.1 System Flow Chart System Flow Chart menggambarkan alur kerja dari sistem informasi LKP MEC Kraksaan. Berikut ini gambar System Flow Chart Terkomputerisasi yang akan dihasilkan pada software sistem informasinya. 31
  • 4. a. Sistem Flowchart Pengelolaan Administrator Gambar 4.1 Flowchart Pengelolaan Administrator 32
  • 5. b. Sistem Flowchart Pengelolaan Instruktur 7 Gambar 4.2 Flowchart Pengelolaan Instruktur c. Sistem Flowchart Pengelolaan Peserta didik Gambar 4.2 Flowchart Pengelolaan Peserta didik 33
  • 6. 4.1.2.2 Arus Data Arus data merupakan aliran yang menunjukan arus data yang dapat berupa masukan untuk sistem dan dapat di gambarkan dengan menggunakan simbo-simbol standart yang telah di tetapkan. 4.1.2.2.1 Context Diagram Context diagram dalam level ini menggambarkan bagaimana hubungan antara entity, proses dan data secara global, dalam level ini, proses yang ada hanya di gambarkan dalam sebuah sistem dengan mengasumsikan sistem tersebut sebagai sebuah proses yang terdiri dari sekumpulan proses. View Daftar Nilai Daftar Nilai View Vocabulary View Materi Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi Jawaban diskusi upload vocabulary nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal Baca materi pencarian vocabulary View data peserta didik View data instruktur View data admin data peserta didik data instruktur data admin 0 SI Kursus Online + Admin Peserta didik Instruktur Gambar 4.3 Context Diagram 34
  • 7. 4.1.2.2.2 Bagan Berjenjang Setelah penggambaran Context Diagram kemudian akan dilanjutkan dengan penggambaran yang lebih terinci lagi dengan menggambarkan bagan berjenjang. Gambar 4.4 Bagan Berjenjang 35
  • 8. 4.1.2.2.3 DFD (Data Flow Diagram) Data Flow Diagram adalah diagram yang menggambarkan alir data dari suatu sistem yang diperinci menjadi beberapa level. a. DFD (Data Flow Diagram) Level 1 Daftar nilai View Daftar Nilai View Vocabulary View Materi soal detail soal detail listening nilai nilai listening materi data instruktur data peserta didilk data admin data peserta didik data instruktur vocabulary diskusi komentar Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi Jawaban diskusi upload vocabulary nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal Baca materi pencarian vocabulary View data peserta didik View data instruktur View data admin data peserta didik data instruktur data admin Admin Peserta didik Instruktur 1 Pemeliharaan Data + 2 Pembelajaran + 3 Laporan + Admin Siswa Guru Vocab Materi Dtllistening Listening Komen Diskusi Dtlsoal Soal Nilai Gambar 4.5 Data Flow Diagram Level 1 36
  • 9. b. DFD (Data Flow Diagram) Level 2 a. Proses Pemeliharaan Data data instruktur data peserta didilk View data peserta didik data peserta didik View data instruktur data instruktur View data admin data admin data admin Admin Admin Siswa Guru 1 Administrator 2 Instruktur 3 Peserta Didik Gambar 4.6 DFD Level 2 Proses Pemeliharaan Data b. Proses Pembelajaran View Vocabulary View Materi detail listening listening soal detail soal detail listeninglistening materi nilai data peserta didik data instruktur vocabulary diskusi komentar Pertanyaan Diskusi Jawaban diskusi Soal dan jawaban upload materi upload vocabulary Jawaban diskusi nilai download materi vocabulary Forum komentar Pertanyaan Diskusi Ujian Latihan soal pencarian vocabulary Baca materi Peserta didik Instruktur Komen Diskusi Vocab Guru Siswa Materi Listening Nilai Dtllistening Dtlsoal Soal 1 Materi 2 Vocabulary 3 Soal 4 Diskusi 37
  • 10. Gambar 4.7 DFD Level 2 Proses Pembelajaran c. Proses Laporan View Daftar Nilai Daftar nilai nilai Nilai 1 Nilai Admin Gambar 4.8 DFD Level 2 Proses Laporan 4.1.2.3 Entity Relationship Diagram ER-Diagram (Entity Relationship Diagram) dirancang untuk dapat memahami hubungan antar tabel yang ada pada perancangan sistem informasi kursus online. Dalam hubungan entitas akan dijelaskan beberapa pola, baik hubungan banyak ke banyak, banyak ke satu dan satu ke satu. Berikut gambar bentuk ER-Diagram : 38 merespo n Diskusi melakuk an Komen memiliki Instruktur Materi memberi Vocab memberi dtllistening Listeningmemberi memiliki dtlsoal memberi memilikiSoal PesertaDidik Nila i n n 1 1 1 m 1 n 1 n1 1 1 n n 1 n n 1 1
  • 11. Gambar 4.9 Entity Relationship Diagram Kamus Data: Instruktur : {id_guru, nama, alamat, jekel, no_hp, ijazah, thn_masuk, username, password, foto, aktif } PesertaDidik : {id_siswa, nama, alamat, no_hp, jekel, ijazah, sekolah, thn_masuk, tgl_lahir, level, username, password, foto, aktif } Materi : {id_materi, id_guru, judul, tanggal, jam, total, isi, foto, file, aktif} Vocab : {id_vocab, id_guru, nama, arti, bunyi} Soal : {id_soal, id_guru, judul, jam, menit, tanggal, level, aktif} Dtlsoal : {id_dtlsoal, id_soal, tanya, A, B, C, D, benar, bunyi, aktif} Nilai : {id_siswa, id_soal, level, tanggal, nilai} Listening : {id_listening, id_guru, judul, tanggal, jam, menit, level, aktif} Dtllistening : {id_dtllistening, id_listening, tanya, A, B, C, D, benr, bunyi, aktif} Diskusi : { id_diskusi, id, status, tanggal, jam, isi} Komen : {id_komen, id_diskusi, id, status, tanggal, jam, isi } 4.1.3 Desain Program Setelah seluruh kebutuhan sistem dianalisis dengan tiga perangkat analisis di atas, langkah selanjutnya yang harus dilakukan adalah membuat desain fisik sistem yang mencakup desain database, desain input, desain output, dan desain menu. 4.1.3.1 Desain Database Dalam database yang akan menampung seluruh jenis data, maka harus ada pola struktur database yang baik agar tidak terjadi redudansi dan inkonsistensi data. Dalam perancangan sistem informasi penjualan yang akan dirancang, database dibuat dengan menggunakan aplikasi MySQL phpMyAdmin yang terdiri dari beberapa tabel. Untuk lebih 39
  • 12. memudahkan pemetaan, maka diklasifikasikan tabel-tabel tersebut antara lain: c. Struktur Database Database yang diusulkan dalam program sistem informasi kursus di LKP MEC adalah sebagai berikut : 1. Tabel Admin Tabel 4.1 Tabel Admin 2. Tabel Diskusi Tabel 4.2 Tabel Diskusi 3. Tabel Dtllistening Tabel 4.3 Tabel Dtllistening 40
  • 13. 4. Tabel Dtlsoal Tabel 4.4 Tabel Dtlsoal 5. Tabel Guru Tabel 4.5 Tabel Guru 6. Tabel Komen Tabel 4.6 Tabel Komen 41
  • 14. 7. Tabel Listening Tabel 4.7 Tabel Listening 8. Tabel Materi Tabel 4.8 Tabel Materi 9. Tabel Nilai Tabel 4.9 Tabel Nilai 42
  • 15. 10. Tabel Siswa Tabel 4.10 Tabel Siswa 11. Tabel Soal Tabel 4.11 Tabel Soal 12. Tabel Vocab Tabel 4.12 Tabel Vocab 43
  • 16. 4.1.3.2 Design Input Output Dari perancangan yang ada, maka dapat kita buat beberapa form sebagai masukan adalah sebagai berikut: a. Perancangan Menu Perekaman Data b. Form Pendataan Administrator c. Design Input Data Administrator Tambah Data Admin Nama : XXXXXXXXXXXXXXXX Username* : XXXXXXXXXXXXXXX *default password sama dengan username No. HP : XXXXXXXX Jekel : YY/MM/DD Level : XXXXXXX Foto : XXXXXX Alamat : XXXXXXXXXXXXXXXXXXX Asal_Sklh : XXXXXXX Kode_Krsus : 12X Tgl_Masuk : YY/MM/DD No_Telp : 123 Nama_ortu : XXXXXXX KOREKSI SIMPA N HAPU S KELUAR Tabel 4.10 Design Input Pendaftaran Siswa 44
  • 17. Tambah Data Admin Nama : XXXXXXXXXXXXXXXX Username* : XXXXXXXXXXXXXXX *default password sama dengan username No. HP : XXXXXXXX Jekel : YY/MM/DD Level : XXXXXXX Foto : XXXXXX Alamat : XXXXXXXXXXXXXXXXXXX Asal_Sklh : XXXXXXX Kode_Krsus : 12X Tgl_Masuk : YY/MM/DD No_Telp : 123 Nama_ortu : XXXXXXX d. Form Paket Kursus Design Input Perekaman Data Paket Kursus Input Paket Kursus Kode_Krsus : 12X Nama_Krsus : XXXXXXXXXXX Jenjang : XXXXXXX Jadwal_Krsus : XXXX Waktu_Krsus : 00:00:00 45
  • 18. Biaya_Krsus : 2333333333 KOREKSI SIMPA N HAPU S KELUAR Tabel 4.11 Design Input Data Paket Kursus e. Form Instruktur Design Input Perekaman Data Instruktur Input Instruktur Kode_Instr : 123XX Nama_Instr : XXXXXXXXXXXXXXXXX Tempat_Lhr : YY/MM/DD 46
  • 19. Tgl_lhr : XXXXXXXX Pendidikan : MM/DD/YY Agama : XXXXXXX Jen_Kel : XXXXXXXXXXXXX Alamat : XXXXXX Keahlian_Inst : XXXXXXX Tgl_Masuk : YY/MM/DD No_Telp : 123 KOREKSI SIMPA N HAPU S KELUAR Tabel 4.12 Design Input Data Instruktur 4.5.1. Perancangan Sub Menu Transaksi a. Form Absensi 47
  • 20. Design Input Transaksi Absensi Siswa Input Absensi NIS : 123XX Kd_Kursus : X123 Masuk : 10XX Ijin : 12XX Absent : 2XX Total_Pertemuan : 24X KOREKSI SIMPA N HAPU S KELUAR Tabel 4.13 Design Input Absensi Siswa b. Form Transaksi Nilai Siswa Design Input Transaksi Nilai Siswa Input Nilai Nm_Siswa : 123XX Kd_Kursus : X123 Nilai : 89 Keterangan : XXXXXXXXX KOREKSI SIMPA N HAPU S KELUAR Tabel 4.14 Design Input Nilai Siswa 48
  • 21. 4.5.2. Perancangan Form Sub Menu Laporan. a. Design input Laporan Data Siswa Kursus. NIS Nama Alamat Telp Kd_Krsus Tgl_Msuk 123 XXXXX XXXX 123 XXXX yy-mm-dd 124 XXXXXX XXXX 1245 XXXXX yy-mm-dd Tabel 4.15 Design Laporan Data Siswa Kursus b. Design input Laporan Data Kehadiran Siswa (Absensi). Kd_Instr Nama Alamat Telp Keahlian Kd_Krsus XXX XXXXX XXXX 123 XXXX XXXX XXX XXXXXX XXXX 1245 XXXXX XXXX Tabel 4.16 Design Laporan Data Kehadiran Siswa c. Design input Laporan Data Nilai. NIS Kd_Kursus Nilai Ket 123 XXXXX 12 XXX 124 XXXXXX 13 XXX Tabel 4.17 Design Laporan Data Nilai 5.3.2 Desain Input Desain input akan menggambarkan rancangan tampilan interface perangkat lunak dalam proses memasukkan data. Desain input untuk master data diaplikasikan pada: 5.3.3 Desain Output Desain output merupakan bentuk keluaran yang berisi informasi hasil pengolahan data sebagai media laporan yang berisikan nota penjualan barang beserta stok akhir dan laporan penjualan dalam periode tertentu. 49
  • 22. 5.3.4 Desain Menu/Navigasi Setelah desain input dan output diimplementasikan dalam bentuk modul program, langkah selanjutnya yang harus ditempuh adalah mengorganisasikan modul melalui sistem navigasi. Navigasi juga menjadi hal yang sangat penting dalam sebuah sistem program yang berfungsi untuk membantu pengguna (user) dalam menjelajah sistem kita untuk mencari informasi yang diinginkan secara mudah. Navigasi yang bagus mencerminkan struktur website yang sangat baik. Kadangkala ditemukan beberapa format navigasi, diantaranya: Papan Navigasi (Navigation Panel) - Bisanya dalam bentuk menu-menu yang tersusun rapi. - Sebaiknya diatur link pada bagian kiri (dari tangan Anda) atau di bagian atas dari sebuah halaman web. - Dapat berupa teks maupun grafik. - Harus mengambil ruang yang tidak terlalu banyak. - Posisi navigasi sebaiknya konsisten pada setiap halamannya. Jika terpaksa menggunakan warna yang berbeda, pastikan bagian tersebut masih merupakan satu kesatuan. Navigasi didesain dengan pola menu drop down yaitu menu horisontal yang terdapat di bawah header program. Dan apabila mouse kita letakkan ke salah satu menu tersebut akan muncul sub menu yang susunannya ke bawah. yang tentunya menu yang berkaitan. Berikut desain interface menu sistem : 1. Interface Halaman Depan 2. Interface Halaman Admin 4.2 Implementasi 4.3 Hasil Uji 50