Abstract Save
5.2.2.6. Pembuatan Modul dan Tampilan ( Layout) Situs
Modul merupakan kerangka dasar dari sebuah website. Modul berisi
serangkaian perintah dan aturan yang berdasarkan logika pemrograman dengan
bahasa HTML (Hyper Text Markup Language) dan merupakan langkah lanjutan
dari perancangan model website yang ada pada tahap preliminary design.
Perintah-perintah yang ada pada modul dibuat berdasarkan fungsi-fungsi
utama yang ingin disertakan pada sistem layanan e-learning tersebut seperti yang
ada pada process spesification dan data apa saja yang mengalir dalam sistem.
Setiap fungsi akan diarahkan oleh tombol-tombol yang jika di-klik akan membawa
ke serangkaian halaman yang sesuai dengan alur logika perintah dari fungsi tersebut.
Berikut adalah fungsi-fungsi utama yang ada dalam modul website e-
learning departemen :
1. Pengaturan banners
Banners adalah ruang yang disediakan untuk menampilkan iklan komersial ataupun iklan tentang tema yang lainnya.
2. Pengaturan database menu
Database menu adalah content (isi) yang memaparkan dan menyimpan
database internal situs e-learning (dalam kategori skripsi, laporan kerja praktek, jurnal penelitian dan buku teks), data berita, dan data anggota.
Main menu adalah menu yang menampilkan pilihan-pilihan yang berkaitan
dengan fungsi-fungsi utama dari sistem website e-learning departemen bagi
pengunjung situs.
4. Pengaturan user menu
User menu adalah menu yang menampilkan pilihan-pilihan untuk setiap
member yang berhasil login seperti edit account.
5. Pengaturan login form
Login form adalah formulir yang berfungsi sebagai halaman pendaftaran bagi
pengunjung yang memang telah menjadi member website.
Berikut adalah tampilan layout untuk tiap-tiap halaman yang terdapat pada
website e-learning. 1. Halaman HOME
Halaman ini menampilkan menu-menu yang menjadi pilihan bagi
pengunjung situs seperti main menu (yang berisi pilihan home, berita, forum,
jadwal kuliah, mata kuliah, perpustakaan, dan laboratorium), logo departemen,
serta login form (login ini dapat dipergunakan oleh member maupun
administrator). Tata cara penulisan script dengan bahasa HTML dapat dilihat pada halaman lampiran dan hasilnya dapat dilihat pada gambar 5.16.
Gambar 5.16. Tampilan Halaman HomeWebsite E-Learning
2. Halaman Daftar
Halaman ini merupakan tempat di mana pengunjung bisa mendaftarkan
diri menjadi member dari situs e-learning. Halaman ini berisi textbox (nama,
tanggal lahir, tahun lahir, e-mail dan username), textbox password (password
dan ketik ulang password), menu list (jenis kelamin dan bulan lahir), dan
command button (daftar). Tata cara penulisan script dengan bahasa HTML dapat dilihat pada halaman lampiran dan hasilnya dapat dilihat pada gambar 5.17.
Gambar 5.17. Tampilan Halaman Daftar
3. Halaman Berita
Halaman berita dibuat sebagai tampilan untuk berita yang diposting oleh
administrator maupun user yang diberikan wewenang khusus untuk mengisi
berita pada website. Tata cara penulisan script dengan bahasa HTML dapat
Gambar 5.18. Tampilan Halaman Berita
4. Halaman Forum
Halaman ini merupakan tempat diskusi antara member. Topik diskusi
dapat berupa berbagai topik yang berkaitan dengan disiplin ilmu teknik industri ataupun agenda-agenda yang direncanakan oleh departemen. Administrator membuat beberapa aturan diskusi forum yang harus ditaati, hal ini dilakukan
bertujuan untuk menjaga kelancaran diskusi. Tata cara penulisan script dengan
bahasa HTML dapat dilihat pada halaman lampiran dan hasilnya dapat dilihat pada gambar 5.19.
Gambar 5.19. Tampilan Halaman Forum
5. Halaman Jadwal Kuliah
Halaman ini berisi jadwal kuliah mahasiswa Teknik Industri USU. Berisi
link yang bertuliskan nama hari (Senin hingga Jumat) dan jika link tersebut diklik maka akan muncul tabel yang berisi jadwal kuliah untuk hari tertentu.
Tata cara penulisan script dengan bahasa HTML dapat dilihat pada halaman
Gambar 5.20. Tampilan Halaman Jadwal Kuliah
6. Halaman Mata Kuliah
Halaman ini berisi materi perkuliahan yang dapat diakses oleh member
website e-learning. Tampilan halamannya berupa nama mata kuliah dan
terdapat link detail>> yang jika diklik akan membawa member untuk
memasuki halaman baru di mana member bisa men-download materi
perkuliahan tersebut. Tata cara penulisan script dengan bahasa HTML dapat
Gambar 5.21. Tampilan Halaman Mata Kuliah
7. Halaman Perpustakaan
Halaman perpustakaan dibuat untuk memudahkan pengguna website untuk
mencari koleksi perpustakaan departemen. Dengan mengetikkan sebuah kata
kunci atau frase, maka search engine akan mencari dan mendaftarkan item-
item mana saja yang cocok dengan kata kunci yang diberikan oleh pengguna.
Tata cara penulisan script dengan bahasa HTML dapat dilihat pada halaman
lampiran dan hasilnya dapat dilihat pada gambar 5.22. (sebagai contoh adalah halaman pencarian buku bacaan perpustakaan).
Gambar 5.22. Tampilan Halaman Perpustakaan
8. Halaman Laboratorium
Halaman laboratorium dibuat untuk memfasilitasi agenda yang dibawa oleh laboratorium-laboratorium di Departemen Teknik Industri USU. Dalam perancangan sistem ini, yang dijadikan sampel perancangan hanyalah Laboratorium Ergonomi dan Analisa Perancangan Sistem Kerja, Laboratorium Inti, Laboratorium Pengukuran dan Statistik, dan Laboratorium Sistem
Produksi. Tata cara penulisan script dengan bahasa HTML dapat dilihat pada
Gambar 5.23. Tampilan Halaman Laboratorium
Gambar 5.25. Tampilan Halaman Laboratorium Inti
Gambar 5.27. Tampilan Halaman Laboratorium Sistem Produksi
5.2.3. Detail Design and Development
Dalam tahap ini, struktur database dirancang dan seluruh relasi database
tersebut yang akan dihubungkan ke dalam aplikasi website disusun. Kemudian
seluruh rancangan dari tiap subsistem digabungkan untuk dibentuk menjadi satu
sistem website e-learning yang lengkap. Rancangan website ini lalu diujicoba di
local host sebelum diluncurkan secara online. Pengujian di local host ini boleh
dibilang merupakan prototype dari sistem e-learning itu sendiri. Jika berhasil