6
1. Deskripsi Sistem
Sistem atau media pembelajaran berbasis web ini berperan sebagai alat peraga dalam
mengenal dan mempelajari berbagai bentuk bangun geometri yang dipelajari siswa
sekolah dasar. Bangun geometri tersebut divisualisasikan dalam bentuk 3D untuk
memudahkan siswa dalam mengenal dan membedakan
berbagai bentuk
bangun geometri.
Sistem ini
dibuat dengan
menggunakan bahasa pemrograman PHP untuk membangkitkan kode-kode VRML
serta dengan mengimplementasikan node
ekstrusi pada VRML untuk membuat model bangun
geometri lalu
hasilnya divisualisasikan melalui peramban web yang
telah terpasang plug-in VRML Browser.
2. Karakteristik Pengguna
Penggunaan sistem ini secara khusus ditujukan kepada guru dan siswa sekolah
dasar untuk membantu belajar dan mengenal bentuk bangun datar dan ruang.
3. Kebutuhan Fungsional
Landasan kebutuhan fungsional sistem diperoleh dari hasil wawancara dan pengisian
kuesioner terhadap responden. Responden terdiri atas dua orang guru sekolah dasar yang
sudah memiliki pengalaman yang cukup lama dalam mengajar. Berdasarkan hasil tersebut
diketahui kebutuhan fungsional dari sistem ini dapat dilihat pada Tabel 1.
Tabel 1 Tabel kebutuhan fungsional sistem.
No. Kebutuhan Fungsional
1. Menampilkan visualisasi bentuk 3D
objek geometri baik itu bangun datar maupun bangun ruang.
2. Menampilkan
gridline pada objek geometri sebagai alat bantu ukur.
3. Memutar
bangun geometri
ke berbagai sisi.
4. Menampilkan rumus luas bangun
datar atau volum bangun ruang yang dipilih.
5. Menghitung luas bangun datar atau
volum bangun ruang berdasarkan parameter yang dimasukkan.
6. Menampilkan materi pelajaran atau
pengertian dan ciri-ciri bentuk objek geometri.
7. Memberikan fasilitas
quiz yang dapat mengukur
kemampuan pengguna
dalam memahami bangun geometri.
4. Batasan Sistem
Batasan-batasan dalam sistem ini adalah : 1. Bangun
geometri yang
dimodelkan terbatas hanya terdiri atas bangun datar
dan bangun ruang yang dipelajari di sekolah dasar.
2. Objek yang divisualisasikan hanya terdiri atas satu buah objek setiap tampilannya.
3. Satuan besaran objek diukur berdasarkan satuan kotak pada
gridline. 4. Pemberian
parameter ukuran
model bangun geometri dibatasi dengan nilai
integer dari 1 sampai 10. 5. Materi yang ditampilkan pada bangun
datar hanya
pengertian dan
rumus perhitungan luas bangun datar.
6. Materi yang ditampilkan pada bangun ruang hanya pengertian dan rumus
perhitungan volum bangun ruang .
7. Soal-soal pada quiz hanya mencakup soal
untuk menebak nama, mengukur, serta menghitung.
5. Kebutuhan Data
Berdasarkan analisis kebutuhan sistem yang telah dilakukan sebelumnya dapat
disimpulkan bahwa data yang diperlukan adalah:
1. Pengertian dan ciri-ciri beberapa bangun datar dan bangun ruang.
2. Data rumus luas bangun datar. 3. Data rumus volum bangun ruang.
4. Gambar-gambar bangun datar dan bangun ruang.
Data tersebut diperoleh dari buku-buku pelajaran matematika sekolah dasar baik itu
dalam bentuk buku teks maupun dalam bentuk e-book
yang disediakan
oleh Dinas
Pendidikan Nasional.
6. Perangkat Keras dan Perangkat Lunak
Sistem
Perangkat lunak yang digunakan untuk penelitian ini adalah:
1. Windows 7 Professional sebagai sistem
operasi, 2.
Adobe Dreamweaver CS3, 3.
VRMLPad, 4.
Apache versi 2.2.4 sebagai web server,
5. Cosmo Player atau Cortona3D Viewer
sebagai plug-in VRML Browser.
Perangkat keras yang digunakan untuk penelitian ini adalah :
1. Prosessor
Intel® Core™ 2 Duo CPU T5750 2.00 GHz,
7 2.
RAM 2.00 GB, dan 3.
Harddisk berkapasitas 250 GB.
Desain Sistem
Setelah menganalisis kebutuhan sistem, tahap selanjutnya yaitu membuat desain
sistem. Hal ini bertujuan untuk memberikan kemudahan
ketika mengimplementasikan
perangkat lunak yang akan dibangun. Desain sistem terdiri atas desain proses dan desain
antarmuka.
1. Desain Proses Sistem
Desain proses sistem dirancang dengan membuat diagram alir proses yang terdiri atas
diagram alir tutorial dan diagram alir quiz.
Diagram alir tutorial dapat dilihat pada Lampiran 2. Diagram alir quiz dapat dilihat
pada Lampiran 3. Desain proses sistem ini bertujuan untuk membantu dan memudahkan
dalam membuat algoritme sistem.
2. Desain Antarmuka
Antarmuka berfungsi
sebagai sarana
interaksi antara manusia dengan komputer. Antarmuka sistem ini terbagi menjadi empat
menu, antara lain: menu home, menu tutorial,
menu quiz, dan menu manual. Tampilan
desain antarmuka dalam sistem ini dapat dilihat pada lampiran.
2.1. Antarmuka Menu Home
Menu home merupakan menu utama pada
sistem. Ini merupakan bagian terdepan dari sistem sebelum pengguna dapat menggunakan
sistem. Desain antarmuka menu home hanya
terdiri atas sambutan kepada pengguna, pengenalan sistem, dan tujuan sistem.
2.2. Antarmuka Menu Tutorial
Antarmuka pada menu tutorial dibagi menjadi tiga tab. Pada tab pertama diberi
nama input karena di dalamnya berisi form
input dinamis serta pendeteksi peramban dan VRML plug-in yang dipakai oleh pengguna.
Form input dinamis ini dapat berubah-ubah sesuai dengan
input yang dimasukkan sebelumnya
dan terdiri
atas beberapa
dropdown list. Dipergunakannya dropdown list adalah untuk membatasi dan menghindari
terjadinya kesalahan dalam memasukkan input. Antarmuka menu tutorial dapat dilihat
pada Lampiran 4.
Pada tab kedua diberi label tampilan karena isinya hanya berupa
frame berukuran besar yang menampilkan hasil visualisasi dari
kode VRML yang sudah diterjemahkan oleh VRMLBrowser
menjadi sebuah
objek geometri
dalam bentuk
3D. Tampilan
antarmukanya dapat dilihat pada Lampiran 5. Tab terakhir diberi nama penjelasan. Di
dalamnya terdapat penjelasan tentang bangun geometri yang dipilih oleh pengguna yang
terdiri atas rumus bangun, nilai parameter ukuran bangun, perhitungan luas atau volum
bangun serta pengertian, ciri-ciri, dan gambar jaring-jaring bangun ruang. Tampilannya
dapat dilihat pada Lampiran 6.
2.3. Antarmuka Menu Manual
Antarmuka pada menu manual hanya berisi ketentuan penggunaan sistem dan
kebutuhan sistem yang harus dipenuhi pengguna agar sistem dapat berjalan dengan
baik pada komputer pengguna. Antarmuka menu manual dapat dilihat pada Lampiran 7.
2.4. Antarmuka Menu Quiz
Rancangan antarmuka untuk menu quiz seperti yang terlihat pada Lampiran 8 terdiri
atas form yang berisi soal dan pilihan jawaban
serta frame berukuran sedang. Frame ini
menampilkan hasil visualisasi dari kode VRML yang sudah diterjemahkan oleh
VRMLBrowser menjadi
sebuah objek
geometri dalam bentuk 3D yang merupakan bagian dari soal. Seluruh soal yang disajikan
merupakan soal-soal yang berkaitan dengan pengamatan terhadap bangun yaitu mengenal
nama atau jenis bangun, mengukur, serta menghitung luas atau volume bangun. Jika
semua soal terjawab maka pada akhir
quiz sistem akan menampilkan akumulasi skor atau
nilai yang merupakan hasil jawaban dari sesi quiz.
Implementasi Sistem
Pada tahap ini dilakukan pembangunan antarmuka yang telah dirancang sebelumnya.
Selanjutnya sistem dikembangkan dengan menambahkan fungsi untuk memvisualisasi
kode VRML, menghitung luas atau volum bangun,
dan menampilkan
materi pembelajaran.
1. Pembangunan Antarmuka
Antarmuka dibangun
dengan menggunakan HTML, CSS, dan Javascript.
HTML dan CSS berperan penting dalam terciptanya
antarmuka sistem
secara keseluruhan. Javascript digunakan untuk
8 membuat antarmuka
form dinamis untuk memasukkan
input bagi pengguna.
1.1. Menu Home
Menu home merupakan menu utama pada
sistem. Ini merupakan bagian terdepan dari sistem sebelum pengguna dapat menggunakan
sistem. Menu home hanya terdiri atas
sambutan kepada pengguna, pengenalan tentang sistem, dan tujuan sistem.
1.2. Menu Tutorial
Menu tutorial dibagi menjadi tiga tab
antara lain tab input, tab tampilan, dan tab
penjelasan. Hal ini untuk memudahkan pengguna
dalam mempelajari
bangun geometri yang diinginkannya secara fokus.
Tab input ditujukan untuk memasukkan input kepada sistem agar menampilkan
bangun yang
diinginkan berdasarkan
parameter yang dimasukkan. Pada tab input
terdapat form pengisian input yang dapat
berubah-ubah secara otomatis dinamis khususnya pada
form input ukuran. Isi form disesuaikan dengan jenis atau nama bangun
yang dipilih. Form ini dibuat dengan
menggunakan Javascript karena bahasa ini berjalan pada komputer
client sehingga prosesnya cepat tanpa membutuhkan koneksi
ke web server untuk me-load atau me-refresh
halaman web. Saat pengguna mengubah input
nama bangun, form di bawahnya akan turut
berubah secara
otomatis menyesuaikan
dengan nama bangun yang dipilih. Setelah pengguna mengisi
form selanjutnya meng-klik tombol lihat untuk menampilkan visualisasi,
perhitungan, dan materi pembahasannya. Selain itu juga pada
tab input terdapat pendeteksi peramban web dan
VRML plug-in yang dipakai oleh komputer pengguna.
Pendeteksi ini dibuat dengan menggunakan Javascript.
Tujuan utamanya
untuk mengetahui apakah peramban web tersebut
sudah terpasang VRML plug-in atau belum.
Jika belum maka sistem akan memberi tahu pengguna dan menunjukkan
link akses untuk mengunduh perangkat lunak
VRML plug-in di situs aslinya. Karena tanpa adanya
VRML plug-in pada peramban web, sistem tidak akan
berjalan dengan semestinya. Tampilan tab
input dapat dilihat pada Lampiran 9. Tab yang kedua yaitu tab tampilan yang
isinya berupa frame berukuran besar yang
menampilkan visualisasi
model bangun
geometri. Tab ini dikhususkan hanya untuk
melakukan pengamatan terhadap bentuk dari bangun.
Input yang dimasukkan pada form input diproses berdasarkan parameternya
dengan menggunakan
PHP sehingga
menghasilkan file yang mengandung kode-
kode VRML kemudian isi file tersebut
diterjemahkan oleh VRML plug-in menjadi
visualisasi model bangun geometri yang sesuai dengan
input. Tampilannya seperti yang ditunjukkan pada Lampiran 10.
a
b Gambar 10
Panel navigasi examine: a
Navigasi pada
Cortona3D Viewer, b Navigasi pada
Cosmo Player. VRML
Browser sudah
menyediakan fasilitas
panel navigasi
objek untuk
melakukan pengamatan
terhadap objek,
namun untuk sistem ini hanya panel examine
yang diaktifkan karena untuk mengamati bentuk atau seluruh sisi pada suatu objek
geometri hanya
membutuhkan kontrol
navigasi untuk memutar, menggeser, dan memperbesar
zoom tampilan. Tampilan panel navigasi dapat dilihat pada Gambar 10.
Pada objek geometri juga diberikan sensor bola
Sphere Sensor agar objek dapat diputar dengan
mouse berdasarkan arah gerak mouse ketika objek diklik dan digeser.
Latar belakang
background pada
visualisasi diberi warna putih agar warna latar dengan objeknya terlihat kontras sehingga
memudahkan pengguna dalam mengamati objeknya.
Selain itu sudut pandang view point dari
pengguna diatur sedemikian rupa agar objek dapat terlihat seluruhnya pada layar. Caranya
dengan menjauhkan jarak antara objek dengan pengguna ketika ukuran objek besar begitu
juga sebaliknya jika objek berukuran kecil maka jarak antara pengguna dengan objek
menjadi lebih dekat dari jarak normal
default sehingga objek tidak terlihat terlalu kecil dan menyesuaikan dengan ukuran layar
atau frame.
Setelah dilakukan beberapa kali percobaan dengan menampilkan objek dengan berbagai
variasi ukuran pada layar tampilan didapatkan sebuah persamaan atau rumus koordinat posisi
sudut pandang x,y,z yang ideal untuk
9 menampilkan bangun agar terlihat utuh
seluruhnya dengan jelas saat bangun pertama kali ditampilkan pada layar visualisasi.
Persamaan dari nilai x, y, z masing-masing adalah:
; {
; Keterangan:
x,y,z = koordinat posisi sudut pandang; y
o
= ukuran tinggi vertikal bangun; P
sumbu
= ukuran sumbu terpanjang bangun; Skripnya dapat dilihat pada Gambar 11.
Gambar 11 Skrip untuk mengatur tampilan
VRML dalam sistem. Tab terakhir yaitu tab penjelasan. Pada tab
ini terdapat
rumus, perhitungan,
dan pengertian dari bangun geometri yang di-
input sebelumnya pada
form input dinamis. Tab ini dikhususkan untuk mempelajari rumus, cara
perhitungan, serta pengertian dari bangun yang dimaksud. Beberapa rumus dan notasi
perhitungan dibuat dengan menggunakan bahasa MathML. Hal ini agar notasi rumus
terlihat lebih baik. MathML merupakan bahasa yang digunakan untuk menampilkan
notasi matematika pada halaman web. Pada tab penjelasan juga ditampilkan pembahasan
mengenai pengertian dan ciri-ciri bangun disertai dengan gambar bangunnya seperti
yang terlihat pada Lampiran 11.
Saat pertama kali pengguna membuka menu tutorial yang ditampilkan hanyalah
tab input,
sedangkan tab
yang lainnya
disembunyikan. Ini karena pengguna belum memasukkan
input ke dalam sistem sehingga sistem tidak menampilkan bangun geometri
yang diinginkan.
1.3. Menu Quiz
Menu quiz terdiri atas form input yang
berisi soal berserta pilihan jawabannya dan juga
frame berukuran
besar yang
menampilkan hasil visualisasi dari kode VRML yang sudah diterjemahkan oleh
VRMLBrowser menjadi
sebuah objek
geometri dalam bentuk 3D. Hasil visualisasi ini merupakan bagian yang dituju oleh soal.
Tampilan ini dapat terlihat pada Lampiran 12. Jika semua soal terjawab maka pada akhir
quiz sistem menampilkan akumulasi skor atau nilai yang merupakan hasil jawaban dari sesi
quiz.
Jumlah soal pada quiz setiap sesinya
adalah sebanyak 10 soal. Soal-soal pada quiz
dibuat tanpa menggunakan database karena
soal beserta visualisasi bangunnya di- generate
secara acak oleh sistem namun beraturan pada setiap
sesinya sehingga
soal-soal dan
visualisasi bangun pada sesi yang satu dengan yang lainnya diharapkan berbeda. Tiga soal
pertama merupakan soal tebak nama atau jenis bangun. Enam soal berikutnya merupakan
soal ukur-mengukur bangun berdasarkan ukuran
gridline dari bangun tersebut. Sisanya merupakan soal berhitung yaitu menghitung
luas atau volum model bangun yang ditampilkan oleh
VRMLBrowser. Skor merupakan akumulasi nilai yang
memiliki range dari 0 sampai 100. Besarnya
nilai point pada soal bervariasi sesuai jenis
soal. Untuk soal tebak nama atau jenis bangun bernilai 5 karena jenis soal ini termasuk dalam
kategori mudah, sedangkan untuk soal ukur- mengukur bangun bernilai 10 karena tipe soal
ini termasuk dalam kategori sedang, dan soal menghitung luas atau volum bernilai 15
karena tipe soal ini termasuk dalam kategori sulit. Jika seluruh soal 10 soal terjawab,
maka pada akhir sesi akan ditampilkan total nilai
yang diperoleh
pengguna, pesan
apresiasi, dan tombol main lagi seperti yang terlihat pada Lampiran 13.
1.4. Menu Manual
Menu manual berisi tentang ketentuan penggunaan sistem dan kebutuhan sistem
yang harus dipenuhi pengguna agar sistem dapat berjalan dengan baik pada komputer
10 pengguna.
Ketentuan penggunaan
memberikan petunjuk kepada pengguna untuk mempelajari
cara menggunakan
sistem. Persyaratan sistem
system requirement berisi tentang
browser dan
plug-in yang
direkomendasikan untuk
dipasang pada
komputer pengguna agar sistem dapat berjalan dengan baik.
2. Pembangunan Database
Pada sistem ini data bangun geometri tidak dibangun atau disimpan dengan menggunakan
perangkat lunak database seperti MySQL.
Data ini cukup disisipkan saja ke dalam skrip PHP karena data yang dibutuhkan untuk
sistem ini tidak terlalu banyak sehingga tidak memerlukan perangkat lunak
database untuk mengelolanya. Data yang dibangun antara lain
data rumus bangun geometri dan data pengertian bangun geometri.
3. Pembangkitan Kode VRML