Desain dan Implementasi Aplikasi Pembelajaran Sejarah

Menggunakan HTML5

Artikel Ilmiah

Diajukan kepada

Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Peneliti:

Yosep Budiyanto (672009245)

Dr. Dharmaputra T. Palekahelu, M.Pd

Ramos Somya, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

Juni 2016

1

2

3

5

6

1. Pendahuluan

Pendidikan merupakan salah satu sistem dalam pemerintahan yang selalu

mengalami perubahan. Salah satu perubahan yang dilakukan pemerintah dari

waktu ke waktu adalah perubahan kurikulum. Pada saat ini di Indonesia

menggunakan kurikulum KTSP. Proses pembelajaran dalam kurikulum KTSP

diharuskan dapat berlangsung dengan tenang dan menyenangkan. Untuk

memenuhi kondisi tersebut pihak sekolah dapat memanfaatkan penggunaan

aplikasi dalam proses pembelajarannya. Salah satu aplikasi yang dapat

dimanfaatkan adalah aplikasi berbasis web. Dengan pemakaian aplikasi

pembelajaran menggunakan media web dapat megurangi suasana yang statis dan

dapat menciptakan proses pembelajaran yang efektif, tenang, menyenangkan dan

dapat juga membangkitkan minat belajar siswa.

Berdasarkan hasil wawancara dengan siswa SMA Kanisius Ambarawa,

menyatakan bahwa metode yang sering digunakan oleh pengajar adalah metode

konvensional di mana peserta didik lebih banyak mendengarkan penjelasan dari

guru di depan kelas dan melaksanakan tugas bila guru memberikan sedangkan

aplikasi yang sering digunakan oleh pengajar adalah aplikasi power point.

Observasi awal peneliti terhadap siswa kelas XI IPS di SMA Kanisius Ambarawa

menunjukkan bahwa seluruh siswa kelas XI di kelas tersebut menyatakan tidak

puas dengan metode mengajar yang dilakukan oleh para guru yang dianggap

monoton dan membosankan karena mereka hanya dituntut untuk mendengarkan

materi yang diberikan oleh pengajar sehingga membuat siswa kurang termotivasi

untuk belajar sedangkan aplikasi power point yang digunakan oleh pengajar

seringkali tampilannya kurang menarik dan membosankan. Didapatkan juga

pernyataan bahwa siswa merasa kesulitan pada mata pelajaran sejarah karena

banyak materi yang membicarakan sejarah masa lampau, para siswa merasa cepat

bosan ketika mendengar guru menyampaikan materi dan tidak dapat fokus dalam

menerima informasi yang diberikan oleh guru hal itu berdampak dengan hasil

nilai mereka pada mata pelajaran sejarah banyak dari siswa selalu melakukan

perbaikan nilai pada setiap tes yang dilakukan.

Aplikasi yang sering digunakan dalam proses pembelajaran sejarah antara

lain aplikasi berbasis flash, dimana aplikasi tersebut mempunyai fitur-fitur yang

dapat menarik perhatian para siswa untuk memperhatikan apa yang sedang

dijelaskan oleh para guru. Namun, aplikasi pembelajaran flash memiliki beberapa

kelemahan diantaranya pembuatan animasi pembelajaran yang cukup sulit,

menunya tidak user friendly, dalam menambah atau menghapus data

membutuhkan keahlian dalam pemprogaman, belum tersedia template

didalamnya. Hal ini menyulitkan pengguna pada saat ingin menggunakan aplikasi

pembelajaran flash mengingat pengguna belum tentu memiliki keahlian dalam hal

pemrograman.

Melihat permasalahan tersebut, maka diperlukan inovasi dari pengajar

dalam memberikan aplikasi pembelajaran yang menarik agar mampuh

membangkitkan minat siswa untuk belajar serta dapat membuat siswa dapat

menerima, memahami dan mengerti materi pembelajaran yang diberikan oleh

pengajar khususnya pada mata pelajan sejarah. Salah satu aplikasi pembelajaran

7

yang dapat digunakan oleh pengajar adalah aplikasi pembelajaran berbasis web.

Pada penelitian ini akan dibuat aplikasi pembelajaran khususnya dalam materi

sejarah tentang periodesasi pada zaman prasejarah, untuk mengetahui bagaimana

peran aplikasi pembelajaran secara spesisik dalam teknologi pendidikan serta

dapat meningkatkan minat siswa untuk belajar, dimana aplikasi akan dibangun

menggunakan fitur – fitur yang terdapat pada HTML5, sedangkan agar web dapat

berjalan dengan lebih dinamis dan iteraktif maka ditambahkan bahasa

pemrograman Hypertext Preprocessing (PHP). Pemilihan penggunaan HTML5

dalam membangun aplikasi karena dengan bantuan HTML5 memungkinkan

pengembangan aplikasi berbasis web yang tidak lagi bergantung sepenuhnya

kepada plugin karena untuk menanam video, audio, gambar berkualitas, grafik

dan banyak konten lainya tanpa menngunakan plugin dan progam pihak ketiga

sebagai fungsi dibangun ke browser.

2. Kajian Pustaka

Penelitian yang digunakan sebagai acuan dalam penelitian ini ada 2.

Penelitian terdahulu yang pertama dilakukan tahun 2010, yaitu pada penelitian

tersebut dilakukan pembuatan Aplikasi Pembelajaran Integral Berbasis Web.

Aplikasi ini menggunakan bahasa pemrograman PHP, MySQL sebagai database,

Dreamweaver, Macromedia Flash untuk animasi dan Photoshop sebagai desain

grafisnya. Aplikasi pembelajaran integral berbasis web ini terbagi menjadi dua

tampilan antarmuka yaitu antarmuka untuk umum dan antarmuka untuk admin.

[1].

Penelitian terdahulu dilakukan tahun 2014, yaitu pada penelitian tersebut

dilakukan pembuatan Membangun Media Pembelajaran Interaktif Berbasis Web

Untuk Anak Bergaya Belajar Visual Tingkat Sekolah Dasar. Agar media

pembelajaran terlihat menarik, maka aplikasi di bangun menggunakan teknologi

terbaru yaitu HTML5 dan metode pengembangan yang memadai. Metode

pengembangan perangkat lunak yang sesuai untuk perangkat lunak berbasis

multimedia adalah Multimedia Development Lifecycle (MDLC). Media

pembelajaran interaktif yang akan dibangun menggunakan HTML5, CSS3, dan

Javascript. Aplikasi ini dibuat dengan konsep multimedia interaktif sehingga

seseorang yang ingin belajar dapat memilih materi yang mereka ingin pelajari,

dalam penyampaian materi akan dikemas semenarik mungkin dan tidak

membosankan. Output dari tahap ini adalah mendefinisikan tujuan aplikasi,

kebutuhan sistem dan materi pembelajaran. [2].

Media dalam proses pembelajaran mempunyai peran sebagai alat perantara

dalam menyampaikan suatu informasi. kata media berasal dari bahasa latin yaitu

medium yang berati perantara. Media adalah berbagai jenis komponen dalam

lingkungan siswa yang dapat merangsangnya untuk belajar, jadi penggunaan

media sebagai perantara menyampaikan informasi antara guru dan siswa dalam

proses pembelajaran dapat mempengaruhi faktor internal siswa yaitu dalam hal

motivasi untuk belajar [3].

Pembelajaran adalah suatu kegiatan yang dilakukan secara sadar dan

sengaja. Tujuan pembelajaran bagi siswa supaya dapat memperoleh berbagai

pengalaman dan dengan pengalaman itu tingkah laku yang dimaksud meliputi

8

pengetahuan, ketrampilan, dan nilai atau norma yang berfungsi sebagai

pengendali sikap dan prilaku siswa. Tujuan pembelajaran menggambarkan

kemampuan atau tingkat penguasaan yang diharapkan dicapai oleh siswa setelah

mereka mengikuti suatu proses pembelajaran, jadi proses pembelajaran

merupakan proses melibatkan guru dengan semua komponen tujuan, bahan,

metode dan alat serta penilaian. Maka proses pembelajaran merupakan suatu

sistem yang saling terkait antar komponennya di dalam mencapai suatu tujuan

yang telah ditetapkan [4].

Web adalah sebuah aplikasi untuk menampilkan dokumen – dokumen

multimedia ( teks, gambar, animasi dan video ) didalamnya menggunakan

protokol HTTP dan untuk mengaksesnya menggunakan perangkat lunak yang

disebut browser. Browser adalah aplikasi yang mampu menjalankan dokumen-

dokumen web dengan cara diterjemahkan. Prosesnya dilakukan oleh komponen

yang terdapat didalam aplikasi browser yang biasa di sebut web engine [5].

Pembelajaran berbasis web merupakan salah satu kegiatan pembelajaran

yang memanfaatkan media situs yang kemudian dapat diakses melaui media

internet. Pembelajaran berbasis web adalah sebuah pengalaman belajar dengan

memanfaatkan jaringan internet untuk berkomunikasi dan menyampaikan

informasi pembelajaran [6].

Pembelajaran berbasis web seringkali mempunyai manfaat yang banyak

bagi peserta didiknya. Bila dirancang dengan baik dan tepat, maka pembelajaran

berbasis web bisa menjadi pembelajaran yang menyenangkan, memiliki unsur

interaktivitas yang tinggi menyebabkan peserta didik mengingat lebih banyak

materi pelajaran, serta mengurangi biaya operasional yang biasanya dikeluarkan

peserta didik untuk mengikuti pembelajaran [7]. Penelitian sejarah meliputi seluruh kehidupan manusia di masa lampau.

Masa lampau manusia meliputi masa sejak manusia pertama kali ada di bumi

sampai sekarang. Masa lampau manusia itu ada ketika yang meninggalkan bukti -

bukti tertulis dan ada yang tidak. Zaman prasejarah adalah zaman sebelum

manusia mengenal tulisan. Uraian mengenai kehidupan serta kebudayaan manusia

pada masa lampau sebelum ada bukti-bukti tertulis. Zaman prasejarah dibagi

menjadi dua yaitu zaman batu dan zaman logam. Zaman batu terjadi sebelum

logam dikenal dan alat-alat kebudayaan terutama dibuat dari batu di samping kayu

dan tulang. Zaman batu ini diperiodisasi lagi menjadi 4 zaman, antara lain zaman

batu tua (palaeolithicum), zaman batu madya (mesolithicum), zaman batu besar

(megalithicum), zaman batu muda (neolithicum) [8].

HTML ( Hyper Text Marcup Language ) dikembangkan pertamama kali

pada tahun 1989 oleh tim Bernes-lee. Bahasa skrip ini memungkinkan penyajian

informasi dalam bentuk teks dengan tautan yang bisa mengaitkan berbagai server.

HTML5 adalah pengembangan dari HTML yang dilakukan oleh badan lain yaitu

WHATMG ( Web Hypertext Application Technologi Working Group ) bahasa

skrip yang memungkinkan penyajian informasi dalam bentuk teks dengan tautan

yang bisa mengaitkan berbagai server. Pada HTML5 kekangan dalam menulis tag

dan atribut dalam menulis huruf kecil tidak ada lagi. Kita mempunyai kebebasan

untuk menggunakan huruf kecil, huruf kapital, atau kombinasinya. Bahkan nilai

suatu atribut mau diberi tanda petik atu tidak sama saja. Browser tidak lagi

9

memperdulikan hal-hal seperti itu. HTML5 menawarkan berbagai fitur menarik

yang tidak didukung oleh HTML sebelumnya. Berbagai fitur yang disediakan

HTML5 antara lain canvas, header, footer, time, audio dan video . Pada HTML5

membuat aplikasi tidak lagi tergantung sepenuhnya oleh plugin [9].

3. Metode dan Perancangan Sistem

Pada penelitian ini, akan dilakukan beberapa tahapan penelitian yang secara

garis besar terbagi ke dalam lima tahapan, yaitu : 1) Analisis kebutuhan dan

pengumpulan data dari narasumber. 2) Perancangan Sistem. 3) Perancangan

aplikasi. 4) Implementasi dan pengujian sistem, serta analisis hasil dari sistem. 5)

Penulisan laporan hasil penelitian [10]. Proses dari tahapan yang telah dilakukan

dalam penelitian ini dapat dilihat pada Gambar 1

Gambar 1 Tahapan Penelitian

Berdasarkan bagan pada Gambar 1 dapat dijelaskan bahwa tahapan

penelitian yang dilakukan adalah sebagai berikut Tahap pertama : analisis dan

pengumpulan kebutuhan dilakukan dengan melakukan pertemuan antara costumer

dan developer. Customer pada penelitian kali ini adalah seorang guru sejarah

SMA Kanisius Ambarawa yang sekaligus menjadi pembimbing lapangan dan

pengguna aplikasi pembelajaran ini. Sedangkan developer adalah peneliti sendiri

sebagai subjek yang melakukan penelitian. Pembahasan pada pertemuan awal

meliputi tujuan umum, kebutuhan yang sudah diketahui dan gambaran kebutuhan

yang akan diperlukan berikutnya. Tahap ini dilakukan dengan melakukkan

wawancara terhadap guru sejarah dan siswa SMA Kanisius Ambarawa hasilnya

didapatkan bahwa aplikasi dan metode yang selama ini digunakan pada

pembelajaran sejarah oleh guru tidak lagi dapat menarik perhatian para siswa

dikarenakan fitur-fitur yang tidak dapat di update dengan mudah. Tahap kedua,

ketiga dan keempat dilakukan perancangan Aplikasi Pembelajaran menggunakan

metode pengembangan sistem Prototype. Sedangkan tahap kelima dilakukan

penulisan laporan penelitian dan artikel ilmiah.

10

Dalam membangun sebuah sistem kita perlu merancang serta menganalisa

secara teliti apa saja yang perlu kita bangun atau kita perbaiki. Agar aplikasi yang

akan dibangun dapat memuaskan pengguna baik dalam hal kinerja aplikasi dan

tampilan yang disajikan oleh aplikasi. Dalam menganalisa sebuah sistem perlu

melibatkan komponen-komponen yang tergabung dalam hal ini siswa,

guru/admin, materi dan evaluasi. Supaya didapatkan sebuah sistem aplikasi

pembelajaran yang handal maka kita harus menganalisa secara menyeluruh dan

utuh untuk memberikan hasil yang baik.

Berdasarkan informasi yang di dapat melalui wawancara kepada guru

sejarah dan siswa di SMA Kanisius Ambarawa diperoleh untuk memenuhi

kebutuhan pengguna dalam penelitian ini adalah kebutuhan dari siswa dan guru.

Maka didapatkan bahwa dibutuhkan aplikasi yang dapat memenuhi kebutuhan

berikut. Kebutuhan guru mengharapkan aplikasi yang dapat menambah materi

sejarah, menghapus materi sejarah, dapat mengelola data user lain. Kebutuhan

siswa mengharapkan aplikasi yang menarik untuk dilihat serta dapat melihat

materi sejarah yang sedang diajarkan yaitu tentang periodesasi zaman prasejarah

dan dapat melihat video sejarah.

Analisis kebutuhan perangkat keras dan spesifikasi perangkat lunak yang

digunakan dalam membangun aplikasi pembelajaran ini yaitu: kebutuhan akan

perangkat keras sangat mendukung terlaksananya aplikasi media pembelajaran

perangkat keras yang dibutuhkan adalah Processor Intel Core i3, 220 GHz, RAM

2,00 GB, Hard Disk 500 GB, Input device (mouse dan keyboard), Output device

(Proyektor). Sedangkan kebutuhan akan perangkat lunak sangat mendukung

terlaksananya aplikasi pembelajaran perangkat lunak yang dibutuhkan adalah

Sistem Operasi Windows 7, Data Base MySQL, PHP designer 8, Paint, Browser

Mozilla Firefox, WampServer, Rational Rose untuk membuat UML sistem.

Perancangan sistem dalam penelitian ini dibuat dalam bentuk diagram

UML. Diagram UML meliputi diagram use case, diagram activity dan diagram

sequence. Berikut ini akan dijelaskan masing-masing diagram yang telah dibuat.

Gambar 2 Use Case Diagram Sistem

11

Gambar 2 merupakan diagram use case dari aplikasi yang dibuat. Terdapat

3 (tiga) aktor dalam aplikasi, yaitu admin, user dan pengunjung. Admin memiliki

hak tertingi yaitu dapat mengelola galeri dan mengelola user. Hak akses user

dapat mengelola galeri. Sedangkan pengunjung memiliki use case melihat

berbagai menu yang terdapat pada aplikasi media pembelajaran sejarah.

Gambar 3 Activity Diagram Tambah Data

Gambar 3 merupakan diagram activity untuk proses tambah data galeri yang

dilakukan oleh admin. Admin memilih menu upload pada halaman admin. Admin

selanjutnya mengisi data gambar yang akan ditambahkan. Data gambar ini berupa

judul, keterangan dan gambar. Data gambar selanjutnya akan disimpan dalam

basis data.

Gambar 4 Diagram Activity Tambah User Gambar 4 merupakan diagram activity untuk proses tambah user yang dilakukan

oleh admin. Admin memilih menu tambah user pada halaman admin. Admin

selanjutnya mengisi data user yang akan ditambahkan. Data user yang ditambah

berupa pass, status dan nama. Data user selanjutnya akan disimpan dalam basis

data.

12

Gambar 5 Sequence Diagram Tambah Data Galeri

Gambar 5 merupakan diagram sequence untuk proses tambah data galeri

yang dilakukan oleh admin. Pada sequence diagram admin mengisi data gambar

yang akan ditambahkan pada form upload, data yang diberikan berupa judul,

keterangan dan gambar yang disisipkan. Kontrol akan mengecek data yang

ditambahkan kemudian diteruskan ke database. Database akan menyimpan data

yang diberikan kemudian mengirimkan pesan kepada controler untuk diteruskan

kepada admin bahwa data telah tersimpan berhasil tersimpan,

Gambar 6 Sequence Diagram Tambah User

Gambar 6 diagram sequence untuk proses tambah user yang dilakukan oleh

admin. Pada sequence diagram admin mengisi data user yang akan ditambahkan

pada form tambah user data yang diberikan berupa pass, status dan nama. Kontrol

akan mengecek data yang ditambahkan kemudian diteruskan ke database.

Database akan menyimpan data yang diberikan.

Dalam proses evaluasi, ada beberapa hal yang akan dibahas diantaranya apa

bahan evaluasi, proses evaluasi, ketika evaluasi diadakan, mengapa harus ada

13

evaluasi, di mana proses evaluasi diadakan dan pihak yang terlibat. Evaluasi

tersebut perlu dilakukan untuk menghindari kesalahan perhitungan dalam

membangun aplikasi pembelajaran. Kesalahan tersebut dapat mengakibatkan

ketidak puasan pengguna dalam pemakaian aplikasi agar kesalahan tersebut tidak

terjadi maka diperlukan proses evaluasi yang jelas.

Model proses yang digunakan dalam penelitian kali ini adalah prototype

modeling, karena dalam pembuatan aplikasi pembelajaran ini pengguna aplikasi

terlibat langsung dalam proses perancangan aplikasi dengan melakukan

komunikasi yang intensif dengan pengguna aplikasi. Metode ini dilakukan secara

bertahap, yaitu setelah kebutuhan sistem terpenuhi maka tahap selanjutnya adalah

merancang prototype sistem. Perancangan mewakili keseluruhan aspek yang

sudah diketahui dan rancangan ini menjadi dasar dalam pembuatan prototype.

Customer mengevaluasi prototype yang telah dibuat dan digunakan untuk

memperjelas kebutuhan software. Ketiga proses diatas diulang secara terus

menerus sampai kustomer merasa puas dengan prototype yang telah dibuat.

Ketika customer telah merasa puas maka kebutuhan sistem telah tergambarkan

seluruhnya dan sistem siap dikembangkan menjadi perangkat lunak Prototype

yang telah diterima dari costumer dikembangkan dan disempurnakan menjadi

software. Software dibangun mengunakan php. Software yang dibangun berfungsi

sebagai aplikasi pembelajaran sejarah pada zaman batu untuk pelajar tingkat SMA

dimana dalam aplikasi media pembelajaran tersebut pelajar dapat melihat

gambaran umum pada zaman batu tersebut baik dalam bentuk tulisan, gambar dan

video [11].Tahapan yang telah di lalui dapat di lihat pada alur Gambar 2.

Gambar 7 Metode Prototyping [11]

Proses evaluasi prototyping dilakukan sebanyak dua kali dan dilakukan

dengan mendemokan aplikasi kepada pengguna aplikasi (guru dan siswa).

Penjelasan setiap tahap evaluasi prototyping adalah sebagai berikut : Evaluasi

pertama dilakukan dengan siswa dan guru SMA Kanisius Ambarawa. Pada

evaluai ini dilakukan pembangunan fitur-fitur yang akan dibangun pada aplikasi

pembelajaran sejarah bedasarkan hasil wawancara yang telah dilakukan untuk

merancang halaman home, halaman sejarah, halaman video dan halaman bantuan.

Hal ini berguna untuk memuaskan pengguna dalam penggunaan aplikasi

pembelajaran tersebut setelah hasil perancangan diserahkan kepada pengguna dan

pengguna merasa puas maka evaluasi masuk ketahap berikutnya. Evaluasi tahap

14

kedua dilakukan dengan memperbaiki kerja sistem yang masih belum valid seperti

data belum dapat mucul pada halaman galeri dan mengubah tampilan data agar

lebih rapi dan aplikasi dapat berjalan dengan sempurna.

4. Hasil Implementasi dan Pembahasan

Implementasi dari pembuatan aplikasi pembelajaran sejarah ini dibangun

menggunakan fitur yang terdapat pada HTML5 dan bahasa pemrograman PHP.

Terdapat beberapa pengaturan yang harus dilakukan pertama kali saat pembuatan,

yaitu pengaturan koneksi ke basis data MySQL. Pengaturan koneksi basis data

dilakukan pada file database yang terletak pada folder config. Pengaturan ini

ditunjukkan pada Kode Program 1. Kode Program 1 Koneksi ke database MySQ

Kode Program 1 merupakan perintah untuk melakukan pengaturan koneksi

untuk menghubungkan ke basis data MySQL. Pada pengaturan ini dilakukan

pengisian untuk hostname, username, password, dan nama dari basis data yang

digunakan. Sedangkan pengaturan untuk folder penyimpanan data berupa gambar

ditunjukkan pada Kode Program 2. Kode Program 2 Pengaturan tempat penyimpanan data gambar

Kode Program 2 berfungsi untuk tempat menyimpan data gambar yang

telah berhasil diupload. Baris ke 1 menunjukkan tempat dan nama folder gambar

yang akan disimpan sedangkan baris ke 2 menunjukkan alamat file gambar yang

telah disimpan.

Gambar 8 Halaman Home Aplikasi Pembelajaran Sejarah

1.$server = 'localhost';

2.$user = 'root';

3.$password = '';

4.$db = 'galeri';

1. $dir_gambar = 'C:\xampp\htdocs\skripsi percepatan\gambar\\';

2. $url_folder_gambar = 'http://localhost/skripsi percepatan/gambar/';

15

Gambar 8 merupakan halaman yang akan muncul pertama kali ketika

aplikasi pembelajaran ini dijalankan pada halaman utama terdapat 4 tombol menu

utama yaitu: tombol home digunakan untuk melihat sebagian isi dari aplikasi

pembelajaran ini, tombol sejarah didalam tombol sejarah terdapat menu dropdown

prasejarah yang didalamnya terdapat 4 pembagian zaman prasejarah, tombol

video digunakan untuk melihat video mengenai zaman prasejarah, tombol

Bantuan digunakan untuk melihat cara menggunakan aplikasi pembelajaran ini.

Gambar 9 Halaman Sejarah

Gambar 9 Merupakan halaman sejarah terdapat menu pembagian zaman

prasejarah berdasarkan kebudayaannya yaitu zaman palaeolithicum,

mesolithicum, neolithicum , megalithicum. Pada setiap menu user dapat melihat

informasi yang berhubungan dengan zaman tersebut baik tentang kebudayaan,

alat-alat yang dipakai dan jenis manusia purba yang ditemukan pada zaman

tersebut.

Gambar 10 Halaman Lihat Galeri

Untuk menampilkan data yang telah di upload pada Gambar 10,

mengunakan fungsi pemanggilan data yang terdapat pada database dengan fungsi

while dan untuk menampilkan gambar yang sudah tersimpan dalam folder.

16

Kode Program 3 Fungsi while dalam pengambilan data

Penggunaan while dimaksudkan agar data dapat secara otomatis

ditampilkan pada saat data berhasil di upload secara berurutan dimulai dari data

yang pertama kali di upload dan sistem view hanya mengikuti perintah untuk

mengambik data berdasarkan id yang telah ditentukan.

Gambar 11 Halaman Hapus Data Galeri

Pada sistem ini admin juga dapat menghapus data yang sudah tidak di

inginkan agar data tersebut tidak akan lagi di simpan dalam database MySQL.

Gambar 11 merupakan gambar halaman web untuk menghapus data yang di pilih,

admin juga dapat menambah data pada galeri melalui halaman upload data yang

dapat diakses melalui halaman admin. Proses ini membutuhkan validasi login ke

dalam halaman admin

Gambar 12 Halaman Untuk Mengupload Data Galeri

1. while( $rows = mysql_fetch_row($query)):

2. php echo $rows[1] ; ?>

3. <img src="<?php echo $url_folder_gambar . $rows[2];?>"

width="100" />

4. hp echo $rows[3]; ?> 1.

17

Penambahan halaman upload ini dilakukan agar admin tidak perlu lagi

membuka halaman pada PHP MyAdmin untuk menambahkan data baru pada

database. Form untuk mengupload data ditunjukkan oleh Gambar 12.

Gambar 13 Halaman Video

Kode Program 4 Fungsi Auto Play Untuk Memutar Video

Menanyangkan video pada halaman web menggunakan tag yang terdapat

pada HTML5 untuk menampilkan video pada halaman web dapat

menggunakan tag yang tersedia pada HTML5 yaitu tag <video>. Halaman video

dapat digunakan oleh user untuk melihat video yang sudah dipersiapkan oleh

admin video dapat diputar dengan mudah oleh user hanya dengan menekan

tombol play dan secara otomatis video akan diputar, proses penambahan video

dilakukan dengan menambahkan langsung pada kode php sehingga tidak

diperlukan database untuk menyimpan data video. Halaman video ditunjukkan

oleh Gambar 13

Gambar 14 Halaman Tambah User

1. <video height="450" width="700 "

2. src="video/kubur_batu.mp4"

3.controls="controls">

4.</video>

18

Halaman Tambah User dapat digunakan oleh admin untuk menambahkan

user pada database. User dapat melakukan hapus data data, update galeri,

Halaman Tambah User ditunjukkan oleh Gambar 14.

Gambar 15 Halaman Untuk Mengelola Bantuan

Gambar 15 merupakan halaman untuk membantu user dalam memahami

penggunaan aplikasi pembelajaran sejarah tersebut, halaman bantuan berisi

petunjuk penggunaan. Dengan adanya halaman bantuan ini diharapkan user dapat

melihat ringkasan data yang terdapat pada aplikasi pembelajaran dan fungsi dari

masing- masing menu yang terdapat pada aplikasi pembelajaran.

Pengujian aplikasi dilakukan dengan menguji fungsi-fungsi dari aplikasi

yang telah dibuat untuk mencari kesalahan/bug pada sistem Dengan pengujian

black box,pada aplikasi pembelajaran sejarah dapat dilakukan untuk menguji

sistem saat input dengan klik icon maupun button dan output yang dihasilkan

sesuai yang diharapkan.

Teknik pengujian black-box berfokus pada domain informasi dari

perangkat lunak, dengan melakukan test case dengan mempartisi domain input

dari suatu program dengan cara yang memberikan cakupan pengujian yang

mendalam. Pengujian black box didesain untuk mengungkap kesalahan pada

persyaratan fungsional tanpa mengabaikan kerja internal dari suatu program.

Tabel 1 adalah hasil pengujian dari aplikasi yang telah dilakukan.

Tabel 1 Hasil Pengujian Blackbox

Fungsi yang diuji Kondisi Output yang

diharapkan

Output yang

dihasilkan system

Status

Pengujian

Login Username dan password

benar

Username dan password salah maupun kosong

User dan Password salah

satu salah

Sukses login

Gagal login

Gagal login

Sukses login

Gagal login

Gagal login

Valid

Upload data Penanbahan data yang

baru pada tabel

Form diisi beberapa atau kosong

Sukses tambah data

Gagal tambah data

Sukses tambah data

Gagal tambah data

Valid

Memutar video Ketika user memutar video Video sukses diputar Video sukses di putar Valid

Hapus data Menghapus data yang di pilih

Sukses hapus data Sukses hapus data Valid

19

Berdasarkan pengujian yang dilakukan pada aplikasi web dapat dilihat

status pengujian dari setiap fungsi valid, maka disimpulkan bahwa aplikasi ini

berjalan dengan baik dan sesuai yang diharapkan. Pengujian eksternal dilakukan

untuk mengetahui respon user terhadap software Aplikasi Pembelajaran Sejarah

ini. Responden akan diberi 20 soal pertanyaan, data dan nilai dari responden dapat

dilihat pada Tabel 2 dan Tabel 3.

Tabel 2 Hasil dan Nilai Siswa Dengan Metode Konvensional

No Nama Siswa Nilai 1 Antonius 70

2 Aprilliani 76

3 Bambang 66 4 Dewi 70

5 Eka 56

6 Eti 80 7 Fega 66

8 Hestomo 60

9 Heti 73 10 Istiana 70

11 Nanang 53

12 Rosi 66 13 Catur 66

14 Weni 70

15 Yudha 73 16 Donati 73

17 Deni 66

18 Afdhol 60

19 Fitri 76

20 Rafika 70

Tabel 3 Hasil dan Nilai Siswa Dengan Aplikasi Pembelajaran Sejarah

No Nama Siswa Nilai 1 Antonius 86

2 Aprilliani 86 3 Bambang 76

4 Dewi 76

5 Eka 76 6 Eti 83

7 Fega 83

8 Hestomo 76 9 Heti 83

10 Istiana 86

11 Nanang 76 12 Rosi 70

13 Catur 83

14 Weni 80 15 Yudha 83

16 Donati 83 17 Deni 76

18 Afdhol 80

19 Fitri 86 20 Rafika 83

Pengujian ini dilakukan dengan Pre Test memakai sistem konvensional

dan siswa yang di tes sejumlah 20 siswa dengan jumlah soal 20 dan Pengujian

dilakukan dengan setelah menggunkan Software Aplikasi Pembelajaran Sejarah

dan siswa yang di tes sejumlah 20 siswa dengan jumlah soal 20 sample user pada

pengujian ini adalah siswa SMA Kanisius Ambarawa.

20

Pengujian keberhasilan responden dengan metode perbandingan antara

sistem pembelajaran konvensional dengan sistem aplikasi pembelajaran berbasis

web kemudian di evaluasi dengan nilai maksimum 100.

Dari penelitian sistem pembelajaran konvensional yang dilakukan dengan

jumlah 20 soal dengan 20 responden dilakukan tes kemampun dengan sistem

konvensioan. Diperoleh jumlah nilai siswa 1360 dengan nilai rata-rata 1360/20

adalah 68 dan dari 20 soal dengan 20 responden dilakukan tes kemampun dengan

sistem Aplikasi pembelajaran Sejarah dengan fitur HTML5. Evaluasi diperoleh

jumlah nilai siswa 1618 dengan nilai rata-rata 1618/20 adalah 80,9.

Analisis hasil tes kemampuan dengan sistem konvensional dibandingkan

dengan sistem aplikasi pembelajaran berbasis web ada peningkatan hasil sebesar

12,9 dengan demikian perangkat bantu Aplikasi Pembelajaran Sejarah yang

dibangun dengan fitur HTML5 menunjukkan peningkatan hasil nilai sehingga

sistem pembelajaran dengan aplikasi pembelajaran media web tersebut lebih baik

dalam meningkatkan minat belajar responden daripada sistem pembelajaran

konvesional.

5. Simpulan

Dari hasil pengujian terhadap responden menunjukkan bahwa perangkat

bantu Aplikasi Pembelajaran Sejarah untuk SMA Kelas XI ini dapat diterima oleh

user dengan baik. Hal ini sesuai dengan fakta-fakta pengujian yang dapat

simpulkan bahwa dari hasil wawancara yang dilakukan kepada responden

terhadap kebutuhan sistem, maka aplikasi mempunyai semua kebutuhan

responden tersebut . Artinya dari sisi keunggulan aplikasi ini layak dipergunakan

sebagai alternatif sumber belajar yang mempunyai unsur edukatif untuk

memenuhi kebutuhan user.

Hasil pengujian dari evaluasi pre test yang diberikan terhadap 20 responden

diperoleh jumlah nilai siswa 1360 dengan nilai rata-rata 1360/20 adalah 68.

Sedangkan dari hasil evaluasi pre test yang di berikan terhadap 20 responden

diperoleh jumlah nilai siswa 1618 dengan nilai rata-rata 1618/20 adalah 80,9. Dari

hasil tersebut di atas di dapat peningkatan pemahaman materi sebesar 12,9%.

Artinya tingkat penguasaan konsep pemahaman siswa dengan aplikasi

pembelajaran sejarah yang diajarkan oleh sistem pembelajaran ini cukup baik dan

merata diserap oleh user.

Kelebihan dari sistem ini yang tidak ada pada sistem konvensional adalah

memberikan kemudahan bagi siswa untuk memulai belajar dan menyediakan

sistem multimedia interaktif yang berkaitan dengan pemahaman materi, sehingga

cukup interaktif, menarik, efisien, efektif dan bermakna untuk dipelajari, melalui

sistem ini siswa memainkan peranan yang lebih aktif dalam pembelajarannya.

Siswa dapat memilih waktu, materi kapan saja dan sesuka hatinya. Bahkan siswa

dapat belajar materi yang sulit berulang-ulang sehingga pemahaman dapat

dicapai.

6. Pustaka

[1] Juwairah, 2010, Aplikasi Pembelajaran Intergal Berbasis Web.

21

[2] Restu, Amalia. Et al. 2014, Membangun Media Pembelajaran Interaktif

Berbasis Web Untuk Anak Bergaya Belajajar Visual Tingkat Sekolah

Dasar.

[3] Sadiman, Arief S. (dkk). 2008. Media Pendidikan: Pengertian,

Pengembangan, dan Pemanfaatanya. Jakarta: PT Grafindo Persada.

[4] Achmad Sugandi. 2000. Teori Pembelajaran. Bandung: PT. Remaja

Rosdakarya.

[5] Abdul Kadir, 2013. From Zero to A Pro. HTML5. Yoyakarta: CV. ANDI.

[6] Rusman. 2012. Belajar dan Pembelajaran Berbasis Komputer. Bandung:

Alfabeta.

[7] Rusman, dkk. 2013. Pembelajaran Berbasis Teknologi Informasi dan

Komunikasi Mengembangkan Profesionalitas Guru. Jakarta: Rajawali Pers.

[8] Wurjantoro, Edhie, 1996. Sejarah Nasional Indonesia dan Umum. Jakarta:

Debdikbud.

[9] Abdul Kadir, 2013. From Zero to A Pro. HTML5. Yoyakarta: CV. ANDI.

[10] Hasibuan, Zainal A. 2007. Metodologi Penelitian Pada Bidang Ilmu

Komputer dan Teknologi Informasi : Konsep, Teknik, dan Aplikasi. Jakarta

: Ilmu Komputer Univesitas Indonesia.

[11] Pressman, R.S, 2001, Software Engineering : A Practitioner’s Approach,

Amerika Serikat : R.S. Pressman and Associates.