59
perpustakaan.uns.ac.id digilib.uns.ac.id commit to user i PEMBUATAN E-LEARNING SMAN 2 PEMALANG TUGAS AKHIR Diajukan untuk Memenuhi Salah Satu Syarat Mencapai Gelar Ahli Madya Program Diploma III Teknik Informatika Disusun Oleh: ZUL HIFNI HANIF NIM. M3109088 PROGRAM DIPLOMA III TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SEBELAS MARET SURAKARTA 2012

PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

  • Upload
    vuminh

  • View
    212

  • Download
    0

Embed Size (px)

Citation preview

Page 1: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

i

PEMBUATAN E-LEARNING

SMAN 2 PEMALANG

TUGAS AKHIR

Diajukan untuk Memenuhi Salah Satu Syarat Mencapai Gelar Ahli Madya

Program Diploma III Teknik Informatika

Disusun Oleh:

ZUL HIFNI HANIF

NIM. M3109088

PROGRAM DIPLOMA III TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SEBELAS MARET

SURAKARTA

2012

Page 2: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

1

BAB I

PENDAHULUAN

A. Latar Belakang Masalah

SMAN 2 Pemalang adalah salah satu sekolah menengah atas di

Kabupaten Pemalang. SMAN 2 Pemalang terletak di jalan Jendral Sudirman

no 14 Pemalang.

Mulai tahun ajaran 2010/2011, SMAN 2 Pemalang

mengembangkan SKM atau lebih dikenal dengan nama Sekolah Kategori

Model. SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-

SMA lain khususnya di Kabupaten Pemalang. Selain pengembangan ke arah

SKM, SMAN 2 Pemalang juga menjadi percontohan dalam pengembangan

IT di sekitar Kabupaten Pemalang. Dibuktikan dengan adanya PSB atau

Pusat Sumber Belajar yang terintegrasi langsung dengan Departemen

Pendidikan Nasional. Tentunya sebagai SMA yang menjadi percontohan

dalam pengembangan IT, penggunaan barang elektronik khususnya

komputer dalam proses kegiatan belajar mengajar (KBM) sangat dibutuhkan

agar KBM lebih praktis dan efisien. Maka dari itu, diperlukan adanya

Elearning sebagai salah satu alat bantu dalam proses KBM. Dengan adanya

Elearning ini, nantinya guru dapat meng-upload materi pelajaran, tugas

harian, serta dapat digunakan sebagai media evaluasi pembelajaran dengan

mengadakan ujian online. Untuk para siswa sendiri dapat men-download

materi pelajaran, meng-upload tugas dan melakukan ujian online. Tentunya

dengan adanya ujian online ini akan semakin meningkatkan keefisienan dan

keefektifan dalam proses KBM.

Berdasarkan penjelasan di atas maka pada proposal Tugas Akhir

ini penulis membuat sebuah “Pembuatan Web E-learning SMAN 2

Pemalang”.Yaitu sebuah web khusus yang dirancang agar para siswa dapat

melakukan proses belajar, dan juga sebagai bahan evaluasi yang berguna

bagi guru mapel.

Page 3: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

2

B. Rumusan Masalah

Berdasarkan latar belakang masalah tersebut maka perumusan

masalah yang dibahas adalah “Bagaimana membangun sebuah Web yang

dapat digunakan untuk membantu proses belajar siswa serta dapat

melakukan ujian/ulangan sebagai bahan evaluasi tiap mapel yang akan

mempermudah dan meningkatkan efisiensi serta efektivitas dalam proses

kegiatan belajar mengajar di SMAN 2 Pemalang”.

C. Batasan Masalah

Batasan permasalahan yang akan dibuat meliputi beberapa pokok

bahasan berikut:

1. Website dikelola oleh admin

2. Fitur-fitur website elearning sebagai berikut:

a. Siswa dapat men-download materi pelajaran.

b. Siwa dapat melakukan ujian online.

c. Guru dapat melakukan upload materi pelajaran dan dapat pula

melakukan ujian/ulangan berbasis online.

d. Adanya laporan ujian/ulangan tiap Kompetensi Dasar (KD) untuk

tiap guru.

D. Tujuan Penelitian

Membuat website elearning di SMAN 2 Pemalang yang bisa

dipergunakan untuk memudahkan dalam proses kegiatan belajar mengajar

dan evaluasi mapel tiap KD.

E. Manfaat Penelitian

1. Untuk user(siswa) :

Penggunaan website ini akan mempermudah siswa mendapatkan

materi pelajaran tiap mapel.

2. Untuk User(guru) :

Penggunaan website ini akan mempermudah guru dalam

memberikan materi pelajaran yang mungkin belum sempat

Page 4: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

3

disampaikan pada KBM dan mempermudah dalam melakukan

ulangan/ujian harian.

3. Untuk penulis :

Sebagai Tugas Akhir untuk memperoleh kelulusan dari D3

Teknik Informatika UNS.

F. Metodologi Penelitian

Penelitian diperlukan sebagai sarana pendukung dalam pembuatan

laporan Tugas Akhir, dimana penelitian ini dilakukan dengan menggunakan

beberapa metode. Metode yang digunakan yaitu :

1. Pengumpulan Data

Metode pengumpulan data yang digunakan penulis dalam

penyusunan tugas akhir ini ada dua yaitu :aan

a. Survey Lapangan dan Wawancara dengan Narasumber

Dalam pembuatan website ini kita terlebih dahulu melakukan

survey melakukan ke SMAN 2 Pemalang, kemudian melakukan

wawancara dengan guru SMAN 2 Pemalang.

b. Studi Pustaka

Penulis mengambil referensi dari buku-buku dari perpustakaan

untuk mencari deskripsi tentang sistem informasi, Context

Diagram, Data Flow Diagram, database, Entitas Relationship

Diagram, Relasional Antar Tabel.

2. Perancangan

Dalam merancang Website Elearning SMAN 2 Pemalang

digunakan beberapa diagram. Antara lain, Context Diagram, Data

Flow Diagram, Entity Relationship Diagram dan Relasional Antar

Tabel. Selain itu, penulis juga membuat perancangan database.

a. Implementasi

Implementasi website ini dikerjakan menggunakan bahasa

pemrograman PHP.

Page 5: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

4

b. Pengujian

Untuk menguji website apakah masih ada script yang error

atau gagal dalam menampilkan data.

G. Sistematika Penulisan

Dalam laporan ini, terdapat 5 bab yang masing-masing akan diuraikan

secara singkat dalam sistematika penulisan sebagai berikut:

a. BAB I PENDAHULUAN

Bab ini merupakan bab awal dalam laporan penelitian ini. Bab ini

berisi latar belakang masalah, perumusan masalah, batasan

masalah, tujuan dan manfaat, metodologi penelitian, serta sistematika

penelitian.

b. BAB II LANDASAN TEORI

Bab ini memuat tinjauan pustaka teori-teori yang disajikan dalam

landasan teori hanyalah teori yang mendukung pembuatan Web

Elearning SMAN 2 Pemalang.

c. BAB III DESAIN DAN PERANCANGAN

Bab ini membahas tentang bentuk desain dan perancangan website.

Pemodelan yang dipakai untuk merancang aplikasi ini adalah dengan

pembuatan Context Diagram, Data Flow Diagram, Entity

Relationship Diagram, database dan Relasional Antar Tabel.

d. BAB IV IMPLEMENTASI DAN ANALISA

Bab ini membahas tentang ini membahas tentang implementasi

spesifikasi hardware maupun software yang dipakai, serta analisa

hasil website yang kemudian ditampilkan dalam bentuk report.

e. BAB V PENUTUP

Bab ini membahas tentang kesimpulan dan saran yang penulis ambil

dari penulisan tugas akhir ini.

Page 6: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

5

BAB II

LANDASAN TEORI

A. Website

Website adalah kumpulan dari halaman-halaman situs, yang biasanya

terangkum dalam sebuah domain atau subdomain, yang tempatnya berada di

dalam World Wide Web (WWW) di Internet (Bunafit Nugroho, 2004). Sebuah

halaman web adalah dokumen yang ditulis dalam format HTML (Hyper Text

Markup Language), yang hampir selalu bisa diakses melalui HTTP, yaitu

protokol yang menyampaikan informasi dari server website untuk ditampilkan

kepada para pemakai melalui web browser.

Semua publikasi dari website tersebut dapat membentuk sebuah jaringan

informasi yang sangat besar. Sebuah website dibuat didalam sebuah sistem

komputer yang dikenal dengan server web. Yang menerima lalu mengirimkan

halaman-halaman yang diperlukan untuk merespon permintaan dari pengguna.

Apache adalah piranti lunak yang biasa digunakan dalam sebuah webserver,

kemudian setelah itu adalah Microsoft Internet Information Services (IIS).

Penemu website adalah Sir Timothy John ¨Tim¨ Berners-Lee, sedangkan

website yang tersambung dengan jaringan, pertamakali muncul pada tahun

1991. Maksud dari Tim ketika membuat website adalah untuk mempermudah

tukar menukar dan memperbarui informasi kepada sesama peneliti di tempat

dia bekerja. Pada tanggal 30 April 1993, CERN (tempat dimana Tim bekerja)

menginformasikan bahwa WWW dapat digunakan secara gratis oleh semua

orang.

Terdapat dua komponen utama dalam mekanisme kerja web :

1. Web server.

Web server merupakan sebuah aplikasi perangkat lunak. Aplikasi web

server ini dijalankan pada sebuah komputer yang disebut dengan server.

Page 7: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

6

Web server adalah salah satu jenis perangkat lunak yang menyediakan

layanan halaman (dokumen) web yang dapat diakses seluruh dunia melalui

internet. Web server akan melayani permintaan akses halaman web dengan

bantuan protokol – protokol komunikasi terutama HTTP.

2. Web browser.

Web browser adalah perangkat lunak (software) yang digunakan untuk

menampilkan dokumen HTML. Perangkat lunak ini dioperasikan pada

komputer pengguna seluruh dunia. Web browser akan membantu pengguna

mengakses halaman web yang disediakan oleh sebuah web server serta

membantu pengguna dalam hal navigasi. Pada saat ini ada beberapa

borwser yang dikembangkan oleh beberapa vendor, antara lain internet

explorer yang dikempangkan oleh netscape.

Protokol merupakan aturan tata cara yang diimplementasikan di dalam

mekanisme komunikasi dalam satu jaringan komoputer. Aturan ini

diperlukan supaya proses komunikasi yang terjadi dapat teratur dan

sistematis sehingga dapat dirancang suatu model komunikasi untuk

berbagai keperluan. Pada saat ini telah tercipta berbagai protokol yang

digunakan dalam rangka berkomunikasi melalui jaringan komputer.

Berikut ini adalah beberapa prootokol yang ada :

a. Transmission Control Protokol (TCP). Mengatur tata cara pemaketan

data dari pengirim dan pembukaan data dari komputer penerima.

b. Internet Protokol (IP). Mengatur mekanisme pengiriman data dari

komputer pengirim sampai komputer penerima.

c. Hypertext Transfer Protocol (HTTP). Mengatur mekanisme transfer

dan penampilan halaman web.

d. File Transfer Protocol (FTP). Mekanisme transfer file di dalam

jaringan komputer.

e. Email protocol. Mengatur meknisme pengiriman dan penerimaan

email.

Page 8: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

7

B. Context Diagram (CD).

Context Diagram merupakan pola penggambaran yang berfungsi untuk

memperlihatkan interaksi sistem informasi dengan lingkungan dimana sistem

itu berada (Sutejo, 2002).

Context Diagram adalah diagram tingkatan atas yaitu diagram yang

paling tidak detail dari sistem informasi yang menggambarkan alur data

kedalam dan keluar.

1. Proses

Menggambarkan system yang akan dibuat.

Gambar 2.1 Entitas Internal

2. Entitas Eksternal

Menggambarkan asal atau tujuan data.

Gambar 2.2 Entitas Eksternal

3. Aliran Data

Menggambarkan aliran data.

Gambar 2.3 Aliran Data

Page 9: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

8

C. Data Flow Diagram (DFD)

DFD sering digunakan untuk menggambarkan suatu sistem yang telah

ada atau sistem baru yang akan dikembangkan secara logika tanpa

mempertimbangkan lingkungan fisik dimana data tersebut mengalir. DFD

merupakan alat yang digunakan untuk pada metodologi pengembangan sistem

yang terstruktur dan jelas.

1. Entitas yaitu sumber data atau tujuan, terletak diluar context sistem karena

tidak terlibat langsung dengan proses data. Simbol entitas sebagai berikut.

Gambar 2.4 Entitas

2. Aliran data, disajikan dengan jalur yang menghubungkan sistem dan

merupakan interface antar sistem. Simbol dari aliran data tersebut sebagai

berikut .

Gambar 2.5 Aliran data

3. Proses yang menyajikan apa yang dikerjakan dengan data, setiap proses

punya input satu atau lebih dan punya produk(hasil). Simbol dari proses

tersebut sebagai berikut.

Gambar 2.6 Proses

Page 10: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

9

4. Sumber data, sebagai tempat penyimpanan data. Simbol sumber data atau

penyimpanan data tersebut sebagai berikut.

Gambar 2.7 Sumber data /penyimpanan data

D. Entity Relationship Diagram (ERD)

ERD merupakan suatu model untuk menjelaskan hubungan antar data

dalam basis data berdasarkan objek-objek dasar data yang mempunyai

hubungan antar relasi. ERD untuk memodelkan struktur data dan hubungan

antar data, untuk menggambarkannya digunakan beberapa notasi dan simbol.

Pada dasarnya ada tiga simbol yang digunakan, yaitu :

1. Entity

Entity merupakan objek yang mewakili sesuatu yang nyata dan dapat

dibedakan dari sesuatu yang lain \

Gambar 2.8 Simbol Entity

2. Atribut

Setiap entitas pasti mempunyai elemen yang disebut atribut yang berfungsi

untuk mendeskripsikan karakteristik dari entitas tersebut. Isi dari atribut

mempunyai sesuatu yang dapat mengidentifikasikan isi elemen satu dengan

yang lain.

Gambar 2.9 Simbol Atribut

Page 11: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

10

3. Hubungan / Relasi

Hubungan antara sejumlah entitas yang berasal dari himpunan entitas yang

berbeda.

Gambar 2.10 Simbol Relasi

4. Garis

Digunakan untuk menghubungkan entitas dan entitas dengan atribut.

Gambar 2.11 Garis

E. PHP (Hypertext Prepocessor)

PHP merupakan kependekan dari Hypertext Prepocessor dan

merupakan bahasa pemrograman yang berbasis web yang memiliki kemampuan

untuk memproses data dinamis yang hasilnya dapat ditampilkan pada client.

PHP diciptakan terutama untuk kegunaan web dan boleh mengubungkannya

dengan query database menggunakan simple task yang boleh diluruskan dengan

3 atau 4 baris kode saja.

PHP dikatakan sebagai sebagai bahasa server-side scripting yang

menyatu dengan HTML untuk membuat halaman web yang dinamis dan

perintah yang diberikan akan sepenuhnya dijalankan di server tetapi disertakan

pada dokumen HTML (Sunarfriantono, 2002).

Pada prinsipnya server akan bekerja apabila ada permintaan dari client.

Dalam hal ini client menggunakan kode-kode PHP untuk mengirimkan

permintaan ke server.

Page 12: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

11

Gambar 2.12 Struktur proses dari web server

F. MySQL

MySQL merupakan salah satu database yang cukup stabil sebagai

media penyimpanan data dalam bentuk besar (Nugroho,2004). Sifatnya yang

menggunakan system client-server , sangat mendukung dalam pengembangan

aplikasi client-server. Database server adalah sebuah program yang bertugas

melayani permintaan query database dari client.

G. phpMyAdmin dan XAMPP

phpMyAdmin disebut juga sebagai tools yang digunakan untuk

mengakses database MySQL dalam bentuk tampilan web. Tools ini secara

standart disertakan ketika menginstal XAMPP. Dengan adanya phpMyAdmin,

semua pekerjaan akan menjadi lebih mudah, Karen sudah dapat memanajemen

database dan data yang ada didalamnya, selain itu juga dapat menjadi

administrator dengan mudah (Bunafit Nugroho 2009).

XAMPP merupakan tool yang menyediakan paket perangkat lunak ke

dalam satu buah paket.

Page 13: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

12

H. E-learning

Pembelajaran adalah proses interaksi peserta didik dengan pendidik

dan sumber belajar pada suatu lingkungan belajar (Achjar Chalil. 2003). Dari

definisi tersebut, dapat ditarik kesimpulan bahwa inti dari proses pembelajaran

adalah interaksi antara peserta didik dengan pendidik. Maka dari itu, syarat-

syarat pembelajaran yang baik adalah sebagai berikut :

1. Frekuensi kontak antara guru dengan siswa, baik di dalam maupun di luar

kelas merupakan faktor yang amat penting untuk meningkatkan motivasi

dan keterlibatan siswa dalam belajar. Dengan seringnya kontak antara

guru-siswa ini, guru dapat lebih meningkatkan kepedulian terhadap

siswanya.

2. Siswa membutuhkan umpan balik yang tepat dan memadai atas kinerjanya

sehingga mereka dapat mengambil manfaat dari apa yang telah

dipelajarinya. Ketika hendak memulai belajar, siswa membutuhkan

bantuan untuk menilai pengetahuan dan kompetensi yang ada.

3. Ada banyak jalan untuk belajar. Tidak hanya di ruang kelas, proses

pembelajaran dapat dilakukan dimana saja, dan sumber yang tidak terbatas.

Dilihat dari beberapa syarat diatas, muncul adanya permasalahan.

Seperti misalnya frekuensi pertemuan antara peserta didik dengan pendidik

yang kurang. Selain itu ada pula keterbatasan dalam melakukan penilaian

terhadap pengetahuan dan kompetensi yang ada. Serta kurang sumber lain

dalam proses pembelajaran.

Masalah itu sekarang dapat diatasi dengan adanya E-learning. Karena

dengan adanya E-learning ini guru dapat berinteraksi kapanpun dengan murid

tanpa harus bertemu secara langsung. Selain itu E-learning juga dapat

difungsikan sebagai media penyebaran materi pendidikan, pengumpulan tugas

Page 14: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

13

atau bahkan sebagai media untuk melaksanakan ujian harian. Sehingga proses

pembelajaran tidak hanya terpaku pada intensitas pertemuan antara peserta

didik dengan pendidik di ruang kelas.

Secara sederhana, e-learning adalah “e-learning is the use of

information and computer technologies to create learning experiences”

(Horton, 2006). Pendapat tersebut dapat diartikan e-learning sebagai segala

bentuk penggunaan informasi dan teknologi komputer untuk menciptakan

pengalaman belajar. Definisi ini menekankan bagaimana pengalaman belajar

diformulasikan, diorganisir, dan diciptakan melalui perangkat E-learning.

Page 15: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user 14

BAB III

DESAIN DAN PERANCANGAN

A. Analisis Sistem

Sistem pembelajaran secara online atau E-learning belum banyak

dipakai di sekolah khususnya di SMA. Namun tidak dapat dipungkiri, seiring

perkembangan zaman menuntut adanya perkembangan pada kegiatan belajar

mengajar. Maka dari itu diperlukan adanya E-learning yang mempunyai

banyak kelebihan yang dapat digunakan pada proses kegiatan belajar

mengajar.

Murid dapat mendapatkan materi pelajaran yang belum didapatkan pada

kegiatan belajar mengajar di sekolah, mengumpulkan tugas-tugas harian, dan

dapat melakukan ujian harian sebagai bahan evaluasi bagi guru dengan adanya

E-learning ini.

Bagi guru sendiri, adanya E-learning dapat memudahkan guru dalam

membagikan materi pelajaran yang mungkin tertinggal atau belum

disampaikan di pertemuan sekolah, memberikan tugas harian dan dapat pula

mengadakan ulangan harian bagi murid-murid.

B. Identifikasi Masalah

Berdasarkan analisis diatas, dapat diketahui bahwa permasalahan yang

muncul dalam kegiatan belajar mengajar adalah :

1. Proses kegiatan belajar mengajar yang selama ini dilakukan sangat

bergantung pada pertemuan yang terjadi antara guru dengan murid pada

saat jam pelajaran sekolah berlangsung.

Page 16: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

15

2. Karena sangat bergantung pada pertemuan sekolah, maka penyebaran

materi pelajaran juga sangat lamban dan terbatas.

3. Selain penyebaran materi pelajaran yang terbatas, ulangan harian juga

dilakukan dengan cara konvensional tanpa memanfaatkan teknologi

yang sudah ada, misalnya komputer.

C. Perancangan Sistem Alur Data

Pembuatan sistem yang benar harus didahului dengan pembuatan

perancangan sistem terlebih dahulu, agar system yang dibuat nantinya tidak

mengalami kesalahan dalam alur data serta tidak mengalami redundancy data.

1. Context Diagram (CD)

SiswaSistem Pembelajaran

OnlineGuru

Admin

Input data

User (siswa,guru), mengolah data mata pelajaran

Data user

Login, upload tugas

Materi pelajaran,

Ujian online

Login, input tugas

Laporan hasil ujian,

Tugas siswa

Gambar 3.1 Context Diagram

Page 17: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

16

Keterangan :

a. Siswa melakukan login ke system, kemudian dapat melakukan

upload tugas, mengerjakan ujian online serta men-download materi

pelajaran yang tersedia.

b. Guru melakukan login ke system, kemudian dapat melakukan input

tugas untuk diberikan pada siswa, upload materi pelajaran, dan

mendapatkan laporan hasil ujian siswa.

c. Admin melakukan login ke system, kemudian dapat melakukan

pengolahan data menyangkut data siswa, guru, maple, materi

pelajaran, tugas dan soal untuk ujian.

Page 18: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

17

2. Data Flow Diagram (DFD) level 0

admin

guru

siswa

1.

login

2.

Olah data

user

3.

Olah data

mapel

4.

Olah data

tugas

5.

Olah data

materi

7.

Download

materi

8.

Upload

tugas

9.

Ujian

online

Admin

Guru

Siswa

Mapel

materi

Tugas

Kd

6.

Olah data

soal

Soal

Input Pass

Input Pass

Input, edit data user

Input, edit data mapel

Input, edit data soalInput, edit data materi

Input pass

Input, edit data tugas

Input, edit data tugas

Input, edit data materi

Input, edit data soal

Download materi

Input data

Input data

Data user

Data user

Data user

Informasi guru

Informasi siswa

Informasi mapel

Informasi tugas

Informasi tugas

Informasi materiInformasi materi

Informasi soal

Informasi soal

Informasi tugas

Informasi soal

Materi pelajaran

Gambar 3.2 Data Flow Diagram level 0

Page 19: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

18

Keterangan :

a. Siswa login ke web menggunakan username dan password yang

sudah didaftarkan oleh admin web.

b. Setelah masuk ke dalam web, siswa dapat memilih menu yang

tersedia, seperti men-download materi pelajaran, melakukan

pengumpulan tugas serta melakukan ujian online pada suatu mata

pelajaran tertentu.

c. Guru login ke web menggunakan username dan password yang

sudah didaftarkan oleh admin web.

d. Setelah masuk ke dalam web, guru dapat melakukan upload materi

pelajaran dan tugas untuk diberikan kepada siswa, serta dapat pula

meng-input soal yang digunakan untuk melakukan ujian online

pada waktu yang telah ditentukan.

e. Guru juga bisa mendapatkan hasil ujian para siswa sebagai laporan.

f. Admin melakukan login ke web, kemudian dapat melakukan proses

pengolahan data mengenai user (Guru dan Siswa), mata pelajaran,

materi pelajaran, tugas dan soal.

Page 20: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

19

Data Flow Diagram level 1 proses 2

Admin

2.1

Olah data

guru

Guru

Siswa

Input, edit data guru

Input, edit data siswa

Informasi data guru

Informasi data siswa

Data guru

Data siswa

2.2

Olah data

siswa

Gambar 3.3 Data Flow Diagram level 1 proses 2

Keterangan :

a. Admin melakukan proses pengolahan terhadap data guru, untuk

kemudian disimpan pada tabel guru. Pengolahan data meliputi NIP,

nama, mapel yang diampu serta kelas yang diajar.

b. Admin melakukan proses pengolahan terhadap data siswa, untuk

kemudian disimpan pada tabel siswa. Pengolahan data meliputi

NIS, nama, kelas, serta jurusan dari siswa tersebut.

Data Flow Diagram level 1 proses 4

Admin

Tugas

Input, edit data tugas

Data tugas

GuruInput, edit data tugas

4.

Olah data

tugas

Gambar 3.4 Data Flow Diagram level 1 proses 4

Page 21: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

20

Keterangan :

a. Proses pengolahan data tugas dapat dilakukan oleh 2 user, yaitu

admin dan guru.

b. Guru dapat melakukan upload tugas yang kemudian dapat di-

download oleh para siswa.

c. Admin juga dapat melakukan pengolahan data tugas.

Data Flow Diagram level 1 proses 5

Admin

5.

Olah data

materi

Materi

Input, edit data materi

Data materi

GuruInput, edit data materi

Gambar 3.5 Data Flow Diagram level 1 proses 5

Keterangan :

a. Proses pengolahan data materi pelajaran dapat dilakukan oleh 2

user, yaitu admin dan guru.

b. Guru dapat melakukan upload materi pelajaran yang kemudian

dapat di-download oleh para siswa.

c. Admin juga dapat melakukan pengolahan data materi pelajaran.

Page 22: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

21

Data Flow Diagram level 1 proses 6

Admin

6.

Olah data

soal

Soal

Input, edit data soal

Data soal

GuruInput, edit data soal

Gambar 3.6 Data Flow Diagram level 1 proses 6

Keterangan :

a. Proses pengolahan data soal dapat dilakukan oleh 2 user, yaitu

admin dan guru.

b. Guru dapat melakukan input soal yang kemudian dapat digunakan

untuk ujian bagi para siswa.

c. Admin juga dapat melakukan pengolahan data soal ujian.

D. Perancangan Database

Basis data (database) merupakan sekumpulan file yang terhubung antara

satu file dengan file yang lain sehingga membentuk suatu bangunan data.

Penyusunan database digunakan untuk mengatasi masalah-masalah yang bisa

terjadi dalam penyusunan data, seperti kesulitan pengaksesan data, banyak

pemakai dan masalah kemanan.

Page 23: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

22

1. Entity Diagram

a. Siswa

Tabel siswa berisi informasi mengenai siswa, meliputi NIS,

nama siswa dan kelas.

Siswa

NIS

Id_kelasNama_siswa

Tabel 3.7 Atribut Siswa

b. Guru

Tabel guru berisi informasi mengenai guru, meliputi NIP,

nama guru, mapel yang diampu, serta kelas yang diajar.

Guru

NIP idmapel

IdkelasNama_guru

Tabel 3.8 Atribut Guru

Page 24: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

23

c. Kelas

Tabel kelas berisi informasi mengenai kelas, hanya terdapat

id kelas dan nama kelas.

kelas

Nama_kelasId kelas

Gambar 3.9 Atribut Kelas

d. Mapel

Tabel mapel berisi informasi mengenai mapel, hanya

terdapat id mapel dan nama mapel.

mapel

Nama_mapelId_mapel

Gambar 3.10 Atribut Mapel

Page 25: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

24

e. Daftarkd

Tabel kd berisi informasi kd. Tabel ini dibutuhkan karena

dimungkinkan satu mapel memiliki banyak kd atau ulangan

harian. Terdiri dari kdmapel, nama_kd, mapel, jumlah soal,

waktu pengerjaan, jumlah soal yang akan ditampilkan dan status

soal (aktif atau tidak aktif).

daftarkd

kdmapel

jumlahnamakd

Id_mapel

waktu

tampilactive

Gambar 3.11 Atribut Daftarkd

f. Materi (File_manager)

Tabel materi berisi informasi mengenai materi mata

pelajaran. Terdiri dari id_materi, id_mapel, id_kelas dan nama

materi.

Page 26: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

25

File_manager

Id_file

Id_kelas

Nama_file

Gambar 3.12 Atribut Materi

g. Tugas

Tabel tugas berisi informasi mengenai tugas dari mata

pelajaran. Terdiri dari informasi tugas dan waktu pengumpulan.

Daftar_tugas

Tugas_id idkelas

Tugas_keteran

gan

Tugas_namaTugas_tanggal

Gambar 3.13 Atribut Tugas

h. Soal

Tabel soal berisi informasi terkait soal yang akan digunakan

pada ujian kd atau ulangan harian. Terdiri dari id_soal, soal dan

jawaban, jawaban benar serta kdmapel.

Page 27: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

26

soal

Id_soal

jwb3

jwb5

gbr2

gbr5

gbr4

jwb4

jwb2

gbr1jwb1

soal

kdmapel

gbr3

gbr6

Gambar 3.14 Atribut Soal

i. Nilai

Tabel nilai berisi informasi mengenai nilai dari siswa yang

telah mengikuti ujian kd, untuk selanjutnya digunakan sebagai

laporan. Terdiri dari NIS, kdmapel, nilai dan status.

nilai

NIS

nilai

kdmapel

status

Gambar 3.15 Atribut Nilai

Page 28: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

27

j. Admin

Tabel ini hanya berisi mengenai username dan password

dari admin.

admin

idadmin password

Gambar 3.16 Atribut Admin

Page 29: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

28

2. Entity Relationship Diagram (ERD)

Siswa

NIS

Id_kelasNama_siswa

Guru

NIP idmapel

IdkelasNama_gur

u

kelas

Nama_kelas

Id kelas

mapel

Nama_mapel

Id_mapel

daftarkd

kdmapel

jumlah

namakd

Id_mapel

waktu

tampil

active

admin

idadmin

password

File_manager

Id_file

Id_kelas

Nama_file

Daftar_tugas

Tugas_id

idkelas

Tugas_keterangan

Tugas_nama

Tugas_tanggal

soal

Id_soal

jwb3

jwb5

gbr2

gbr5

gbr4

jwb4

jwb2

gbr1jwb1

soal

kdmapel

gbr3

gbr6

nilai

NIS

nilai

kdmapel

status

memilikin 1

memiliki

n

1

memilikin 1 memiliki

1

memiliki

n

memiliki

1

n

memiliki

1

n

1

memiliki

1

n

n

Gambar 3.17 Entity Relationship Diagram

3. Perancangan tabel

Perancangan sistem ini membutuhkan 9 tabel, yaitu : tabel siswa,

tabel guru, tabel admin, tabel kelas, tabel mapel, table kdmapel,

tabel materi, tabel tugas, tabel soal dan tabel nilai.

Tabel 3.1 berisi daftar siswa

Nama Field Type Panjang Default Keterangan

NIS Char 8 Not Null Primary Key

Nama_siswa varchar 30 Not Null

Idkelas Char 6 Not Null

Page 30: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

29

Tabel 3.2 berisi daftar guru

Nama Field Type Panjang Default Keterangan

NIP Char 10 Not Null Primary Key

Nama_guru varchar 30 Not Null

Idkelas Char 6 Not Null

Idmapel Char 6 Not Null

Tabel 3.3 berisi daftar kelas

Nama Field Type Panjang Default Keterangan

Idkelas Char 6 Not Null Primary Key

Namakelas varchar 30 Not Null

Tabel 3.4 berisi daftar mapel

Nama Field Type Panjang Default Keterangan

Idmapel Char 6 Not Null Primary Key

Namamapel varchar 30 Not Null

Tabel 3.5 berisi daftar kd

Nama Field Type Panjang Default Keterangan

Kdmapel Char 10 Not Null Primary Key

Idmapel Char 10 Not Null

Namakd Varchar 30 Not Null

Jumlah Int 11 Not Null

Waktu Int 11 Not Null

Tampil Int 11 Not Null

Active Char 1 Not Null

Page 31: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

30

Tabel 3.6 berisi materi pelajaran

Nama Field Type Panjang Default Keterangan

Id_file Int 11 Not Null Primary Key

Nama_file Text Not Null

Id_kelas Char 6 Not Null

Tabel 3.7 berisi daftar tugas

Nama Field Type Panjang Default Keterangan

Tugas_id Int 11 Not Null Primary Key

Tugas_nama Varchar 30 Not Null

Tugas_keterangan Text Not Null

Idkelas Char 6 Not Null

Tugas_tanggal Date Not Null

Tabel 3.8 berisi daftar soal

Nama Field Type Panjang Default Keterangan

Id_soal Char 8 Not Null Primary Key

Soal varchar 60 Not Null

jwb1 Varchar 60 Not Null

gbr1 Varchar 60 Not Null

jwb2 Varchar 60 Not Null

gbr 2 Varchar 60 Not Null

jwb 3 Varchar 60 Not Null

gbr 3 Varchar 60 Not Null

jwb 4 Varchar 60 Not Null

gbr 4 Varchar 60 Not Null

jwb 5 Varchar 60 Not Null

gbr 5 Varchar 60 Not Null

Ans Varchar 60 Not Null

Kdmapel Char 5 Not Null

Gbr6 Varchar 60 Not Null

Page 32: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

31

Tabel 3.9 berisi daftar nilai

Nama Field Type Panjang Default Keterangan

NIS Char 8 Not Null Primary Key

Kdmapel Char 10 Not Null

Nilai Integer 11 Not Null

Status Char 1

Tabel 3.10 berisi informasi admin

Nama Field Type Panjang Default Keterangan

Idadmin Varchar 40 Not Null Primary Key

Password Varchar 40 Not Null

Page 33: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user 32

BAB IV

IMPLEMENTASI DAN ANALISIS

Berdasarkan hasil analisis kebutuhan dari E-learning, dimana terdapat 3 user

utama, yaitu admin, guru dan siswa. Karena perbedaan kepentingan dan kebutuhan,

maka tiap user memiliki menu yang beda satu sama lain agar tidak terjadi redundancy

data.

A. Struktur dan Desain

A.1. Halaman Index/Halaman Utama Web

Halaman Index meruakan halaman pertama yang ditampilkan saat pertama

kali masuk ke dalam web. Pada halaman ini terdapat informasi singkat mengenai

E-learning, form login serta link yang terkait dengan web ini. Form login yang

terdapat pada halaman index ini khusus digunakan oleh siswa. Untuk tampilan

dari halaman index dapat dilihat pada gambar 4.1.

Gambar 4.1 Halaman Index

Page 34: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

33

Gambar 4.2 Halaman Login Siswa

A.2. Halaman Administrator

Halaman ini adalah halaman yang penting pada web ini. Karena administrator

melakukan banyak proses pengolahan data untuk kemudian ditampilkan oleh

pengguna web ini. Pada halaman ini administrator mempunyai akses langsung ke

database sehingga dapat menambah, mengubah serta menghapus data.

a. Halaman Login

Halaman pertama yang muncul saat user akan masuk ke dalam halaman

administrator adalah halaman login. Halaman login ini diperlukan agar tidak

sembarangan orang dapat masuk ke dalam halaman administrator dan

melakukan pengolahan data secara illegal. Halaman login ini juga berbeda

dari halaman login siswa agar lebih aman. Halaman login administrator dapat

dilihat pada gambar 4.3.

Gambar 4.3 Login admin

Page 35: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

34

b. Halaman Utama Admin

Pada halaman ini terdapat beberapa menu yang dapat digunakan untuk

proses pengolahan data, seperti menu siswa, guru, materi, tugas, soal dan

nilai. Pada menu-menu tersebut juga terdapat sub menu lagi untuk melakukan

proses pengolahan data secara spesifik. Halaman utama administrator dapat

dilihat pada gambar 4.4.

Gambar 4.4 Halaman Utama Administrator

c. Menu Halaman Guru

Pada halaman ini ditampilkan daftar guru yang ada. Terdapat submenu

tambah guru serta menu tambahan yaitu edit data guru yang sudah ada dan

hapus data guru. Menu halaman guru dapat dilihat pada gambar 4.5.

Page 36: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

35

Gambar 4.5 Menu halaman guru

Untuk tampilan submenu yang ada pada halaman guru dapat dilihat

pada gambar 4.6 untuk tambah guru dan gambar 4.7 untuk edit guru.

Gambar 4.6 Halaman submenu tambah guru

Page 37: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

36

Gambar 4.7 Halaman submenu edit guru

Gambar 4.8 Submenu hapus guru

Gambar 4.9 Pemberitahuan bahwa data guru telah dihapus

Page 38: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

37

d. Menu Halaman Siswa

Pada halaman ini ditampilkan daftar siswa yang terdaftar. Terdapat

submenu tambah siswa serta menu tambahan yaitu edit data siswa yang sudah

ada dan hapus data siswa. Menu halaman siswa dapat dilihat pada gambar

4.10.

Gambar 4.10 Menu halaman siswa

Untuk tampilan submenu yang ada pada halaman siswa dapat dilihat

pada gambar 4.11 untuk tambah siswa dan gambar 4.12 untuk edit siswa.

Gambar 4.11 Submenu tambah siswa

Page 39: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

38

Gambar 4.12 Tampilan submenu edit siswa

Gambar 4.13 Submenu hapus siswa

Gambar 4.14 Pemberitahuan bahwa data siswa sudah dihapus

Page 40: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

39

e. Submenu Halaman Materi

Pada halaman submenu materi ini, akan ditampilkan semua materi yang

telah di-upload dan tersedia untuk di-download oleh siswa. Terdapat menu

untuk menambahkan materi baru. Halaman submenu materi dapat dilihat pada

gambar 4.15.

Gambar 4.15 Tampilan submenu materi

Gambar 4.16 Pemberitahuan bahwa file telah berhasil di-upload

f. Submenu Halaman Soal

Pada halaman submenu ini, administrator diberikan pilihan untuk

menampilkan semua soal berdasarkan kompetensi yang ada. Kemudian

administrator juga dapat melakukan edit soal dan hapus soal. Tampilan

halaman soal dapat dilihat pada gambar 4.17.

Page 41: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

40

Gambar 4.17 Tampilan submenu soal

Gambar 4.18 Soal ditampilkan sesuai dengan kompetensi yang dipilih

Page 42: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

41

Gambar 4.19 Menu edit soal

Gambar 4.20 Pemberitahuan bahwa soal telah dihapus

g. Submenu halaman tugas

Pada halaman submenu tugas ini, akan ditampilkan semua tugas yang

telah disimpan dan tersedia untuk dilihat oleh siswa. Terdapat menu untuk

menambahkan tugas baru. Halaman submenu tugas dapat dilihat pada gambar

4.21.

Page 43: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

42

Gambar 4.21 Tampilan submenu tugas

Gambar 4.22 Tampilan detail tugas

Page 44: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

43

Gambar 4.23 Tampilan tambah tugas

Gambar 4.24 Pemberitahuan bahwa tugas telah dihapus

h. Submenu halaman nilai

Pada halaman submenu ini, administrator diberikan pilihan untuk

menampilkan nilai berdasarkan guru, kelas dan kompetensi yang ada.

Tampilan halaman nilai dapat dilihat pada gambar 4.25.

Page 45: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

44

Gambar 4.25 Tampilan submenu nilai

Gambar 4.26 Tampilan nilai berdasarkan guru, kelas dan kompetensi

A.3. Halaman Guru

Halaman ini adalah halaman yang diperuntukan khusus untuk guru. Pada

halaman ini guru dapat melakukan banyak proses, diantaranya adalah

menambahkan materi pelajaran baru sesuai kelas yang diampu, memberikan

tugas harian kepada siswa dan menambahkan soal yang dapat digunakan untuk

ujian kd.

a. Halaman login

Halaman ini adalah halaman yang pertama kali ditampilkan sebelum

masuk ke halaman utama. Guru diharuskan memasukkan nip dan password

agar dapat masuk ke halaman guru dan dapat melakukan banyak proses

didalamnya. Halaman login dapat dilihat pada gambar 4.27.

Page 46: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

45

Gambar 4.27 Login guru

b. Halaman utama

Halaman ini merupakan halaman utama dari halaman guru. Terdapat

pilihan menu yang dapat dilakukan oleh guru. Tampilan halaman utama dapat

dilihat pada gambar 4.28.

Gambar 4.28 Halaman utama guru

Page 47: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

46

c. Halaman materi

Pada menu ini, guru dapat melihat dan menambahkan materi yang

nantinya dapat di-download oleh siswa. Tampilan halaman materi dapat

dilihat pada gambar 4.29.

Gambar 4.29 Halaman materi

Gambar 4.30 Pemberitahuan bahwa materi baru telah ditambahkan

Page 48: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

47

d. Halaman tugas

Pada menu tugas ini, guru dapat melihat tugas yang telah ditambahkan

pada siswa. Selain itu, guru juga dapat menambahkan tugas baru bagi siswa.

Tampilan halaman tugas dapat dilihat pada gambar 4.31.

Gambar 4.31 Halaman tugas

Gambar 4.32 Tampilan submenu tambah tugas

Page 49: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

48

e. Halaman tambah soal

Pada halaman ini, guru dapat menambahkan kd dan soal sesuai dengan

mapel yang diampu guru tersebut. Tampilan halaman soal dan penambahan

soal dapat dilihat pada gambar 4.33 dan 4.34.

Gambar 4.33 Halaman soal (pilih mapel yang diampu)

Gambar 4.34 Tampilan submenu tambah kd

Page 50: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

49

Gambar 4.35 Tampilan submenu input soal

f. Halaman Nilai

Pada halaman ini guru dapat melihat nilai dari ujian kd para siswa.

Dapat dilakukan secara individu atau secara kelas berdasar mapel yang

diampu. Tampilan halaman nilai dapat dilihat pada gambar 4.36.

Gambar 4.36 Tampilan halaman nilai

Page 51: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

50

g. Halaman Kd

Pada menu ini guru dapat melakukan pengeditan dan aktivasi soal.

Aktivasi soal diberikan agar waktu pelaksanaan ujian dapat dikendalikan guru.

Tampilan halaman kd dapat dilihat pada gambar 4.37.

Gambar 4.37 Tampilan halaman kd

A.4. Halaman Siswa

Halaman ini adalah halaman yang tampil saat siswa memasukkan username

dan password mereka. Terdapat 4 menu yang dapat dimanfaatkan oleh siswa,

yaitu materi, tugas, soal dan nilai.

a. Halaman utama

Halaman ini adalah halaman yang tampil saat siswa memasukkan

username dan password mereka. Terdapat 4 menu yang dapat dimanfaatkan

oleh siswa, yaitu materi, tugas, soal dan nilai. Tampilan halaman utama siswa

dapat dilihat pada gambar 4.38.

Page 52: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

51

Gambar 4.38 Halaman utama siswa

b. Halaman materi

Pada halaman ini ditampilkan materi yang tersedia untuk di-download

oleh siswa sesuai dengan kelas dari siswa tersebut. Tampilan halaman materi

dapat dilihat pada gambar 4.39.

Page 53: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

52

Gambar 4.39 Tampilan halaman materi

c. Halaman tugas

Pada halaman ini ditampilkan tugas yang tersedia untuk siswa sesuai

dengan kelas dari siswa tersebut. Tampilan halaman tugas dapat dilihat pada

gambar 4.40.

Gambar 4.40 Tampilan halaman tugas

Page 54: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

53

Gambar 4.41 Tampilan detail tugas siswa

d. Halaman soal

Pada halaman ini siswa akan diberi pilihan ujian yang akan dikerjakan.

Kemudian akan muncul nama kd yang aktif dan dapat dikerjakan oleh siswa

sebagai ujian online. Tampilan halaman soal dapat dilihat pada gambar 4.42

dan 4.43.

Gambar 4.42 Tampilan halaman soal

Page 55: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

54

Gambar 4.43 Tampilan pilihan kd yang aktif

Gambar 4.44 Tampilan soal ujian online

Page 56: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

55

e. Halaman nilai

Pada halaman ini akan ditampilkan nilai yang didapat oleh siswa sesuai

dengan ujian yang pernah dikerjakan. Tampilan halaman nilai dapat dilihat

pada gambar 4.45.

Gambar 4.44 Tampilan halaman nilai

B. Analisis Kebutuhan Sistem

Analisis kebutuhan sistem dari E-learning SMAN 2 Pemalang ini dibagi

menjadi 2, yaitu :

1. Kebutuhan Software

Kebutuhan perangkat lunak yang digunakan untuk menggunakan E-

learning ini adalah sebagai berikut :

Tabel 4.1 Kebutuhan Software

No. Jenis Sotware Nama Software Harga

1 Sistem Operasi Windows 7 Ultimate Rp. 7.000.000,00

2 Bahasa Pemrograman PHP, HTML, Javascript Gratis

3 Web Server Apache Gratis

4 Database Server MySQL Gratis

Page 57: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

56

5 Task Editor Adobe Dreamweaver CS4 Rp. 7.500.000,00

6 Web Browser Mozilla Firefox, Google

Chrome Gratis

Kebutuhan minimum perangkat lunak yang dibutuhkan untuk

menampilkan web ini adalah :

a. Sistem operasi : Windows XP

b. Browser : Mozilla Firefox

2. Kebutuhan Hardware

Spesifikasi perangkat keras yang digunakan untuk membuat web ini

adalah sebagai berikut :

a. Processor Intel Core i3 2330M 2,2 Ghz

b. Memori 4GB DDR3

c. Harddisk 750GB

d. VGA Ati Radeon HD6730M 2GB

e. Mouse

Page 58: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user 57

BAB V

PENUTUP

A. Kesimpulan

E-learning yang dapat digunakan sebagai alat bantu dalam proses

pembelajaran telah dapat dibuat. Dalam E-learning ini dapat digunakan sebagai

penyebaran materi pelajaran, sebagai alat penyebaran dan pengumpulan tugas,

serta dapat pula digunakan sebagai media evaluasi pembelajaran melalui ujian

online.

B. Saran

Berdasarkan kesimpulan diatas, penulis dapat memberikan saran sebagai

berikut :

1. Bisa ditambahkan laporan nilai secara visual dalam bentuk grafik

sehingga lebih mudah untuk pembacaan.

2. Fasilitas search pada semua halaman yang dapat digunakan untuk

memudahkan dalam proses pencarian materi, tugas atau ujian online.

Page 59: PEMBUATAN E-LEARNING SMAN 2 PEMALANG... · SKM ini sendiri bertujuan agar menjadi percontohan bagi SMA-SMA lain khususnya di ... evaluasi tiap mapel ... atau tujuan, terletak diluar

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

58

DAFTAR PUSTAKA

Anonim. 2010. Pengertian dan Definisi Pembelajaran menurut beberapa Ahli.

http://carapedia.com/Definisi_infocat28//pengertian_definisi_pembelajaran_m

enurut_para_ahli_info507. Diakses pada tanggal 10 April 2012.

Fathansyah . 2007. Basis Data. Bandung: Informatika Bandung.

Horton, William Kendall. 2006. E-learning by Design.

Jogiyanto, H.M.2001.Analisis dan Desain Sistem Informasi. Yogyakarta : Andi.

Kadir, Abdul.1998. Konsep dan Tuntunan Praktis Basis Data. Yogyakarta : Andi.

Kendall K.E, Kendall J.E. 2003. Analisis dan Perancangan Sistem Edisi 1, alih

bahasa oleh Alhamdany Hafedh. Jakarta : PT Prenhallindo dan Pearson

Education Asia Pte. Ltd.

Kristanto, Andri. 2003. Perancangan Sistem Informasi dan Aplikasinya. Yogyakarta:

Gava Media

Kristanto, Harianto. 2002. Konsep dan Perancangan Database Edisi ke-6.

Yogyakarta : Andi.

Nugroho B., 2004, Aplikasi Pemrograman Sistem Informasi Manajemen dan

Aplikasinya, Yogyakarta : Gaya Media.

Sudrajat, Akhmad. 2009. Tujuh Prinsip Praktik Pembalajaran yang Baik. http:

//akhmadsudrajat.wordpress.com/2009/09/30/inilah-tujuh-prinsip-praktik-

pembelajaran-yang-baik. Diakses pada tanggal 10 April 2012.