SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG
Diajukan sebagai salah satu syarat meraih gelar Sarjana Komputer (S.Kom) pada Sekolah Tinggi Manajemen Informatika dan Komputer (STMIK) Indonesia Padang.

STMIK INDONESIA

Oleh:

Nama No Bp

: Renaldi : 4744

Program Studi : Strata -1 Sistem Informasi

YAYASAN AMAL BAKTI MUKMIN INDONESIA SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER STMIK INDONESIA PADANG 2011

HALAMAN PENGESAHAN

Pimpinan Sekolah Tinggi Manajemen Informatika Komputer (STMIK) Indonesia Padang, Menyatakan bahwa Proyek Akhir / Skripsi:

Nama No Bp

: Renaldi : 4744

Program Studi : Strata -1 Sistem Informasi Judul Skripsi : Analisa dan perancangan E-learning berbasis web pada SMK Adzkia Padang

Telah diterima dan disyahkan sebagai salah satu syarat meraih gelar Sarjana Komputer (S.Kom) pada Sekolah Tinggi Manajemen Informatika dan Komputer (STMIK) Indonesia Padang.

Padang, 19 September 2011 Dosen Pembimbing

Ir.Hj.Nurmi, M.Kom Mengetahui,

Ketua STMIK Indonesia

Koordinator Program Studi S1 Sistem Informasi

Prof. Dr.Hj. Safni, M. Eng

NIP: 1967 0512 1990 032001

Ir.H.M.Amrin Lubis, M.Sc

HALAMAN PERSETUJUAN

Dewan Penguji Proyek Akhir / Skripsi pada Sekolah Tinggi Manajemen Informatika Komputer (STMIK) Indonesia Padang, menyatakan bahwa Proyek Akhir / Skripsi: Nama No Bp : Renaldi : 4744

Program Studi : Strata-1 Sistem Informasi Judul Skripsi : Analisa dan perancangan E-learning berbasis web pada SMK Adzkia Padang

Telah lulus mengikuti ujian Komprehenshif pada tanggal 19 september 2011 Dewan Penguji

1. Ir.Hj.Nurmi, M.Kom 2. Ir.H.Firlan Mustafa, MM 3. Drs. Rajab, M.Pd

Ketua /Pembimbing Anggota /Penguji Anggota /Penguji

( ( (

) ) )

Padang, 19 September 2011 Dosen Pembimbing

Ir.Hj.Nurmi, M.Kom Mengetahui,

Koordinator Program Studi S1 Manajemen Informatika Komputer

Ir.H.M.Amrin Lubis, M.Sc

Abstrak

Sebagai lembaga pendidikan sekolah menengah kejuruan, SMK elektro Adzkia padang berperan penting dalam pengembangan ilmu pengetahuan. Konsekuensi dari itu maka , SMK elektro Adzkia padang harus mampu meningkatkan kualitas dan mutu pendidikan yang diselenggarakannya. Selama ini semua proses pembelajaran di , SMK elektro Adzkia padang masih bersifat konvensional, dengan kata lain bahwa proses belajar mengajar antara siswa dengan guru hanya dapat dilakukan dengan syarat terjadinya pertemuan antara siswa dengan guru di dalam kelas. Jika pertemuan antara siswa dengan guru tidak terjadi maka secara otomatis proses pembelajaran pun tidak dapat dilaksanakan. E-Learning mampu mendukung pengembangan kegiatan belajar mengajar dengan media internet, intranet atau media jaringan komputer lain yang disajikan dengan menggunakan sebuah website. Dengan e-Learning memungkinkan terjadinya proses pendidikan tanpa melalui tatap muka langsung dan pengembangan ilmu pengetahuan kepada siswa bisa dilakukan dengan mudah. Dengan adanya E-Learning , SMK elektro Adzkia padang siap memberikan pengajaran kepada setiap siswa lebih maju dan modern karena

sistem ini mampu menjawab segala kebutuhan belajar-mengajar secara efektif dan efisien. Kata Kunci :Web Disain, E-Learning

ii

Abstract

As a high school vocational education institutions, vocational electro Adzkia field plays an important role in the development of science. The consequence of that then, SMK electro Adzkia field should be able to improve the quality and the quality of education are held. During all this process of learning, vocational electro Adzkia field is still conventional, in other words that the process of teaching and learning between students and teachers can only be done on condition that the meeting between students and teachers in the classroom. If a meeting between students and teachers do not happen automatically the learning processwas not feasible. E-Learning is able to support the development of teaching and learning with the internet, intranet or other computer network media are presented using a website. With e-Learning allows the educational process without going through a face to face and the development of science to students can be done easily. With the E-Learning, CMS electro Adzkia field ready to provide instruction to each student is more advanced and modern as the system is able to answer all the needs of teaching and learning effectively and efficiently. Kata Kunci :Web Disain, E-Learning

iii

KATA PENGANTAR

Alhamdulillahirabbilalamin. Puji syukur penulis panjatkan ke hadirat Allah SWT karena hanya berkat rahmat, hidayah dan karunia-Nya penulis berhasil menyelesaikan skripsi dengan judul ANALISA DAN PERANCANGAN E_LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG Skripsi ini diajukan untuk memenuhi salah satu syarat dalam menyelesaikan Program Sarjana (S-1) pada Program Sarjana STMIK INDONESIA Padang. Pada Kesempatan ini penulis menyampaikan terima kasih setulustulusnya atas segala dukungan, bantuan, dan bimbingan dari beberapa pihak selama proses studi dan juga selama proses penyusunan skripsi ini. Penulis mengucapkan terima kasih kepada :

1. Bapak H. Irman gusman, MBA selaku ketua yayasan amal bakti mukmin indonesia 2. Ibu Prof.Dr. Hj Safni, M.Eng selaku ketua STMIK Indonesia 3. Ibu Ir.Hj. Nurmi, M kom pembimbing atas petunjuk bimbingan dan arahannya sehingga sehingga terselesainya skripsi ini.

iv

4. Ibu dan Ayah, atas doa dan motivasinya dan pengorbanan yang tulus dan tidak ternilai selama ini. 5. Teman-teman yang se angkatan 2006 saling mendukung menyelesaikan skripsi masing-masing. 6. Semua pihak yang telah membantu dalam doa,nasehat dan berbagai kritikan yang telah mendorong menyelesaikan skripsi ini

Semoga Tuhan Yang Maha Esa berkenan memberikan balasan yang setimpal atas segala sumbangsihnya. Dengan sepenuh hati penulis menyadari bahwa tulisan sederhana ini masihjauh dari kualitas yang baik, oleh karena itu dengan segenap kerendahan hatipenyusun menerima kritik dan saran yang konstruktif bagi penyusunan karya-karyayang lain. Akhirnya dengan harapan semoga tulisan sederhana ini bermanfaat bagipara Pemerhati.

padang,

22 Agustus 2011

penulis

DAFTAR ISI

HALAMAN JUDUL HALAMAN PENGESAHAN HALAMAN PERSETUJUAN HALAMAN PERSEMBAHAN

ABSTRAK.............................................................................................................................i ABSTRACT...........................................................................................................................iii KATA PENGANTAR ..........................................................................................................iv DAFTAR ISI..........................................................................................................................vi DAFTAR GAMBAR .............................................................................................................vii DAFTAR TABEL..................................................................................................................xi BAB I PENDAHULUAN 1.1.Latar Belakang Masalah ......................................................................................1 1.2.Identifikasi Masalah ............................................................................................2 1.3.Perumusan Masalah ............................................................................................3 1.4.Batasan Masalah ..................................................................................................3 1.5.Tujuan dan Manfaat Penelitian ...........................................................................4 1.6.Metode Penelitian ................................................................................................5 BAB II LANDASAN TEORI 2.1. Pengertian Sistem................................................................................................7 2.2. Konsep Analisa dan Perancangan sistem............................................................7 2.2.1. Pengertian Analisis Sistem..7 2.2.2. Pengertian Perancangan Sistem...8
vi

2.3. Internet.12 2.3.1. Pengertian Internet....12 2.3.2. Sejarah Internet.....12 2.3.3. Peran Situs Web....16 2.3.4. WWW(Word Wide Web)..17 2.3.5. Web Server....18 2.4. Electronic Learning.....19 2.4.1. Pengertian E-learning...19 2.4.2. E-learning BerbasisWeb.......21 2.4.3. Arsitektur E-learning...23 2.4.4. Komponen-Komponen E-learning......23 2.4.5. Keuntungan E-learning.......25 2.4.6. Kelemahan E-learning....30 2.5. Interaksi Manusia Dan Komputer.31 2.5.1. Pengrtian Interaksi Manusia Dan Komputer.31 2.5.2. Delapan Aturan Emas Perancangan Antarmuka ..32 2.5.3. 10 Kesalahan Utama Pada Website...33 2.6. Basis Data(database)............................................................................................34 2.7.Spesifikasi Proses..................................................................................................34 2.8. STD (State Transition Diagram)..........................................................................35 2.9. Unified Modeling Language(UML) ....................................................................36 2.9.1. Pengertian UML....36 2.9.2. Diagram Struktur..38 2.9.2.1. Diagram Kelas ...38 2.9.2.2. Diagram Objek...40 2.9.2.3. Diagram Komponen...40 2.9.2.4.Diagram Deployetmen.41 2.9.3. Diagram perilaku...................................................................................41 2.9.3.1.Diagram Use-case....41 2.9.3.2. Diagram urutan / sequen.44 2.9.3.3. Diagram Kolaborasi ...45
vii

2.9.3.4. Diagram Statecchart...46 2.9.3.5. Diagram Actvitas...48 2.10. Rekayasa Perangkat Lunak ............................................................................. 49 2.10.1. Pengertian Rekayasa Perangkat Lunak.49 2.10.2. Langkah-langkah Pengembangan Piranti Lunak .....50 2.11. Siklus Hidup Sistem (System Life Cycle) ...................................................... 50 2.12. Teori Khusus Yang Berhubungan................................................................... 53 2.12.1.HTML (Hyper Text Markup Langueage).....53 2.12.2. PHP .54 2.12.2.1. Sejarah PHP..54 2.12.2.2. Pengertian PHP.....56 2.12.2.3. Kelebihan PHP..57 2.12.3. Mysql...57 2.12.3.1. Entry Relationship....59 2.13. Metode Pemecahan Masalah........................................................................... 63 2.14. Metode Pengumpulan Data.............................................................................65 BAB III ANALISA DAN HASIL 3.1. Analisa Sistem Yang Sedang Berjalan ............................................................. 68 3.2. Aliran Sistem Yang Diusulkan ......................................................................... 71 3.3. Hasil Analisis .................................................................................................... 74 BAB IV DISAIN SISTEM 4.1. Disain Sistem Secara Global............................................................................. 76 4.1.1.Hyrarcy, Input, Proses, Output (HIPO)..77 4.1.2.Kontek Diagram .77 4.1.3. Data Flow Diagram (DFD)79 4.1.4. Entry Relationship Diagram (ERD)...81 4.2. Disain secara Terinci......................................................................................... 83 4.2.1. Disain Output.83 4.2.2. Disain Input....91 4.2.3. Disain File..96 4.2.4. Disain Proses.110
viii

4.2.5. Disain File...110

BAB V IMPLEMENTASI DAN PEMBAHASAN HASIL IMPLEMENTASI 5.1. Implementasi.......................................................................................................111 5.1.1.Input. 111 5.1.2. Proses.. 126 5.1.3.Output.. 139 5.2. Pembahasan Hasil Implementasi .......................................................................142 5.2.1.Input. 142 5.2.2. Proses.. 146 5.2.3.Output.. 147 BAB VI PENUTUP 6.1. Kesimpulan .........................................................................................................153 6.2. Saran ...................................................................................................................154 DAFTAR PUSTAKA...........................................................................................................155 LAMPIRAN Flowchart ..............................................................................................................................157 Listing Program ...................................................................................................................165

ix

DAFTAR TABEL

Tabel 2.1. ................................................................................................... 24 Tabel 2.2. .................................................................................................... 25 Tabel 2.3. .................................................................................................... 26 Tabel 2.4. .................................................................................................... 27 Tabel 2.5. .................................................................................................... 28 Tabel 2.6. .................................................................................................... 29 Tabel 2.7. .................................................................................................... 30 Tabel 2.8. .................................................................................................... 30 Tabel 2.9. ..................................................................................................... 37 Tabel 2.10. .................................................................................................. 38 Tabel 2.11. .................................................................................................. 40 Tabel 4.1. .................................................................................................... 67 Tabel 4.2. .................................................................................................... 67 Tabel 4.3. .................................................................................................... 68 Tabel 4.4. .................................................................................................... 69 Tabel 4.5. ................................................................................................... 69 Tabel 4.6. ................................................................................................... 70 Tabel 4.7. ................................................................................................... 70 Tabel 4.8. ................................................................................................... 71 Tabel 4.9. ................................................................................................... 71

xv

DAFTAR GAMBAR

Gambar 2.1Klas. ..................................................................................... 38 Gambar 2.2. Inheritance Kelas ................................................................. 39 Gambar 2.3. Massage............................................................................... 40 Gambar 2.4.Diagram Use Case ................................................................ 44 Gambar 2.5.Diagram Secuence ................................................................ 45 Gambar 2.6. Diagram Kolaborasi............................................................. 46 Gambar 2.7. Diagram Statechart ............................................................. 47 Gambar 2.8. Diagram Aktivitas................................................................ 48 Gambar 2.9. Wartelfall Model.................................................................. 51 Gambar 2.10.Model Data Hubungan Entitas ............................................ 63 Gambar 3.1.Aliran Sistem Informasi E-learning berbasis wab pada SMK Adzkia padang..................................................................... 70 Gambar 3.2. Aliran Sistem Informasi E-learning berbasis wab pada SMK Adzkia padang ...................................................................... 72 Gambar 4.1.Hirarki,Input,Proses,Output (HIPO)...................................... 77 Gambar 4.2. Contek Diagram E-learning(CD).......................................... 78 Gambar 4.3. Data Flow Diagram (DFD). ................................................. 80 Gambar 4.4. Entity Relationship Diagram ............................................... 82 Gambar 4.5. Disain Input Data Siswa Pada Step 1.................................... 91 Gambar 4.6. Disain Input Data Siswa Pada Step 2.................................... 92 Gambar 4.7. . Disain Input Data Guru Pada Step 1................................... 93 Gambar 4.8 . Disain Input Data Guru Pada Step 2 ................................... 93

xi

Gambar 4.9. Input Data Master ................................................................ 94 Gambar 4.10. Input Data Kelas. ............................................................... 95 Gambar 4.11. Input Data Pelajaran........................................................... 95 Gambar 5.1. Home E-learning.................................................................. 111 Gambar 5.2.Login Guru ........................................................................... 112 Gambar 5.3.Contact Use .......................................................................... 113 Gambar 5.4. FAQ (frequently asked questions) ....................................... 114 Gambar 5.5.Daftar Pelajaran .................................................................. 115 Gambar 5.6. Pengumuman ....................................................................... 116 Gambar 5.7. Login Siswa......................................................................... 116 Gambar 5.8.Login Admin ........................................................................ 117 Gambar 5.9 Data detail input jenis klamin................................................ 118 Gambar 5.10. Data detail input Agama .................................................... 118 Gambar 5.11. Data Diatail input alamat .................................................. 119 Gambar 5.12 Data detail input Mata Pelajaran.......................................... 119 Gambar 5.13 Input Data Siswa Baru Step 1.............................................. 120 Gambar 5.14. Input Data Siswa Baru Step 2............................................. 121 Gambar 5.15. Input Data Guru Step 1 ...................................................... 122 Gambar 5.16. Input Data Guru Step 2 ...................................................... 122 Gambar 5.17 . Input Data Kelas................................................................ 123 Gambar 5.18. Input Data Jadwal Prlajaran ............................................... 125 Gambar 5.19. Upload Jawaban................................................................. 125 Gambar 5.20 Posting Pengumuman.......................................................... 126 Gambar 5.21. Halaman Admin Siswa....................................................... 127

xii

Gambar 5.22. Pencarian Siswa ................................................................. 127 Gambar 5.23. hasil pencarian siswa.......................................................... 128 Gambar 5.24. Edit Siswa step1................................................................ 128 Gambar 5.25 . Edit Siswa step 2 .............................................................. 129 Gambar 5.26.Hapus Data Siswa ............................................................... 129 Gambar 5.27. Halaman Admin Guru........................................................ 130 Gambar 5.28 Pecarian Data Guru ............................................................. 130 Gambar 5.29.Hasil Pencarian Data Guru .................................................. 131 Gambar 5.30 Edit Data Guru step 1 ......................................................... 131 Gambar 5.31 Edit Data Guru step 2.......................................................... 132 Gambar 5.32. Konfirmasi Delete Data Guru............................................. 132 Gambar 5.33. Data Kelas ........................................................................ 133 Gambar 5.34.Edit Data Kelas................................................................... 133 Gambar 5.35. Konfirmasi Delete Data Kelas............................................ 134 Gambar 5.36. Pelajaran ............................................................................ 134 Gambar 5.37. Edit Data Pelajaran ............................................................ 135 Gambar 5.38.Konfirmasi Delete Data Pelajaran ....................................... 135 Gambar 5.39.Kumpulan Penguman.......................................................... 136 Gambar 5.40.Edit Pengumuman............................................................... 136 Gambar 5.41.Tampil Poling .................................................................... 137 Gambar 5.42. Edit Poling......................................................................... 137 Gambar 5.43. Konfirmasi Delete Poling................................................... 137 Gambar 5.44 . Tampilan Tambah FAQ..................................................... 138 Gambar 5.45.Ubah Sandi ......................................................................... 139

xiii

Gambar 5.46. Laporan Data Siswa ........................................................... 139 Gambar 5.47 .Laporan Data Siswa Per Tahun ajaran ................................ 140 Gambar 5.48. Laporan Data Guru ............................................................ 140 Gambar 5.49 . Print Priview Jadwal Pelajaran pada sem I ........................ 141 Gambar 5.50 . Print Priview Jadwal Pelajaran pada sem II ....................... 141 Gambar 5.51. Download Tugas ................................................................ 142

xiv

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

BAB I PENDAHULUAN

1.1.

Latar Belakang Masalah Proses belajar seyogyanya berlangsung sejak dari lahir sampai akhir

hayat, atau lebih sering dikenal dengan life long learner (Jones, 2007). Selain belajar sepanjang hayat, proses belajar orang dewasa juga menekankan kemandirian dan keaktifan untuk selalu mencari pengetahuan. Informasi merupakan suatu hal yang mutlak dan perlu didapatkan dalam mengarungi perjalanan hidup sehari-hari. Dimasa sekarang kecanggihan teknologi membuat akses yang tidak terbatas apalagi dalam hal mendapatkan informasi. Khusus di bidang pendidikan penggunaan informasi dapat membantu kelancaran di dalam proses pembelajaran. Metode belajar yang baik dapat mempengaruhi pola pikir peserta didik khususnya siswa. Begitu juga dengan SMK elekto Adzkia padang membutuhkan informasi yang dapat membantu dalam Kegiatan Belajar Mengajar (KBM). Selama ini Kegiatan Belajar Mengajar (KBM) hanya dilakukan di kelas yang terbatas, membuat peserta didik kurang memahami materi yang disampaikan terutama bagi yang terlambat mengikuti Kegiatan Belajar Mengajar (KBM). Selain itu materi yang terlalu terfokus pada buku panduan yang tidak bervariasi membuat siswa merasa bosan mengikuti pelajaran tersebut.

Untuk mengatasi hal ini dapat dimanfaatkan teknologi lain seperti memanfaatkan akses internet seperti membuat E-learning, dengan E-learning ini dapat membuat minat belajar siswa menjadi terpacu karena siswa dapat mengakses mata pelajaran yang diinginkan kapan saja. Dengan dibuatnya media pembelajaran seperti ini diharapkan proses pembelajaran di SMK Adzkia akan menjadi lebih baik dan dapat meningkatkan prestasi belajar siswa Sebagai tugas akhir dan persyaratan untuk menyelesaikan program studi Srata Satu (S1) di Sekolah Tinggi Managemen Informatika dan Komputer (STMIK) Indonesia dan untuk membantu SMK Adzkia , maka permasalahan diatas kedalam skripsi dengan judul : ANALISA DAN PERANCANGAN E_LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG diangkat

1.2.

Identifikasi Masalah Dari latar belakang masalah diatas maka bisa diambil kesimpulan

bahwa masalah yang dihadapi SMK Adzkia adalah sebagai berikut : 1. Kegiatan Belajar Mengajar (KBM) hanya dilakukan di kelas yang terbatas 2. Peserta didik kurang memahami materi yang disampaikan terutama bagi yang terlambat mengikuti Kegiatan Belajar Mengajar (KBM)

3. Materi yang terlalu terfokus pada buku panduan yang tidak bervariasi membuat siswa merasa bosan mengikuti pelajaran

1.3.

Batasan Masalah Batasan masalah dalam penulisan ini yaitu perancangan e-learning

bebasis web, dimana dalam perancangan e-learning terdapat beberapa fiturfitur antara lain: 1. Informasi tentang unit-unit terkait dalam proses belajar mengajar a. Silabus b. Tugas c. Jadwal Ujian d. Daftar referensi atau bahan bacaan 2. Kemudahan akses ke sumber referensi a. FAQ (frequently asked questions) b. Sumber-sumber referensi untuk pengerjaan tugas c. Situs-situs bermanfaaat 3. Komunikasi dalam kelas a. Forum diskusi online b. Mailing list diskusi c. Download materi d. Papan pengumuman

Mengembangkan model ini tidak sekedar menyajikan materi pelajaran ke dalam internet tetapi perlu dipertimbangkan secara logis dan memegang prinsip pembelajaran. Begitu pula desain pengembangan yang sederhana, personal, dan cepat, serta unsur hiburan akan menjadikan peserta didik betah belajar di depan internet seolah-seolah mereka belajar di dalam kelas

1.4

Perumusan Masalah Dari latar belakang dan identifikasi masalah yang telah dikemukakan diatas maka dapat dirumuskan suatu masalah yaitu Bagaimana menganalisa dan merancang E-Learning berbasis web ?.

1.5

Tujuan dan Manfaat Penulisan 1.5.1. Tujuan Penulisan Tujuan dari penulisan ini adalah menciptakan suatu sistem pembelajaran jarak jauh e-learning berbasis web, yang diharapkan menjadi media alat bantu bagi peserta didik serta media pelengkap pembelajaran di sekolah. 1.5.2. Manfaat Penulisan Adapun manfaat dari tulisan ini antara lain : 1. Dapat memudahkan para siswa untuk memperoleh materi dan pelajaran

2. Memudahkan para guru untuk mendistribusikan materi pelajaran 3. Membuka komunikasi antara siswa dan guru ataupun antar siswa diluar jan pelajaran melalui forum diskusi dan private masseg

1.6

Metode Penulisan Metodologi dalam suatu penelitian sangat menentukan kualitas hasil

penelitian. Dalam penulisan skripsi ini digunakan 3 metodologi yaitu : 1. Penelitian Lapangan (Field Research) Suatu metode untuk mendapatkan data data yng dibutuhkan dengan cara peninjauan kelapangan melalui wawancara lansung kepada responden dan mengumpulkan dokumen dokumen yang berhubungan dengan laporan penelitian pelaksanaan izin trayek. 2. Penelitian Kepustakaan (Library Research) Merupakan penelitian terhadap berbagai literature yang memuat konsep dan teori dasar mengenai permasalahan yang akan di bahas. Dengan penelitian ini penulis menganalisa berbagai konsep dan teori yang kemudian dijadikan dasar atau landasan pemikiran dalam pengolahan data yang ditemukan dalam praktek. 3. Penelitian Laboratorium (Laboratory Research)Suatu penelitian yang dilakukan terhadap data data yang diperoleh dengan implementasi dari sistem yang dirancang. Dari hasil penelitian dilaboratorium yaitu pembuatan

program serta pengujian hasil 4. Metode Pengembangan. Dalam pengembangan yang penulis lakukan ini, penulis menggunakan metode SDLC (System Development Life Cycle)

dengan model proses waterfall yang dikemukakan oleh Pressman (2007) yang meliputi tahap-tahap berikut : a. Analisis dan Rekayasa Sistem, yaitu mengumpulkan kebutuhan mengenai informasi apa saja yang dibutuhkan oleh pengguna berdasarkan hasil analisis wawancara pihak terkait. b. Analisis Kebutuhan Piranti Lunak, yaitu melakukan analisis atas informasi kebutuhan yang didapat kepada piranti lunak yang digunakan. c. Perancangan. Yaitu, melakukan perancangan program e-learning berbasis web agar dapat menyediakan layanan yang diharapkan. d. Pengkodean. Yaitu melakukan penerapan hasil rancangan kedalam bentuk yang dapat dibaca dan di mengerti oleh komputer. e. Pengujian. Yaitu melakukan pengujian program yang telah dibuat. f. Pemeliharaan. Yaitu, kegiatan pemeliharaan terhadap datadata pada e-Learning berbasis web yang harus dilakukan secara rutin. Metode SDLC ini dipilih untuk menghemat waktu proses penyelesaian aplikasi e-Learning berbasis web

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

BAB II LANDASAN TEORI

2.1. Pengertian Sistem Pengertian sistem sudah umum dan biasa dipakai dalam kehidupan sehari-hari, misalnya sistem pengajaran, sistem komputer, sistem tata surya, dan masih banyak lagi. Dalam kehidupan sehari-hari kita mengartikan sistem sebagai suatu wadah yang menampung beberapa elemen yang saling berinteraksi didalamnya. Menurut Kenneth E Kendall (2006:75) sistem merupakan sekelompok elemen-elemen atau komponen-komponen yang saling berkaitan dan berhubungan atau subsistem-subsistem yang bersatu untuk mencapai tujuan yang sama.

2.2. Konsep Analisis dan Perancangan Sistem 2.2.1. Pengertian Analisis Sistem Menurut Laudon dan kawan-kawan (2006:60) analisis sistem adalah suatu proses analisa terhadap masalah yang akan diselesaikan oleh sebuah organisasi dengan menggunakan sistem informasi, yang terdiri dari pendefinisian masalah dan identifikasi spesifikasi kebutuhan yang harus

dipenuhi oleh solusi dari system Menurut Alter (2006:89) analisa sistem adalah proses umum yang mencakup pendefinisian masalah, pengumpulan informasi yang berkaitan, pengembangan solusi alternative, dan pemilihan diantara solusi yang ada tersebut.

2.2.2. Pengertian Perancangan Sistem Perancangan sistem adalah sebagai penggambaran, perencanaan dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah kedalam suatu kesatuan yang utuh dan berfungsi(Jogiyanto, 2008:60) Perancangan sistem dapat dibagi dua yaitu : 1. Perancangan Global Rancangan global merupakan gambaran secara umum tentang sistem yang baru. Rancangan ini merupakan persiapan dari desai terinci yang mengidentifikasikan komponen-komponen sistem iinformasi yang akan dirancang secara rinci. Rancangan global juga dapat memberikan kemudahan bagi pemakai dalam

mempelajari dan menggunakan aplikasi yang dihasilkan sistem.

2. Desain Terinci Pedoman dari desain terinci adalah desain global yang telah dibahas sebelumnya. Tujuan dari sistem terinci ini adalah untuk memberikan innformasi atau gambaran secara terinci bentuk dari perancangan E-learning barbasis web Rancangan terinci terdiri dari : a. Desain Output Output merupakan produk dari sistem informasi atau hasil dari proses yang tersimpan pada sebuah media penyimpanan. Output pada sistem komputer merupakan tampilan dilayar monitor ataupun data yang dicetak pada kertas. Hal yang harus diperhatikan dalam desain output adalah mengenai jenis data spesifik atau informasi apa yang diperlukan, bagaimana cara user memakai data/informasi tersebut dan format apa yang seharusnya digunakan yang sesuai dengan kebutuhan. Desain dari formulir yang akan dicetak perlu dipeersiapkan peletakan tiap data dalam form

10

sesuai

dengan

kesepakatan

antara

user

dengan

pengembang. b. Desain Input Terdapat dua jenis input yang ada pada sistem berbasis komputer, adalah: 1) Batch Input Batch pengumpulandata Input, transaksi merupakan tradisional metode untuk

pengolahan data dengan komputer. Pendekatan ini terdiri dari penyimpanan data transaksi pada dokumen dokumen sumber dari transaksi yang sama, kemudian dikumpulkan kedalam bagian bagian , dilakukan validasi input kemudian baru dipindahkan ke media yang dapat dibaca oleh komputer. 2). Online Input Online Input, yaitu pengumpulan data secara lansung dihubungkan dengan komputer. Data

11

dimasukkan

melalui

beberapa

jenis

peralatan

pengumpulan data dan lansung terhubung secara online untuk diproses oleh komputer. c. Desain File Hal yang paling penting pada saat melakukan desain file adalah pengetahuan tentang struktur file yang di desain. Sebuah file menyimpan record record yang jenisnya sama. Satu atau lebih informasi disebut sebagai field dapat digunakan sebagai kunci bagi sebuah record, artinya key dari file dapat mengidentifikasikan record record pada file tersebut. d. Desain Proses Desain proses merupakan suatu tahap untuk perancangan E-learning barbasis web

12

2.3 Internet

2.3.1. Pengertian Internet Menurut Turban (2006:70), internet merupakan rangkaian jaringan dalam jaringan yang menghubungkan komputer individual yang dimiliki oleh pemerintah, universitas, grup non-profit dan perusahaan. Interkoneksi ini dihubungkan dengan standart protokol yang bebas dan terbuka. Internet adalah sistem jaringan komputer dan jaringan dari banyak jaringan yang meliputi seluruh dunia. Internet bersifat publik, kooperatif, dan mandiri yang memfasilitasi akses ke ratusan atau jutaan manusia di seluruh dunia.

2.3.2. Sejarah Internet Internet dimulai pada tahun 1969. Pada waktu itu Departemen Pertahanan Amerika Serikat membangun sebuah jaringan komputer melalui proyek yang disebut ARPANET (Advanced Research Projects Administrator Adminitration Network) yang dimana mereka menjelaskan dan mendemonstrasikan bagaimana dengan hardware dan software komputer yang berbasis UNIX dapat melakukan komunikasi dalam jarak yang tidak terhingga melalui saluran telepon. Proyek ARPANET

13

merancang bentuk jaringan, kehandalan, seberapa besar informasi dapat dipindahkan, dan akhirnya semua standar yang mereka tentukan menjadi asal mula pembangunan protokol baru yang sekarang dikenal sebagai TCP/IP (Transmission Control Protocol/Internet Protocol). Pada awalnya, dibangunannya proyek tersebut adalah untuk keperluan militer. Pada saat itu Departement Pertahanan Militer Amerika Serikat merancang sistem jaringan komputer yang tersebar dengan menghubungkan komputer di daerah-daerah vital untuk mengatasi masalah bila terjadi serangan nuklir dan untuk menghindari terjadinya informasi terpusat, yang apabila terjadi perang dapat mudah dihancurkan. Di tahun tersebut, jaringan itu hanya menhubungkan pada empat komputer yang tersebar di negara bagian California dan Utah di Amerika Serikat, dan pada tahun 1969 mereka membentuk satu jaringan terpadu. Kemudian jaringan ini berkembang begitu cepat dan menghubungkan komputer-komputer yang berada di universitas, lembaga penelitian pemerintah dan instansi militer yang letaknya di kota yang berbeda. Secara umum ARPANET diperkenalkan pada bulan Oktober 1972. Sejak awal, jaringan ini dirancang tetap berfungsi walaupun sebagian jalur rusak akibat perang. Tidak lama kemudian proyek ini berkembang pesat di seluruh

14

daerah, dan semua universitas di negara tersebut ingin bergabung, sehingga membuat ARPANET kesulitan untuk mengaturnya. Kemudian untuk solusinya, ARPANET dipecah menjadi dua bagian yaitu MILNET yang dilakukan untuk keperluan militer dan ARPANET baru yang lebih kecil untuk keperluan non-militer. Oleh sebab itu masing-masing komputer dapat berhubungan dengan komputer lain melalui berbagai macam jalur alternatif. Gabungan kedua jaringan tersebut akhirnya dikenal dengan nama DARPA internet, yang kemudian disederhanakan menjadi internet.

Pada tahun 1980-an, National Science Foundation membentuk NSFnet, yang menghubungkan setengah lusin super komputer pada kecepatan tertinggi waktu itu. NSFnet akhirnya mengambil alih dari ARPAnet. a. File Transfer Protocol (FTP) FTP (File Transfer Protocol) adalah suatu protokol khusus yang memungkinkan untuk mentransfer file dari suatu komputer ke komputer lainnya dalam suatu jaringan internet. Dengan FTP, dapat dilakukan transfer file data grafik, data audio, video, spreadsheet, dokumen, serta file-file dengan format yang bermacam-macam jenisnya

15

b. Terminal Emulator (Telnet) Telnet adalah suatu program pengguna internet untuk berinteraksi dengan komputer lain yang seakan-akan pengguna pengguna fasilitas ini bekerja di komputer lain yang dihubungnya. c. Information Browsing (Gopher) Gopher merupakan sarana pertama yang memudahkan pencarian informasi di internet. Gopher memberikan kemudahan untuk menyusun daftar-daftar sehingga mudah untuk mencari suatu informasi yang diinginkan.

d. Advanced Browsing (WWW, Mosaic) WWW (World Wide Web) adalah sistem hypermedia pada internet. Dokumen-dokumen informasi pada WWW disertai dengan grafik berwarna dan mendukung sistem multimedia dan memiliki link ke informasi lainnya. Untuk memperoleh dokumen WWW, kita menggunakan aplikasi browse Mosaic, Netscape, Websurfer, dan lainnya.

16

2.3.3. Peranan Situs Web Sebelumnya penyebaran informasi lebih banyak dilakukan melalui media cetak (surat kabar, majalah, buku, atau brosur). Proses ini dapat memakan waktu cukup lama, bahkan hingga berhari-hari. Belum lagi ditambah dengan waktu pengiriman yang sangat tergantung pada lokasi yang dituju. Kehadiran web menjadikan internet mengalami banyak sekali perubahan. Dengan menggunakan format HTML (Hypertext Markup Language), sebuah dokumen dapat memuat teks dan gambar sekaligus. Bahkan dengan perkembangan HTML, dokumen dalam bentuk multimedia (perpaduan grafik, animasi, suara, dan video) mampu ditampilkan. Internet tidak hanya tempat orang berkomunikasi, tetapi juga menjadi tempat orang mendapatkan berita, informasi, dan pengetahuan. Di negara yang maju, ada yang menggunakan internet sebagai sambungan untuk video. Dengan demikian, informasi yang tersedia di internet akan menjadi daya tarik bagi semua orang.

17

2.3.4. WWW (World Wide Web) WWW merupakan suatu kumpulan informasi pada beberapa server komputer yang terhubung satu sama lain dalam jaringan internet. Informasi-informasi dalam web mempunyai link-link yang menghubungkan informasi yang satu ke informasi lain di dalam jaringan internet. Link ini mempunyai tanda khusus, yang biasanya dinyatakan dalam teks berwarna biru dan digarisbawahi atau dalam bentuk icon maupun gambar yang dikelilingi oleh suatu kotak (border). Menurut Turban (2006:80), World Wide Web adalah aplikasi yang digunakan dalam internet yang berfungsi sebagai transportasi data yang diterima sebagai start untuk menyimpan, menerima, dan formatting, dan menampilkan informasi melalui

client/server architecture. Bekerja pada web mencakup dua hal penting, yaitu web browser dan web server. Kedua hal ini bekerja dengan sistem client-server. Web browser yaitu yang bertindak sebagai client memungkinkan anda menginterprestasikan dan melihat informasi pada web, sedangkan web server bertindak sebagai server yang memungkinkan anda untuk menerima informasi yang diminta oleh browser. Jika suatu permintaan akan suatu informasi datang, web server mencari file yang diminta tersebut dan kemudian mengirimkan browser yang memintanya.

18

2.3.5. Web Server Suatu aplikasi yang jalan pada suatu situs web dan bertanggung jawab untuk merespon permintaan file dari web browser. Dalam melakukan permintaan suatu halaman pada suatu situs web, browser melakukan koneksi ke suatu server dengan protokol HTTP. Server akan menanggapi koneksi tersebut dengan mengirimkan isi file yang diminta dan memutuskan koneksi tersebut. Browser kemudian memformat informasi yang didapat dari server. Pada bagian server, browser yang berbeda dapat melakukan koneksi pada server yang sama untuk memperoleh informasi yang sama. Dalam memberikan halaman yang diminta web server dapat melakukan kerja sama dengan server lain seperti Aplikasi Server.

2.3.6. Web Browser Software yang dijalankan pada komputer pengguna (client) yang meminta informasi dari server web dan menampilkannya sesuai dengan file data itu sendiri. Tugas utama dari web browser adalah mendapatkan dokumen dari web lalu memformat dokumen tersebut bagi pengguna. Untuk mendapatkan halaman tersebut, harus diberikan

19

alamat dari dokumen tersebut.

Menurut Shneiderman (2007), browser

adalah sebuah program yang dirancang untuk mengambil informasiinformasi dari server komputer pada jaringan internet dan sumber-sumber internet lainnya.

2.4 Electronic Learning (E-Learning) 2.4.1. Pengertian E-Learning E-learning merupakan singkatan dari Elektronic Learning,

merupakan cara baru dalam proses belajar mengajar yang menggunakan media elektronik khususnya internet sebagai sistem pembelajarannya. Elearning merupakan dasar dan konsekuensi logis dari perkembangan teknologi informasi dan komunikasi. Beberapa ahli mencoba menguraikan pengertian e-learning menurut versinya masing-masing, diantaranya : Jaya Kumar C.Koran (2006) e-learning sebagai sembarang pengajaran dan pembelajaran yang menggunakan rangkaian elektronik (LAN, WAN, atau internet) untuk menyampaikan isi pembelajaran, interaksi, atau bimbingan. Dong(dalam Kamarga: 2006) e-learning sebagai kegiatan belajar asynchronous melalui perangkat elektronik komputer yang memperoleh bahan belajar yang sesuai dengan kebutuhannya.

20

Rosenberg(2006)menekankan bahwa e-learning merujuk pada penggunaan teknologi internet untuk mengirimkan serangkaian solusi yang dapat meningkatkan pengetahuan dan keterampilan

DarinE.Hartley(Hartley,2006) E-learning merupakan suatu jenis belajar mengajar yang memungkinkan tersampaikannya bahan ajar ke siswa dengan menggunakan media Internet, Intranet atau media jaringan komputer lain.

LearnFrame.Com dalam Glossary of eLearning Terms (Glossary, 2006) Elearning adalah sistem pendidikan yang menggunakan aplikasi elektronik untuk mendukung belajar mengajar dengan media Internet, jaringan komputer,maupun komputer standalone. E-learning dalam arti luas bisa mencakup pembelajaran yang dilakukan di media elektronik (internet) baik secara formal maupun informal. E-learning secara formal misalnya adalah pembelajaran dengan kurikulum, silabus, mata pelajaran dan tes yang telah diatur dan disusun berdasarkan jadwal yang telah disepakati pihak-pihak terkait (pengelola elearning dan pembelajar sendiri). Pembelajaran seperti ini biasanya tingkat interaksinya tinggi dan diwajibkan oleh perusahaan pada karyawannya

21

atau pembelajaran jarak jauh yang dikelola oleh universitas dan perusahaan-perusahaan (biasanya perusahaan konsultan) yang memang bergerak dibidang penyediaan jasa e-learning untuk umum.

2.4.2. E-Learning Berbasis Web Pembelajaran berbasis web (E-learning) pada hakikatnya adalah perkembangan dari konsep sistem belajar jarak jauh (Distance learning). Sistem pembelajaran berbasis web ini bisa tejadi karena perkembangan yang peasat dari tiga bidang, yaitu; bidang pembelajaran jarak jauh, pembelajaran dengan menggunakan teknologi komputer, dan perkembangan bidang teknologi internet. Pembelajaran jarak jauh sejak lama sudah dikenal masyarakat dunia. Pada mulanya pembelajaran jarak jauh dilakukan melalui korespondensi dengan menggunakan media kertas dan jasa pos. Kemudian pada tahun 1960-an dengan munculnya konsep pendekatan sistem,

belajar jarak jauh dilakukan lebih sistematis yaitu melalui modul dan pengajaran berprograma. Kemajuan teknologi dalam bidang komunikasi dengan

ditemukannya alat elektronik sebagai media komunikasi, seperti

22

telephone, radio dan televisi, sistem belajar jarak jauh lebih berkembang lagi seperti munculnya konsep sekolah terbuka dan Universitas Terbuka. Berkembangnya teknologi komputer memberi dampak terhadap berbagai sendi kehidupan, termasuk dunia pendidikan. Kemajuan teknologi komputer memberi pengaruh luar biasa terhadap dunia pendidikan. Berbagai istilah pembelajaran dengan memanfaatkan

komputer seperti; Computer Assisted Instruction (CAI) dan Computer Based Training (CBT). Model pembelajaran tersebut memungkinkan peserta didik mempelajari bahan pelajaran sendiri langsung melalui

komputer sebagai sumber belajar. Dengan memahami cara menggunakan komputer, melalui disket atau CD siswa dapat mempelajarai bahan pelajaran secara interaktif dan menarik, tanpa harus didampingi oleh seorang guru. Perkembangan teknologi internet memberikan nuansa sistem belajar jarak jauh yang lebih terbuka lagi. Sistem pembelajaran berbasis web yang populer dengan sebutan elektronik leraning (E-

leraning), web-based training (WBT) atau kadang disebut web-based education (WBC), kampus maya (Virtual Campus)

23

2.4.3. Arsitektur E-learning

Tabel 2.1 Tiga Arsitektur E-learning (Clark & Mayer, 2008:27)

2.4.4. Komponen-komponen E-learning Menurut Gottschalk (2005), komponen-komponen utama dalam Elearning terdiri dari : 1. Pelajar Memenuhi kebutuhan pelajar adalah dasar dari setiap E-learning yang efektif. Ketika instruksi disampaikan dari jarak jauh, tantangan baru muncul karena pelajar-pelajar terpisahkan satu sama lain dengan latar belakang yang berbeda. 2. Fakultas Keberhasilan suatu E-learning tergantung pada fakultas. Peran instruktur dalam E-learning adalah : a. Memahami karateristik dan kebutuhan pelajar tanpa adanya kontak langsung. b. Mengaplikasikan metode pengajaran yang sesuai dengan harapan belajar. c. Mengembangkan teknologi penyampaian, sementara tetap memfokuskan pada perannya sebagai pengajar.

24

d. Berfungsi secara efektif sebagai fasilitator yang mahir. 3. Fasilitator Seorang fasilitator harus mengerti kebutuhan pelajar dan harapan instruktur. Yang terpenting, fasilitator harus bersedia untuk mengikuti arahan guru. Fasilitator yang menyediakan peralatan, mengumpulkan tugasm mengawasi ujian, dan bertindak sebagai mata dan telinga instruktur. 4. Staf pendukung Staf pendukung memastikan detail-detail yang diperlukan bagi keberhasilan program digunakan secara efektif. Kebanyakan program Elearning yang sukses menggunakan staf pendukung untuk mengurus pendaftaran pelajar, duplikasi dari distribusi materi, pemesanan textbook, penjadwalan fasilitas, pemrosesan rapor, dan lain-lain. 5. Administrator Administrator berfungsi sebagai pembuat kesepakatan, pembuat keputusan dan wasit. Mereka memastikan sumber daya teknologi digunakan secara efektif untuk meneruskan misi akademik institusi dan mempertahankan fokus akademik agar tetap berada pada jalur yang benar. 2.4.5. Keuntungan E-learning Menurut Kristy DelVecchio dan Megan Loughney (2006 : 5), Elearning sangat berguna bagi pendidikan dan perusahaan serta untuk semua tipe pelajar. E-learning sangat terjangkau, menghemat waktu, dan memiliki hasil yang dapat diukur. E-learning mempunyai berbagai keuntungan, yaitu: a. Mengurangi biaya : E-learning lebih hemat dibanding dengan cara belajar tradisional karena hemat waktu dan uang yang dihabiskan saat dalam transportasi. E-learning dapat diakses dari berbagai

25

lokasi dan tidak ada biaya transportasi sama sekali, E-learning lebih hemat dibandingkan dengan cara belajar tradisional. b. Fleksibilitas : E-learning memiliki kelebihan dalam pengaksesan dimana saja dan kapan saja. Pendidikan tersedia kapanpun dan dimanapun dibutuhkan. E-learning dapat digunakan di kantor, rumah, jalan, 24 jam sehari dan 7 hari dalam satu minggu. Elearning juga memiliki pengukuran terhadap hasil belajar yang dapat dibuat agar instruktur dan pelajar dapat mengetahui apa saja yang telah dipelajari, kapan mereka akan menyelesaikan pelajarannya dan bagaimana hasil yang telah mereka capai. c. Pelajar sangat menyukai E-learning karena mengakomodir cara belajar yang berbeda. Pelajar bisa mengambil keuntungan belajar sesuai dengan keinginan mereka. Pelajar juga bisa menyesuaikan Elearning dengan jadwal kesibukan mereka. Apabila pelajar bekerja maka ia masih dapat bekerja dengan E-learning. Apabila pelajar menginginkan waktu belajar di malam hari, maka pilihannya juga tersedia.

Jolliffe, Ritter, Stevans (2005) menjabarkan beberapa keunggulan internet (www) dalam menyampaikan materi pembelajaran, yaitu:

26

1. Increased client base Dengan menempatkan materi pembelajaran pada web, maka dapat meningkatkan jumlah pengguna (user). 2. Increased learner accessability Bahan pengajaran, tugas, tanggapan (feed back) terhadap pertanyaan pada sebuah diskusi yang diberikan pengajar atau fasilitator dapat disimpan dalam sebuah server, sehingga para pelajar dapat mengakses secara langsung ke server untuk mendapatkan materi

terbaru, mengumpulkan tugas, bertanya atau berdiskusi. Dengan demikian pengaksesan terhadap situs lebih sering dilakukan oleh para pelajar. 3. Ease of updating the learning materials Dengan menggunakan software yang mendukung E-Learning, maka memungkinkan para pengajar memberikan materi, tugas dan bahan diskusi secara cepat. 4. Platform independence Seluruh materi pembelajaran yang disimpan di server dapat diakses oleh pengajar maupun pelajar dengan menggunakan web browser yang berbeda-beda (internet explorer, firefox, opera, netscape) dan

27

menggunakan sistem operasi yang berbeda pula. 5. Increased learner effectiveness Perubahan paradigma dari Teacher Centered Teaching menjadi Student Centered Learning. Pembelajaran konvensional

menempatkan seorang pengajar menjadi sumber informasi yang memberikan materi kepada seluruh pelajar yang datang untuk mendengarkan. Sedangkan pada pembelajaran dengan E-Learning, seorang pelajar akan menjadi pusat pembelajaran, di mana pelajar lebih banyak aktif dalam mencari informasi yang berkaitan dengan materi yang dipelajarinya

6. Administrative support Web juga dapat digunakan untuk mendukung electronic bulletin boards dan fasilitas diskusi lainnya yang memungkinkan pengguna mengikuti perubahan materi dengan cepat. Selain itu web juga dapat digunakan untuk mendistribusikan hasil ujian, nilai akhir, waktu pelaksanaa, dan informasi lainnya.

7. Resource and reference Pencarian informasi dapat dilakukan dengan menggunakan

28

program index dan utility, memungkinkan semua pengguna mempunyai hak akses yang sama.

8. Increased learner expectations Penggunaan TI dalam bidang pendidikan tentunya akan

memberikan manfaat dan nilai tambah bagi pelajar maupun pengajar. 9. Changing nature of knowledge Perkembangan ilmu pengetahuan sangat cepat sekali, sehingga apa yang diajarkan saat ini dapat tidak terpakai lima tahun kemudian. Ini berarti dibutuhkannya pembelajaran yang kontinyu, dengan adanya E-Learning hal tersebut mudah untuk dilakukan. 10. Increased competition Dengan pemanfaatan teknologi internet untuk pembelajaran, lokasi dan institusi pendidikan tidak lagi menjadi hal yang penting.

29

2.4.6. Kekurangan E-learning Disamping kelebihannya, menurut Kristy DelVecchio dan Megan Loughney(2006) E-learning juga mempunyai kekurangan, yaitu : a. Pelajar harus memiliki akses ke komputer dan internet. b. Pelajar juga harus memiliki keterampilan komputer dengan programnya, seperti program word processing, internet browser, dan e-mail. c. Koneksi internet yang baik, karena sangat dibutuhkan dalam pengambilan materi pelajaran. d. Dengan tidak adanya rutinitas yang ada di kelas tradisional maka pelajar mungkin akan berhenti belajar atau bingung mengenai kegiatan belajar dan tenggang waktu tugas, yang akan membuat pelajar gagal. e. Pelajar akan merasa sangat jauh dengan instruktur. Karena instruktur tidak selalu ada untuk membantu pelajar, sehingga pelajar harus disiplin dan mengerjakan tugas secara mandiri tanpa bantuan instruktur. f. Pelajar juga harus memiliki kemampuan menulis dan kemampuan komunikasi yang baik. Karena pelajar dan instruktur tidak bertatap muka sehingga memungkinkan terjadinya salah pengertian

30

2.5 Interaksi Manusia dan Komputer 2.5.1 Pengertian Interaksi Manusia dan Komputer Interaksi manusia dan komputer adalah disiplin ilmu yang berhubungan dengan perancangan, evaluasi, serta implementasi sistem komputer yang interaktif untuk digunakan oleh manusia. Interaksi manusia dan komputer berkaitan dengan user interface (antarmuka pemakai) yang digunakan oleh pengguna untuk berkomunikasi dan berinteraksi dengan komputer (Shneiderman:2007). Hal-hal yang perlu diperhatikan dalam

merancang suatu antarmuka yang use friendly, antara lain : 1. Waktu untuk belajar Berapa lama waktu yang diperlukan bagi pengguna pada umumnya untuk mempelajari perintah yang berhubungan dengan suatu task. 2. Kecepatan Kinerja Berapa waktu yang diperlukan untuk menjalankan suatu task. 3. Tingkat kesalahan pengguna Berapa banyak dan apa saja kesalahan yang dilakukan penggunadalam melaksanakan suatu task. 4. Retensi pengguna setelah jangka waktu tertentu Berapa lama pengguna dapat mempertahankan pengetahuan mereka

31

setelah jangka waktu tertentu. Retensi dapat dihubungkan dengan waktu belajar, dan frekuensi penggunaan memegang peranan penting dalam hal ini. 5. Kepuasan subyektif pemakai Mencari tahu apakah pengguna sering menggunakan berbagai aspek dari sistem. Jawabannya dapat diperoleh dari wawancara atau surevei tertulis yang memuat skala kepuasan dan tempat bagi jawaban bebas.

2.5.2 Delapan aturan emas perancangan antar muka Menurut Ben Shneiderman(2007), dalam perancangan user interface, digunakan 8 aturan emas perancangan atau yang sering dikenal dengan eight golden rules, yaitu :

1. Berusaha untuk konsisten 2. Memungkinkan frequent user menggunakan shortcut 3. Memberikan umpan balik yang informatif 4. Merancang dialog yang memberikan penutupan

32

5. Memberikan pencegah kesalahan dan penanganan kesalahan yang sederhana 6. Memungkinkan pembalikkan aksi yang mudah 7. Mendukung pusat kendali internal (internal locus of control) 8. Mengurangi beban ingatan jangka pendek

2.5.3

10 kesalahan utama pada website

Inilah laporan tahunan yang selalu ditunggu oleh para web developer, laporan web usability oleh pakar - pakar web usability di USA. Dan pada penelitian sepanjang tahun 2007 hingga bulan April ini menunjukan bahwa ada 10 kesalahan yang sering terjadi dalam web desain : 1. Pencarian yang sulit 2.Menggunakan PDF - reading 3. Tidak menggunakan visited colour link 4. Text Wall 23 5. Fixed size font 6. Judul web yang tidak optimal 7. Kemiripan dengan iklan

33

8. Konsistensi 9. Membuka halaman baru 10. Website yang gagal menjawab

2.6 Basis data (Database) Sistem basis data merupakan penyimpanan informasi yang terorganisasi secara komputerisasi sehingga memudahkan pemakai dalam pengolahannya dan penggunaannya (Jogiyanto, 2008). Pada saa ini sistem basis data sudah dikembangkan pada mesin-mesin komputer kecil sampai komputer yang lebih besar seperti mainframe. Tujuan dari hal tersebut secara keseluruhan adalah untuk melakukan perawatan informasi dan menyajikannya kapan saja dibutuhkan oleh pengguna.

2.7. Spesifikasi Proses Spesifikasi proses merupakan penjelasan dari proses-proses yang terjadi dalam sistem. Spesifikasi proses harus dapat dimengerti baik oleh pemakai maupun pembuat sustem. Spesifikasi proses dapat menjadi pedoman bagi pembuat program dalam membuat kode program (coding). Spesifikasi proses digunakan untuk menggambarkan semua alur proses yang terjadi pada tahapan akhir. Isi spesifikasi proses dapat berupa

34

teks naratif, gambaran proses dari algoritma, persamaan matematika, tabel, diagram atau bagan.

2.8. STD (State Transition Diagram) State Transition Diagram (STD) adalah model dari tingkah laku sistem didasarkan pada definisi satu bagian dari keadaan sistem. Keadaan atau state adalah suatu model tingkah laku yang ditemukan Roger S. Pressman (1992). STD sering digunakan utnuk menggambarkan kinerja dari sistem. Melalui STD, tingkah laku sistem dapat dimengerti serta ditujukan dan dan yang lebih penting adalah meyakinkan apa ada yang kurang atau tertinggal dari tingkah laku yang telah dispesifikasikan. STD merupakan suatu alat untuk merancang suatu system yang digunakan secara realtime misalnya proses control, telephone switching system, dan control system. Notasi-notasi yang digunakan dalam STD adalah sebagai berikut :

1. State

: Menyatakan state atau kondisi dari suatu sistem.

terdiri dari dua macam yaitu intial state atau state awal dan final state atau state akhir. Final state bisa terdiri

35

atas beberapa state, tetapi intial state tidak boleh lebih dari satu. 2. sistem. 3.Kondisi : Menyatakan suatu kejadian pada lingkungan eksternal yang dapat dideteksi oleh suatu sistem misalnya suatu signal atau data. 4.Aksi : Sesuatu yang dilakukan oleh sistem terjadi perubahan : Menyatakan perubahan state atau kondisi dari suatu

state atau merupakan reaksi terhadap kondisi. Aksi akan menghasilkan output, message display pada screen, menghasilkan kalkulasi dan lain-lain.

2.9

Unified Modelling Language (UML)

2.9.1 Pengertian UML Menurut Grady Booch(1998), UML adalah bahasa standard untuk melukiskan software blueprints. UML digunakan untuk menggambarkan, menspesifikasikan, merancang, dan dokumentasi dari artfacts of a software-intensive system. Unified Modeling Language (UML) adalah bahasa spesifikasi standar untuk mendokumentasikan, menspesifikasikan, menggambarkan, dan membangun sistem perangkat lunak seperti halnya

36

pada business modelling dan sistem lainnya [OMG01]. UML tidak berdasarkan pada bahasa pemrograman tertentu. Standar spesifikasi UML dijadikan standar defacto oleh OMG (Object Management Group) pada tahun 1997.UML yang berorientasikan object mempunyai beberapa notasi standar. Spesifikasi ini menjadi populer dan standar karena sebelum adanya UML, telah ada berbagai macam spesifikasi yang berbeda. Hal ini menyulitkan komunikasi antar pengembang perangkat lunak. Untuk itu beberapa pengembang spesifikasi yang sangat berpengaruh berkumpul untuk membuat standar baru. UML dirintis oleh Grady Booch OOD (Object-Oriented Design), Jim Rumbaugh OMT (Object Modeling Technique), dan Ivar Jacobson OOSE (Object-Oriented Software Engineering). UML mendeskripsikan OOP (Object Oriented Programming) dengan beberapa diagram.

37

2.9.2 Diagram Struktur 2.9.2.1 Diagram kelas Class diagram adalah diagram yang mendeskripsikan jenis-jenis objek dalam sistem dan berbagai macam hubungan statis yang terdapat diantara mereka. (Martin Fowler:2005). Menurut Sri Dharwiyanti (2003) Diagram kelas adalah diagram yang menggambarkan serangkaian kelas, interface, dan kolaborasi dan hubungannya. Notasi-notasi yang digunakan dalam Diagram Kelas adalah sebagai berikut:

1. Kelas Menyatakan kelas yang digunakan. Diagram ini berisikan tiga komponen, yaitu nama kelas, atribut dalam kelas, dan behavior. Atribut merepresentasikan parameter dan data-data yang terdapat dala keas. Behavior menyatakan fungsi atau method yang berlaku dalam kelas tersebut.

Gambar 2.1 Kelas

38

2.

Inheritance Menyatakan hirarki dari suatu kelas sebagai komponen kelas lain yang jug disebut sub objek.

Gambar 2.2 Inheritance Kelas

3.

Agregation Merupakan sebuah bentuk assosiasi yang menyatakan bagian dari keseluruhan dan digambarkan dalam notasi berbentuk diamond.

4. Message Message (pesan) merupakan cara untuk berhubungan antara satu objek dengan objek lain. Suatu pesan dikirimkan oleh suatu objek kepada objek tertentu dapat digambarkan sebagai anak panah. Objek pengirim

39

mengirimkan pesan kepada objek penerima supaya objek penerima melaksanakan salah satu metode yang dimilikinya.

Gambar 2.3 Massage

2.9.2.2

Diagram obyek Menurut Arthur M. Langer (2008) Diagram objek adalah diagram

yang menggambarkan serangkaian objek dan hubungannya pada waktu tertentu. 2.9.2.3 Diagram komponen Menurut Arthur M. Langer (2008) komponen diagram adalah diagram yang menunjukkan serangkaian komponen dan hubungannya. Diagram komponen mengilustrasikan gambaran implementasi static sebuah sistem. Komponen diagram terhubung dengan diagram kelas yang komponennya kolaborasi. terhubung Digunakan dengan untuk beberapa kelas, interface, organisasi sistem, atau dan untuk

mengambarkan software

ketergantungan

komponen-komponen

40

menunjukkan bagaimana kode pemrograman dibagi menjadi modul-modul atau komponen.

2.9.2.4 Diagram deployment Menurut Arthur M. Langer (2008) diagram deployment adalah diagram yang mendeskripsikan arsitektur fisik dalam istilah node untuk hardware dan software dalam sistem. Diagram ini menunjukkan konfigurasi komponen-komponen software runtime, processor, dan peralatan yang membentuk arsitektur sistem.

2.9.3

Diagram Perilaku

2.9.3.1 Diagram use-case Use-case modeling merupakan proses pemodelan fungsi-fungsi sistem dalam konteks peristiwa-peristiwa bisnis, siapa yang

mengawalinya, dan bagaimana sistem itu merespon hal tersebut. Menurut Arthur M. Langer (2008) diagram use-case adalah diagram yang menunjukkan serangkaian use case dan aktor dan hubungannya. Diagram use-case digunakan untuk mengilustrasikan gambaran statis use case sebuah sistem. Diagram use-case sangat penting dalam pengaturan dan pemodelan behavior sistem. Diagram use-case menggambarkan interaksi

41

antara sistem dengan sistem eksternal dan pengguna. Dengan kata lain, secara grafis menggambarkan siapa yang menggunakan sistem dan dengan cara apa pengguna mengharapkan untuk berinteraksi dengan sistem. Salah satu tantangan bagi semua tim pengembangan system informasi, dan khususnya analis sistem, adalah kemampuan untuk memperoleh persyaratan sistem yang benar dan yang diperlukan para stakeholder dan menetapkannya dalam sebuah cara yang dapat dipahami para stakeholder agar persyaratan-persyaratan itu dapat di validasi dan di verifikasi. Industri pengembangan perangkat lunak telah mempelajari bahwa untuk meraih sukses perencanaan, analisis, desain, konstruksi, dan penyebaran sistem informasi, analisis sistem pertama-tama harus memahami kebutuhan para stakeholder dan mengapa sistem harus dikembangkan- konsep yang disebut user-centered development atau pengembangan berpusatkan pengguna. Dengan fokus kepada pengguna sistem, analis dapat berkonsentrasi untuk mengembangkan bagaimana sistem akan digunakan dan bukan bagaimana sistem dibangun. Pemodelan use-case awalnya disusun oleh Dr. Ivar Jacobson pada tahun 1986 dan menjadi populer setelah beliau menerbitkan buku, ObjectOriented Software Engineering, pada tahun 1992. Dr Jacobson menggunakan pemodelan use-case sebagai kerangka kerja untuk

42

metodologi

objectory-nya sistem

dengan informasi

sukse

digunakannya

untuk

mengembangkan

berorientasi-objek.

Penggunaan

pemodelan use-case memfasilitasi dan mendorong keterlibatan pengguna, yang merupakan faktor sukses kritis untuk memastikan sukses proyek. Ada dua alat utama yang digunakan saat menyajikan pemodelan use-case. Pertama adalah use-case diagram, yang secara grafis menggambarkan pelaku(pengguna), sistem dan sebagai hubungan sebuah kumpulan use-case, ini

keduanya.

Diagram

mengkomunikasikan lingkup kejadian bisnis yang harus diproses oleh sistem. Detil setiap kejadian bisnis dan bagaimana pengguna dapat berinteraksi dengan sistem digambarkan dalam artifak kedua yang dinamakan use-case narrative, yang merupakan deskripsi tekstual tentang kejadian bisnis dan bagaimana pengguna akan berinteraksi dengan sistem untuk menyelesaikan tugas.

43

ud M ahasisw a Si stem Inform asi Akadem i k Berbasi s SM S

Info Kalender Akademik

Pengirima n Sara n

Info Nila i Uj ian Tengah Seme ster (UT S)

Info Nila i Uj ian Akhir Se mes ter (UAS) ma hasisw a Info Inde ks Pre stasi S eme ste r (IPS)

Info Inde ks Pres tasi Komula tif (IPK)

Ubah Pass w ord

Gambar 2.4 Diagram Use Case

2.9.3.2 Diagram urutan / sequence Menurut Arthur M. Langer (2008) diagram sequence adalah diagram interaksi yang menekankan urutan waktu dalam pengiriman pesan. Sequence diagram menunjukan interaksi objek dengan waktu yang direpresentasikan dalam grafik dua dimensi. Dimensi vertical menunjukan waktu, digambarkan melintang kebawah. Dimensi Horizontal menunjukkan jenis peranan yang menggambarkan individu objek dalam diagram collaboration. Durasi aktivitas objek ditunjukkan oleh lifeline yang berupa garis putus-putus. Message ditampilkan sebagai panah dari satu lifeline sebuah objek ke lifeline objek yang lainnya.

44

Gambar 2.5 Diagram Sequence

2.9.3.3 Diagram kolaborasi Menurut Arthur M. Langer (2008) diagram kolaborasi adalah diagram interaksi yang menunjukkan struktur organisasi dari objek yang

mengirimkan dan menerima messages. Diagram kolaborasi adalah class diagram yang mengandung classifier roles dan association roles yang menunjukkan konfigurasi antara objek dan link yang tejadi ketika eksekusi. Association roles dapat ditempati oleh berbagai mecam temporary link seperti argument procedure atau procedure variable local. Objek

45

yang ditampilkan hanya objek yang terlibat dalam kolaborasi meskipun objek tersebut berada dalam system yang berbeda. Jadi, collaboration diagram memodekan objek dan hubungan yang terlibat dalam implementasi dari interaksi.

Gambar 2.6 Diagram Kolaborasi

2.9.3.4. Diagram statechart Menurut Arthur M. Langer (2008) diagram statechart adalah diagram yang menunjukkan state machine yang terdiri atas states, transitions, events, dan activities. Diagram statechart digunakan untuk mengilustrasikan gambaran dinamik sebuah sistem. Diagram statechart menampilkan kemungkinan daur hidup object dari class. Diagram state terdiri dari state(keadaan) yang

46

terhubung dengan transisi. Setiap state memodelkan periode dari waktu selama objek hidup dengan suatu kondisi yang pasti. Ketika terjadi sebuah event, maka hal tersebut dapat menyebabkan sebuah objek mengalami transisi yang memindahkan objek tersebut ke state yang lain. Diagram statechart banyak digunakan untuk mendeskripsikan user interface, alat pengendali, pasif objek yang mempunyai behavior yang special.

Gambar 2.7 Diagram Statechart

47

2.9.3.5. Diagram aktivitas Menurut Arthur M. Langer (2008) diagram aktivitas adalah diagram yang menunjukkan aliran dari aktifitas satu ke aktifitas lainnya di dalam sebuah sistem. Diagram 35 aktifitas digunakan unutk mengilustrasikan gambaran dinamis dari suatu sistem. Diagram aktifitas menekankna pada aliran kontrol diantara objek. Diagram aktivitas adalah notasi yang digunakan untuk menggambarkan grafis aktivitas yang meliputi symbol-simbol yang unik. Symbol-simbol tersebut dapat digunakan dalam diagram statechart.

Gambar 2.8 Diagram Aktivitas

48

2.10 Rekayasa Perangkat Lunak 2.10.1. Pengertian Rekayasa Perangkat Lunak Perangkat lunak adalah perintah (program komputer) yang bila dieksekusi memberikan fungsi dan unjuk kerja seperti yang diinginkan, struktur data yang memungkinkan program memanipulasi informasi secara proporsional, dan dokumen yang menggambarkan operasi dan kegunaan program. (Roger S Pressman:2007) Sedangkan rekayasa piranti lunak adalah pembuatan dan penggunaan prinsip-prinsip teknik yang bertujuan untuk mendapatkan software yang bernilai ekonomis yang reliabel dan bekerja secara efisien pada perangkat nyata (Roger S Pressman:2007). Sedangkan menurut IEEE [IEE93] telah mengembangkan definisi yang lebih komprehensif, yaitu : (1) rekayasa perangkat lunak adalah aplikasi dari sebuah pendekatan kuantifiable, disiplin, dan sistematis kepada pengembangan, operasi dan pemeliharaan perangkat lunak. (2). Studi tentang pendekatan-pendekatan seperti pada proses, metode dan alat bantu.

49

2.10.2. Langkah-langkah Pengembangan Piranti Lunak Dalam merancang suatu aplikasi, perlu diadakan suatu pendekatan sistematis dalam rekayasa piranti lunak tersebut. Dalam rekayasa piranti lunak terdapat sebuah pendekatan yang digunakan disebut sebagai The Linear Sequentual Model, atau terkadang disebut sebagai Waterfall Model atau Classic Life Model. (Pressman:2007). Model eksplisit yang pertama dari proses pengembangan software, berasal dari proses-proses rekayasa yang lain. Model ini memungkinkan proses pengembangan lebih terlihat. Dikarenakan bentuknya yang bersusun kebawah dari satu fase ke fase lainnya, model ini dikenal sebagai model Waterfall.

2.11. Siklus Hidup Sistem (System Life Cycle) Siklus hidup sistem (system life cycle) atau SLC adalah proses evolusioner yang diikuti dalam menerapkan sistem atau subsistem informasi berbasis komputer. SLC terdiri dari serangkaian tugas yang erat yang mengikuti langkah-langkah pendektan sistem. Karena tugas-tugas tersebut mengikuti suatu pola yang teratur dan dilakukan secara top-down, SLC sering disebut sebagai pendekatan air terjun (waterfall approach) bagi pengembangan dan penggunaan sistem.

50

Gambar 2.9 Waterfall Model

1. System Engineering Pengembangan software dilakukan dimulai dari analisis kebutuhankebutuhan software. Analisis kebutuhan ini penting untuk dikerjakan karena akan menentukan konektivitas antara hardware, user, dan databasedatabase. 2. Software requirement analysis Pada tahap selanjutnya hasil pengumpulan kebutuhan-kebutuhan software ini akan difikuskan secara khusus pada software. Untuk

51

membangun suatu software yang sesuai dengan permintaan user, software engineer harus mengetahui fungsi-fungsi yang dibutuhkan, user interface, kebutuhan software untuk didokumentasikan dan dibahas bersama dengan customer. 3. Design Pada tahap ini akan dibuat design dari software. Pada saat ini dilakukan desain akan diterjemahkan kebutuhan-kebutuhan dari user dan akan dibuat perancangan software sebelum dilakukan coding. Perancangan ini juga akan didokumentasikan dan akan menjadi bagian dari software yang dibuat. 4. Coding Setelah dilakukan desain software maka tahapan selanjutnya yaitu coding. Coding dilakukan untuk menterjemahkan perancangan yang telah dibuat ke dalam bentuk yang dapat dibaca oleh mesin. 5. Testing Setelah program selesai dibuat maka tahapan selanjutnya akan dilakukan testing. Proses testing ini difokuskan pada :

a. Logical internals of the software Pengetesan terhadap statement-statement.

52

b. Functional external Pengetesan dilakukan untuk menemukan error pada program.

6. Maintenance Maintenance (pemeliharaan) harus dilakukan untuk mengantisipasi perubahan-perubahan pada sistem. Perubahan ini dpat disebabkan oleh : a. Error ditemukan b. Perubahan dari lingkungan sistem, misalnya perubahan hardware dan sistem operasi yang baru

c. Customer memerlukan pengembangan sistem yang baru

53

2.12 Teori Khusus yang berhubungan 2.12.1 HTML (Hyper Text Markup Language) HTML merupakan kepanjangan dari Hyper Text Markup Language adalah suatu bahasa yang digunakan untuk membuat halaman-halaman hypertext (hypertext page) pada internet. Dengan konsep hypertext ini, untuk membaca suatu dokumen anda tidak harus melakukannya secara urut, baris demi baris, atau halaman demi halaman. Tetapi anda tidak dapat dengan mudah melompat dari satu topik ke topic lainnya yang anda sukai, seperti halnya jika anda melakukan pada online Help dari suatu aplikasi Windows. HTML dirancang untuk digunakan tanpa tergantung pada suatu platform tertentu (platform independent).

2.12.2 PHP PHP diciptakan oleh Rasmus Lerdorf, seorang pemrogram C yang handal. Semula PHP hanya digunakan untuk mencatat jumlah pengunjung pada homepagenya. Rasmus adalah seorang pendukung open source. Karena itulah ia mengeluarkan Personal Home Page Tools versi 1.0 secara gratis. Setelah mempelajari YACC dan GNU Bison, Rasmus menambah kemampuan PHP 1.0 dan menerbitkan PHP 2.0. PHP mudah dibuat dan cepat dijalankan, PHP dapat berjalan dalam web server yang berbeda dan

54

dalam sistem operasi yang berbeda pula. PHP dapat berjalan di sistem operasi UNIX, Windows 98, Windows XP, Windows NT, dan Macintosh.

2.12.2.1 Sejarah PHP PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada waktu itu PHP bernama FI (Form Interpreted). Pada saat tersebut PHP adalah sekumpulan script yang digunakan untuk mengolah data form dari web. Perkembangan selanjutnya adalah Rasmus melepaskan kode sumber tersebut dan menamakannya PHP/FI, pada saat tersebut kepanjangan dari PHP/FI adalah Personal Home Page/Form Interpreter. Dengan pelepasan kode sumber ini menjadi open source, maka banyak programmer yang tertarik untuk ikut mengembangkan PHP. Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini interpreter sudah diimplementasikan dalam C. Dalam rilis ini disertakan juga modul-modul ekstensi yang meningkatkan kemampuan PHP/FI secara signifikan. Pada tahun 1997, sebuah perusahaan bernama Zend, menulis ulang interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat. Kemudian pada Juni 1998 perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan nama rilis tersebut menjadi PHP 3.0. Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis tersebut dikenal dengan

55

PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak dipakai. Versi ini banyak dipakai sebab versi ini mampu dipakai untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan proses dan stabilitas yang tinggi. Pada Juni 2004, Zend merilis PHP 5.0. Versi ini adalah versi mutakhir dari PHP. Dalam versi ini, inti dari interpreter PHP mengalami perubahan besar. Dikenalkannya model pemrograman berorientasi objek baru untuk menjawab perkembangan bahasa pemrograman.

2.12.2.2 Pengertian PHP Menurut Luke Welling dan Laura Thomson(2001:1), PHP adalah server-side scripting language yang didesain secara spesifik untuk web. Dalam page HTML, dapat dimasukkan code PHP yang akan dieksekusi setiap kali halaman dikunjungi. PHP code diterjemahkan di web-server dan dirubah menjadi HTML atau output lain yang akan dilihat oleh pengunjung halaman. PHP adalah bahasa pemrograman script yang paling banyak dipakai saat ini. PHP banyak dipakai untuk memrogram situs web dinamis, walaupun tidak tertutup kemungkinan digunakan untuk pemakaian lain. Contoh terkenal dari aplikasi PHP adalah phpBB dan MediaWiki (software di belakang Wikipedia). PHP juga dapat dilihat sebagai pilihan lain dari ASP.NET/C#/VB.NET Microsoft, ColdFusion Macromedia, JSP/Java Sun

56

Microsystems, dan CGI/Perl. Contoh aplikasi lain yang lebih kompleks berupa CMS yang dibangun menggunakan PHP adalah Mambo, Joomla!, Postnuke, Xaraya, dan lain-lain.

2.12.2.3. Kelebihan PHP a. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya. b. Web Server yang mendukung PHP dapat ditemukan dimana - mana dari mulai IIS sampai dengan apache, dengan konfigurasi yang relatif mudah. c. Dalam sisi pengembangan lebih mudah, karena banyaknya milis milis dan developer yang siap membantu dalam pengembangan. d. Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena referensi yang banyak. PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (linux, unix, windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah system.

57

2.12.3 MySQL MySQL adalah salah satu jenis database server yang sangat terkenal. Kepopulerannya disebabkab bersifat free (anda tidak perlu membayar untuk menggunakannya) pada berbagai platform (kecuali pada windows, yang bersifat software atau anda perlu membayar setelah melakukan evaluasi dan memutuskan digunakan untuk keperluan produksi). Perangkat lunak atau

MySQL sendiri bisa di download dari http: // www.mysql.org http://www.mysql.com. MySQL termasuk jenis RDMS

(Relational

Database Management System). Itulah sebabnya istilah seperti tabel, baris, dan kolom digunakan pada MySQL. Pada MySQL, sebuah database mengandung satu atau sejumlah tabel. Tabel terdiri atas sejumlah baris dan setiap baris mengandung satu atau beberapa kolom. Menurut Menurut Luke Welling dan Laura Thomson(2001,p1), MySQL adalah sebuah relational database management systems yang sangat cepat dan kuat. MySQL adalah sebuah perangkat lunak sistem management basis data SQL atau DBMS yang multithread, multiuser, dengan sekitar 6 juta instalasi diseluruh dunia. MySQL dimiliki dan disponsori oleh sebuah perusahaan komersial Swedia MySQL AB, dimana memegang hak cipta hampir atas semua kode sumbernya. Kedua orang Swedia dan satu orang Finlandia yang mendirikan MySQL AB adalah: David Axmark, Allan

58

Larsson, dan Michael "Monty" Widenius. Tersedia sebagai perangkat lunak gratis dibawah lisensi GNU General Public License (GPL), tetapi mereka juga menjual dibawah lisensi komersial untuk kasus-kasus dimana penggunaannya tidak cocok dengan penggunaan GPL. Untuk melakukan administrasi dalam basis data MySQL, dapat menggunakan modul yang sudah termasuk yaitu command-line (perintah: mysql dan mysqladmin). Juga dapat diunduh dari situs MySQL yaitu sebuah modul berbasis grafik (GUI): MySQL Administrator dan MySQL Query Browser. Selain itu terdapat juga sebuah perangkat lunak gratis untuk administrasi basis data MySQL berbasis web yang sangat populer yaitu phpMyAdmin.

2.12.3.1. Entity Relationship Diagram Menurut Jeffery L. Whitten, Lonnie D. Bentley, Kevin C. Dittman (2004:281), ERD ialah model data yang menggunakan beberapa notasi untuk menggambarkan data dalam konteks entitas dan hubungan yang dideskripsikan oleh data tersebut. ERD adalah model konseptual yang mendeskripsikan hubungan antara penyimpan (dalam DFD). ERD digunakan untuk memodelkan struktur data dan hubungan antar data. Dengan ERD, model dapat diuji

59

dengan mengabaikan proses yang dilakukan.

Ada beberapa catatan

mengenai pemodelan data. Sebagian besar ERD disebut sesuai dengan nama penemunya (misalnya, Chen Martin, Bachman, Merise) atau sesuai standar yang dipublikasikan. Bahasa pemodelan data ini pada umumnya mendukung konsep dan konstruksi dasar yang sama. Skripsi ini menggunakan ERD Martin karena penggunanya sudah tersebar luas dan didukung oleh peralatan CASE. Model data ERD mempunyai beberapa kosep dasar ,yaitu : 1. Entitas (Entity) Entitas adalah sekelompok orang, tempat, objek, kejadian atau konsep tentang apa yang kita perlukan untuk men-capture dan meyimpan data. Jika entitas adalah sesuatu yang kita gunakan untuk menyimpan data, maka kita perlu mengidentifikasi bagian data spesifik yang ingin kita simpan dari setiap contoh entitas tertentu. Bagian data ini dapat disebut atribut. Atribut adalah sifat atau karakteristik deskriptif suatu entitas. 2. Atribute (Attribute) Yang dimaksud dengan atribute adalah karakteristik entity. a. Domain Nilai dari tiap atribut didefinisikan kedalam tiga properti yaitu : - Tipe Data : properti dari atribut yang mengidentifikasikan

60

tipe data atribut. - Domain

yang dapat disimpan ke dalam

: properti dari atribut yang mendefinisikan nilai apa yang boleh diambil oleh suatu atribut.

- Default Value : suatu nilai yang akan disimpan apabila nilai tidak dispesifikasikan oleh user.

b. Identifikasi (Identification). Dengan banyaknya instance yang dimiliki oleh suatu entity maka diperlukan suatu key yang unik untuk menngidentifikasikan setiap instance berdasarkan data dari atribut. Yang dimaksud dengan key adalah suatu atribut atau sekumpulan atribut yang mengasumsikan nilai yang unik dari setiap bagian dari entity dan seringkali disebut identifier. Candidate key adalah salah satu key yang memiliki kemungkinan untuk dijadikan primary key. Primary key adalah candidate key yang unik dan mengidentifikasikan sebuah bagian dari entity. Alternate key adalah candidate key yang tidak dijadikan primary key.

61

3. Hubungan (Relationship) Secara konseptual, entitas dan atribut tidak terpisah. Hal yang dinyatakannya saling berinteraksi dan mempengaruhi untuk mendukung tujuan bisnis. Relationship/hubungan adalah hubungan bisnis alami yang ada di antara satu atau lebih entitas. Hubungan tersebut dapat menyatakan kejadian yang menghubungkan entitas atau hanya persamaan logika yang ada di antara entitas. Cardinality adalah jumlah minimum dan maksimum dari keberadaan suatu entity yang mungkin direlasikan dengan entity lain. Degree adalah sejumlah entity yang berpartisipasi dalam sebuah relationship. Foreign key adalah sebuah primary key yang digunakan oleh entity lain untuk mengidentifikasikan instansi dari sebuah relationship. Berikut ini adalah notasi dari cardinality : a. Tepat satu (satu dan hanya satu): nilai minimum dan maksimum adalah 1. b. Nol atau satu: nilai minimum adalah 0 dan nilai maksimum adalah 1. c. Satu atau lebih: nilai minimum adalah 1 dan nilai maksimum adalah banyak(>1).

62

d. Nol, satu, atau lebih: nilai minimum adalah 1 dan nilai maksimum adalah banyak (>1). e. Lebih dari satu : nilai minimum dan maksimum adalah >1

4. Generalisasi (Generalization) Yang dimaksud dengan generalization adalah sebuah konsep dimana atribut-atribut yang umum bagi beberapa tipe dari entity digrupkan kedalam entity mereka masing-masing.

Gambar 2.10 Model Data Hubungan Entitas

63

2.13. Metode pemecahan masalah Pada dasarnya penelitian (jogianto,2008) itu dilakukan guna mendapatkan data yang dapat digunakan untuk memecahkan masalah. Untuk itu setiap penelitian yang akan dilakukan selalu berangkat dari masalah. Seperti dinyatakan oleh Emory (2006) bahwa, baik penelitian murni maupun terapan, semuanya berangkat dari masalah, hanya untuk penelitian terapan, hasilnya langsung dapat digunakan untuk membuat keputusan. Jadi setiap penelitian yang akan dilakukan selalu berangkat dari masalah. Walaupun diakui bahwa memilih masalah penelitian sering merupakan hal yang paling sulit dalam proses penelitian. Bila dalam penelitian telah dapat menemukan masalah yang betul-betul masalah, maka pekerjaan penelitian 50% telah selesai. Hubungan antara ketetapan memilih masalah dan cara pemecahan ditunjukan pada table 2.2

Tabel 2.2 Hubungan Antara Ketepatan Memilih Masalah dan Cara Pemecahannya (Sugiyono, 2007)

64

Berdasarkan tabel 2.1 tersebut, maka yang paling baik adalah yang pertama, pemilihan masalah benar, dan pemecahannya juga benar. Kedua masalah benar cara pemecahannya salah. Ketiga masalahnya salah dan tetapi cara pemecahannya benar. Keempat masalah salah dan cara pemecahannya juga salah.

2.14. Metode Pengumpulan Data Terdapat dua hal utama yang mempengaruhi kualitas data hasil penelitian(Sugiyono,2004), yaitu, kualitas instrumen penelitian, dan kualitas pengumpulan data. Pengumpulan data dapat dilakukan dalam berbagai setting dan berbagai cara. Bila dilihat dari setting-nya, data dapat dikumpulkan pada setting alami. Bila dilihat dari sumber datanya, pengumpulan data dapat menggunakan sumber primer dan sumber sekunder yang tidak langsung memberikan data kepada pengumpul data. Pengumpulan data dapat dilakukan dengan menggunakan tekniktekniktertentu seperti berikut:

65

1. Angket (Koesioner) Angket adalah teknik pengumpulan data dengan

menyerahkan atau mengirimkan daftar pertanyaan untuk diisi oleh responden. Responden adalah orang yang memberikan tanggapan atas-atau, menjawab pertanyaan-pertanyaan yang diajukan. Tipe dari pertanyaan koesioner diklasifikasikan menjadi 3 macam, yaitu: A. Perilaku, informasi yang dicari adalah bersifat fakta, apa yang dilakukan atau dimiliki responden, serta frekuensi suatu tindakan yang dilakukan. B. Sikap, informasi yang dicari adalah pendapat, citra dan penilaian orang terhadap sesuatu. C. Klasifikasi, informasi yang dicari adalah informasi mengelompokkan responden, seperti umur, jenis kelamin, kelas sosial, lokasi tempat tinggal, dan lain-lain. Koesioner mempunyai 4 tujuan yaitu: a. Memperoleh informasi yang akurat dari responden dengan mengajukan pertanyaan yang tepat kepada orang yang tepat pula.

66

b. Memberikan sturuktur pada wawancara, sehingga wawancara dapat berjalan lancar dan teratur. c. Memberikan format standar pencatatan fakta, komentar dan sikap. d. Memudahkan pengolahan data. 2. Wawancara (interview) Wawancara adalah teknik pengumpulan data dengan mengajukan pertanyaan langsung oleh pewawancara kepada responden, dan jawaban-jawaban respon dicatat atau direkam. Teknik wawancara ini dapat dibedakan atas dua, yaitu sebagai berikut: a. Wawancara berstruktur Merupakan teknik wawancara dimana pewawancara menggunakan (mempersiapkan) daftar pertanyaan, atau daftar isian sebagai pedoman saat melakukan wawancara.

67

b. Wawancara tidak berstruktur Merupakan teknik wawancara dimana pewawancara tidak menggunakan daftar pertanyaan atau daftar isian sebagai penuntun selama dalam proses wawancara.

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

68

BAB III ANALISIS SISTEM

3.1.

Ananlisa Sistem Yang Sedang Berjalam

Penguraian dari suatu sistem informasi yang utuh kedalam komponen-komponennya mengidentifikasikan dan dengan maksud untuk

mengevaluasikan

permasalahan-

permasahan, kesempatan-kesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan-perbaikannnya.(Jogiyanto : 2008) Berdasarkan pengertian diatas dapat diambil kesimpulan bahwa analisis sistem itu adalah kegiatan, usaha atau orang yang berusaha mencari permasalahan, penyebab permasalahan dari

suatu sistem yang sedang berjalan untuk dapat dicarikan pemecahan masalahannya. Aliran Sistem Informasi Perancangan
E_Learning Berbasis Web Pada SMK Elektro Adzkia Padang yang sedang

68

69

berjalan dapat dilihat pada gambar 3.1 Adapun aliran sistem informasi yang sedang berjalan dapat dijelaskan sebagai berikut:

1. Siswa datang ke sekolah dan masuk kedalam ruangan belajar untuk menerima materi ajar siswa memiliki identitasnya yaitu : Nomor induk siswa, nama siswa, jenisklamin 2. Guru menerima data siswa lalu guru mengecek siswa yang hadir. 3. Selanjutnya Guru dan Siswa melakukan proses kegiatan belajar mengajar. 4. Output dari pengolahan data tersebut adalah : a. b. c. d. e. Materi Ajar Laporan Data Siswa Laporan Data Siswa Per TA Laporan Data Guru Daftar Pelajaran Per Semester

5. Output dari pengolahan data di arsipkan satu lembar oleh Guru 6. dan lembaran kedua diberikan kepada siswa

70

ASI : SISTEM PERANCANGAN E_LEARNING BERBASIS WEB PADA SMK ELEKTRO AZKIA PADANG
SISWA GURU

Data Siswa -Nis -Nama -Jenis Klamin

Data Siswa -Nis -Nama -Jenis Klamin

PROSES KEGIATRAN BELAJAR MENGAJAR

-Materi Ajar -Laporan Data Siswa -Laporan Data Siswa per TA -Laporan Data Guru -Daftar Pelajaran Per Semester

-Materi Ajar -Laporan Data Siswa -Laporan Data Siswa per TA -Laporan Data Guru -Daftar Pelajaran Per Semester

Gambar 3.1 ASI : SISTEM PERANCANGAN E_LEARNING BERBASIS WEB PADA SMK ELEKTRO AZKIA PADANG

71

3.2.

Aliran Sistem Yang Diusulkan Aliran sistem informasi Sistem Informasi Perancangan

E_Learning Berbasis Web Pada SMK Azkia Elektro Padang yang diusullkan dapat dilihat pada gambar 3.2 : ASI : Sistem Informasi Perancangan E_Learning Berbasis Web Pada SMK Azkia Elektro Padang

72

SISWA

GURU

ADMINISTRATOR

TAMPILAN SISTEM ELEARNING

TAMPILAN SISTEM ELEARNING

TAMPILAN SISTEM ELEARNING

Login Ke server

Login Ke server

Login Ke server

PROSES DOWNLOAD MATERI dan UPLOAD TUGAS

PROSES UPLOAD MATERI AJAR dan DOWNLOAD JAWABAN TUGAS

PROSES PENGOLAHAN DATA SISWA,PENGOLAHAN DATA GURU, PENGOLAHAN DATA PELAJARAN

Jawaban Tugas Laporan

Materi Ajar

-Materi Ajar -Laporan Data Siswa -Laporan Data Siswa per TA -Laporan Data Guru -Daftar Pelajaran Per Semester

Databas e dbelearni ng SISTEM ELEARNING BERBASIS WEB Daftar Pelajaran Per semester A

Gambar 3.2 ASI :

SISTEM INFORMASI Perancangan E_Learning Berbasis Web Pada SMK Azkia Elektro Padang Yang Diusulkan

73

Adapun aliran sistem informasi yang diusulkan dapat dijelaskan sebagai berikut: 1. Siswa melakukan Login ke system E-learning setelah

berhasil login siswa dapat mendownload materi pelajaran dan tugas untuk berinteraksi dengan guru siswa bias menggunakan forum diskusi. 2. Guru melakukan Login ke system E-learning setelah berhasil login guru dapat meng upload materi dan melihat hasil jawban tugas untuk berinterasi dengan siswa guru dapat menggunakan forum diskusi. 3. Selanjutnya Administerator Sekolah melakukan login

setelah berhasil login admin dapat menambah data siswa,data guru dan kelas admin juga dapat membuat daftar pelajaran dan pengumuman . 4. Hasil Pengolahan data tersebut disimpan dalam sebuah Database yang diberi nama dbelearning 5. Output dari pengolahan data tersebut adalah data siswa, data siswa per TA, data guru dan daftar pelajaran per semester

74

6. Siswa bisa melihat lansung daftar Pelajaran dan juga mendownload materi dan tugas.

3.3.

Hasil Analisis Berdasarkan masalah dan kendala-kendala yang terjadi

pada system yang berjalan selama ini, maka penulis akan mengusulkan suatu system baru yang dapat memberikan

kemudahan dalam melakukan kegiatan belajar mengajar tepat dan akurat. System yang baru ini sudah bersifat online dimana dalam melakukan kegiatan belajar mengajar mengunakan website yang dirancang dengan bahasa pemograman PHP. Dengan website ini dapat membuat minat siswa menjadi terpacu karna siswa dapat mengakses matapelajaran yang diinginkan kapan saja. Dengan dibuatnya media seperti ini diharapkan proses pembelajaran di SMK Adzkia akan menjadi lebih baik dan dapat meningkatkan prestasi belajar siswa.

75

Dalam usulan system baru ini nantinya akan melibatkan file-file yang saling berinteraksi satu dengan yang lainnya sehingga membentuk satu kesatuan system yangdisebut dengan database Adapun manfaat yang dapat diperoleh dari analisa dan perancangan E-learning berbasis web ini adalah sebagai berikut : 1. Dapat memudahkan para siswa untuk materi dan pelajaran 2. Memudahkan pelajaran 3. Membuka komunikasi antar siswa dan guru ataupun antar siswa diluar pelajaran melalui forum diskusi para guru mendistribusikan materi memperoleh

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

76

BAB IV ANALISA DAN HASIL

4.1.

Desain Sistem Secara Global

Rancangan global merupakan gambaran secara umum tentang

sistem yang baru. Rancangan ini merupakan persiapan dari desain terinci yang mengidentifikasikan komponen-komponen sistem informasi yang akan dirancang secara rinci. Rancangan global juga dapat memberikan kemudahan bagi pemakai dalam mempelajari dan menggunakan aplikasi yang dihasilkan sistem. Ada beberapa alat yang digunakan untuk menggambarkan rancangan global dari sebuah sistem yaitu :

76

77

4.1.1. Hyrarcy Plus Input Proses Output (HIPO) Hiraki, Input, Proses dan Output dari perancangan Elearning berbasis web pada SMK Elektro Adzkia Padang, dapat dilihat pada gambar 4.1 berikut ini :

Gambar 4.1 HIPO (Hirarki Plus Input Proses Output)

4.1.2. Kontek Diagram

Dibawah

ini

dijelaskan

kontek

diagram

yang

menggambarkan garis besar dari perancangan E-learning berbasis

78

web pada SMK Elektro Adzkia Padang yang melibatkan tiga buah entity yaitu : siswa, guru, administrator. Pada kontek diagram ini, yang mempunyai peranan begitu banyak adalah administrator, dimana proses pengolahan dan entri data dilakukan pada bagian ini.

SISWA

Login Username & Password Materi Ajar Daftar Pelajaran Per Semester

Login Username & Password Forum Diskusi Jawab Tugas

Login Username & Password Data Materi Ajar Data Tugas Forum Diskusi GURU Login Username & Password Data Upload Jawaban Tugas Forum Diskusi SISTEM E-LEARNING

Laporan -Materi Ajar -Laporan Data Siswa -Laporan Data Siswa per TA -Laporan Data Guru -Daftar Pelajaran Per Semester

ADMINISTRATOR Login Username & Password -Data Siswa -Data Guru -Data Master -Data Jadwal Pelajaran -Data Kelas

Gambar 4.2 Kontek Diagram E-learning

79

41.3. Data Flow Diagram (DFD) DFD merupakan detail rancangan dari diagram konteks yang sudah dibuat yang sudah memuat rancangan table database yang akan diimplementasikan pada database yang akan dibuat. Data Flow Diagram dapat dilihat pada gambar 4.2 berikut ini DFD : SI Perancangan E_Learning Berbasis Web Pada SMK Azkia Padang

80

ADMINISTRATOR

-Data Siswa -Data Guru -Data Master -Data Jadwal Pelajaran -Data Kelas

GURU

-Username & Password -Materi Ajar

1.0

Data Siswa Data Guru Data Master

F . Data Siswa F . Data Guru F . Data Master F . Data Jadwal Pelajaran F . Data Kelas

SISWA

-Username & Password -Jawab Tugas

PROSES ENTRY DATA E-LEARNING

Data Jadwal Pelajaran Data Kelas

-Data Siswa -Data Guru -Data Master -Data Jadwal Pelajaran -Data Kelas -jawab tugas

2.0 -Username & Password -Materi Ajar -Daftar Pelajaran Per Semester Jawaban Tugas

Data Kelas Data Jadwal Pelajaran

PROSES PENGOLAHAN DATA E-LEARNING

Data Master Data Guru Data Siswa

-Data Siswa -Data Guru -Data Master -Data Jadwal Pelajaran -Data Kelas -jawab tugas

Laporan -Materi Ajar -Laporan Data Siswa -Laporan Data Siswa per TA -Laporan Data Guru -Daftar Pelajaran Per Semester

3.0

PROSES LAPORAN E-LEARNING

Gambar 4.3 : Data Flow Diagram (DFD)

81

4.1.3. Entity Relathion Diagram (ERD) ERD adalah model konseptual yang (dalam dan mendeskripsikan DFD), simbol ERD untuk

hubungan

antara

penyimpanan notasi

menggunakan

sejumlah

menggambarkan struktur dan hubungan antara data ERD merupakan model jaringan yang menggunakan susunan data yang disimpan dalam sistem secara abstrak ERD menekankan pada struktur dan relationship data, berbeda dengan DFD(Data Flow Diagram) yang merupakan model jaringan fungsi yang akan dilaksanakan system ERD : SI Perancangan E_Learning Berbasis Web Pada SMK Azkia Padang

82

Gambar

4.4. Entity Relationship Diagram Perancangan E_Learning Berbasis Web Pada SMK Azkia Padang

83

4.2

Desain Terinci

Pedoman dari desain terinci adalah desain global yang telah dibahas sebelumnya. Tujuan dari sistem terinci ini adalah untuk memberikan innformasi atau gambaran secara terinci bentuk dari Perancangan E_Learning Berbasis Web Pada SMK Azkia Padang. Rancangan terinci terdiri dari : 4.2.1. Desain Output Output merupakan produk dari sistem informasi atau hasil dari proses yang tersimpan pada sebuah media penyimpanan. Output pada sistem komputer merupakan tampilan dilayar monitor ataupun data yang dicetak pada kertas. Rancangan output yang penulis usulkan bisa dilihat pada table berikut ini :

84

a. Download Materi
Kode Pelajaran Name Type Size Deskripsi Tanggal kadarluarsa

X(4)9(1)

X(25)

X(3)

9(4)

X(25)

99-99-9999

X(4)9(1)

X(25)

X(3)

9(4)

X(25)

99-99-9999

Tabel: 4.1 Rancangan output Download Materi

85

b. Laporan Data Siswa SMK Adzkia Padang

Laporan Data Siswa SMK Adzkia Padang Tahun Ajaran

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504

Jenis Nis Nama Kode klamin

Tempat lahir

Tanggal Kode lahir Agama Alamat Kecamatan Kelurahan Kota

Kode Pos

Kode Tahun masuk kelas Jurusan

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

X(4)9(1)

9(8)

X(30)

X(30) 9(5) X(25) 9(1) X(9) X(25) 9(8) 9(1) X(15) X(25) X(25) X(25) X(25) 9(5) X(4)9(1) 9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel: 4.2 Rancangan output Laporan daftar siswa smk adzkia padang

86

c. Laporan Data Siswa SMK Adzkia Padang Tahun Ajaran

Laporan Data Siswa SMK Adzkia Padang Tahun Ajaran

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504

Jenis Nis Nama Kode klamin

Tempat lahir

Tanggal Kode lahir Agama Alamat Kecamatan Kelurahan Kota

Kode Pos

Kode Tahun masuk kelas Jurusan

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

X(4)9(1)

9(8)

X(30)

X(30) 9(5) X(25) 9(1) X(9) X(25) 9(8) 9(1) X(15) X(25) X(25) X(25) X(25) 9(5) X(4)9(1) 9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel: 4.2 Rancangan output Laporan daftar siswa smk adzkia padang Tahun Ajaran

87

d. Laporan Data Siswa SMK Adzkia Padang Pada Kelas 1

Laporan Data Siswa SMK Adzkia Padang Pada Kelas 1

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504 Jenis Nis Nama Kode klamin lahir lahir Tempat Tanggal Kode Agama Alamat Kecamatan Kelurahan Kota Pos kelas Kode Kode Tahun masuk Jurusan

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

X(4)9(1)

9(8)

X(30)

X(30) 9(5) X(25) 9(1) X(9) X(25) 9(8) 9(1) X(15) X(25) X(25) X(25) X(25) 9(5) X(4)9(1) 9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel: 4.2 Rancangan output Laporan daftar siswa smk adzkia padang pada kelas1

88

e. Laporan Data Siswa SMK Adzkia Padang Pada Kelas 2

Laporan Data Siswa SMK Adzkia Padang Pada Kelas 2

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504 Jenis Nis Nama Kode klamin lahir lahir Tempat Tanggal Kode Agama Alamat Kecamatan Kelurahan Kota Pos kelas Kode Kode Tahun masuk Jurusan

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

X(4)9(1)

9(8)

X(30)

X(30) 9(5) X(25) 9(1) X(9) X(25) 9(8) 9(1) X(15) X(25) X(25) X(25) X(25) 9(5) X(4)9(1) 9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel: 4.2 Rancangan output Laporan daftar siswa smk adzkia padang pada kelas 2

89

f. Laporan Data Siswa SMK Adzkia Padang Pada Kelas 3

Laporan Data Siswa SMK Adzkia Padang Pada Kelas 3

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504 Jenis Nis Nama Kode klamin lahir lahir Tempat Tanggal Kode Agama Alamat Kecamatan Kelurahan Kota Pos kelas Kode Kode Tahun masuk Jurusan

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

X(4)9(1)

9(8)

X(30)

X(30) 9(5) X(25) 9(1) X(9) X(25) 9(8) 9(1) X(15) X(25) X(25) X(25) X(25) 9(5) X(4)9(1) 9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel: 4.2 Rancangan output Laporan daftar siswa smk adzkia padang pada kelas 3

90

g. Laporan daftar guru SMK Adzkia Padang

Laporan Daftar Guru SMK Adzkia Padang

JL.Belanti Raya Blok C No 4 Khatib sulaiman Padang Telepon 0751-7871504

Kode Nama Guru Kode

Jenis klamin

Tempat lahir

Tanggal Kode lahir Agama Alamat Kecamatan Kelurahan Kota

Kode Tahunmasuk Pos

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

9(8)

9(5)

X(25)

9(1)

X(9)

X(25)

9(8)

9(1)

X(15)

X(25)

X(25)

X(25)

X(25)

9(5)

9(8)

Padang, Tgl 99-99-9999 Kepala sekolah SMK Adzkia Padang

()

Tabel : 4.3 Rancangan output Daftar guru smk adzkia pada

91

h. Daftar Pelajaran SMK adzkia padang Daftar Pelajaran SMK Adzkia Padang SEMESTER I
Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel : 4.4 Rancangan Daftar pelajaran smk adzkia pada sem I

Daftar Pelajaran SMK Adzkia Padang SEMESTER II
Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel: 4.5 Rancangan Daftar pelajaran smk adzkia pada sem II

92

Daftar Pelajaran SMK Adzkia Padang SEMESTER III

Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel : 4.6 Rancangan Daftar pelajaran smk adzkia pada sem III
Daftar Pelajaran SMK Adzkia Padang SEMESTER IV
Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel: 4.7 Rancangan Daftar pelajaran smk adzkia pada sem IV

93

Daftar Pelajaran SMK Adzkia Padang SEMESTER V

Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel : 4.8 Rancangan Daftar pelajaran smk adzkia pada sem V

Daftar Pelajaran SMK Adzkia Padang SEMESTER VI
Kode No Kelas Jurusan Hari Jam Pelajaran Pelajaran Nama Kode guru Guru

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30)

9(5)

X(25)

9(9)

9(3)

X(30)

X(6)

9(4)

X(3)9(1)

X(30) 9(5)

X(25)

Tabel : 4.9 Rancangan Daftar pelajaran smk adzkia pada sem VI

94

4.2.2 Disain Input

Input atau masukan merupakan tempat untuk memasukkan data-data dan disimpan dalam media penyimpanan. Tujuan dari disain input adalah untuk mencapai keakuratan data serta untuk menjamin agar pemasukan data dapat diterima dan dimengerti oleh pemakai. 1. Disain input siswa Disain input ini digunkan untuk memasukan data siswa yang terdaftar pada smk adzkia, penginputan data siswa dilakukan dengan dua step.Adapun gambar disain input siswa dapat dilihat dibawah ini:

Gambar : 4.5. disain input data siswa pada step 1

95

Gambar : 4.6. disain input data siswa pada step 2

2. Disain input guru Disain input ini digunkan untuk memasukan data guru

yang ada pada smk adzkia, seperti input data siswa input data guru juga terdiri dari dua step. Adapun gambar disain input guru dapat dilihat dibawah ini :

96

Gambar : 4.7. disain input data guru pada step 1

Gambar : 4.8. disain input data guru pada step 2

97

3. Disain input data master Disain ini digunakan untuk memasukkan master yang terdiri dari data jenis klamin, agama, alamat, mata pelajaran.Adapun gambar input data master dapat dilihat dibawah ini:

Gambar : 4.9. input data master 4. Disain input data kelas Disain ini digunakan untuk memasukkan data kelas .Adapun gambar input data kelas dapat dilihat dibawah ini :

98

Gambar : 4.10. input data kelas

5. Disain input data pelajaran Disain ini digunakan untuk memasukkan data pelajaran untuk menghasilkan daftar pelajaran.Adapun gambar input data pelajarn dapat dilihat dibawah ini :

Gambar : 4.10. input data pelajaran

99

42.3. Desain File Desain file merupakan unit penampungan data dari system informasi, dalam menghasilkan laporan-laporan yang diinginkan. Disini penulis merancang beberapa desain file yaitu : 1. Disain file guru Tabel 4.10 Disain File Guru Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 7 8 nip username password tempat tanggal alamat foto tanggalmsk Field Name

: dbelearning .SQL : Guru : NIP

Type character character character character date character character date 40 90 Width 20 25 90 40 Description Nomor induk pegawai Nama guru Password Tempat lahit Tanggal lahir alamat foto Tanggal masuk

100

2. Disain file siswa Tabel 4.11 Disain File Siswa Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 7 8 nis username password tempat tanggal alamat tahun_masuk foto Field Name Type character character character character date character date character 90 40

: dbelearning .SQL : Siswa : NIS

Width 20 25 90 40 Description Nomor induk siswa Nama guru Password Tempat lahit Tanggal lahir alamat Tahun masuk foto

101

3. Disain file pelajaran Tabel 4.12 Disain File Pelajaran Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 Field Name idpel kode_pelajaran kode_kelas hari jam Type numeric character character character time

: dbelearning .SQL : Pelajaran : Idpel

Width 11 10 10 11 Description Nomar pelajaran Kode pelajaran Kode kelas Hari Jam mulai pelajaran

4. Disain file mata pelajaran Tabel 4.13 Disain File Mata Pelajaran Nama Database Nama Tabel Primary Key
No 1 2 3 Field Name kode_pelajaran nama_pelajaran nip Type character character character

: dbelearning .SQL : mp : Kode_pelajaran

Width 10 67 12 Description Kode dari pelajaran Nama dari pelajaran Nomor induk pegawai

102

5. Disain file kelas Tabel 4.14 Disain File Kelas Nama Database Nama Tabel Primary Key
No 1 2 3 4 Field Name Kode_kelas Nama_kelas jurusan tinggkat Type character character character numeric

: dbelearning .SQL : kelas : Kode_kelas

Width 10 25 40 11 Description Kode dari kelas Nama kelas Jurusan tingkat

6. Disain file upload tugas Tabel 4.15 Disain File Upload Tugas Nama Database Nama Tabel Primary Key
No 1 2 3 4 id Kode_pelajaran name type Field Name Type numeric character character character

: dbelearning .SQL : Upload : Id

Width 11 10 30 30 Description Nomor file upload Kode pelajaran Nama file upload Type file

103

5 6 7

size descripsi tgl

numeric text date

11

Ukuran file Keterangan Tanggal kadar luarsa

7. Disain file upload materi Tabel 4.16 Desain File Upload Materi Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 7 id Kode_pelajaran name type size descripsi tanggal Field Name Type numeric character character character numeric text date

: dbelearning .SQL : Materi : Id

Width 11 10 30 30 11 Description Nomor file upload Kode pelajaran Nama file upload Type file Ukuran file Keterangan Tanggal upload file

104

8. Disain file nilai Tabel 4.17 Disain File Nilai Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 7 id Kode_pelajaran nis Nila_harian Nilai_tugas Nilai_ts Nilai_as Field Name Type numeric character character character character character character

: dbelearning .SQL : Nilai : Id

Width 5 10 10 4 4 4 4 Description Nomor dari nilai Kode pelajaran Nomor induk siswa Nilai harian Nilai tugas Nilai tengah semester Nilai akhir semester

9. Disain file jawab tugas Tabel 4.18 Disain File Jawab tugas Nama Database Nama Tabel Primary Key : dbelearning .SQL : jawab : Id_jawab

105

No 1 2 3 4 5 6

Field Name Id_jawab Kode_pelajaran nis path_jawab tanggal cek

Type numeric character character text date character

Width 11 10 11

Description Nomor file jawab Kode pelajaran Nomor induk siswa Isi dari upload jawab Tanggal dijawab

Dicek oleh guru

10. Disain file admin Tabel 4.19 Disain File Admin Nama Database Nama Tabel Primary Key
No 1 2 3 4 id username password email Field Name Type numeric character character character

: dbelearning .SQL : tbladmind : Id

Width 10 64 64 100 Description Nomor admin Nama admin Password admin Alamat email admin

106

11. Disain file pengumuman Tabel 4.20 Disain File Pengumuman Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 7 id tanggal judul kop isi user klik Field Name Type numeric date character character character character numeric 50 3 225 225

: dbelearning .SQL : Pengumuman : Id

Width 4 Description Nomor dari pengumuman Tanggal pengumuman Judul pengumuman kop isi Nama admind Jumlah di klik

107

12. Disain file Frequently Asked Questions Tabel 4.21 Disain File Frequently Asked Questions Nama Database Nama Tabel Primary Key : dbelearning .SQL : Faq : Id

No 1 2 3 id

Field Name

Type numeric text text

Width 11

Description Nomor dari F A Q Pertanyaan Jawaban

question answer

13. Disain file poling Tabel 4.22 Disain File poling Nama Database Nama Tabel Primary Key
No 1 2 id topik Field Name Type numeric character

: dbelearning .SQL : Poling : Id

Width 3 200 Description Nomor poling Topik poling

108

3 4 5 6 7 8 9 10 11 12

Pil1 Pil2 Pil3 Pil4 Pil5 Dat1 Dat2 Dat3 Dat4 Dat5

character character character character character numeric numeric numeric numeric numeric

50 50 50 50 50 10 10 10 10 10

Pilihan pertama Pilihan kedua Pilihan ke tiga Pilihan ke empat Pilihan ke lima Data Satu Data dua Data tiga Data enpat Data lima

14. Disain file forum Tabel 4.23 Disain File Forum

Nama Database Nama Tabel Primary Key

No 1 2 3 4 5 Field Name postid author title Post showtime Type numeric character character character character

: dbelearning .SQL : Forum_posting : Postid

Width 20 255 255 Description Nomor posting Pengirim posting Judul posting Isi posting 255 Waktu posting

109

6 7 8 9 10

realtime lastposter numreplies parentid lastrepliedto

numeric character numeric numeric numeric

20 255 20 20 20

Lama waktu posting Nama posting terakhir Jumlah Balasan posting Balasan posting Terakhir balas posting

15. Disain file mailbox Tabel 4.24 Disain File Mailbox

Nama Database Nama Tabel Primary Key

No 1 2 3 4 5 6 7 8 9 id Pengirin email Penerima Waktu subjek isi baca folder Field Name Type numeric character character character character character character numeric numeric

: dbelearning .SQL : Mailbox : Id

Width 5 20 100 25 100 200 Description Nomor mail Nama pengirim Alamat email pengirim Nama penerima Waktu Judul Isi mail 0,1,2 0,1 Jumlah dibaca Isi folder

110

16. Disain file Jenis klamin

Tabel 4.25 Disain File Jenis Klamin Nama Database Nama Tabel Primary Key
No 1 2 Field Name kdjkel jekel Type numeric character

: dbelearning .SQL : jekel : kdjkel

Width 2 10 Description Nomor jenis klamin Nama jenis klamin

17. Disain file agama Tabel 4.26 Disain File Agama Nama Database Nama Tabel Primary Key
No 1 2 Field Name kdagm agama Type numeric character

: dbelearning .SQL : agama : kdagm

Width 2 10 Description Nomor agama Nama agama

111

18. Disain file detail alamat Tabel 4.27 Disain File Ditail Alamat Nama Database Nama Tabel Primary Key
No 1 2 3 4 Field Name Kdpos kecamatan kelurahan kota Type character character character character

: dbelearning .SQL : alamat : kdpos

Width 5 60 60 60 Description Kode Pos kecamatan kelurahan kota

19. Disain file detail guru Tabel 4.28 Disain File Ditail Guru Nama Database Nama Tabel Primary Key
No 1 2 3 4 Id Kdguru kdjkel kdagm Field Name Type numeric character numeric numeric

: dbelearning .SQL : detail_guru : id

Width 11 20 2 2 Description Nomor detail guru Kode guru Kode jenis klamin Kode agama

112

5 6

kdpos kode_pelajaran

character character

5 10

Kode pos Kode pelajaran

20. Disain file detail siswa Tabel 4.29 Disain File Ditail siswa Nama Database Nama Tabel Primary Key
No 1 2 3 4 5 6 Id nis kdjkel kdagm kdpos kode_kelas Field Name Type numeric character numeric numeric character character

: dbelearning .SQL : detail_siswa : id

Width 11 20 2 2 5 10 Description Nomor detail siswa Nomor induk siswa Kode jenis klamin Kode agama Kode pos Kode kelas

113

4.2.4 Desain proses Adapun disain proses dari E_Learning Berbasis Web Pada SMK Azkia Padang adalah sebagai berikut: 1.Proses terdiri dari simpan, hapus, tambah, koreksi, upload, download. 2.Proses dilakukan dangan menggunakan program kompuer dalam hal ini menggunakan bahasa pemograman PHP

4.2.5 Disain relasi antar file

Gambar Relasi Antar File

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

114

BAB V IMPLEMENTASI DAN PEMBAHASAN HASIL IMPLEMENTASI

5.1.Implementasi 5.1.1. Input Berdasarkan rancangan system yang dibuat, maka bentuk ini dapat dilihat hasil yang terdiri dari menu utama, home siswa, home guru, admin dan laporan-laporan.

5.1.1.1.Home Home merupakan tampilan pertama muncul ketika membuka web Elearning yang berisi tentang profil dari SMK adzkia padang dapat dilihat pada gambar dibawah ini

114

115

Gambar 5.1 home 5.1.1.2.Guru Sub guru merupakan halaman login untuk guru dapat dilihat pada gambar dibawah ini :

Gambar 5.2 login guru

116

5.1.1.3.Contact Us Contact Us halaman yang berisi tentang alamat sekolah SMK adzkia padang dapat dilihat pada gambar dibawah ini :

Gambar 5.3 Contact Us

117

5.1.1.4.FAQ (frequently asked questions) Frequently asked questions kumpulan dari pertanyaan dan jawaban dapat dilihat pada gambar dibawah ini:

Gambar 5.4 FAQ (frequently asked questions)

118

5.1.1.5.Daftar Pelajaran Pada sub daftar pelajaran ini siswa dapat melihat dan mendownload daftar pelajaran dapat dilihat pada gambar dibawah ini:

Gambar 5.5 Daftar Pelajaran

119

5.1.1.6.Pengumuman Pada sub ini siswa dan dosen dapat melihat pengumuman seperti gambar dibawah ini :

Gambar 5.6 Pengumuman 5.1.1.7.Login Siwa Pada sub ini siswa dapat login dapat dilihat pada gambar dibawah ini :

Gambar 5.7 Login Siswa

120

5.1.1.8.Login Admin Ketika admin masuk ke E-learning maka yang pertama kali muncul adalah halaman login admin dapat dilihat pada gambar dibawah ini:

Gambar 5.8 Login Admin

5.1.1.9.Data Ditail Pada halaman data ditai admin dapat mengimput dan menghapus data master dapat dilihat pada gambar dibawah ini :

121

Gambar 5.9 Data detail input jenis klamin

Gambar 5.10 Data detail input Agama

122

Gambar 5.11 Data detail input Alamat

Gambar 5.12 Data detail input Mata Pelajaran

123

5.1.1.10. Input data siswa Pada halaman ini admin dapat menambah data siswa yang ter diri dari dua step, step pertama pengisian biodata dan step kedua pengisian ruangan dapat dilihat pada gambar di bawah ini :

Gambar 5.13 Input Data Siswa baru step1

124

Gambar 5.14 Input Data Siswa baru step2

5.1.1.11. Input data guru Pada halaman ini admin dapat menambah data guru yang ter diri dari dua step, step pertama pengisian biodata dan step kedua pengisian bahan ajar dapat dilihat pada gambar di bawah ini :

125

Gambar 5.15 Input Data Guru Step 1

Gambar 5.15 Input Data Guru Step 2

126

5.1.1.12. Input data kelas Pada halaman ini admin dapat melakukan penambahan data kelas dapat dilihat pada ganbar dibawah ini :

Gambar 5.16 Input Data Kelas

5.1.1.13. Input Jadwal Pelajaran Pada halaman pelajaran ini admin dapat meng iputkan data yang nantinya meghasilkan jadwal pelajaran seperti gambar dibawah ini :

127

Gambar 5.17 Input Data Jadwal Prlajaran

5.1.1.14. Upload Jawaban siswa Pada halaman ini siswa dapat mengirim jawaban tungas yang diberikan oleh guru dapat dilihat pada gambar dibawah ini :

128

Gambar 5.18 Upload Jawaban

5.1.1.15. Posting Pengumuman Pada halaman ini admin dapat membuat pengumuman dapat dilihat pada gambar dibawah ini :

129

Gambar 5.19 Posting Pengumuman

5.1.2. Proses Berdasarkan rancangan input maka data yang di input lalu diproses untuk menghasilkan suatu laporan dapat dilihat di bawah ini :

5.1.2.1.Siswa Pada halaman siswa admin dapat melakukan proses edit, delete, cari data, print priview dapat dilihat pada gambar dibawah ini :

130

Gambar 5.20 Halaman Admin Siswa

Gambar 5.21 Pencarian Siswa

131

Gambar 5.22 hasil pencarian siswa

Gambar 5.23 Edit Siswa step1

132

Gambar 5.24 Edit Siswa step2

Gambar 5.25 Hapus data siswa

133

5.1.2.2. Guru Pada halaman data guru admin dapat melakukan proses edit, delete, cari data, dan print priview dapat dilihgat pada gambar dibawah ini :

Gambar 5.25 Halaman Admin Guru

Gambar 5.25 Pecarian Data Guru

134

Gambar 5.22 Hasil pencarian data guru

Gambar 5.23 Edit Data Guru step 1

135

Gambar 5.24 Edit Data Guru step 2

Gambar 5.25 Konfirmasi Delete Data Guru

136

5.1.2.3.Data Kelas Pada halaman ini admin dapat melakukan proses delete dan edit dapat dilihat pada ganbar dibawah ini :

Gambar 5.26 Data Kelas

Gambar 5.28 Edit Data Kelas

137

Gambar 5.29 Konfirmasi Delete Data Kelas

5.1.2.4.Pelajaran Pada halaman pelajaran ini admin dapat melakukan proses edit, delete data pelajaran seperti gambar dibawah ini :

Gambar 5.30 Pelajaran

138

Gambar 5.31 Edit Data Pelajaran

Gambar 5.32 Konfirmasi Delete Data Pelajaran

139

5.1.2.5.Pengumuman Pada halaman ini admin dapat melakukan proses delet, edit data pengumuman dapat dilihat pada gambar dibawah ini :

Gambar 5.33 Kumpulan Pengumuman

Gambar 5.34 Edit Pengumuman

140

5.1.2.6.Poling Pada halaman ini admin dapat melakukan proses edit data poling dan delet data poling dapat dilihat pada gambar dibawah ini :

Gambar 5.35 Tampil Poling

Gambar 5.36 Edit Poling

Gambar 5.37 Konfirmasi Delete Poling

141

5.1.2.7.F A Q (frequently asked questions) F A Q (frequently asked questions) adalah kumpulan pertanyaan danjawaban pada halaman ini admin dapat melakukan proses delete data faq dapat dilihat pada gambar dibawh ini :

Gambar 5.38 Tampilan Tambah FAQ 5.1.2.8.Ubah Sandi Pada halaman ini admin dapat merubah password nya dapat dilihat pada gambar dibawah ini :

142

Gambar 5.39 Ubah Sandi

5.1.3. Output 5.1.3.1.Laporan data siswa Laporan ini berisikan seluruh siswa yang terdaftar pada SMK adzkia padang dapat dilihat pada gambar dibawah ini :

Gambar 5.40 Laporan Data Siswa

143

5.1.3.2.Laporan data siswa Per Tahun ajaran Laporan ini berisikan seluruh siswa yang terdaftar berdasarkan tahun ajaran pada SMK adzkia padang dapat dilihat pada gambar dibawah ini :

Gambar 5.41 Laporan Data Siswa Per Tahun ajaran

5.1.3.3.Laporan Data Guru Laporan ini berisi seluruh guru yang terdaftar pada SMK adzkia padang dapat dilihat pada gambar dibah ini :

144

Gambar 5.42 Laporan Data Guru

5.1.3.4.Jadwal pelajaran per semester Laporan ini berisikan jadwal pelajaran per semester dapat dilihat pada gambar dibawah ini :

Gambar 5.43 Jadwal Pelajaran pada semester I

145

Gambar 5.44 Jadwal Pelajaran pada semester II

5.1.3.5.Download Materi Pelajaran Halaman ini dapat mendownload materi pelajaran yang di upload oleh guru dapat dilihat pada gambar dibaah ini :

146

Gambar 5.45 Download Tugas

5.2. Pembahasan Hasil Implementasi 5.2.1. Input 5.2.1.1.Home Home merupakan tampilan utama saat user mengunjungi web E-learning adzkia 5.2.1.2.Login guru Ini merupakan halaman pertama bagi guru untuk masuk ke hohe guru jika guru lupa dengan password ada fasilitas untuk bertanya pada admin 5.2.1.3.Contact Us

147

Halaman ini berisikan informasi letak, status, kepala sekola, misi dan tujuan sekolah SMK Adzkia padang 5.2.1.4.F A Q (frequently asked question) Berisikan kumpulan pertanyaan-pertanyaan dan jaaban 5.2.1.5.Daftar Pelajaran Siswa dapat melihat dan mendownload daftar pelajaran, daftar pelajaran pun terkelompok per semester untuk mempermudah siswa melihatnya 5.2.1.6.Pengumuman Halaman ini berisi informasi penting untuk siswa maupun untuk guru seputar SMK Adzkia padang 5.2.1.7.Login Siswa Untuk masuk ke halaman home siswa haris melalui halaman login siswa ini login dibutuhkan untuk keamanan data yang penting bagi siswa

5.2.1.8.Login Admind Untuk masuk ke halaman home admin seorang admin harus login pada halaman login admin ini, karna di admin ini lah

148

hamper

seluruh

pemrosesan

dan

pengimputan

data

dilakukan. 5.2.1.9.Data Detail Data detail merupakan data master yangterdiri dari: 1) Input jenis klamin diperlukannya input jenis klamin ini untuk

memudahkan admin dalam pengimputan data siswa dan data guru 2) Input agama Sama dengan jenis klamin Input agama juga diperlukan untuk mempermudah admin dalam pengimputan data siswa dan guru 3) Input Alamat Input alamat ini juga memudahkan admin dalam melakukan pengimputan data siswa dan data guru

4) Mata Pelajaran

149

Imput mata pelajaran ini dingnakan saat admin menyusun jadwal pelajaran dan mentikan mata pelajaran yang akan di ajar guru

5.2.1.10. Input data siswa Pada halaman input data siswa admin dapat menambah data siswa.Input data siswa menghasilkan laporan siswa dan laporan siswa per tahun ajaran 5.2.1.11. Input data guru Pada halaman input guru admin dapat menambah data guru dan menghasilkan laporan data seluruh guru yang mengajar di SMK adzkia padang 5.2.1.12. Input data kelas Pada halaman ini admin dapat menambah kan kelas jika diperlukan 5.2.1.13. Input jadwal pelajaran Pada halaman ini admin dapat membuat jadwal pelajaran dan menghasilkan laporan jadwal pelajaran per semester 5.2.1.14. Upload jawab siswa Halaman ini digunakan oleh siswa untuk mengirim jawaban dari tugas yang mereka download 5.2.1.15. Posting pengumuman

150

Halaman ini digunakan untuk membuat pengumuman yang ditampilkan pada home utama

5.2.2. Proses 5.2.2.1.Siswa Pada halaman ini admin dapat melakukan proses pencarian data siswa berdasarkan kata kunci nama dan nomor induk siswa selain itu admin juga dapat meng edit data siswa dan juga bias menghapus data siswa jika sudah keluar dari sekolah. 5.2.2.2.Guru Pada halaman ini admin dapat melakukan proses pencarian data guru berdasarkan kata kunci nama dan kode guru

selain itu admin juga dapat meng edit data guru dan juga bias menghapus data guru jika sudah keluar dari sekolah. 5.2.2.3.Kelas Pada halaman ini admin dapat menghapus data kelas dan meng edit data kelas 5.2.2.4.Pelajaran Pada halaman ini dilakukannya proses pembuatan jadwal pelajaran per semester dan admin juga dapat meng edit data

151

jadwal pelajaran dan juga bias meng hapusnya jika diperlukan. 5.2.2.5.Pengumuman Pada halaman ini admin dapat melakukan proses edit data penggumuman dan juga menghapus data pengumuman jika diperlukan. 5.2.2.6.Poling Poling berfungsi sebagai rating bagi sebuah web, pada halaman ini admin dapat melakukan edit poling dan hapus data poling 5.2.2.7.F A Q Pada halaman ini admin hanya bias menghapus FAQ 5.2.2.8.Ubah Sandi Halaman ini digunakan untuk merubah password admin jika password yang lama telah diketahui oleh banyak orang 5.2.3. Output Output yang dihasilkan oleh E-learning berbasis web ini adalah : 5.2.3.1.Laporan data siswa Merpakan hasil query dari table siswa dan table detail siswa laporan ini digunakan untk melihat jumlah seluruh siswa SMK adzkia

152

5.2.3.2.Laporan data siswa Per Tahun ajaran Laporan ini Merpakan hasil query dari table siswa dan table detail siswa laporan ini digunakan untk melihat jumlah seluruh siswa SMK adzkia pertahun ajaran 5.2.3.3.Laporan Data Guru Laporan ini Merpakan hasil query dari table guru dan table detail guru laporan ini digunakan untk melihat jumlah seluruh guru SMK adzkia 5.2.3.4.Jadwal pelajaran per semester Jadwal ini merupakan hasil query dari beberapa table yaitu table kelas,pelajaran,guru,mp dan table ditail_guru jadwal digunakan untuk melakukan kegiatan belajar mengajar di SMK adzkia 5.2.3.5.Download Materi Pelajaran Merupakan hasil dari table materi dan diperlukan oleh siswa untuk mendownload matri pelajaran

SKRIPSI

ANALISA DAN PERANCANGAN E-LEARNING BERBASIS WEB PADA SMK ELEKTRO ADZKIA PADANG

YAYASAN AMAL BAKTI MUKMIN INDONESIASEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTERSTMIK INDONESIA PADANG 10/4/2011

153

BAB VI KESIMPULAN DAN SARAN

5.1. Kesimpulan Dengan adanya rancangan aplikasi E-learning berbasis web pada SMK Elektro Adzkia padang dan diperkuat oleh semua hasil kuesioner yang telah dilakukan serta dibantu dengan studi literatur yang ada di sekolah, maka disimpulkan sebagai berikut : 1. Aplikasi E-learning mempermudah komunikasi antara guru dan siswa 2. Aplikasi E-learning membantu siswa dalam mendapatkan materi pelajaran 3. Aplikasi E-learning mempermudah sekolah baik guru maupun siswa dalam menerima informasi 4. Aplikasi E-learning mempermudah guru dalam mengola nilai dan mempermudah siswa dalam untuk memdapatkan infomasi nilai 5. Aplikasi E-learning ini mudah digunakan

153

154

5.2 Saran Aplikasi e-learning pada SMK Elektro Adzkia padang masih dapat dikembangkan lagi. Dibawah ini adalah beberapa saran untuk pengembangan aplikasi e-learning SMK Elektro Adzkia padang, yaitu : 1. Aplikasi e-learning ini memerlukan maintenance secara rutin agar aplikasi e-learning ini dapat selalu mengikuti perkembangan kurikulum pembelajaran yang selalu berubah-ubah. Seperti format pemberian nilai dan distribusi materi pelajaran. 2. Aplikasi e-learning ini juga masih dapat ditambahkan dengan fitur-fitur multimedia yang berhubungan dengan kebutuhan pembelajaran dan sekolah. 3. Dengan perkembangan teknologi yang sangat cepat, sistem keamanan aplikasi e-learning ini juga harus selalu ditingkatkan agar kerahasiaan data-data SMK Elektro Adzkia padang tetap terjaga.

155

DAFTAR PUSTAKA

Alter, Steven, (2006), Information Systems, Foundation of E-Business, Prentice Hall PTR, Upper Saddle

Arthur M. Langer (2008), Analysis and Design of InformationSystems, Third Edition Booch, Grady, Rumbaugh, James, Jacobson, Ivar (2006) . The unified modeling language user guide. Addison-Wesley Connolly, Thomas M., Begg, Carolyn E.. Database systems : a practical approach to rddesign, implementation, and management. 3 edition. Addison-Wesley C.Laudon, Kenneth, Rosenblatt, Kenneth, Watson, Richard (2006), Management Information Systems : New Approaches to Organization and technology Fowler, Martin (2007). UML Distilled : Panduan singkat bahasa pemodelan objek standar. Edisi 3. Pearson Education alih bahasa Penerbit Andi Frank Alexander Kraemer Peter Herrmann (2011). System Analysis and Modeling: About Models. Norwegian University of Science and Technology (NTNU) Department of Telematics Jeffery L. Whitten, Lonnie D. Bentley, Kevin C. Dittman (2007). Metode Desain dan Analisis Sistem. Edisi 6. McGraw-Hill alih bahasa Penerbit Andi Kendall, E.Keneth (2006), Analisa dan Perancangan Sistem, edisi 5, PT Indeks Kelompok gramedia, jakarta Prof. Dr. Jogiyanto (2008), Sistem Teknologi Informasi, edisi III
Pressman, Roger S. (2007). Software Engineering : a practitioners approach. 6 edition. McGraw-Hill

155

156

Prof. Dr. Sugiyono(2006). Metode Penelitian Bisnis. Alfabeta

Shneiderman, Ben (2007). Designing the user interface : strategies for effective human-computer interaction. 3rd edition. Addison-Wesley
Turban, Efraim, Rainer, R. Kelly Jr., Potter, Richard E (2006). Introduction to Information Technology. 3rd edition. Sine Nomine

Thomson, Laura (2007). PHP and MySQL web development. Sams Publishing

157

FLOWCHART

157

158

SUB MENU PENGUMUMAN

Pengumuman

Open File Pengumuman

"select * from pengumuman order by id asc limit {$start}, {$limit}"

Tampilkan Daftar Pengumuman

Close File Daftar Pengumuman

Retrun Menu utama

159

160

161

162

163

164

165 Listing Program koneksi <?php $host="localhost"; $userdb="root"; $passdb="renaldi"; $namadb="dbelearning"; $sambung=mysql_connect($host,$userdb,$passdb); mysql_select_db($namadb,$sambung); ?> Login guru <? session_start(); include('coneksi.php'); if($_POST['user'] && $_POST['password']){ $data=mysql_query("select * from md5($_POST['password']) . "'"); $ketemu=mysql_num_rows($data); $r=mysql_fetch_array($data); if ($ketemu > 0){ header("Location:guru/index.php"); }else{ header("Location:index.php?opt=2"); }} ?> logout <?php session_start(); guru where user='{$_POST['user']}' and password='" .

165

166 $_SESSION['username'] = ""; session_destroy(); header("Location:index.php"); ?> Login form <?php session_start(); include'coneksi.php'; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>A.E.A</title> <link rel="stylesheet" href="CSS/style.css" type="text/css" /> <link rel="stylesheet" href="CSS/log.css" type="text/css" /> <script src="CSS/jquery.js" type="text/javascript"></script> <!--<script type="text/javascript"> $(document).ready(function() {

$(".signin").click(function(e) { e.preventDefault(); $("fieldset#signin_menu").toggle(); $(".signin").toggleClass("menu-open"); });

$("fieldset#signin_menu").mouseup(function() { return false

167 }); $(document).mouseup(function(e) { if($(e.target).parent("a.signin").length==0) { $(".signin").removeClass("menu-open"); $("fieldset#signin_menu").hide(); } });

}); </script>--> <script language="javascript"> function cek(){ var user= document.getElementById('username').value; var pass= document.getElementById('password').value; if(user.replace(/^\s+|\s+$/g, '')==''){ alert('Username Harus Diisi!'); return false; } if(pass.replace(/^\s+|\s+$/g, '')==''){ alert('Password Harus diisi!'); return false;} return true;} </script> <style type="text/css"> <!-.style2 { font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; color:#3399FF;

168 font-size: 36px; position: absolute; } .style3{ font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; font-size: 36px; color: #FFFFFF; } .style5 {font-size: 11px}

--> </style> </head> <body> <div id="Layer1"></div> <div id="container1"> <div id="header"> <h3 class="style2"><img src="image/logo.gif" title="ADZKIA" />Adzkia<span class="style3">elearning application</span></h3> <!-- <div id="container"> <div id="topnav" class="topnav"> <span class="style1 style4">Enter for student.</span> <a href="../cubo/login" class="signin"><span>Sign in</span></a> </div> <fieldset id="signin_menu"> <form method="post" id="signin" action="login.php"> <label for="username">Username or email</label> <input id="username" name="username" title="username" tabindex="4" type="text"> </p> <p>

169 <label for="password">Password</label> <input id="password" name="password" title="password" tabindex="5" type="password"> </p> <p class="remember"> <input id="signin_submit" value="Sign in" tabindex="6" type="submit"> <input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox"> <label for="remember">Remember me</label> </p> <p class="forgot"> <a href="#" id="resend_password_link">Lupa password?</a> </p> <!--<p class="forgot-username"> <A id=forgot_username_link title="If you remember your password, try logging in with your email" href="#"></A> </p> </form> </fieldset> </div>--> </div> <div> <form name="frmlogin" method="post" action="login.php"> <table width="346" border="0" align="center" style="background-color:#ddeef6;"> <p align="center"><? echo $status;?></p>

<tr> <td height="26"><label for="username">Username or email</label></td> <td> <input id="username" name="username" title="username" tabindex="4" type="text"><br /> <font size="-6" color="#FF0000">*Mohon periksa username anda</font></td> </tr> <tr> <td height="55"><label for="password">Password</label></td>

170 <td> <input id="password" name="password" title="password" tabindex="5" type="password"><br /> <font size="-6" color="#FF0000">*Mohon periksa password anda</font> </tr> <tr> <td><input id="signin_submit" value="Sign in" tabindex="6" type="submit" onclick="return cek()"></td> <td><input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox"><label for="remember">Remember me</label></td> </tr> </table> <p class="forgot" align="center"> <a href="#" id="resend_password_link">Lupa password?</a> </p> <!--<p class="forgot-username"> <A id=forgot_username_link title="If you remember your password, try logging in with your email" href="#"></A> </p> --> </form> <center> <p class="style5" >Mungkin anda belum terdaftar di Adzkia e-learning application ini silahkan hubungi admin di SMK Adzkia padang </p><br /> Back to <a href="index.php">Home</a></center> </div> <div id="footer"> <center> <h5>&copy; Copyright ADZKIA 2011 </h5> </center> </div> </div> </body> </html> Index <? </td>

171 session_start(); include('coneksi.php'); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="icon" href="images/icon/imac_web.ico" type="image/x-icon" /> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>A.E.A</title> <link rel="stylesheet" href="CSS/style.css" type="text/css" /> <link rel="stylesheet" href="CSS/log.css" type="text/css" /> <script type="text/javascript"> if (window.top !== window.self) { window.top.location.href = window.self.location.href; } </script> <script type="text/javascript">var _siteRoot='index.html',_root='index.html';</script> <script type="text/javascript" src="CSS/jquery.js"></script> <script type="text/javascript" src="CSS/scripts.js"></script> <script src="CSS/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() {

$(".signin").click(function(e) { e.preventDefault(); $("fieldset#signin_menu").toggle(); $(".signin").toggleClass("menu-open"); });

172 $("fieldset#signin_menu").mouseup(function() { return false }); $(document).mouseup(function(e) { if($(e.target).parent("a.signin").length==0) { $(".signin").removeClass("menu-open"); $("fieldset#signin_menu").hide(); } });

}); </script> <script language="javascript"> function cek(){ var user= document.getElementById('username').value; var pass= document.getElementById('password').value; if(user.replace(/^\s+|\s+$/g, '')==''){ alert('Username Harus Diisi!'); return false; } if(pass.replace(/^\s+|\s+$/g, '')==''){ alert('Password Harus diisi!'); return false; } return true; } </script> <style type="text/css"> <!--

173 .style2 { font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; color:#3399FF; font-size: 36px; position: absolute; } .style3{ font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; font-size: 36px; color: #FFFFFF; } .style4 {color: #3399FF} </style> </head> <body> <div id="Layer1"></div> <div id="container1"> <div id="header"> <h3 class="style2"><img src="image/logo.gif" title="ADZKIA" />Adzkia<span class="style3">elearning application</span></h3> <div id="container"> <div id="topnav" class="topnav"> <span class="style1 style4">Enter for student.</span> <a href="loginfrom.php" class="signin"><span>Sign in</span></a> </div> <fieldset id="signin_menu"> <form name="frmlogin" method="post" action="login.php"> <p align="center"><? echo $status;?></p> <label for="username">Username or email</label>

174 <input id="username" name="username" title="username" tabindex="4" type="text"> </p> <p> <label for="password">Password</label> <input id="password" name="password" title="password" tabindex="5" type="password"> </p> <p class="remember"> <input id="signin_submit" value="Sign in" tabindex="6" type="submit" onclick="return cek()"> <input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox"> <label for="remember">Remember me</label> </p> <p class="forgot"> <a href="#" id="resend_password_link">Lupa password?</a> </p> <!--<p class="forgot-username"> <A id=forgot_username_link title="If you remember your password, try logging in with your email" href="#"></A> </p> --> </form> </fieldset> </div> </div> <div id="headermenu"> <div class="menu_nav"> <ul> <li><a href="index.php"><span>Home</span></a></li> <li><a href="?opt=2"><span>Guru</span></a></li> <li><a href="?opt=4"><span>Contact Us</span></a></li> </ul> </div> </div> <div id="menu" align="center">

175 <ul> <li><a href="?opt=20" title="Menu">F.A.Q</a></li> <li><a href="?opt=3" title="Menu">DAFTAR PELAJARAN</a></li> <li><a href="?opt=7" title="Menu">PENGUMUMAN</a></li> </ul> </div> <div id="sideleftbawah"> <?php //bulan sekarang $month=date("m"); //Tahun sekarang $year=date("Y"); //hari ini $day=date("d"); //cek jumlah hari tahun sekarang $endDate=date("t",mktime(0,0,0,$month,$day,$year));

//style untuk table echo ' <style> td { font-size:11px; } </style> '; //table untuk menulis tanggal sekarang echo '<table align="center" border="0" color=ffffff><tr><td align=center>'; width="80" cellpadding=2 cellspacing=1 style=""

echo date("D, d M Y ",mktime(0,0,0,$month,$day,$year)); echo '</td></tr></table>'; //table untuk menulis hari echo ' <table align="center" border="0" width="80%" cellpadding=2 cellspacing=1 style="border:1px solid #CCCCCC"> <tr bgcolor="#EFEFEF"> <td align=center><font color=red>Su</font></td>

176 <td align=center>Mo</td> <td align=center>Tu</td> <td align=center>We</td> <td align=center>Th</td> <td align=center>Fr</td> <td align=center> <font color=#0000FF>Sa</font></td></tr> '; /* mengecek tanggal 1 bulan sekarang ada pada hari ke berapa kemudian tambahkan cell td sebanyak var $s */ $s=date ("w", mktime (0,0,0,$month,1,$year)); for ($ds=1;$ds<=$s;$ds++) { echo "<td style=\"font-family:arial;color:#B3D9FF\" width=\"15%\" align=center valign=middle bgcolor=\"#FFFFFF\"> </td>"; } // memulai penulisan tanggal for ($d=1;$d<=$endDate;$d++) { // jika nilai $d (tanggal) adalah hari minggu (0) dibuat baris baru <tr> if (date("w",mktime (0,0,0,$month,$d,$year)) == 0) { echo "<tr>"; } //default warna huruf $fontColor="#000000"; // jika tanggal adalah hari minggu warna huruf merah if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sun") { $fontColor="red"; } // jika tanggal adalah hari sabtu warna huruf biru if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sat") { $fontColor="blue"; } //menulis tanggal echo " <td style=\"font-family:arial;color:#333333\" style=\"color:$fontColor\">$d</span></td>"; width=\"9%\" align=center valign=middle><span

//jika tanggal adalah hari sabtu (6) akhiri baris </tr>

177 if (date("w",mktime (0,0,0,$month,$d,$year)) == 6) { echo "</tr>"; }} //akhir table echo '</table>'; ?> </div> <div id="sideleft"> <img src="image/logosmkbisa.jpg" width="186" /></div> <div id="sideleft1"> <table> <tr> <td> <? include"jajak.php"; ?> </td> </tr> </table> </div> <div id="middle"> <table> <tr> <td> <?php if ($_GET['opt']==1){ include "jajakpen.php"; }else if($_GET['opt']==2){ include "logguru.php"; }else if($_GET['opt']==3){

178 include "daftarPelajaran.php"; }elseif ($_GET['opt']==4){ include "contac.php"; }elseif ($_GET['opt']==5){ include "lain.php"; }elseif ($_GET['opt']==6){ include "detail1.php"; }elseif ($_GET['opt']==7){ include "pengumuman.php"; }elseif ($_GET['opt']==20){ include "tampilFAQ.php"; }elseif ($_GET['opt']==190){ include "pollresult.php"; }elseif ($_GET['opt']==90){ include "detail.php"; }else{ include"info.php"; } ?> </td> </tr> </table> </div> <div id="footer"> <p align="center">&copy; <?php ini_set('date.timezone', 'Europe/London'); $startYear = 2011; $thisYear = date('Y'); if ($startYear == $thisYear) { echo $startYear; } else { echo "{$startYear}-{$thisYear}"; } ?> Adzkia</p>

179 </div> </div> </body> </html> Index Guru <?php session_start(); include'../coneksi.php'; if($_SESSION['login'] != true and $_SESSION['username'] == ""){ header("Location:../loginfrom.php"); } isset($_SESSION['username']) ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="PRAGMA" content="NO-CACHE" /> <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"> <title>A.E.A</title> <link rel="stylesheet" href="../CSS/style.css" type="text/css" /> <link rel="stylesheet" href="../CSS/log.css" type="text/css" /> <link rel="stylesheet" href="../CSS/upload.css" type="text/css" /> <script src="../CSS/jquery.js" type="text/javascript"></script> <script type="text/javascript" src="../CSS/jquery-1.5.min.js"></script> <script type='text/javascript' src='../CSS/jquery.timer.js' ></script> <script type="text/javascript" src="../likno-modal-project.js"></script> <script type="text/javascript" src="../likno-scripts/likno-modal-lib.js"></script>

180 <script type="text/javascript" src="../likno-scripts/jquery.js"></script> <script src="../CSS/script.js"></script> <!--<script type="text/javascript"> $(document).ready(function() {

$(".signin").click(function(e) { e.preventDefault(); $("fieldset#signin_menu").toggle(); $(".signin").toggleClass("menu-open"); });

$("fieldset#signin_menu").mouseup(function() { return false }); $(document).mouseup(function(e) { if($(e.target).parent("a.signin").length==0) { $(".signin").removeClass("menu-open"); $("fieldset#signin_menu").hide(); } });

}); </script>--> <style type="text/css"> <!-.style2 { font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; color:#3399FF;

181 font-size: 36px; position: absolute;} .style3{ font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; font-size: 36px; color: #FFFFFF;} .style4 {color: #3399FF} --> </style> </head> <body> <div id="Layer1"></div> <div id="container1"> <div id="header"> <h3 class="style2"><img src="../image/logo.gif" title="ADZKIA" />Adzkia<span class="style3">elearning application</span></h3> </div> <div id="headermenu"> <div class="menu_nav"> <ul> <li class="active"><a href="index.php"><span>Home</span></a></li> <li><a href="?opt=29"><span>Ubah sandi</span></a></li> <li><a href="?opt=69"><span>Bantuan</span></a></li> <li><a href="../logout.php"><span>Logout</span></a></li> </ul> </div> </div> <div id="menu" align="center">

182 <ul> <li><a href="?opt=14" title="Menu">Cek Tugas</a></li> <li><a href="?opt=2">UPLOAD</a></li> <li><a href="?opt=12" title="Menu">Nilai</a></li> <li><a href="?opt=8" title="Menu">Forum Diskusi</a></li> </ul> </div> <div id="sideleftbawah"> <?php //bulan sekarang $month=date("m"); //Tahun sekarang $year=date("Y"); //hari ini $day=date("d"); //cek jumlah hari tahun sekarang $endDate=date("t",mktime(0,0,0,$month,$day,$year));

//style untuk table echo ' <style> td { font-size:11px; } </style> '; //table untuk menulis tanggal sekarang echo '<table align="center" border="0" color=ffffff><tr><td align=center>'; width="80" cellpadding=2 cellspacing=1 style=""

echo date("D, d M Y ",mktime(0,0,0,$month,$day,$year)); echo '</td></tr></table>'; //table untuk menulis hari echo ' <table align="center" border="0" width="80%" cellpadding=2 cellspacing=1 style="border:1px solid #CCCCCC"> <tr bgcolor="#EFEFEF">

183 <td align=center><font color=red>Su</font></td> <td align=center>Mo</td> <td align=center>Tu</td> <td align=center>We</td> <td align=center>Th</td> <td align=center>Fr</td> <td align=center> <font color=#0000FF>Sa</font></td></tr> '; /* mengecek tanggal 1 bulan sekarang ada pada hari ke berapa kemudian tambahkan cell td sebanyak var $s */ $s=date ("w", mktime (0,0,0,$month,1,$year)); for ($ds=1;$ds<=$s;$ds++) { echo "<td style=\"font-family:arial;color:#B3D9FF\" width=\"15%\" align=center valign=middle bgcolor=\"#FFFFFF\"> </td>"; } // memulai penulisan tanggal for ($d=1;$d<=$endDate;$d++) { // jika nilai $d (tanggal) adalah hari minggu (0) dibuat baris baru <tr> if (date("w",mktime (0,0,0,$month,$d,$year)) == 0) { echo "<tr>"; } //default warna huruf $fontColor="#000000"; // jika tanggal adalah hari minggu warna huruf merah if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sun") { $fontColor="red"; } // jika tanggal adalah hari sabtu warna huruf biru if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sat") { $fontColor="blue"; } //menulis tanggal echo " <td style=\"font-family:arial;color:#333333\" style=\"color:$fontColor\">$d</span></td>"; width=\"9%\" align=center valign=middle><span

184 //jika tanggal adalah hari sabtu (6) akhiri baris </tr> if (date("w",mktime (0,0,0,$month,$d,$year)) == 6) { echo "</tr>"; } } //akhir table echo '</table>'; ?> </div>

<div id="middle"> <table> <tr> <td> <?php if ($_GET['opt']==1){ include "beriNilai.php"; }else if($_GET['opt']==2){ include "UP.php"; }else if($_GET['opt']==3){ include "frommateri.php"; }elseif ($_GET['opt']==4){ include "fromupload.php"; }elseif ($_GET['opt']==5){ include "lain.php"; }elseif ($_GET['opt']==6){ include "detail1.php"; }elseif ($_GET['opt']==7){ include "inputNilai.php"; }elseif ($_GET['opt']==8){

185 include"forum.php"; }elseif ($_GET['opt']==9){ include"post.php"; }elseif ($_GET['opt']==10){ include"message.php"; }elseif ($_GET['opt']==11){ include"reply.php"; }elseif ($_GET['opt']==12){ include"tampilNilai.php"; }elseif ($_GET['opt']==14){ include"periksaTgs.php"; }elseif ($_GET['opt']==29){ include"gantipassword.php"; }elseif ($_GET['opt']==69){ include"mailBox.php"; }elseif ($_GET['opt']==88){ include"tampilMail.php"; }else{ echo " <p>Selamat Datang Pada situs E-learning Adzkia Padang Bapak: ".$_SESSION['username']." <br> </p>"; include"app.php"; include"tampilan_UPLOAD.php"; } ?> </td> </tr> </table>

186 </div> <div id="footer"> <p align="center">&copy; <?php ini_set('date.timezone', 'Europe/London'); $startYear = 2011; $thisYear = date('Y'); if ($startYear == $thisYear) { echo $startYear; } else { echo "{$startYear}-{$thisYear}"; } ?> Adzkia</p> </div> </div> </div> </body> </html> Download jawaban tugas <?php session_start(); include'../coneksi.php'; // $id = $_GET['id_jawab']; $query = "SELECT * FROM jawab WHERE id_jawab = '$id'"; $hasil = mysql_query($query); $data = mysql_fetch_array($hasil); header("Content-Disposition: attachment; filename=".$data['path_jawab']); header("Content-length: ".$data['size']); header("Content-type: ".$data['type']); $fp = fopen("files/".$data['path_jawab'], 'r'); $content = fread($fp, filesize('files/'.$data['path_jawab'])); fclose($fp); echo $content; exit; ?>

187

Upload Materi <?php $uploaddir = 'files/'; $fileName = $_FILES['userfile']['name']; $tmpName = $_FILES['userfile']['tmp_name']; $fileSize = $_FILES['userfile']['size']; $fileType = $_FILES['userfile']['type']; $u.date("Y-m-d__H-i-s"); /*$exts =array('Documents/doc','Documents/pdf','Documents/rtf','Documents/txt'); if(!in_array(($tipe),$exts)){ echo 'Format file yang di izinkan hanya DOC dan PDF'; exit; }*/ mysql_connect('localhost','root','renaldi'); mysql_select_db('dbelearning'); $query = "SELECT count(*) as jum FROM upload WHERE name = '$fileName'"; $hasil = mysql_query($query); $data = mysql_fetch_array($hasil); if ($data['jum'] > 0) { $query = "UPDATE upload SET size = '$fileSize' WHERE name = '$fileName'"; } else $query = "INSERT INTO upload (kode_pelajaran,name, size, type, deskripsi,tgl) VALUES ('$_POST[kode_pelajaran]', '$fileName', '$fileSize', '$fileType','$_POST[deskripsi]', '".$_POST["y"]."".$_POST["m"]."-".$_POST["d"]."')"; mysql_query($query); $uploadfile = $uploaddir . $fileName; if (move_uploaded_file($_FILES['userfile']['tmp_name'], $uploadfile)) { header("Location:index.php");

188 } else { echo "File gagal diupload"; } ?> Index siswa <?php session_start(); include'../coneksi.php'; if($_SESSION['login'] != true and $_SESSION['username'] == ""){ header("Location:../loginfrom.php"); } isset($_SESSION['username'],$_SESSION['foto'])

?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>A.E.A</title>

<link rel="stylesheet" href="../CSS/style.css" type="text/css" /> <link rel="stylesheet" href="../CSS/log.css" type="text/css" /> <script src="../CSS/jquery.js" type="text/javascript"></script>

<style type="text/css">

189 .style2 { font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; color:#3399FF; font-size: 36px; position: absolute; } .style3{ font:normal 46px/1.2em Arial, Helvetica, sans-serif; letter-spacing:-2px; font-size: 36px; color: #FFFFFF; } .style4 {color: #3399FF}

</style> </head> <body> <div id="container1"> <div id="header"> <h3 class="style2"><img src="../image/logo.gif" title="ADZKIA" />Adzkia<span class="style3">elearning application</span></h3> </div> <div id="headermenu"> <div class="menu_nav"> <ul> <li class="active"><a href="index.php"><span>Home</span></a></li> <li><a href="?opt=52"><span>Ubah Sandi</span></a></li>

190 <li><a href="?opt=7"><span>Bantuan</span></a></li> <li><a href="../logout.php"><span>Logout</span></a></li> </ul> </div> </div> <div id="menu" align="center"> <ul> <li><a href="?opt=1" title="Menu">Pelajaran</a></li> <li><a href="?opt=4" title="Menu">Kirim jawaban</a></li> <li><a href="?opt=8" title="Menu">Nilai</a></li> <li><a href="?opt=9" title="Menu">Forum Diskusi</a></li> </ul> </div>

<div id="sideleftbawah"> <?php //bulan sekarang $month=date("m"); //Tahun sekarang $year=date("Y"); //hari ini $day=date("d"); //cek jumlah hari tahun sekarang $endDate=date("t",mktime(0,0,0,$month,$day,$year)); //style untuk table echo ' <style> td { font-size:11px; } </style> '; //table untuk menulis tanggal sekarang echo '<table align="center" border="0" color=ffffff><tr><td align=center>'; width="80" cellpadding=2 cellspacing=1 style=""

191 echo date("D, d M Y ",mktime(0,0,0,$month,$day,$year)); echo '</td></tr></table>'; //table untuk menulis hari echo ' <table align="center" border="0" width="80%" cellpadding=2 cellspacing=1 style="border:1px solid #CCCCCC"> <tr bgcolor="#EFEFEF"> <td align=center><font color=red>Su</font></td> <td align=center>Mo</td> <td align=center>Tu</td> <td align=center>We</td> <td align=center>Th</td> <td align=center>Fr</td> <td align=center> <font color=#0000FF>Sa</font></td></tr> ';

/* mengecek tanggal 1 bulan sekarang ada pada hari ke berapa kemudian tambahkan cell td sebanyak var $s */ $s=date ("w", mktime (0,0,0,$month,1,$year)); for ($ds=1;$ds<=$s;$ds++) { echo "<td style=\"font-family:arial;color:#B3D9FF\" width=\"15%\" align=center valign=middle bgcolor=\"#FFFFFF\"> </td>"; } // memulai penulisan tanggal for ($d=1;$d<=$endDate;$d++) { // jika nilai $d (tanggal) adalah hari minggu (0) dibuat baris baru <tr> if (date("w",mktime (0,0,0,$month,$d,$year)) == 0) { echo "<tr>"; } //default warna huruf $fontColor="#000000"; // jika tanggal adalah hari minggu warna huruf merah

192 if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sun") { $fontColor="red"; } // jika tanggal adalah hari sabtu warna huruf biru if (date("D",mktime (0,0,0,$month,$d,$year)) == "Sat") { $fontColor="blue"; } //menulis tanggal echo " <td style=\"font-family:arial;color:#333333\" style=\"color:$fontColor\">$d</span></td>"; width=\"9%\" align=center valign=middle><span

//jika tanggal adalah hari sabtu (6) akhiri baris </tr> if (date("w",mktime (0,0,0,$month,$d,$year)) == 6) { echo "</tr>"; } } //akhir table echo '</table>'; ?> </div> <div id="middle"> <table> <tr> <td> <?php if ($_GET['opt']==1){ include "UP.php"; }else if($_GET['opt']==2){ include "downloadTugas.php"; }else if($_GET['opt']==3){ include "downloadMateri.php"; }elseif ($_GET['opt']==4){ include "kirim_jawaban.php"; }elseif ($_GET['opt']==5){

193 include "jawab.php"; }elseif ($_GET['opt']==6){ include "detail1.php"; }elseif ($_GET['opt']==7){ include "mailBox.php"; }elseif ($_GET['opt']==8){ include "LihatNilai.php"; }elseif ($_GET['opt']==9){ include "forum.php"; }elseif ($_GET['opt']==10){ include "post.php"; }elseif ($_GET['opt']==11){ include "message.php"; }elseif ($_GET['opt']==12){ include "reply.php"; }elseif ($_GET['opt']==52){ include "gantipassword.php"; }elseif ($_GET['opt']==123){ include "lihatmail.php"; }else{ echo " <p><p>Selamat datang di halaman Home wahai user : ".$_SESSION['username']." </p> <br> </p>"; $sql="select nis from siswa where username='".$_SESSION['username']."'"; $q=mysql_query($sql); $data=mysql_fetch_array($q); echo "NIS&nbsp;:$data[nis]"; include"app.php"; }

194 ?> </td> </tr> </table> </div> <div id="footer"> <center> <h5>&copy; Copyright ADZKIA 2011 </h5> </center> </div> </div> </body> </html>