1. Dokumen ini membahas pengembangan bahan ajar berbasis web untuk mata kuliah Pengantar Teori Graf menggunakan Joomla dan Macromedia Flash 8. Tujuannya adalah menyediakan sumber belajar tambahan bagi mahasiswa. 2. Website ini menyajikan materi dengan animasi dan evaluasi berupa soal latihan serta video. Diharapkan mahasiswa dapat belajar sesuai keinginan dan meningkatkan kualitas pembelajaran. 3. Penelitian ini

1. 1
PENGEMBANGAN BAHAN AJAR BERBASIS WEB MATA KULIAH
PENGANTAR TEORI GRAF MENGGUNAKAN JOOMLA DAM MACROMEDIA
FLASH 8 (STUDI KASUS POKOK BAHASAN TEORI DASAR GRAF DAN
PEWARNAAN GRAF)
Kristina Nuraini
Jurusan SI, Fakultas ILMU KOMPUTER
Universitas Gunadarma, Depok
ABSTRAKSI
Di Universitas Gunadarma, sebagian besar metode pengajaran yang dilakukan
hanya berupa kuliah konvesional yaitu proses belajar mengajar yang mengandalkan tatap
muka antara dosen dan mahasiswa.
Seiring perkembangan teknologi terutama teknologi komunikasi dan teknologi
informasi (ICT) penggunaan komputer (termasuk di dalamnya internet) sebagai sarana
pendukung kegiatan belajar mengajar (pembelajaran) memiliki sifat interaktif dan
diharapkan mampu memberikan dukungan bagi terselenggaranya proses komunikasi
interaktif antara dosen, mahasiswa, dan bahan belajar maka dihadirkanlah suatu media
pembelajaran berbasis web yang dapat menjadi suplemen bagi pengembangan bahan ajar.
Penulisan Tugas akhir ini menjelaskan perancangan dan pengembangan bahan
ajar berbasis web mata kuliah Pengantar Teori Graf dengan pokok bahasan Teori Dasar
Graf dan Pewarnaan Graf.
Pada website ini menyediakan berbagai fasilitas pembelajaran, yaitu dengan
menyajikan materi dengan animasi agar lebih menarik dan dilengkapi dengan evaluasi
berupa latihan-latihan soal serta video on demand. Hasil yang akan dicapai dari
pembuatan website ini adalah bahwa mahasiswa dapat mengikuti semua materi khususnya
untuk mata kuliah Pengantar Teori Graf sesuai yang mereka inginkan.
Diharapkan dengan adanya website ini dapat memudahkan dan meningkatkan
kualitas proses belajar mengajar serta memberikan kemudahan bagi dosen atau pengajar
dan mahasiswa dalam melaksanakan kegiatan belajar mengajar.
Kata Kunci : Bahan Ajar Berbasis Web, Pengantar Teori Graf, Teori Dasar Graf dan
Pewarnaan Graf, Joomla, Macromedia Flash 8
I. PENDAHULUAN
Dalam proses belajar mengajar terdapat dua unsur yang penting, yaitu metode
pengajaran dan metode pembelajaran, kedua unsur tersebut saling berkaitan satu dengan
yang lainnya. Di Universitas Gunadarma, sebagian besar metode pengajaran yang
dilakukan hanya berupa kuliah konvesional yaitu proses belajar mengajar yang
mengandalkan tatap muka antara dosen dan mahasiswa. Hal ini menyebabkan terbatasnya
metode belajar mahasiswa dan media pembelajaran yang digunakan oleh dosen hanya

2. 2
berupa media transparansi yang ditampilkan dengan menggunakan proyektor transparansi
(OHP) dan media cetak seperti buku dan fotocopy materi. Dengan media pembelajaran
yang digunakan sekarang, mahasiswa hanya bisa membayangkan bagaimana bentuk atau
visualisasi dari materi tersebut secara abstrak. Dan oleh sebab itu maka dihadirkanlah
sebuah media yang bisa mengkomunikasikan antara mahasiswa dan bahan ajar yaitu berupa
web based learning dan kondisi tersebut yang mendorong penulis untuk membuat sebuah
aplikasi berbasis web dengan membahas salah satu materi perkuliahan yang berguna dan
menjadi suplemen bagi mahasiswa yaitu berupa mata kuliah Pengantar Teori Graf.
II. LANDASAN TEORI
1. Web Based Learning
Pada prinsipnya web based learning juga merupakan e-learning, hanya lebih
dispesifikasikan pada pembelajaran dengan menggunakan internet terutama yang
berupa website, web mail, mailing list dan bulletin board yang semua fasilitas
tersebut masih berbasis web. Website sendiri adalah sejumlah halaman yang dapat
berupa isi (content) sesuai dengan jenis website tersebut. Isi website disampaikan
dengan berbagai bentuk seperti text, audio, video, bahkan teknologi streaming.
2. Tahapan Pengembangan Web Based Learning
Dalam pengembangan web based learning terdapat beberapa elemen yang
perlu diperhatikan, seperti : interaktifitas (tutorial), pewarnaan, content, layout, dan
lain-lain. Tutorial merupakan bagian dari proses pembelajaran. Tutorial merupakan
satu bentuk interaksi antara pengajar (dosen/pakar) dengan mahasiswa. Interaksi
dan komunikasi merupakan inti dari sebuah tutorial (Wardani, 2000).
3. Internet
Secara teknis, internet adalah suatu jaringan komputer global yang terbentuk
dari jaringan-jaringan komputer lokal dan regional, memungkinkan komunikasi data
antar komputer-komputer yang terhubung ke jaringan tersebut. Dari segi ilmu
pengetahuan, internet merupakan sebuah perpustakaan besar yang didalamnya
terdapat jutaan (bahkan milyaran) informasi atau data yang dapat berupa teks,
grafik, suara maupun animasi dan lain–lain dalam bentuk media elektronik. Setiap
orang dapat mengunjungi perpustakaan tersebut kapan saja dan dimana saja.
Sedangkan dari segi komunikasi, internet adalah sarana yang sangat efisien dan
efektif untuk melakukan pertukaran informasi jarak jauh maupun di dalam
lingkungan tertentu.
4. Joomla
Joomla merupakan web berbasis Content Management System (CMS) dan
bersifat opensource yang dapat digunakan oleh siapa saja untuk keperluan
pembuatan website yang sangat kompleks. Para pengembang joomla fokus pada
prinsip aplikasi gratis dan tidak ingin membuat sesuatu yang bersifat komersial.

3. 3
Kata joomla sendiri berasal dari bahasa swahili yang berarti “all together” atau ”as
a whole” atau “bersama-sama”.
5. Macromedia Flash 8
Macromedia Flash merupakan aplikasi yang banyak digunakan oleh para
profesional desain ataupun animator karena kelebihannya dalam menampilkan
multimedia, gabungan antara grafis, animasi, suara, serta interaktivitas bagi user
(Dhani Yudhiantoro : 2003).
Macromedia Flash 8 adalah versi terbaru dari Flash Sejak diakuisisi oleh
Adobe, kemampuan dan fitur-fiturnya menjadi sangat dahsyat dan lengkap sehingga
dapat digunakan untuk membuat berbagai macam aplikasi seperti animasi web
kartun, multimedia interaktif sampai aplikasi untuk ponsel. Selain itu Flash 8 juga
kompatible dengan software-software desain dan animasi lainnya.
6. Unified Modelling Language (UML)
UML (Unified Modeling Language) adalah sebuah bahasa standard
yang digunakan untuk menspesifikasikan, memvisualisasikan, membangun, dan
mendokumentasikan objek-objek dari sistem software, untuk urusan pemodelan
dan sistem non-software. Bahasa permodelan ini digunakan untuk memahami,
mendesain, menkonfigurasikan, memelihara dan mengontrol informasi yang
terdapat dalam sebuah sistem.
UML menggambarkan struktur yang statis (static structure) dan kelakuan
yang dinamis (dynamic behavior) dari sebuah sistem. Sebuah sistem dalam
UML digambarkan sebagai kumpulan objek diskrit yang saling berinteraksi untuk
mencapai suatu tujuan yang berguna bagi pengguna. Dalam struktur yang
statis, UML mendefinisikan objek-objek penting yang terdapat dalam system
dan implementasinya, dan menggambarkaninteraksi antara objek-objek tersebut.
Sedangkan dalam kelakuan yang dinamis, UML mendefinisikan sejarah suatu
objek dan dan komunikasi antar objek tersebut untuk mencapai suatu tujuan.
7. Mengenal StartUML
StarUML adalah software permodelan yang mendukung UML (Unified
Modeling Language). Berdasarkan pada UML version 1.4 dan dilengkapi 11 macam
diagram yang berbeda, mendukung notasi UML 2.0 dan juga mendukung
pendekatan MDA (Model Driven Architecture) dengan dukungan konsep UML.
StarUML dapat memaksimalkan pruduktivitas dan kualitas dari suatu software
project.
8. Struktur Navigasi
Struktur navigasi adalah struktur alur cerita dari sebuah program sebelum
menyatukan elemen-elemen yang digunakan dalam aplikasi multimedia, sebaiknya
kita mendefinisikan objek-objek dan merancang tampilan. Agar semua objek yang
termasuk di dalam aplikasi tersebut tidak mengalami kerancuan informasi, dengan
kata lain semua tampilan harus dapat memberikan informasi yang bulat dan utuh

4. 4
sehingga dapat tercapai suatu pembentukan aplikasi multimedia. Dalam pembuatan
aplikasi multimedia ada empat macam struktur navigasi yang dapat digunakan.
III. METODE PENELITIAN
Tahapan dan Langkah - Langkah Penelitian
Penelitian pengembangan (Research and Development) ini terdiri dari tiga
tahap, di mana langkah-langkah penelitian mengacu pada R & D cycle borg dan
Gall (1983), dengan uraian penjelasan yang telah dimodifikasi dan diselaraskan
dengan tujuan dan kondisi penelitian yang sebenarnya, seperti yang digambarkan
secara ringkas pada tabel 3.1
Tabel Tahapan Pengembangan Model
Tahap Langkah Aktivitas
Pra Pengembangan
Model
1
Penelitian dan pengumpulan data awal
Penelitian pendahuluan
Penyusunan hasil penelitian pendahuluan -
Analisa kebutuhan
Pengembangan
Model
2
Pembuatan web based tutorial berbantuan
komputer Pengantar Teori Graf.
- Hal pertama yang dilakukan untuk
membuat sebuah web dengan
menggunakan CMS Joomla adalah
dengan menginstall program pendukung
yaitu PHP dan Apache (Kedua program
tersebut telah ada pada AppServ).
- Menginstalasi CMS Joomla, joomla dapat
diinstalasi jika software pendukung sudah
ada.
- Membuat struktur navigasi untuk web
based tutorial dan perancangan halaman
web.
- Memilih template yang terdapat pada
CMS Joomla.
- Membuat Section berdasarkan struktur
navigasi yang telah dibuat.
- Membuat Category, cara membuat
category ini sama dengan membuat
section. Namun, perbedaanya adalah
harus menetapkan category yang dipilih
akan dimasukkan kedalam section
tertentu.

5. 5
3 - Membuat Content Item.
- Membuat Menu lalu mengaturnya sesuai
dengan keinginan.
- Memasukkan content yang telah disiapkan
sebelumnya, mulai dari materi, artikel,
dan video.
- Upload hasil pembuatan website tadi
Evaluasi Formatif, mengacu pada : Hannafin
& Peck (1988)
Uji Coba Awal
Kajian ahli dengan ahli materi, ahli media,
dan ahli teknologi informasi dan komunikasi
Perbaikan
Penerapan Model 4
5
Uji Coba Lapangan
Uji coba pada 60 responden mahasiswa
jurusan Sistem Informasi (S1) Universitas
Gunadarma.
Perbaikan Operasional
Penyempurnaan Web-Based Tutorial
berbantuan Komputer Pengantar Teori Graf
IV. ANALISIS DAN PERANCANGAN
1. Analisa Masalah
Pengantar Teori Graf merupakan salah satu mata kuliah yang sebagian besar
materi yang disajikan dalam bentuk gambar. Gambar-gambar tersebut berfungsi
untuk memperjelas proses-proses yang terjadi pada setiap materi, gambar yang yang
terdapat dalam buku biasanya tidak ditampilkan secara jelas dan hanya sedikit yang
digambarkan sehingga tidak jarang mahasiswa kurang mendapatkan pemahaman
bagaimana proses dari gambar tersebut.akan sangat berbeda jika gambar-gambar
tersebut ditampilkan dalam bentuk animasi, gambar bergerak, atau video.
Mahasiswa dapat dengan mudah memahami maksud dari gambar tersebut karena
proses dalam gambar tersebut dapat terlohat dengan jelas.
Selain itu, dari penelitian yang telah dilakukan sebelumnya oleh saudara
ferdi dan adit mengenai pengembangan teknologi informasi dan komunikasi untuk
meningkatkan mutu pendidikan didapatkan hasil bahwa mahasiswa membutuhkan
suatu media pembelajaran lain yang dapat membantu proses belajar mahasiswa.
Media pembelajaran ini berupa media pembelajaran berbasis TIK (Teknologi
Informasi dan Komunikasi) seperti CAI (Computer Assisted Instruction) berbasis
web yang sedang penulis buat.

6. 6
2. Perancangan Sistem
a. Diagram Use Case
user
membuka website
memilih menu mata kuliah
memilih materi
mengikuti pembelajaran
mengerjakan latihan
memperoleh nilai
admin
login
mengelola data
<<include>>
<<include>>

7. 7
b. Diagram Activity
user aplikasi
membuka website elearning menampilkan menu utama
menampilkan menu mata kuliah
memilih menu mata kuliah
memilih halaman materi
menampilkan halaman materi
mengikuti pembelajaran
menampilkan soal
mengerjakan soal
mengoreksi jawaban
memperoleh nilai

8. 8
c. Diagram Sequence
3. Perancangan Struktur Navigasi
4. Penelitian Uji coba hasil pengembangan media pembelajaran berbasis web
(web-based learning) untuk mata kuliah Pengantar Teori Graf
Dalam pengembangan website ini sebelumnya telah dilakukan evaluasi
formatif oleh rekan penulis sebelumnya yang meliputi :
1. Kajian ahli materi
Hasil dari kajian ahli materi menjelaskan bahwa aplikasi CAI Pengantar
Teori Graf sudah baik dan layak untuk digunakan.
: user
halaman utama halaman mata kuliah halaman materi pembelajaran halaman tes formatif halaman hasil tes formatif
1 : membuka web()
2 : klik menu mata kuliah()
3 : tampilkan menu mata kuliah()
4 : klik materi pembelajaran()
5 : tampilkan materi pembelajaran()
6 : mengikuti pembelajaran()
7 : klik menu tes formatif()
8 : tampilkan halaman tes formatif()
9 : mengerjakan soal tes formatif()
10 : mengoreksi jawaban()
11 : tampilkan hasil tes formatif()
Halaman
Utama
Artikel Video On
Demand
Other Link
Tentang
Learning site
contact us Mata
Kuliah
UG
Services

9. 9
2. Kajian ahli media
Pengkajian media dilakukan oleh Widyo Nugroho selaku ahli media
(instructional development). Hasil dari kajian ahli media menjelaskan bahwa
cai.elearning.gunadarma.ac.id dan aplikasi CAI Pengantar Teori Graf sudah
baik dan layak untuk digunakan.
3. Kajian ahli komputer
Hasil kajian ahli media menjelaskan bahwa cai.elearning.gunadarma.ac.id
sudah sangat baik dan layak digunakan.
V. PENUTUP
A. Kesimpulan
Berdasarkan hasil dan pembahasan sebelumnya maka didapat kesimpulan
yaitu :
1. Bahan ajar berbasis web ini dapat menjadi suplemen bagi mahasiswa walaupun
sifatnya hanya optional tapi dapat dimanfaatkan juga untuk menambah
pengetahuan, wawasan khususnya tentang matakuliah Pengantar Teori Graf,
memudahkan proses belajar mengajar serta meningkatkan kualitas
pembelajaran.
2. Hasil pengisian kuisioner dari 60 responden mengenai kualitas tampilan situs
web, kualitas tampilan materi, penyajian materi, interaksi pemakai, interaksi
program menyatakan bahwa rata-rata presentasi lebih dari 50% sudah setuju
dengan semua aspek yang ada pada tampilan website ini. Namun untuk
penamaan website mudah diingat hanya sebanyak 48,33%.
B. Saran
Pembuatan bahan ajar berbasis web ini masih dalam tahap pengembangan
sehingga masih belum sempurna, baik dari sisi content maupun sisi teknologi
pendukungnya. Interaksi dengan pengguna sudah cukup baik tetapi hendaknya
ditambahkan menu help agar lebih mempermudah penggunaan website ini.