Menu Home Menu Tutorial

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