laporan skripsi media pembelajaran ghorib …jurnal.stmikelrahma.ac.id/assets/file/ahmad budi...
TRANSCRIPT
LAPORAN SKRIPSI
MEDIA PEMBELAJARAN GHORIB DAN MUSYKILAT
BERBASIS MULTIMEDIA PADA TPQ BAITURROHMAN
Disusun Oleh
Nama : Ahmad Budi Purwanto
Nomor Mahasiswa : 12090688
Program Studi : Teknik Informatika
Jenjang : Strata 1
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN ILMU KOMPUTER
EL RAHMA
YOGYAKARTA
2013
INTISARI
MEDIA PEMBELAJARAN GHORIB DAN MUSYKILAT
BERBASIS MULTIMEDIA PADA TPQ BAITURROHMAN
Oleh
Ahmad Budi Purwanto
12090688
Al Quran memiliki peran penting dalam kehidupan manusia sedangkan ilmu tentang
membaca Al Quran yang baik dan benar tidak cukup hanya dengan mempelajari ilmu
tajwid yang contoh bacaannya sudah banyak ditemukan di masyarakat, tetapi juga
harus mengerti bacaan penting lainnya dalam Al Quran yaitu ghorib dan musykilat
dimana bacaan yang ada di dalamnya tidak sesuai dengan tulisannya dan harus
berhati-hati ketika membacannya.
Penelitian ini bertujuan untuk memberikan penjelasan kepada para santri tentang
materi yang mengandung bacaan-bacaan ghorib dan musykilat dalam Al Quran. Hal
ini ditampilkan dalam bentuk multimedia berupa teks, gambar dan suara mengenai
keterangan dan cara membacanya untuk memberikan kemudahan kepada para murid
dalam memahami materi yang disampaikan. Dalam media pembelajaran ini juga
terdapat evaluasi untuk mengetahui sejauh mana kemampuan seorang santri dalam
memahami materi-materi yang ada.
Media pembelajaran ghorib dan musykilat ini berbasis multimedia dan dibuat
menggunakan perangkat lunak yakni Adobe Flash CS5. Data yang ada dalam media
pembelajaran ini bersifat dinamis yakni terkoneksi database sehingga datanya bisa
diubah sewaktu-waktu dan untuk menggunakannya terlebih dahulu harus
mengaktifkan localhost dan MySQL pada komputer.
Kata kunci: ghorib, musykilat, media pembelajaran, multimedia.
1. Latar Belakang Masalah
Al Qur’an merupakan kalamullah yang diturunkan kepada Nabi Muhammad
SAW melalui Malaikat Jibril secara mutawatir serta membacanya adalah ibadah. Al-
Qur’an berisi ilmu pengetahuan, hukum-hukum, kisah-kisah, falsafah, akhlak,
peraturan-peraturan yang mengatur tingkah laku dan tata cara hidup manusia baik
sebagai makhluk individual maupun sosial, serta menjadi petunjuk bagi penghuni
langit dan bumi.
Mengingat begitu pentingnya Al Quran dalam kehidupan manusia, maka belajar
membaca, memahami, menghayati, dan mengamalkan isi kandungan Al Quran dalam
kehidupan sehari-hari adalah sebuah kewajiban bagi seorang muslim. Firman Allah
dalam QS. Al Muzzammil (73):4, “Dan bacalah Al Quran itu dengan tartil”.
Membaca Al Quran dengan baik dan benar sebagaimana Al Quran diturunkan adalah
kewajiban setiap muslim. Akan tetapi kenyataannya masih banyak anak-anak, orang
dewasa, bahkan orang tua yang belum bisa membaca Al Quran dengan benar. Beberapa
faktor penyebabnya antara lain metode pengajaran yang kurang tepat, guru yang
kurang memadai, media pembelajaran yang kurang mendukung atau pribadi itu
sendiri yang kurang menyadari pentingnya belajar Al Quran.
Perkembangan ilmu pengetahuan dan teknologi mempunyai dampak positif
terhadap berbagai bidang kehidupan, tak terkecuali untuk pembelajaran Al Quran.
Dengan sarana komputer di bidang pendidikan akan sangat membatu para kalangan
pengajar untuk menyampaikan pengajaran kepada para santrinya. Dengan adanya
tampilan grafis dan audio, komputer menjadi salah satu media pembelajaran yang
menarik dan mempermudah bagi santri untuk belajar Al-Qur an.
Ilmu bagaimana membaca Al Quran yang baik dan benar tidak cukup hanya
dengan mempelajari ilmu tajwid yang contoh bacaannya sudah banyak ditemukan di
masyarakat, tetapi juga harus mengerti bacaan penting lainnya dalam Al Quran yaitu
ghorib dan musykilat. Dalam materi ghorib dan musykilat dijelaskan tentang bacaan-
bacaan Al Quran yang tidak sesuai dengan tulisannya dan bacaan-bacaan yang harus
berhati-hati ketika membacanya. Banyak lafal dalam ayat-ayat Al Quran yang aneh
bacaannya. Maksud aneh adalah ada beberapa bacaan tulisan di dalam Al Quran yang
tidak sesuai dengan kaidah aturan membaca yang umum atau yang biasa berlaku
dalam kaidah bacaan bahasa arab.
Taman pendidikan Al Quran sebagai lembaga pendidikan yang mengajarkan
ilmu membaca Al Quran ternyata tidak semuanya lembaga tesebut telah mengajarkan
materi ghorib dan musykilat secara khusus. Beberapa taman pendidikan Al Quran
yang telah menggunakan metode pembelajaran yang tepat memang telah menerapkan
materi tersebut ke dalam kurikulumnya, namun hal itu hanya sebatas buku sebagai
media pembelajarannya. Seperti halnya yang terjadi pada Taman Pendidikan Al
Quran (TPQ) Baiturrohman, minimnya jumlah pengajar yang berkompeten dan
kurangnya media pembelajaran yang memadai menjadi faktor utama pendidikan
kurang berjalan dengan baik dan kualitas pengajaran yang semakin menurun. Tak
terkecuali dengan pengajaran materi ghorib dan musykilat dimana materi yang ada di
dalamnya banyak dijumpai bacaan-bacaan yang sulit untuk dimengerti, dilafalkan,
dan dihafalkan sehingga tidak sedikit santri yang mengalami kesulitan dalam
mempelajarinya. Hal tersebut tentunya akan menguras pikiran para santri dalam
belajar agar mampu menguasai semua materinya dengan baik. Media pembelajaran
yang memadai, menyenangkan dan bisa mempermudah santri sangat dibutuhkan
dalam mempelajari materi ghorib dan musykilat yang bermacam-macam bacaan,
keterangan, dan cara membacanya, akan tetapi hal tersebut belum tersedia disana,
sehingga kegiatan pembelajaran tersebut terasa sulit dan menjenuhkan bagi santri.
Berdasarkan latar belakang diatas, maka perlu adanya sebuah media
pembelajaran yang menarik dan mempermudah para santri untuk mempelajari
bacaan-bacaan ghorib dan musykilat dalam Al Quran serta mengetahui bagaimana
cara membacanya dengan baik dan benar. Oleh karena itu dalam penelitian kali ini
mengangkat judul “Media Pembelajaran Ghorib dan Musykilat Berbasis Multimedia
pada TPQ Baiturrohman”.
2. Landasan Teori
2.1 Pengertian Ghorib
Lafal gharib berasal dari bahasa Arab, yakni bentuk jamak dari gharibah yang
berarti asing atau sulit pengertiannya. Apabila dihubungkan dengan Al Qur’an maka
yang dimaksudkan adalah ayat-ayat Alqur’an yang yang sukar pemahamannya
sehingga hampir-hampir tidak dimengerti. (Baidan, 2005:267).
Banyak lafal dalam ayat-ayat Alqur’an yang aneh bacaannya. Maksud aneh
adalah ada beberapa bacaan tulisan Alqur’an yang tidak sesuai dengan kaidah aturan
membaca yang umum atau yang biasa berlaku dalam kaidah bacaan bahasa arab. Hal
ini menunjukkan adanya keistimewaan Alqur’an yang mengandung kemukjizatan
yang sangat tinggi, disinilah letak kehebatannya sehingga kaum sastrawan tidak
mampu menandinginya. Dari segi tulisan, mushaf yang kita terima ini tidak ada
masalah karena telah dipersatukan tulisannya oleh khalifah Usman. (Khan, 2008:100)
Hamzah (2003) berpendapat bahwa Gharib Al Qur'an adalah ilmu Al Qur’an
yang membahas mengenai arti kata dari kata-kata yang ganjil dalam al Qur’an yang
tidak biasa digunakan dalam percakapan sehari-hari. Sedangkan menurut Korcab
Metode Qiroati Kebumen (2003) dalam memudahkan pemahaman kepada santri
memberikan pengertian bahwa gharib adalah bacaan Al Quran yang tidak sesuai
antara tulisan dan cara membacanya, seperti tulisannya (Dibaca MAJREEHAA).
Sedangkan bacaan musykilat dalam Al Quran adalah bacaan yang harus hati-hati
dalam membacanya, seperti .
Menurut Baidan (2005:267) banyak faedah yang dapat dipetik dengan
mengetahui dan mempelajari ayat-ayat yang gharib antara lain sebagai berikut:
a. Mengundang tumbuhnya penalaran ilmiah. Artinya, mempelajari ayat-ayat yang
sulit dalam pemahamannya itu akan melahirkan berbagai upaya guna
memahaminya.
b. Mengambil perhatian umat. Dengan diketahuinya ke-gharib-an ayat-ayat Al quran,
maka terasa mendalam ketinggian bahasa yang dibawa oleh Al quran.
c. Memperoleh keyakinan eksistensi Al quran sebagai kalam ilahi. Dengan diketahui
maksud yang terkandung dalam ayat-ayat gharibat, maka akan diperoleh suatu
pemahaman yang mendalam dari ayat tersebut.
2.2. Media Pembelajaran
Kata media merupakan bentuk jamak dari kata medium yang dapat didefinisikan
sebagai perantara atau pengantar terjadinya komunikasi dari pengirim menuju
penerima. Menurut Association of Education and Communication Technology
(AECT) yang dikutip oleh Rohani (1997: 2) media adalah segala bentuk yang
dipergunakan untuk proses penyaluran informasi. Sedangkan menurut Arief
S.Sadiman (2003:6), pengertian media adalah perantara atau penghantar pesan dari
pengirim kepada penerima pesan. Menurut Azhar Arsyad (2003:3) yang mengutip
dari pendapat Gertach dan Ely, mengatakan bahwa media apabila dipahami secara
garis besar adalah manusia atau materi maupun kejadian yang membangun kondisi
yang membuat peserta didik mampu memperoleh pengetahuan, ketrampilan, atau
sikap.
Menurut Daryanto (2011:4), pada hakekatnya, proses belajar mengajar adalah
proses komunikasi, penyampaian pesan dari pengantar ke penerima. Pesan berupa isi
atau ajaran yang dituangkan ke dalam simbol-simbol komunikasi baik secara verbal
maupun nonverbal. Proses tersebut dinamakan encoding. Penafsiran simbolsimbol
komunikasi tersebut oleh peserta didik dinamakan decoding. Menurut Oemar
Hamalik (2008:154) belajar adalah perubahan tingkah laku berkat latihan dan
pengalaman. Belajar dalam hal ini harus dilakukan dengan sengaja, direncanakan
sebelumnya dengan struktur tertentu, agar proses belajar dan hasil-hasil yang dicapai
dapat dikontrol secara cermat.
Menurut Gagne dalam Arief S. Sadiman (2003:6) menyatakan bahwa media
pembelajaran adalah berbagai jenis komponen dalam lingkungan peserta didik yang
dapat merangsangnya untuk belajar. Sementara itu pendapat dari Briggs dalam Arief
S. Sadiman (2003:6) menyatakan bahwa media pembelajaran adalah segala alat fisik
yang dapat menyajikan pesan serta merangsang peserta didik untuk belajar,
contohnya adalah: buku, film, kaset, film bingkai.
Dari pendapat di atas dapat disimpulkan bahwa media pembelajaran merupakan
segala sesuatu yang bisa digunakan oleh seseorang untuk menyalurkan pesan dari
seseorang pengirim kepada penerima sehingga dapat merangsang fikiran, perasaan,
minat dan perhatian peserta didik sehingga terjadi proses belajar.
2.3. Multimedia
2.3.1.Sejarah Multimedia
Sejarah multimedia berawal dari teater, bukan komputer. Pertunjukan yang
memanfaatkan lebih dari satu medium disebut pertunjukan multimedia. Pertunjukan
multimedia mencakup monitor video, synthesized band dan karya seni manusia
sebagai bagian dari pertunjukan sistem multimedia dimulai akhir 1980-an dengan
diperkenalkan hyperard oleh apple tahun 1987, dan pengumuman oleh IBM tahun
1989 mengenai perangkat lunak audio visual connection (AVC), video adhapter card
bagi PS, hampir setiap pemasok perangkat keras dan lunak melompat ke multimedia.
Pada tahun 1994, diperkirakan ada lebih dari 700 produk dan sistem multimedia di
pasaran. (Suyanto, 2004)
2.3.2. Definisi Multimedia
Industri elektronika multimedia merupakan kombinasi dari komputer dan video
atau secara umum merupakan kombinasi tiga elemen yaitu suara, gambar, dan teks
atau multimedia kombinasi dari paling sedikit media input atau output dari data,
media ini dapat berupa audio (suara, musik), animasi, video, teks, grafik dan gambar.
(Suyanto, 2004).
2.3.3. Komponen Multimedia
Teks
Teks adalah elemen paling awal dan sederhana dalam multimedia, yang biasanya
mengacu pada kata, kalimat dan alenia atau segala sesuatu yang tertulis atau
ditayangkan. Sebagian besar multimedia menggunakan teks karena teks sangat efektif
untuk menyampaikan ide dan panduan kepada pengguna. Teks merupakan bentuk
data multimedia yang paling mudah disimpan dan dikenali, serta file teks merupakan
struktur yang sederhana. (Suyanto, 2003).
Gambar
Menurut Suyanto (2003) format file gambar yang digunakan dalam
multimedia terdiri dari :
a. PICT
Merupakan format file default Macintosh yang mampu untuk membuat objek
yang digambar secara bitmap maupun vektor.
b. BMP
Merupakan file format default Windows. Format ini mendukung RGB, Indexed
Colour, Grayscale dan Bitmap colour mode tetapi tidak mendukung alpha channel.
c. JPEG (Joint Photographic Experts Group)
Format grafik yang terkompresi, digunakan dalam tampilan foto dan gambar
secara kontinue, dapat mengendalikan kedalaman warna serta mempunyai
ukuran yang relatif kecil.
d. GIF (Grafic Interchange File)
Format file yang terkompresi yang dikembangkan oleh CompuServe.
e. TIFF (Tagged Interchange File Format)
Format file terkompresi yang digunakan di paket desktop publishing.
Kekuatan dari format ini adalah lebih fleksibel dari format gambar bitmap
yang didukung secara ritual oleh seluruh point, image editing dan aplikasi
kedalaman layout.
f. EPS (Encapsulated Post Script)
Merupakan format file yang digunakan dalam photoshop dapat memuat baik
gambar vektor maupun grafik.
g. PNG (Portable Network Graphics)
Merupakan format file terkompresi untuk menampilkan gambar pada World
Wide Web, mempunyai kemampuan menampilkan gambar 24 bit dan
menghasilkan latar belakang secara transparan.
h. PSD
Merupakan format file yang digunakan photoshop untuk menyimpan file
yang dibuat dan dimanipulasi. File PSD tidak dikompresi dan memuat
informasi tentang berbagai graphics layer yang ada tanpa sebuah file.
Animasi
Menurut Dhani (2003) animasi merupakan susunan gambar mati yang
dibuat efek sehingga seolah-olah tampak bergerak. Perbedaan movie dengan
animasi adalah animasi merupakan proses kejadiannya sedangkan movie
merupakan proses hasilnya.
Audio
Menurut Suyanto (2003) Format-format file suara (audio) terdiri dari:
a. MP3 (MPEG Audio Player 3)
File audio yang digunakan suatu codec untuk melakukan encoding dan decoding
suatu rekaman musik, dengan ekstensi *.mp3.
b. MIDI (Musical Instrument Digital Interface)
File audio yang digunakan untuk menyimpan instrument musik dengan
ekstensi *.mid.
c. DAT (Digital Audio Tape)
Format file yang menggunakan head yang diputar serupa dengan Video Tape
Recorder (VTR).
d. WAV (Waveform Audio)
Merupakan format file audio yang berbentuk digital, dapat dimanipulasi
dengan perangkat lunak PC multimedia.
Video
Menurut Suyanto (2003) format file dalam audio menurut terdiri dari :
a. Audio Video Interleave (AVI)
Merupakan format video dan animasi yang digunakan video untuk windows dan
berinteraksi.
b. Motion Overlay Video (MOV)
Format video dan animasi yang digunakan untuk Macintosh dan windows.
c. Motion Picture Expert Group (MPEG)
Skema kompresi dan spesifikasi format file video digital.
d. Shockwave
Merupakan format dari Macromedia Flash yang berekstensi, dikembangkan
oleh Macromedia Format Shockwave.
e. Real Video
Mempunyai ekstensi serta dikembangkan oleh real media.
2.4. Adobe Flash CS5
Adobe Flash CS5 memiliki beberapa kelebihan dengan fitur-fitur terbarunya
dimana software tersebut telah melakukan penambahan dan perubahan perintah
sehingga memudahkan penggunanya dalam mengelola animasi, seperti copy and paste
layer, mengatur skala objek saat mengubah ukuran stage, TLF tab rulers, tombol
controller untuk menjalankan animasi, kotak dialog publish setting baru, perubahan
panel properties, pengaturan visible simbol lewat panel property, mengunci tulang atau
pinning for IK bone, dan autorecover and auto save. (Madcoms, 2011: 2)
2.4.1. Halaman Awal Adobe Flash CS5
Madcoms (2011:2) menjelaskan bahwa langkah untuk menjalankan program
Adobe Flash CS5 adalah dengan menekan tombol Start > All Program > Adobe
> Adobe Flash Professional CS5 sehingga tampil Welcome Screen seperti yang
tampak pada gambar berikut :
Gambar 1. Tampilan awal Adobe Flash CS5 (Madcoms, 2011:2)
Menurut Madcoms (2011:6) di dalam Jendela Welcome Screen tersedia empat
pilihan perintah untuk membuka Adobe Flash CS5, yaitu :
Create From Template, berguna untuk membuka lembar kerja dengan template
yang tersedia dalam program Adobe Flash Professional CS5.5.
Open a Recent Item, berguna untuk membuka kembali file yang pernah anda
simpan atau pernah anda buka sebelumnya.
Create New, berguna untuk membuat lembar kerja baru dengan beberapa pilihan
script yang tersedia.
Learn, berguna untuk membuka jendela bantuan yang berguna untuk mempelajari
perintah yang ada pada Adobe Flash Professional CS5.5
Berikut ini adalah bentuk tampilan jendela utama pada Adobe Flash CS5.
Gambar 2. Jendela utama Adobe Flash CS5 (Madcoms, 2011:6)
2.4.2. Istilah dalam Adobe Flash CS5
Berikut ini ditampilkan istilah yang sering digunakan dalam penggunaan Adobe
Flash CS5. (Madcoms, 2011:3)
Tabel 1. Istilah dalam Adobe Flash CS5
Istilah Keterangan
Stage Lembar kerja yang digunakan untuk menyusun objek atau
gerakan animasi
Timeline Sebuah panel yang menampilkan layer dan frame
Layer Sebuah nama tempat yang digunakan untuk menampung satu
gerakan objek, sehingga jika ingin membuat gerakan lebih dari
satu objek sebaiknya diletakkan pada layer yang berbeda
Frame Bagian dari layer yang diguankan untuk mengatur pembuatan
animasi
Keyframe Suatu tanda berbentuk lingkaran kecil yang digunakan untuk
membatasi suatu gerakan animasi
Istilah Keterangan
Properties Sebuah panel yang menampilkan perintah dari suat tombol yang
dipilih
Actions Script Suatu perintah yang diletakkan pada suatu Keyframe atau objek
sehingga Frame atau objek tersebut akan menjadi interaktif
Movie Clip Suatu animasi yang dapat digabugkan dengan animasi atau objek
yang lain
Masking Perintah yang digunakan untuk menghilangkan isi dari suatu
layer dan isi layer tersebut akan tampak saat animasi dijalankan.
2.4.3. Komponen Kerja Adobe Flash CS5
Madcoms (20011:7) menjelaskan beberapa komponen kerja program Adobe
Flash Professional CS5.5 telah ditampilkan sebagai tampilan standart. Masih banyak
lagi komponen yang masih tersembunyi sehingga memerlukan perintah-perintah
tertentu untuk menampilkannya. Kita dapat mengatur komponen di dalam program
Adobe Flash Professional CS5.5 sesuai dengan yang kita inginkan. Berikut ini adalah
beberapa komponen kerja dari Adobe Flash Professional CS5.5:
Toolbox
Toolbox adalah sebuah panel yang menampung tombol-tombol yang berguna
untuk membuat suatu desain animasi mulai dari tombol seleksi, pen, pensil 3D
Rotate, dan lain-lain. Dalam daftar tabel berikut adalah simbol dan nama-nama
tombol di dalam Toolbox beserta fungsinya. (Madcoms, 2011:7)
Tabel 2. Daftar simbol toolbox
Simbol Nama Tombol Fungsi
Selection Tool Untuk menyeleksi objek
Subselection Tool
Untuk menyeleksi bagian objek untuk proses
editing
Free Transform
Tool Untuk mengubah bentuk objek secara bebas
Simbol Nama Tombol Fungsi
Gradient Transform
Tool
Untuk mengubah transformasi warna gradasi
pada sebuah objek
3D Rotation Tool
Untuk melakukan rotasi 3D pada objek
berdasarkan sumbu X, Y dan Z
3D Translation
Tool
Untuk melakukan transformasi bentuk dan
posisi 3D pada simbil movie clip dengan
acuan tiga sumbu X, Y dan Z
Lasso Tool
Untuk menyeleksi objek dengan pola seleksi
bebas
Pen Tool Untuk menggambar objek
Add Anchor Point
Tool
Untuk menambah titik anchor pada sebuah
path
Delete Anchor
Point Tool Untuk menghapus titik anchor
Convert Anchor
Point Tool
Untuk mengubah sudut lancip dari sebuah path
menjadi sudut lengkung
Text Tool Untuk mengetik teks dan paragraf
Line Tool Untuk menggambar objek garis lurus
Rectangle Tool Untuk menggambar objek kotak
Oval Tool Untuk menggambar objek oval atau lingkaran
Rectangle Primitive
Tool
Untuk menggambar objek kotak dengan sudut
yang dapat dilengkungkan
Oval Primitive
Tool
Untuk menggambar objek lingkaran dengan
berbagai variasi
Polystar Tool Untuk menggambar objek poligon dan bintang
Pencil Tool
Untuk menggambar dengan bentuk goresan
pensil
Simbol Nama Tombol Fungsi
Brush Tool
Untuk menggambar dengan bentuk polesan
kuas
Spray Brush Tool
Untuk menggambar dengan spray, yaitu
menyemprotkan warna atau simbol
Deco Tool
Untuk menggambar corak dekorasi dengan
menggunakan simbol grapis
Bone Tool
Membuat animasi pertulangan dengan
menambahkan titik sendi pada objek
Bind Tool
Melakukan pengeditan dan modifikasi titik
sendi dari Bone Tool
Ink Bottle Tool
Untuk memberikan warna dan bentuk garis
outline pada sebuah objek
Paint Bucket Tool Untuk memberi warna bidang objek
Eyedropper Tool
Untuk mengambil sampel warna dari sebuah
objek
Erasser Tool Untuk menghapus bidang objek
Hand Tool Untuk menggeser area lembar kerja atau Stage
Zoom Tool
Untuk memperbesar atau memperkecil
tampilan lembar kerja atau stage
Stroke Color Untuk menentukan warna garis
Fill color Untuk menentukan warna bidang objek
Black and White
Untuk mengubah warna garis dan bidang
menjadi hitam dan putih
Swap Colors
Untuk membalik warna antara warna garis dan
warna suatu objek
Snap to Objects
Untuk mengaktifkan atau mematikan fungsi
Snap To Object
Timeline
Menurut (Madcoms, 2011:10) timeline berguna untuk menentukan durasi
animasi, jumlah layer, frame, menempatkan script dan beberapa keperluan animasi
lainnya. Semua bentuk animasi yang akan dibuat, diatur dan ditempatkan pada layer
dalam timeline. Berikut ini adalah gambar timeline dan komponen yang ada
didalamnya.
Gambar 3. Timeline Adobe Flash CS5 (Madcoms, 2011:10)
Tabel berikut adalah nama dan keterangan-keterangan dari gambar di atas.
(Madcoms, 2011:11)
Tabel 3. Nama dan keterangan gambar timeline
Abjad Nama Keterangan
A Layer Lembar kerja yang menampung objek yang akan
dianimasikan di dalam Timeline
B Timeline Tabulasi dari lembar kerja atau stage yang sedang
dikerjakan
C Show/Hide All
Layers
Untuk menyembunyikan atau menampilkan semua isi
layer
D Lock/Unlock
All Layers
Untuk mengunci atau melepas kunci objek dari semua
layer
E Show All layers
as Outlines
Untuk menampilkan objek pada semua layer dalam
bentuk outline
Abjad Nama Keterangan
F Playhead Jarum untuk membaca Frame pada saat animasi
dijalankan
G Blank
Keyframe
Sebuah simbol lingkaran kosong yang menampung
suatu objek
H Frame Suatu bagian dari layer yang digunakan untuk
mengatur pembuatan animasi
I Collapse to
icons & Close Untuk melipat dan menutup jendela Timeline
J Menu Untuk mengatur tampilan Frame
K New Layer Untuk menambah layer baru
L New Folder Untuk menambah folder baru
M Delete Untuk menghapus layer
N Simbol Pensil Menunjukkan bahwa layer dalam kondisi terpilih atau
aktif
O Titik Show or
Hide
Klik untuk menampilkan atau menyembunyikan layer
aktif
P Titik Kunci Klik untuk menampilkan atau menyembunyikan layer
aktif
Q Kotak Outline Klik atau menampilkan objek dalam layer aktif
menjadi bentuk outline
R Controller Tombol yang digunakan untuk mengontrol animasi
S Loop Tombol yang digunakan untuk mengaktifkan
pengulangan animasi
T Onion Skinning
Button Untuk mengatur tampilan animasi di dalam Stage
U Current Frame Menunjukkan posisi Frame aktif
V Frame Rate Untuk mengatur kecepatan gerak animasi dalam tiap
detiknya
W Elapsed Time Menunjukkan durasi atau lamanya animasi
Stage
Menurut Madcoms (2011:12) stage adalah lembar kerja yang digunakan untuk
membuat atau mendesain objek yang akan dianimasikan. Objek yang dibuat dalam
lembar kerja dapat berupa objek vector, movie clip, text, button atau yang lainnya.
Gambar 4. Stage atau lembar kerja (Madcoms, 2011:12)
Tabel di bawah ini adalah nama dan keterangan-keterangan dari gambar stage di atas :
Tabel 4. Nama dan keterangan gambar stage (Madcoms, 2011:13)
Abjad Keterangan
A Stage, lembar kerja untuk menyusun objek yang akan dianimasikan
B Scene, menunjukkan nama scene yang aktif
C Panah yang digunakan untuk berpindah dari lembar kerja simbol ke
lembar kerja utama
D Edit Scene, untuk memilih nama scene yang akan diedit
E Edit Symbols, untuk memilih nama simbol yang akan diedit
F Zoom, untuk mengatur besarnya tampilan stage atau lembar kerja.
Panel Properties
Panel properties adalah panel yang menampilkan perintah dari sebuah tombol
yang terpilih sehingga dapat melakukan modifikasi dan memaksimalkan fingsipiranti
tersebut. (Madcoms, 2011:13)
Gambar 5. Panel properties (Madcoms, 2011:13)
Panel Color
Panel Color digunakan untuk memodifikasi warna pada objek terpilih. Panel
Color meyediakan dua pilihan warna yaitu warna solid dan warna gradasi. (Madcoms,
2011:15)
Gambar 6. Panel color (Madcoms, 2011:15)
Panel Action
Menurut Madcoms (2011:14), Panel Action digunakan untuk menuliskan perintah
ActionScript saat membuat animasi interaktif. Dengan perintah ActionScript
seseorang dapat membuat animasi lebih hidup dan menarik. Untuk membuka Panel
Actions, klik tulisan Action yang ada pada jendela panel atau dengan memilih menu
Windows lalu pilih Action atau dengan menekan tombol F9 pada keyboard.
Gambar 7. Panel Action (Madcoms, 2011:15)
2.4.4. ActionScript
Salah satu kelebihan Adobe Flash CS 5 dibanding perangkat lunak animasi yang
lain yaitu adanya ActionScript. Menurut Ferry Herlambang (2007), ActionScript
adalah bahasa pemrograman Adobe Flash CS5 yang digunakan untuk membuat
animasi atau interaksi. Sedangkan menurut Madcom (2011:164), ActionScript adalah
suatu perintah yang dapat menghasilkan aksi atau gerakan pada obyek. Dengan
perintah ini seseorang dapat membuat animasi yang interaktif sehingga lebih menarik
bagi penikmat animasi.
Menurut Syarif dkk (2008), sama dengan bahasa pemrograman yang lain,
ActionScript berisi banyak elemen yang berbeda serta strukturnya sendiri. Kita harus
merangkainya dengan benar agar ActionScript dapat menjalankan dokumen sesuai
dengan keinginan. Jika tidak merangkai semuanya dengan benar, maka hasil yang
didapat kan akan berbeda atau file flash tidak akan bekerja sama sekali.
ActionScript juga dapat diterapkan untuk action pada frame, tombol, movie clip,
dan lain-lain. Action frame adalah action yang diterapkan pada frame untuk
mengontrol navigasi movie, frame, atau objek lain-lain.
2.5 Basis Data (Database)
Pengertian basis data menurut adalah kumpulan data yang terhubung satu sama
lain secara logikal dan deskripsi data itu dirancang untuk memenuhi kebutuhan
informasi dari sebuah organisasi. Basis data digunakan sebagai tempatpenyimpanan
data yang secara simultan digunakan oleh banyak departemen dan pengguna. Semua
data terintegrasi dengan jumlah yang minimum. Basis data tidak hanya dijumpai oleh
satu departemen tetapi di-share oleh beberapa sumber lainnya (Connolly, 2005:15).
Menurut McLeod dkk (2004:196) database adalah suatu sistem penyimpanan
informasi yang terorganisasi secara komputer sehingga memudahkan pemakai dalam
pengolahan dan penggunaannya. Sedangkan menurut Kustiyahningsih (2010), basis
data adalah sekumpulan informasi yang diatur agar mudah dicari. Dalam arti umum
basis data adalah sekumpulan data yang diproses dengan bantuan komputer yang
memungkinkan data dapat diakses dengan mudah dan tepat, yang dapat digambarkan
sebagai aktivitas dari satu atau lebih organisasi yang berelasi.
2.6 Normalisasi
Normalisasi adalah suatu teknik dimana digunakan untuk mengidentifikasikan
hubungan antara atribut dengan memberikan kebutuhan data yang diperlukan oleh
suatu perusahaan. Normalisasi merupakan sebuah teknik untuk memproduksi satu set
hubungan dengan sifat yang diinginkan, memberikan kebutuhan data pada
perusahaan. ( Connolly dan Begg, 2010:416)
Bentuk-bentuk normalisasi menurut Connolly dan Begg, (2010, p.430-438)
antara lain:
1. Unnormalized Form (UNF)
Merupakan sebuah tabel awal yang belum ternormalisasi yang berisikan satu atau
lebih kumpulan data yang berulang. Untuk membuat tabel UNF yaitu dengan
memindahkan data dari sumber informasi yang di dapat ke dalam tabel dengan format
baris dan kolom, jika ada atribut yang mempunyai banyak nilai (multivalue) akan
masuk ke dalam bentuk UNF.
2. First Normal Form (1NF)
Bentuk normalisasi tahap pertama yang merupakan sebuah relasi dimana sebuah titik
pertemuan antara setiap baris dan kolom yang berisi satu dan hanya satu nilai.
3. Second Normal Form (2NF)
Tahapan kedua setelah 1NF terpenuhi yaitu 2NF dimana merupakan sebuah relasi
yang terdapat di dalam 1NF dan setiap atribut yang bukan primary key bergantung
pada primary key.
4. Third Normal Form (3NF)
Merupakan tahapan ketiga dalam normalisasi dimana sebuah relasi yang terdapat
pada bentuk normalisasi pertama dan kedua, yang mana atribut primary key
bergantung pada primary key.
2.7 MySQL
Menurut Luke Welling dan Laura Thomson (2001:208) MySQL adalah sebuah
software yang open source. MySQL adalah suatu sistem manajemen database. Untuk
menambahkan, mengakses, dan memproses data yang tersimpan pada suatu database
komputer diperlukan sistem manajemen database seperti MySQL. Karena komputer
sangat unggul dalam menangani sejumlah besar data, sistem manajemen database
memainkan suatu peranan yang peting dalam komputansi, baik sebagai utility stand-
alone maupun bagian dari aplikasi lainnya.
Menurut Didik Dwi Prasetyo (2002), MySQL adalah jenis database yang sangat
populer dan digunakan pada banyak website di internet sebagai bank data
(Madcoms). MySQL dikembangkan sekitar tahun 1994 oleh sebuah perusahaan
pengembangan software dan konsultan database bernama MySQL bernama MySQL
AB yang bertempat di Swedia. Pengambilan nama MySQL sampai saat ini masih
belum jelas asal-usulnya. Ada yang berpendapat nama My diambil dari huruf depan
dan belakang Monty, tetapi ada juga yang berpendapat nama itu diambil dari putri
Monty yang kebetulan juga bernama My.
Paranginangin (2006) berpendapat bahwa MySQL merupakan salah satu
Relational Database Management System (RDBMS) yang mendukung database yang
terdiri dari sekumpulan relasi atau tabel. MySQL sangat cocok untuk bekerja
bersama-sama dengan PHP. Secara umum, database berfungsi sebagai tempat atau
wadah untuk menyimpan, mengklasifikasikan data secara prefosional. MySQL
bekerja menggunakan SQL Language (Structure Query Language). Itu dapat
diartikan bahwa MySQL merupakan standar penggunaan database di dunia untuk
pengolahan data. MySQL termasuk jenis RDBMS (Relational Database Management
System). Sedangkan RDBMS sendiri akam lebih banyak mengenal istilah seperti
tabel, baris, dan kolom digunakan dalam perintah-perintah di MySQL. MySQL
merupakan sebuah basis data yang mengandung satu atau sejumlah tabel. Pada
umumnya, perintah yang paling sering digunakan dalam mySQL adalah select
(mengambil), insert (menambah), update (mengubah), dan delete (menghapus).
Selain itu, SQL juga menyediakan perintah untuk membuat database, field, ataupun
index guna menambah atau menghapus data.
2.8 PHP
Menurut Janer Simarmata (2006:30) adalah bahasa (Scripting language) yang
dirancang secara khusus untuk penggunaan pada Web. PHP adalah tool untuk
pembuatan halaman web dinamis. PHP kependekan untuk HyperText Preprocessor.
Pada awal perkembangan oleh Rasmus Leodrof, dia menyebutkan sebagai tools
Personal Home Page. PHP (Hypertext Preprocessor) merupakan bahasa berbentuk
script yang ditempatkan dalam server dan akan diproses oleh server. Dan hasilnya
akan dikirimkan ke client menggunakan browser.
Menurut Kadir (2002) PHP (Hypertext Preprocessor) merupakan bahasa
pemrograman berbasis Web. Bahasa ini memiliki kelebihan yaitu kompatibilitasnya
dengan berbagai macam jenis database serta dukungan dengan berbagai macam jenis
sistem operasi. PHP lebih cocok dan umum digunakan jika digabungkan dengan
database MySql. MySql dengan PHP seakan-akan dua hal yang tidak dapat
dipisahkan. Tentunya untuk dapat menggunakan keduanya dibutuhkan tingkat
kemampuan programming tertentu. Script dan PHP juga berkedudukan sebagai tag
dalam bahasa HTML. Konsep kerja dari PHP adalah sama dengan kode HTML,
hanya saja ketika berkas PHP yang diminta didapatkan dari web server, isinya segera
dikirimkan ke mesin PHP dan mesin inilah yang memproses dan memberikan
hasilnya yang berupa kode HTML ke web server. Lalu web server akan
menyampaikannya ke client melalui web browser.
2.9. Diagram Aliran Data (DAD) atau ( Data Flow Diagram/DFD)
Menurut Jogiyanto (2005 : 700) Data Flow Diagram (DFD) adalah diagram yang
menggunakan notasi-notasi berupa lingkaran dan anak panah untuk menggambarkan
arus dari data sistem. Diagram aliran data 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 atau
lingkungan fisik dimana data tersebut akan disimpan. DAD merupakan alat yang
digunakan pada metodologi pengembangan sistem yang terstruktur (structured
Analysis and Design).
Ada beberapa tingkatan dalam pembuatan diagram aliran data, yaitu :
a. Diagram Konteks
Dimulai dengan diagram konteks yang merupakan level tertinggi (top level),
diagram yang menggambarkan hubungan antar system dengan entitas diluar system,
merupakan system secara keseluruhan.
b. Diagram Nol (Zero)
Merupakan proses-proses yang ada didalam system berupa pecahan dari diagram
konteks, diagram nol (zero) merupakan rincian dari diagram konteks.
c. Diagram Rinci/detail/primitive
Menggambarkan rincian tiap proses yang terdapat pada diagram nol, dimana
proses rinci ini dapat dipecahkan sampai pada proses yang paling rinci.
Ada beberapa simbol yang digunakan di DFD untuk maksud mewakili menurut
Jogiyanto, (2005:700) yaitu:
a. External entitity (Kesatuan luar) atau boundary (Batas sistem)
Setiap sistem pasti mempunyai batas sistem (boundary) yang memisahkan suatu
sistem dengan lingkungan luarnya. Sistem akan menerima input dan akan
menghasilkan output kepada lingkungan luarnya. Kesatuan luar (external entitity)
merupakan kesatuan (entity) di lingkungan luar sistem yang dapat berupa orang,
organisasi atau sistem lainnya yang berada di lingkungan luarnya yang akan
memberikan input atau menerima output dari sistem.
Suatu kesatuan luar dapat disimbolkan dengan suatu notasi kotak atau suatu
kotak dengan sisi kiri dan atasnya berbentuk garis tebal sebagai berikut:
Gambar 8. Simbol kesatuan luar
b. Data flow (Arus data),
Arus data di DFD di beri simbol dengan panah. Arus data ini mengalir diantara
proses, simpanan data dan kesatuan luar. Arus data ini menunjukan arus dari data
yang dapat berupa masukan untuk sistem atau hasil dari proses sistem.
Gambar 9. Simbol arus data
c. Process (Proses),
Kegiatan yang dilakukan oleh orang, mesin atau komputer dari hasil suatu arus
data yang masuk ke dalam proses untuk menghasilkan arus data yang akan keluar dari
proses atau dari input menjadi output.
atau
Gambar 10. Simbol proses
d. Data store (Simpanan data).
Simpan data merupakan simpanan data yang dapat berupa file atau database di sistem
komputer, arsip atau catatan manual, kotak tempat data dimeja seseorang, tabel acuan
manual, agenda atau buku. Simpanan data di DFD dapat disimbolkan dengan
sepasang garis horizontal parallel yang tertutup di salah satu ujungnya, seperti
Gambar Data Store berikut ini:
Nama Data Store
Gambar 11. Simbol simpanan data
2.10 Flowchart
Bagan alir (flowchart) adalah bagan (chart) yang menunjukan hasil (flow)
didalam program atau prosedur sistem secara logika. Bagan alir digunakan terutama
untuk alat bantu komunikasi dan untuk dokumentasi (Jogiyanto, 2005:795).
Flowcart adalah bagan-bagan yang mempunyai arus yang menggambarkan
langkah-langkah penyelsaian suatu masalah. Flowcart merupakan cara penyajian dari
suatu algoritma (Ladjamuddin, 2006:225).
Menurut Jogiyanto (2005:796) ada lima macam flowchart, diantranya:
a. Bagan alir sistem (Sistems flowchart)
Bagan alir sistem (System flowchart) yaitu bagan yang menujukan arus pekerjaan
secara keseluruan dari sistem. Bagan menjelaskan urutan-urutan dari prosedure-
prosedure yang ada dalam sistem. Bagan alir sistem menunjukan apa yang dikerjakan
sistem. Bagan alir sistem digambar dengan simbol-simbol yang tampak pada tabel 3.1
Ident
ifikas
i
Nam
a
prose
s
Media
Tabel 5. Simbol flowchart sistem (Jogiyanto, 2005)
Nama KeteranganGambar
DokumenMenunjukan dokumen Input dan
Output proses manual, mekanik,
atau komputerisasi
Menunjukan Pekerjaan Manual
Menunjukan kegiatan proses dari
operasi program
Menunjukan input dan output
menggunakan hardisk
Menunjukan file non-komputer yang
diarsip urut tanggal. A untuk
(alphabetical), N untuk (numerical)
dan C untuk (cronological)
Merupakan input data yang
menggunakan online keyboard
Menunjukan arusa dari proses
Menunjukan tahapan pembuatan
keputusan
Menunjukan awal dan akhir dari
bagan alir dokumen
Proses Manual
Simbol Proses
Komputerisasi
File Hardisk/
Database
Simpanan/
Offine
Simbol Keyboard
Arus Dokumen/
Pemprosesan
Keputusan
Terminal
c n a
Menunjukan output yang
ditampilkan di monitor
Menunjukan penjelasan dari suatu
proses
Display
PenjelasanJjhjhj
Nhbvjh]jhv
Pita MagnetikMenunjukan input/output
menggunakan pita magnetik
Menunjukan input/output yang
menggunakan kartu plong
(punched card).
Menunjukan input/output
menggunakan pita kertas
berlubang
Kartu Plong
Pita Keras
Berlubang
Menunjukan penghubung ke
halaman yang sama atau ke
halaman lain
Connector
Menunjukan operasi yang
dilakukan di luar proses operasi
komputer
Menunjukan proses trasmisi data
melalui channel komunikasi
Operasi Luar
Hubungan
Komunikasi
Nama KeteranganGambar
b. Bagan alir dokumen (Document flowchart)
Bagan alir dokumen (document flowchart) atau disebut bagan alir formulir (form
flowchart) atau paperwork flowchart merupakan bagan alir yang menunjukan arus
dari laporan dan formulir termasuk tembusan-tembusannya. Bagan alir dokumen ini
menggunakan simbol-simbol yang sama dengan yang digunakan di dalam bagan alir
sistem.
c. Bagan alir skematik (schematic flowchart)
Bagan alir skematik (schematic flowchart) merupakan bagan alir yang mirip
dengan bagan alir sistem, yaitu untuk menggambarkan prosedur di dalam sistem.
Perbedaannya adalah bagan alir skematik menggunakan simbol-simbol bagan alir
sistem , juga menggunakan gambar - gambar komputer dan peralatan lainnya yang
digunakan. Maksud penggunaan gambar-gambar ini adalah untuk memudahkan
komunikasi kepada orang yang kurang paham dengan simbol-simbol bagan alir.
d. Bagan alir program (program flowchart)
Bagan alir program (program flowchart) merupakan bagan yang menjelaskan
secara rinci langkah-langkah dari proses program. Bagan alir program dibuat dengan
menggunakan simbol-simbol sebagai berikut ini.
Tabel 6. Simbol flowchart program (Jogiyanto, 2005)
Nama KeteranganGambar
Digunakan untuk menunjukan awal
dan akhir dari suatu proses
Digunakan untuk suatu
penyelesaian kondisi di dalam
program
Digunakan untuk mewakili data
input/output
Digunakan untuk menunjukan arah
dari proses
Dugunakan untuk menunjukan
sambungan dari bagan alir yang
terputus di halaman yang masih
sama atau di halaman lainnya
Digunakan untuk menunjukan suatu
operasi yang rinciannya ditunjukan
di tempat lain
Digunakan untuk memberi nilai
awal suatu besaran
Digunakan untuk mewakili suatu
proses
Terminal
Keputusan
Input/output
Garis alir
Penghubung
Proses terdefinisi
Persiapan
Proses
e. Bagan alir proses (Process flowchart)
Bagan alir proses (process flowchart) merupakan bagan alir yang banyak digunakan
teknik industri. Bagan alir juga berguna bagi anilis sistem untuk menggambarkan
proses dalam suatu prosedure. Bagan alir proses menggunakan lima buah simbol
tersendiri.
3. Perancangan Sistem
Secara umum tujuan dari perancangan sistem adalah untuk memberikan
gambaran secara umum kepada user tentang sistem yang baru. Rancangan sistem
secara umum mengidentifakasi komponen-komponen sistem yang akan dirancang
secara rinci. Perancangan dalam media pembelajaran ini berupaya menganalisa input
atau aliran data secara sistematis, memproses data, menyimpan data dan
menghasilkan output berupa tampilan informasi.
3.3. Rancangan Basis Data
3.3.1. Normalisasi
Bentuk Tidak Normal
Kategori
Judul
Bacaan
Uraian
Suara
Gambar
Keterangan
Gambar 12. Bentuk tidak normal
Dalam bentuk tidak normal ini, data-data dikumpulkan secara keseluruhandan
masih banyak terdapat field-field yang mengalami perulangan. Dalam bentuk tersebut
tidak ada aturan-aturan pengelompokan, sehingga terjadinya redundasi.
Bentuk 1 NF (Normal Pertama)
Dalam Bentuk Normal Pertama ini belum bisa dikatakan normal karena masih
ada tabel dengan atribut yang berulang. Untuk mengatasinya yaitu mencari
ketergantungan parsial dengan menjadikan field-field menjadi tergantung pada satu
atau beberapa field. Bentuk normal pertama ini terbentuk dari tabel materi dan dalam
hal ini yang dapat dijadikan kunci adalah id_kat dan id_materi.
id_kat
kategori
id_materi
judul
bacaan
uraian
suara
nama_gbr
keterangan
Tabel Materi
Gambar 13. Bentuk normal pertama
Bentuk 2 NF (Normal Kedua)
Dalam bentuk ini sudah di tentukan kunci dari tiap-tiap tabel yang telah
terbentuk dari normal pertama dimana kunci field bersifat unik dan dapat mewakili
dari setiap field lain yang menjadi anggota dari tabel tersebut. Pada bentuk normal
kedua ini belum bisa dikatakan normal karena masih terdapat pengulangan field
sehingga perlu dipecah lagi.
materi
* id_materi
** id_kat
judul
bacaan
uraian
suara
nama_gbr
keterangan
kategori
* id_kat
kategori
Gambar 14. Bentuk normal kedua
Bentuk 3 NF (Normal Ketiga)
Dalam bentuk ini sudah di tentukan kunci dari tiap-tiap tabel yang telah
terbentuk dari normal pertama. Pada bentuk normal ketiga ini sudah tidak terdapat
pengulangan field-field sehingga tabel bisa dikatakan normal.
materi
* id_materi
* id_kat
** id_gambar
judul
bacaan
uraian
suara
gambar
* id_gambar
nama_gbr
keterangan
kategori
* id_kat
kategori
Gambar 15. Bentuk normal ketiga
3.3.2. Relasi Antar Tabel
Pada tabel yang telah di rancang berupa file-file basis data, antara file yang satu
dengan yang lainya saling berhubungan. Untuk menghubungkan menghubungkan file
satu dengan file yang lainunya maka di perlukan suatu kunci tamu. Kunci tamu inilah
yang nantinya akan menjadi tanda penghubug antara file satu dengan file lainnya.
soal
* id_soal
pertanyaan
a
b
c
d
jawaban
user
* id_user
nama
alamat
nilai materi
* id_materi
** id_kat
** id_gambar
judul
bacaan
uraian
suara
gambar
* id_gambar
gambar
keterangan
admin
username
password
kategori
* id_kat
kategori
Gambar 16. Relasi antar tabel
3.4. Diagram Alir Data (DAD)
Diagram Alir Data (DAD) Media Pembelajaran Ghorib dan Musykilat
mengambarkan proses-proses yang terjadi beserta alir datanya sebagai penjelasannya
terhadap terhadap sistem yang akan di kembangkan.
3.4.1. Diagram Konteks
Diagram Konteks berikut ini akan memberikan gambaran aliran data secara
umum sistem pengolahan data pada media pembelajaran ghorib dan musykilat.
Media Pembelajaran
Ghorib dan Musykilat
Admin User
Data materi
Data gambar
Data soal
Data admin
Data materi
Data gambar
Data soal
Data user
Data user
Data materi
Data gambar
Data soal
Data user
Gambar 17. Diagram konteks
3.4.2. Diagram Berjenjang
Diagram berjenjang di gunakan untuk mempersiapkan penggambaran DAD ke
level bawah. Di gambarkan dengan menggunakan notasi proses yang digunakan di
DAD.
0.0
Media Pembelajaran
Ghorib dan Musykilat
1.0
Input
3.0
Tampilan
1.2
Data Gambar
1.1
Data Materi
1.3
Data Soal
1.4
Data Admin
3.2
Tampilan
Gambar
3.1
Tampilan Materi
3.3
Tampilan Soal
3.4
Tampilan User
2.0
Evaluasi
2.1
Nilai
1.5
Data User
Gambar 18. Diagram berjenjang
3.4.3 DAD Level 0 Media Pembelajaran
materi
gambar
soal
user
3.0
Tampilan
Admin UserData user
Tampilan data materi
Tampilan data gambar
Tampilan data soal
Tampilan data user
Data materi
Data gambar
Data soal
Data admin
Data materi
Data user
Data soal
Data gambar
1.0
Input
Data soal
Data gambar
Data materi
Tampilan data materi
Tampilan data gambar
Tampilan data soal
Tampilan data user
2.0
Evaluasi
Data user
Data soal
user
Data user
Data nilai
adminData admin
kategori
Gambar 19. DAD level 0 media pembelajaran
3.4.4. DAD Level 1 Proses Input
Admin
User
gambar
1.2
Data Gambar
1.3
Data Soal
1.1
Data Materi
1.5
Data User
Data materi
Data soal
Data gambar
materi
soal
user
Data materi
Kategori
Data gambar
Data soal
Data user Data user
1.4
Data Admin
Data passwordadmin
Data Password
kategori
Data gambar
Gambar 20. DAD level 1 proses input
3.4.5. DAD Level 1 Proses Evaluasi
2.1
Nilai userData nilaisoal
user
Data soal
Data user
Gambar 21. DAD level 1 proses evaluasi
3.4.6. DAD Level 1 Proses Tampilan
Admin
User
gambar
3.2
Data Gambar
3.3
Data Soal
3.1
Data Materi
3.4
Data User
Tampilan data materi
Tampilan data soal
Tampilan data gambar
materi
soal
user
Data materi
Data gambar
Data gambar
Data soal
Tampilan data user Data user
Tampilan data materi
Tampilan data gambar
Tampilan data soal
Tampilan data user
kategoriData kategori
Gambar 22. DAD level 1 proses tampilan
3.5. Flowchart
3.5.1. Flowchart Sistem
Input materi Input gambar
Proses simpan
materiProses simpan
gambar
gambarmateri
Proses tampilan
gambar
Proses
tampilan materi
Input user
Proses simpan
user
user
Proses
tampilan user
Input soal
Proses simpan
soal
soal
Proses
tampilan soal
Tampilan
data materi
Tampilan
data gambar
Tampilan
data soal
Tampilan
data user
kategori
Gambar 23. Flowchart sistem
3.5.2. Flowchart Program Halaman Utama
Mulai
Koneksi
sukses
Koneksi ke
database server
Tampilkan menu
utama (petunjuk,
materi, profil, evaluasi)
Pilih judul
materi
Ya
Tidak
Tampilkan
halaman petunjukYa
Pilih menu
petunjuk
Pilih menu
profil
Pilih menu
materi
tidak
tidak
Tampilkan
halaman materiYa Tidak
Pilih menu
homeYa
tidak
Ya
tidak
Tampilkan isi
materi
Pilih menu
homeYa
tidak
Pilih profil
dosen
Tampilkan
halaman profil
mahasiswa
Ya Ya
tidak
Tampilkan
halaman profil
dosen
Pilih menu
homeYa
tidak
Pilih menu
evaluasi
Input data
user
Tampilkan
halaman evaluasiYa tidak
tidak
Pilih menu
home
Ya
tidak
Kerjakan soalTampilkan soal
evaluasi
Proses simpan data
user
Ya
Tampilkan nilai
evaluasiSimpan nilai
Ya
tidak
tidak
Proses simpan nilai
evaluasi
Ya Coba lagi
Ya
tidak
Keluar
Selesai
Yatidak
Gambar 24. Flowchart program halaman utama
3.5.3. Flowchart Program Halaman Admin
Mulai
Login
sukses
Input Login
Halaman utama
menu admin
Ya
Tidak
Pilih menu
materi
Pilih menu
ayat
Tampilkan data
materiSaveYa
Ya
tidak
Ya Pilih menu
soal
tidak
Pilih menu
user
Ubah
password
Ya
Ya
tidak
Ya Keluar
tidak
tidak
Ya
tidak
Edit Ya
Delete
tidak
tidak
Simpan password
tidak
Selesai
Simpan data
materi
Konfirmasi
hapus data Ya
Hapus data
materi
tidak
Ya
Tampilkan data
gambar ayatSave Ya
tidak
Edit Ya
Delete
tidak
tidak
Simpan data
gambar ayat
Konfirmasi
hapus data Ya
Hapus data
gambar ayat
tidak
Ya
Tampilkan data
soalSave Ya
tidak
Edit Ya
Delete
tidak
tidak
Simpan data soal
Konfirmasi
hapus data Ya
Hapus data
soal
tidak
Ya
Tampilkan data
userDelete
Konfirmasi
hapus data
Hapus data
user
Ya
tidak
Simpan data usertidak Ya
Ubah
password
Gambar 25. Flowchart program halaman admin
3.6. Perancangan Input
Rancangan input merupakan sebuah halaman yang berisi perancangan untuk
melakukan input data pada sistem berupa sebuah tampilan desain yang terdiri dari
beberapa form.
3.6.1 Rancangan Form Login Administrator.
Dalam perancangan form login ini, tabel yang dibutuhkan adalah tabel admin.
Form login ini digunakan seorang admin untuk masuk dan menggunakan hak akses
sebagai admin.
Gambar 26. Rancangan form login admin
Form ini terdiri dari username dan password. Form username diisi nama user dari
seorang admin, sedangkan password diisi kata sandi yang bersifat rahasia. Tombol
login digunakan untuk masuk ke dalam halaman administrator sedangkan tombol
cancel untuk membatalkannya.
3.6.2 Rancangan Input Materi
Form ini berisi data materi yang terdiri dari judul, bacaan ( Dimuat dalam bentuk
gambar), uraian materi, suara bacaan dan gambar atau lokasi ayat Al Quran yang
mengandung bacaan ghorib atau musykilat dari materi yang bersangkutan dan
dipanggil dari tabel gambar.
Gambar 27. Rancangan input materi
Tombol save digunakan untuk menyimpan data, tombol edit untuk mengubah
data dan tombol delete untuk menghapus data materi.
3.6.3 Rancangan Input Ayat
Pada form ini berisi data gambar ayat Al Quran yang terdiri dari inputan data
gambar dan keterangan. Form gambar ini berisi data nama file dari gambar yang
dipilih. Untuk menyimpannya klik tombol simpan.
Gambar 28. Rancangan input ayat
Tombol save digunakan untuk menyimpan data, tombol edit untuk mengubah
data dan tombol delete untuk menghapus data gambar ayat.
3.6.4 Rancangan Input Soal
Form input soal ini berisi data soal yang terdiri dari inputan pertanyaan, pilihan
jawaban a, b, c, dan d serta jawaban kunci. Untuk melakukan penyimpanan klik
tombol simpan.
Gambar 29. Rancangan input soal
Tombol save digunakan untuk menyimpan data, tombol edit untuk mengubah
data dan tombol delete untuk menghapus data soal.
3.6.5 Rancangan Input User
Tampilan form ini terdapat pada halaman utama ketika user atau pengguna
hendak melakukan evaluasi latihan soal. Seseorang harus menginputkan nomor
induk, nama dan kelas sebagai identitas pengguna pada form ini.
Gambar 30. Rancangan input user
Tombol start digunakan untuk memulai mengerjakan soal-soal evaluasi yang
akan muncul pada halaman selanjutnya. Jika semua soal telah terjawab maka akan
muncul halaman nilai user dari hasil pengerjaannya dan terdapat pilihan untuk
menyimpannya atau tidak. Data user ini akan masuk ke dalam database manakala ia
mengeklik tombol simpan, namun jika tidak maka data user yang telah dimasukan
dan hasil evaluasi latihan soal yang telah dikerjakan tidak akan tersimpan.
4. Implementasi Program
Media pembelajaran ghorib dan musykilat ini berbasis multimedia yang
menyajikan materi-materi pelajaran berisi bacaan ghorib dan musykilat yang ada di
dalam Al Quran. Hal ini dikemas dalam bentuk teks, gambar dan suara dengan
harapan dapat meningkatkan minat dan ketertarikan para peserta didik dan siapapun
untuk mempelajari bacaan Al Quran terutama bacaan ghorib dan musykilat dalam
bentuk yang lebih menarik dan mudah dimengerti. Media pembelajaran ini juga
sangat tepat digunakan pada lembaga pendidikan seperti taman pendidikan Al Quran
maupun yang lainnya karena dapat membantu para guru dan ustadz dalam
menyampaikan materi dengan bantuan multimedia.
4.1 Persiapan Awal
Data yang ada dalam media pembelajaran ini bersifat dinamis yakni terkoneksi
database sehingga datanya bisa diubah sewaktu-waktu. Langkah yang harus
dilakukan untuk bisa menggunakannya adalah dengan cara mengaktifkan terlebih
dahulu localhost dan MySQL pada komputer kita dengan catatan database untuk
aplikasi ini sudah dibuat pada MySQL. Dalam hal ini software yang digunakan
adalah Wamp5 Versi 1.7.0, sedangkan untuk pembuatan programnya, software yang
digunakan adalah Adobe Flash CS5.
Dalam pembuatan programnya, sebaiknya pada langkah akhir disimpan dalam
format *.exe. Hal ini dimaksudkan agar semua komputer, baik yang memiliki Flash
Player maupun tidak, tetap bisa menjalankan program tersebut. Jika semua file
program telah tersedia dan database telah terhubung maka media pembelajaran
ghorib dan musykilat siap untuk digunakan.
4.2 Tampilan Halaman Utama
Halaman ini merupakan halaman utama dari media pembelajaran ini yang
ditujukan untuk para pengguna seperti santri, siswa, ataupun pengguna yang lain. Di
dalam halaman utama ini terdapat halaman intro, menu utama, petunjuk, materi,
profil, dan evaluasi.
4.2.1 Tampilan Halaman Intro
Halaman ini merupakan halaman yang pertama kali muncul ketika media
pembelajaran ghorib dan muykilat dijalankan. Tampilan dari halaman ini berupa intro
atau pembuka yang berisi animasi-animasi dan ditambah perpaduan suara untuk
mempercantik tampilan. Dalam halaman ini berisi tombol MULAI yang digunakan
untuk masuk kedalam halaman menu utama.
Gambar 31. Halaman intro
4.2.2 Tampilan Halaman Menu Utama
Halaman ini merupakan halaman menu utama dari media pembelajaran ghorib
muykilat ini yang berisi tombol-tombol menu yang terdiri dari empat menu utama
yaitu menu petunjuk, materi, profil, dan evaluasi, serta satu tombol silang yang
terdapat di pojok kanan bawah berfungsi sebagai tombol untuk keluar dari program
ini. Klik salah satu menu utama untuk membuka halaman menu yang diinginkan.
Halaman menu utama ini berisi animasi dan dilengkapi dengan backsound untuk
memperindah tampilan, begitupun dengan tombol menu utama juga dilengkapi
dengan audio sehingga ketika disorot maupun diklik maka tombol ini akan
mengeluarkan suara.
Gambar 32. Halaman menu utama
4.2.3 Tampilan Halaman Materi
Halaman materi ini merupakan halaman yang berisi kumpulan materi yang ada
dalam program ini. Menu ini merupakan menu terpenting yang menerangkan bacaan
ghorib dan musykilat yang ada dalam Al Quran.
Gambar 33. Halaman materi
Halaman ini terdapat judul materi yang berada di sebalah samping kiri dan
berfungsi untuk menampilkan isi dari judul materi yang bersangkutan. Terdapat
pilihan kategori menu materi yaitu ghorib dan musykilat untuk mengelompokkan
materi apa saja yang termasuk bacaan ghorib atau musykilat. Adapun tombol home
yang berada di pojok kiri bawah digunakan untuk kembali ke halaman menu utama.
Isi halaman materi berupa judul, uraian, bacaan ghorib dalam bentuk gambar dan
suara bacaan. Untuk mendengarkan suara bacaannya klik tulisan bacaan arab yang
berada di atas dan jika ingin melihat gambar dan lokasi ayat dalam Al Quran klik
tombol lihat ayat yang berada di bagian bawah, maka akan tampak gambar ayat
beserta lokasi ayatnya dalam Al Quran. Untuk kembali ke halaman sebelumnya klik
tombol kembali.
Gambar 34. Halaman ayat Al Quran
4.3. Tampilan Halaman Admin
Halaman ini merupakan halaman yang hanya bisa diakses oleh seorang admin
yaitu seseorang yang memiliki hak untuk mengubah, menambah, maupun menghapus
data dari media pembelajaran ini.
4.3.1 Form Login Admin
Form login administrator adalah halaman yang pertama kali tampil ketika file
admin dari media pembelajaran ini dijalankan. Form login ini bertujuan untuk
mengamankan data yang ada di dalamnya sehingga hanya seseorang yang
mengetahui akun admin sajalah yang bisa masuk ke halaman ini.
Gambar 35. Form login admin
Untuk dapat mengakses halaman ini maka pengguna harus memasukkan
username dan password dengan benar. Jika data yang dimasukkan salah atau data
form tidak diisi, maka akan tampil peringatan dan proses login untuk masuk ke
halaman utama tidak berhasil sampai seorang admin memasukan datanya dengan
benar sesuai database.
Seseorang yang telah berhasil masuk ke halaman admin, maka akan ditampilkan
menu utama yang berada disamping kiri dan terdiri dari menu user, soal, materi, dan
ayat. Di bagian bawah juga terdapat menu ubah password dan logout untuk keluar.
5.3.1 Tampilan Menu Data User
Tampilan menu user dari halaman admin ini berisi tentang data pengguna seperti
siswa, santri dan lain sebagainya yang telah melakukan evaluasi soal latihan ghorib
dan musykilat pada media pembelajaran ini. Halaman ini berisi data user yang terdiri
dari no induk, nama, kelas, dan nilai.
Pada menu ini hanya terdapat pilihan untuk menghapus data user, sehingga
seorang admin hanya bisa menghapus daftar user yang ada tanpa bisa menambah
maupun mengedit data user yang ada.
Gambar 36. Halaman menu user
4.3.2 Tampilan Menu Materi
Tampilan menu materi dari halaman admin ini berisi tentang data materi ghorib
dan musykilat yang ada dalam media pembelajaran ini. Data materi pada halaman ini
terdiri dari judul materi, uraian, bacaan, suara, dan gambar ayat.
Pada halaman menu ini terdapat pilihan untuk menambah data, mengedit maupun
menghapus data materi. Tombol save di samping kiri berfungsi untuk menyimpan
data materi, tombol edit untuk mengganti dan tombol delete untuk menghapus data
materi yang dipilih.
Gambar 37. Halaman menu materi
DAFTAR PUSTAKA
Ahmad, R., 1997. Media Intruksional Edukatif, Rineka Cipta, Jakarta.
Arsyad, A., 2003, Media pengajaran, Raja Grafindo Persada, Jakarta.
Baidan, N., 2005, Wawasan Baru Ilmu Tafsir, cet. 1, hal. 267, Pustaka Pelajar,
Yogyakarta.
Bin Ladjamuddin, A., 2006, Rekayasa Perangkat Lunak, cet-keII, Graha Ilmu,
Yogyakarta.
Connolly, T., and Begg, C., 2005, Database System: A Practical Approach to Design,
Implementation, and Management, 4th Edition, Addison Wesley, Harlow.
Daryanto, 2011, Ilmu Komunikasi 1, Satu Nusa, Bandung.
Dhani, Y., 2003, Panduan Lengkap Macromedia Flash MX 2004.Andi
Offset:Yogyakarta.
Diginnovac, Maulana, A., dan Nasution, K., 2008, Draw and Animate with Flash,
Elex Media Komputindo, Jakarta.
Hamalik, O., 2008, Kurikulum dan Pembelajaran. Bumi Aksara, Jakarta.
Hamzah, M., 2003, Studi Al-Qur'an Komprehensif. Gama Media, Yogyakarta.
Herlambang, F., 2007, Membuat Efek Khusus dengan ActionScript 2.0 Flash 8, PT
Elex Media Komputindo, Jakarta.
Jogiyanto H.M., 2005, Analisis & Desain, Ed ke-III, Andi Offset, Yogyakarta.
Kadir, A., 2002, Dasar Pemrograman Web Dinamis menggunakan PHP, Andi
Offset, Yogyakarta.
Khan, A.M., 2008, Praktikum Qira’at, cet. 1, hal. 100, Amzah, Jakarta.
Kustiyahningsih, Y., dan Anamisa, D.R., 2010, Pemrograman Basisdata Berbasis
Web Menggunakan PHP dan MySQL. Graha Ilmu, Yogyakarta.
Madcoms, 2011, Mahir dalam 7 Hari Adobe Flash CS5.5, Andi Offset, Yogyakarta.
McLeod, R. Jr., dan Schell, G., 2004, Management Information System. 9th Edition.
Pearson Education, Inc, New Jersey.
Nasihudin, A, 2003, Keterangan Ghorib dan Musykilat, Koordinator Pendidikan Al
Quran Metode Qiroati Cabang Kebumen, Kebumen.
Priyanto, H., Amarullah, A.M., dan Zaky, R., 2008, Making Educational Animation
Using Flash, Informatika, Bandung.
Sadiman, A.S., 2003. Media pendidikan, pengertian, pengembangan, dan
pemanfaatannya. Jakarta: CV. Rajawali.
Simarmata, J., dan Paryudi, I., 2006. Basis Data, Edisi Pertama, Andi Offset,
Yogyakarta.
Suyanto, M., 2003, Multimedia Alat untuk Meningkatkan Keunggulan Bersaing, Andi
Offset, Yogyakarta.
Suyanto, M., 2004, Analisis & Desain Aplikasi Multimedia untuk Pemasaran, Andi
Offset, Yogyakarta.
Welling, L., and Thomson, L., 2001, PHP and MySQL Web Development. Sams
Publishing, Indianapolis.