bab iii desain dan pembuatan program

35
Laporan Tugas Akhir BAB III STT Telematika Telkom Purwokerto 26 D310051 BAB III DESAIN DAN PEMBUATAN PROGRAM 3.1. INSTRUMEN PENELITIAN Dalam melakukan sebuah penelitian, instrumen (alat bantu) yang digunakan selama proses menjadi sebuah hal penting yang akan mempengaruhi hasil dari penelitian. Dalam hal ini penelitan yang dimaksud adalah perancangan dan pembuatan program. Apabila alat bantu yang digunakan selama proses perancangan dan pembuatan program dalam kondisi yang bagus dan ditunjang dengan data-data yang sesuai maka proses perancangan dan pembuatan program akan semakin mudah dan lancar. 3.1.1. Hardware Alat bantu utama yang digunakan adalah berupa PC (dalam hal ini Laptop). PC berperan sebagai alat perancangan sekaligus pembuatan program karena pada dasarnya modul pembelajaran yang dibuat secara keseluruhan menggunakan aplikasi yang tentunya memerlukan PC sebagai tempat instalasi aplikasi tersebut. Keluaran dari tugas akhir ini adalah sebuah aplikasi modul pembelajaran komunikasi serat optik yang hanya bisa digunakan untuk PC, sehingga tidak memerlukan hardware lain seperti handphone. Pada gambar 3.1. merupakan hardware PC yang digunakan selama proses pengerjaan tugas akhir. Gambar 3.1. Sampel PC PC yang digunakan selama proses pembuatan tugas akhir minimal harus memiliki spesifikasi sebagai berikut: a. Komputer IBM PC atau kompatibel dengan prosesor 486

Upload: others

Post on 10-Nov-2021

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: BAB III DESAIN DAN PEMBUATAN PROGRAM

Laporan Tugas Akhir BAB III

STT Telematika Telkom Purwokerto 26 D310051

BAB III

DESAIN DAN PEMBUATAN PROGRAM

3.1. INSTRUMEN PENELITIAN

Dalam melakukan sebuah penelitian, instrumen (alat bantu) yang digunakan

selama proses menjadi sebuah hal penting yang akan mempengaruhi hasil dari

penelitian. Dalam hal ini penelitan yang dimaksud adalah perancangan dan pembuatan

program. Apabila alat bantu yang digunakan selama proses perancangan dan

pembuatan program dalam kondisi yang bagus dan ditunjang dengan data-data yang

sesuai maka proses perancangan dan pembuatan program akan semakin mudah dan

lancar.

3.1.1. Hardware

Alat bantu utama yang digunakan adalah berupa PC (dalam hal ini

Laptop). PC berperan sebagai alat perancangan sekaligus pembuatan program

karena pada dasarnya modul pembelajaran yang dibuat secara keseluruhan

menggunakan aplikasi yang tentunya memerlukan PC sebagai tempat instalasi

aplikasi tersebut. Keluaran dari tugas akhir ini adalah sebuah aplikasi modul

pembelajaran komunikasi serat optik yang hanya bisa digunakan untuk PC,

sehingga tidak memerlukan hardware lain seperti handphone. Pada gambar

3.1. merupakan hardware PC yang digunakan selama proses pengerjaan tugas

akhir.

Gambar 3.1. Sampel PC

PC yang digunakan selama proses pembuatan tugas akhir minimal harus

memiliki spesifikasi sebagai berikut:

a. Komputer IBM PC atau kompatibel dengan prosesor 486

Page 2: BAB III DESAIN DAN PEMBUATAN PROGRAM

27

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

b. RAM 16 MB untuk Window 95 ke atas atau 32 MB untuk Window NT

Workstations 4.0

c. Microsoft Window 95 atau yang terbaru atau Window NT Workstations 4.0

d. 486DX/66Mhz atau prosesor yang lebih tinggi (Pentium atau prosesor

lainnya), atau prosesor Alpha untuk Microsoft Windows NT Workstations

e. Ruang harddisk tersisa minimum 100 MB

Spesifikasi PC tersebut merupakan sarat agar PC yang digunakan untuk

pengerjaan tugas akhir dapat di-instal program aplikasi Visual basic 6.

Semakin baik spesifikasi PC yang digunakan maka proses pembuatan tugas

akhir akan semakin mudah dan lancar.

3.1.2. Software

Software (aplikasi) utama yang digunakan selama proses perancangan

dan pembuatan program adalah Visual basic 6. Di dalam aplikasi inilah proses

design, coding, dan testing dilakukan. Dan untuk menginstal program Visual

basic di PC, PC yang digunakan harus memenuhi persyaratan minimum seperti

yang telah disebutkan sebelumnya.

Selain visual basic, terdapat beberapa software tambahan yang digunakan

selama proses pengerjaan tugas akhir, yatu Microsoft access 2007, Microsoft

visio 2007, dan Star UML.

Microsoft access 2007 digunakan sebagai aplikasi pengolah database. Di

dalam modul pembelajaran yang dibuat dalam tugas akhir ini, terdapat

beberapa aplikasi yang membutuhkan database. Aplikasi yang dimaksud

adalah aplikasi Simulasi Warna, perhitungan Link budget, dan Simulasi Soal.

Microsoft visio 2007 dan Star UML digunakan untuk membuat flowchart dan

diagram-diagram seperti diagram usecase, diagram activity, dan diagram Class.

3.2. DIAGRAM USECASE, ACTIVITY, DAN CLASS

3.2.1. Diagram Usecase

Diagram usecase merupakan diagram yang menggambarkan interaksi

antara komponen-komponen dari sebuah sistem yang akan dibangun.

Komponen-komponen dari diagram tersebut adalah aktor dan use-case.

Page 3: BAB III DESAIN DAN PEMBUATAN PROGRAM

28

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Dalam pembuatan modul pembelajaran komunikasi serat optik ini

komponen-komponen dari diagram usecase nya yaitu:

a. Aktor

1) Mahasiswa

2) Dosen

b. Usecase:

1) Belajar Materi

2) Belajar Penentuan Warna Serat

3) Perhitungan Link budget

4) Perhitungan Rise time budget

5) Latihan Soal

6) Login

7) Edit Soal

Dari komponen-komponen tersebut dapat dibuat diagram usecase seperti

pada gambar 3.2.

Gambar 3.2. Use Case Diagram

3.2.2. Diagram Activity

Diagram activity adalah diagram yang menggambar alur dari sistem yang

sedang dibangun. Dari diagram activity, dapat diketahui awal dari masing-

masing alur dari sistem tersebut dan juga dapat dilihat pula akhir dari alur

sistem yang dibuat.

Diagram activity dari modul pembelajaran pada tugas akhir ini, dapat

dilihat pada gambar 3.3.

Dosen

Belajar Materi

Belajar Penentuan Warna Serat

Perhitungan Link Budget

Perhitungan Rise Time Budget

Latihan Soal

Aplikasi

Login

Edit SoalDosen

Page 4: BAB III DESAIN DAN PEMBUATAN PROGRAM

29

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Gambar 3.3. Diagram Activity Program

3.2.3. Diagram Class

Diagram Class (Class diagram) adalah diagram yang menggambarkan

kelas-kelas serta paket-paket yang berada di dalam sistem aplikasi yang

dibangun. Selain itu, Class diagram juga menggambarkan relasi-relasi dari

masing-masing kelas serta paket dalam sistem tersebut.

Dalam pembuatan modul pembelajaran komunikasi serat optik, terdiri

dari beberapa kelas, yaitu:

a. Mahasiswa

b. Dosen

c. Perguruan Tinggi

d. Modul Pembelajaran

e. Sistem Komunikasi Serat Optik

f. Serat Optik

g. Power link budget

h. Rise time budget

Masing-masing kelas tersebut memiliki atribut yang berbeda-beda. Dan

dari kelas-kelas tersebut dapat dibuat class diagram seperti pada gambar 3.4.

Page 5: BAB III DESAIN DAN PEMBUATAN PROGRAM

30

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Gambar 3.4. Class diagram Program

3.3. DESAIN LAYOUT PROGRAM

Proses desain layout dilakukan menggunakan visual basic 6. Dalam visual basic,

proses desain dilakukan pada sebuah jendela yang bernama form. Masing-masing

menu di desain pada form yang berbeda sehingga mengeluarkan aplikasi output yang

berbeda. Proses desain yang terjadi cukup mudah karena pada dasarnya visual basic 6

memiliki fitur-fitur yang mempermudah designer dalam melakukan proses desain.

Selain itu, visual basic 6 juga menyediakan komponen-komponen yang bervariasi

yang dapat dimasukkan ke dalam form sebagai bagian dari aplikasi yang dibuat.

Komponen-komponen yang digunakan selama proses desain layout yaitu:

1. Label

2. Command Button

3. XP Button

4. Text box

5. XPText box

6. Frame

7. XPframe

8. Option Button

Dosen

+Nama+NIDN+Alamat

Sistem Komunikasi Serat Optik

+Jenis Optik+Jarak Link+Perhitungan Link Budget+Perhitungan Rise Time Budget+Sumber Optik+Detektor Optik

Modul Pembelajaran

+Materi+Simulasi Warna+Link Budget+Rise Time Budget+Simulasi Soal

Perguruan Tinggi

+Nama+Alamat+Jurusan

Serat Optik

+Jenis Optik+Aturan Pewarnaan+Kelebihan dan Kekurangan

Power Link Budget

+Level Tx+Level Rx+Margin SIstem+Jarak Link+Total Loss+Amplifier/Attenuation

Rise Time Budget

+Rise Time Transmitter+Rise Time Dispersi Modal+Rise Time Dispersi Material+Rise Time Receiver+Rise Time Sistem+Bandwidth Total Sistem

Dosen

+Nama+NIDN+Alamat

Perguruan Tinggi

+Nama+Alamat+Jurusan

Page 6: BAB III DESAIN DAN PEMBUATAN PROGRAM

31

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

9. List box

10. Adodc

11. Datagrid

12. Timer

3.3.1. Membuka Visual basic 6.

Langkah-langkah untuk membuka aplikasi visual basic 6 sama dengan

membuka aplikasi lain pada PC, yaitu:

a. Menekan dua kali icon Vsual Basic 6 yang sudah terdapat pada desktop

b. Menekan start-program-Microsoft Visual Studio 6-Microsoft Visual basic

6-Standard EXE-open lalu muncul interface awal sebuah jendela kerja dari

Visual basic seperti pada gambar 3.5.

Gambar 3.5. Tampilan Awal Visual basic 6

3.3.2. Layout menu utama

Menu utama adalah tampilan yang muncul pertama kali saat aplikasi

modul pembelajaran pertama kali dibuka. Menu utama berperan sebagai menu

home. Layout dari menu utama hanya terdiri dari beberapa tombol (command

button) dan beberapa tulisan Label. Masing-masing tombol pada menu utama

Page 7: BAB III DESAIN DAN PEMBUATAN PROGRAM

32

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

akan menjalankan perintah yang berbeda, dan beberapa di antaranya akan

membuka anak aplikasi dari modul pembelajaran.

Langkah untuk melakukan desain layout menu utama, setelah visual

basic 6 dibuka, selanjutnya adalah mengatur properti dari form. Properties yang

diatur yaitu:

a. Name : MenuUtama (nama form akan tersimpan dengan

MenuUtama.frm dan tidak boleh ada spasi dalam penamaan)

b. Border style : 1-Fixed single (agar menu utama hanya memiliki 1 tombol

border yaitu tombol close)

c. Caption : Menu Utama (memberikan nama pada tittle bar)

d. Picture : Memberikan gambar pada background menu utama.

Setelah mengatur properti dari form, langkah selanjutnya adalah

memasukkan 8 tombol XP (Xpbutton) dari Toolbox, yang diberi caption sesuai

dengan nama masing-masing menu dan mengatur warna setiap tombol.

Langkah selanjutnya adalah menambahkan beberapa Label untuk memberikan

beberapa keterangan. Agar tampilan menjadi lebih menarik dapat dilakukan

dengan menambahkan komponen Timer untuk membuat Label di sebelah atas

menjadi bergerak ke kanan-kiri. Pada menu utama juga dilengkapi dengan

adanya tampilan tanggal dan waktu saat user menggunakan aplikasi modul

pembelajaran.

Hasil dari desain layout menu utama dapat dilihat pada gambar 3.6.

Gambar 3.6. Layout Menu Utama

Page 8: BAB III DESAIN DAN PEMBUATAN PROGRAM

33

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

3.3.3. Layout menu materi

Menu materi berisi sekumpulan materi yang berhubungan dengan sistem

komunikasi serat optik. Materi-materi tersebut dikelompokkan menjadi

beberapa menu pada Toolbar menu. Menu-menu tersebut yaitu:

a. Teori Cahaya

b. Serat Optik

c. SKSO

d. Jarlokaf

e. Parameter performansi

f. Spesifikasi

Materi-materi tersebut pada awalnya dibuat di Microsoft power point

2007 dan dibuat menjadi gambar dengan ekstensi *.jpeg. Gambar tersebut

ditampilkan menggunakan komponen Picture box sehingga pada menu materi

ini terdapat banyak picture box sesuai dengan jumlah slide materi pada power

point. Selain itu, untuk memisahkan materi yang satu dengan yang lainnya tiap

menu, menggunakan komponen Frame di mana satu frame mewakili 1

kelompok materi setiap menu.

Langkah-langkah dalam membuat layout Menu Materi adalah sebagai

berikut:

a. Setelah membuat layout menu utama, pada bagian sebelah kanan yaitu

pada project explorer, menekan klik kanan pada forms lalu memilih add-

form-form-open sehingga muncul form baru.

b. Melakukan pengaturan properties dari form.

1) Name : Materi

2) Border style : 1-Fixed single

3) Caption : Materi

c. Membuat Toolbar Menu menggunakan menu Editor

d. Memasukkan beberapa Frame yang masing-masing diberi nama sesuai

dengan nama pada toolbar menu dan setiap frame memiliki tinggi dan lebar

yang sama dan posisinya saling menumpuk satu sama lain.

e. Pada masing-masing frame, memasukkan beberapa picture box sesuai

dengan slide masing-masing materi. Pada properties picture pada masing-

Page 9: BAB III DESAIN DAN PEMBUATAN PROGRAM

34

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

masing picture box, dipilih gambar dari materi sesuai dengan urutan agar

mempermudah proses coding.

f. Memasukkan beberapa Xpbutton sesuai dengan kebutuhan.

g. Mengatur properties lain dari form seperti Back colour (warna

background), height (tinggi form, dapat dilakukan secara manual dengan

menggeser batas bawah form), dan width (lebar form dapat dilakukan

secara manual dengan menggeser batas kanan form)

Hasil dari proses desain Layout materi dapat terlihat pada gambar 3.7.

Gambar 3.7. Layout Materi

3.3.4. Layout menu simulasi warna

Seperti yang telah dijelaskan sebelumnya bahwa pada aplikasi simulasi

warna terdapat 3 sampel simulasi warna. Proses desain untuk memilih satu dari

tiga simulasi tersebut membutuhkan tiga buah option button sehingga pada

aplikasi simulasi warna ini juga terdapat 3 option button dengan Caption:

a. 6 Tube 6 Serat

b. 7 Tube 7 Serat

c. 8 Ttube 8 Serat

Page 10: BAB III DESAIN DAN PEMBUATAN PROGRAM

35

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Masing-masing dari option button tersebut akan terhubung ke frame yang

berisi simulasi warna. Jumlah frame disesuaikan dengan jumlah sampel

sehingga terdapat 3 buah frame. Pada masing-masing frame tersebut di

tambahkan xpbutton, text box, dan label.

Pada dasarnya aplikasi ini nantinya terhubung dengan database yang

telah dibuat pada microsoft access. Proses koneksi ke database dilakukan

dengan menambahkan sebuah adodc dan sebuah datagrid. Agar menarik dan

menambah pengetahuan user mengenai materi penentuan warna, maka

ditambahkan lagi satu buah frame yang di dalamnya berisi label tentang aturan

pewarnaan serat.

Langkah-langkah dalam membuat layout menu simulasi warna adalah

sebagai berikut:

a. Setelah desain layout menu Materi selesai dibuat, pada bagian sebelah

kanan yaitu pada project explorer, menekan klik kanan pada forms lalu

memilih add-form-form-open sehingga muncul form baru.

b. Melakukan pengaturan properties dari form.

1) Name : SimulasiWarna

2) Border style : 1-Fixed single

3) Caption : Simulasi Warna

c. Menambahkan tiga kontrol option button dari pada caption masing-masing

diberi nama:

1) 6 Tube 6 Serat

2) 7 Tube 7 Serat

3) 8 Tube 8 Serat

d. Menambahkan 1 buah frame untuk diberi keterangan mengenai aturan

pewarnaan.

e. Menambahkan 3 buah frame yang masing-masing di dalamnya berisi 1

buah kontrol adodc, 1 buah kontrol datagrid, 5 buah kontrol xpbutton, 4

buah text box, dan 3 buah label yang disusun sedemikian rupa. 3 frame ini

diletakkan saling menumpuk.

f. Menambahkan 1 buah frame berukuran lebih lebar dari 4 frame

sebelumnya. Frame ini berfungsi sebagai wadah dari keempat frame

Page 11: BAB III DESAIN DAN PEMBUATAN PROGRAM

36

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

sebelumnya sehingga 4 frame yang telah dibuat dimasukkan ke dalam

frame induk ini.

g. Menambahkan 1 buah timer dan 2 buah label untuk menampilkan tanggal

dan waktu saat user menggunakan aplikasi modul pembelajaran.

h. Melakukan pengaturan properties baik pada form maupun pada frame agar

menarik perhatian seperti mengatur back colour, picture, dan fore colour.

Hasil dari proses desain layout simulasi warna dapat dilihat pada gambar

3.8.

Gambar 3.8 Layout Simulasi Warna

3.3.5. Layout menu link budget

Menu link budget pada dasarnya adalah sebuah aplikasi perhitungan

untuk melakukan perhitungan power link budget. Aplikasi dalam menu ini

berfungsi untuk melakukan perhitungan, sehingga bagian utama dari aplikasi

ini adalah bagian parameter input (masukan) dan parameter output (keluaran).

Page 12: BAB III DESAIN DAN PEMBUATAN PROGRAM

37

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Dalam melakukan desain layout menu power link budget ini, parameter

input di bagi lagi menjadi beberapa bagian yang dipisahkan menggunakan

frame yang berbeda. Demikian juga untuk parameter keluarannya.

Keluaran dari aplikasi ini terdiri dari beberapa jenis. Pertama adalah

keluaran berupa hasil perhitungan yang ditampilkan pada text box. Keluaran

kedua adalah berupa analisa yang berasal dari data-data masukan dan keluaran

dan ditampilkan pada list box. Keluaran ketiga adalah berupa data-data

masukan dan data keluaran dan ditampilkan pada Microsoft word yang akan

muncul secara otomatis bila user menekan tombol cetak.

Secara keseluruhan, parameter masukan dan keluaran berada dalam satu

buah frame induk yang di dalamnya terdapat beberapa frame kecil yang

memisahkan adntara parameter input, parameter output, dan pilihan tombol.

Frame-frame yang dimaksud yaitu:

a. Option : berisi 4 buah tombol, yaitu: Mulai, Tambah

Link, Reset, dan Cetak.

b. Data Link : berisi data-data input link, yaitu:

Transmitter, Receiver, Jarak Link, dan Jumlah Titik Sambung.

c. Data Loss : berisi data-data tentang loss selama proses

transmisi seperti Loss Konektor, Loss Sambungan, Loss Kabel, dan Margin

Sistem.

d. Level yang diinginkan : berisi data level tx dan lever rx yang

diinginkan.

e. Hasil perhitugan : berisi data-data keluaran hasil perhitungan

Langkah-langkah dalam membuat layout power link budget adalah

sebagai berikut:

a. Setelah desain layout menu Simulasi Warna selesai dibuat, pada bagian

sebelah kanan yaitu pada project explorer, menekan klik kanan pada forms

lalu memilih add-form-form-open sehingga muncul form baru.

b. Melakukan pengaturan properties dari form.

Name : LinkBudget

Border style : 1-Fixed single

Caption : Link budget

Page 13: BAB III DESAIN DAN PEMBUATAN PROGRAM

38

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

c. Membuat 1 buah frame induk dan 5 buah frame kecil yang dimasukkan ke

dalam frame induks, dengan isi seperti yang telah disebutkan sebelumnya.

d. Menambahkan beberapa xp button di setiap sela antar frame dan

menambahkan 1 buah list box untuk menampilkan analisis data.

e. Menambahkan 2 buah label yang background nya dibuat transparan dan

diisikan sedikit materi pengantar tentang power link budget.

f. Menambahkan 1 buah timer dan 2 buah label untuk menampilkan waktu

dan tanggal saat user menggunakan aplikasi modul pembelajaran.

g. Melakukan pengaturan properties baik pada from maupun pada frame agar

menarik perhatian seperti mengatur back colour, picture, dan fore colour.

Hasil dari proses layout power link budget dapat dilihat pada gambar 3.9.

Gambar 3.9. Layout Power link budget

Page 14: BAB III DESAIN DAN PEMBUATAN PROGRAM

39

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

3.3.6. Layout menu rise time budget

Desain layout menu rise time budget hampir sama dengan power link

budget karena keduanya merupakan aplikasi perhitungan. Namun pada menu

ini parameter input dijadikan menjadi satu dan tidak dipisah seperti pada power

link budget. Frame yang terdapat pada menu ini yaitu:

a. Frame induk : berisi frame option, parameter input, hasil

perhitungan, dan hasil bandwidth total.

b. Frame Option : berisi tombol Mulai, reset, dan exit

c. Frame Parameter Input : perisi parameter input.

d. Frame Hasil Perhitungan : berisi parameter hasil perhitungan.

Langkah-langkah dalam membuat layout menu rise time budget yaitu:

a. Setelah desain layout menu Power link budget selesai dibuat, pada bagian

sebelah kanan yaitu pada project explorer, menekan klik kanan pada forms

lalu memilih add-form-form-open sehingga muncul form baru.

b. Melakukan pengaturan properties dari form.

Name : Risetime

Border style : 1-Fixed single

Caption : Rise time budget

c. Membuat 1 buah frame induk dan 3 buah frame kecil yang dimasukkan ke

dalam frame induk, dengan isi seperti yang telah disebutkan sebelumnya.

d. Menambahkan satu xp button di setiap sela antar frame dan menambahkan

1 buah list box untuk menampilkan analisis data.

e. Pada sisi sebelah kanan setiap parameter input ditambahkan label yang

berisi keterangan setiap parameter yang nantinya akan muncul saat text box

dipilih.

f. Menambahkan 1 buah label yang background nya dibuat transparan dan

diisikan sedikit materi pengantar tentang rise time budget.

g. Menambahkan 1 buah timer dan 2 buah label untuk menampilkan waktu

dan tanggal saat user menggunakan aplikasi modul pembelajaran.

h. Melakukan pengaturan properties baik pada from maupun pada frame agar

menarik perhatian seperti mengatur back colour, picture, dan fore colour.

Page 15: BAB III DESAIN DAN PEMBUATAN PROGRAM

40

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Hasil dari proses desain layout menu rise time budget dapat dilihat pada

gambar 3.10.

Gambar 3.10. Layout Rise time budget

3.3.7. Layout menu simulasi soal

Seperti yang telah dijelaskan sebelumnya bahwa menu aplikasi simulasi

soal digunakan untuk menguji daya paham user mengenai materi sistem

komunikasi serat optik. Layout dari menu ini terdiri dari beberapa bagian,

yaitu:

a. Pertanyaan

Terdiri dari 1 buah Label yang isinya akan dimasukkan data

pertanyaan dari database soal.

b. Option Jawaban

Terdiri dari tiga buah option button yang masing-masing mewakili

pilihan a, b, dan c.

Page 16: BAB III DESAIN DAN PEMBUATAN PROGRAM

41

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

c. Identitas User

Terdiri dari dua buah label dan text box yang menunjukkan nama

user dan Nim dari user.

d. Hasil

Terdiri dari dua buah label dan text box yang menunjukkan jawaban

yang dipilih user serta skor yang diperoleh user.

e. Tombol Lanjutkan dan Ulangi

Tombol lanjutkan nantinya digunakan untuk menju ke soal

selanjutnya sedangkan tombol ulangi digunakan untuk mengulang simulasi

soal apabila user masih merasa belum puas dengan hasil yang diperoleh.

Pada form soal ini juga dilengkapi dengan 1 buah timer dan 2 buah label

untuk menampilkan waktu dan tanggal penggunaan user. Hasil dari proses

desain layout Simulasi Soal dapat dilihat pada gambar 3.11.

Gambar 3.11. Layout Simulasi Soal

3.3.8. Layout menu About

Di dalam menu utama pada modul pembelajaran, terdapat tombol About

yang berfungsi untuk menampilkan keterangan mengenai versi dari modul

pembelajaran dan juga identitas pembuatnya. Pada saat tombol tersebut ditekan

tidak akan memunculkan aplikasi lain, akan tetapi hanya menampilkan sebuah

kotak pesan yang berisi keterangan-keterangan tersebut.

Page 17: BAB III DESAIN DAN PEMBUATAN PROGRAM

42

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Desain dari keluaran About ini dapat dilihat pada gambar 3.12.

Gambar 3.12. Desain Keluaran About

3.3.9. Layout Form Pembantu

a. Form Tambah Link

Form ini merupakan form tambahan yang digunakan untuk

melengkapi aplikasi power link budget. Di dalam aplikasi power link

budget terdapat sebuah tombol Tambah Link yang nantinya akan

mengarahkan user ke form ini.

Dalam form ini, user dapat melihat database kota transmitter,

receiver, serta jarak antar kota yang terhubung ke power link budget.

Dengan menggunakan form ini, user dapat dengan mudah menambah,

mengedit, serta menambah data yang ada.

Layout form ini terdiri dari tombol Tambah, Simpan, Hapus,

Datagrid, serta kontrol adodc. Hasil desain layout form Tambah Link dapat

dilihat pada gambar 3.13.

Gambar 3.13. Layout Form Tambah Link

Page 18: BAB III DESAIN DAN PEMBUATAN PROGRAM

43

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

b. Form Status

Form status merupakan form yang berisi pilihan untuk user. Pilihan

tersebut mengenai status dari user, yaitu Dosen atau Mahasiswa. Dengan

memilih salah satu opsi maka user akan diarahkan ke halaman yang

berbeda.

Layout form ini hanya tersusun dari dua buah tombol. Tombol

tersebut yaitu: “Dosen” dan “Mahasiswa”. Hasil desain layout form status

dapat terlihat pada gambar 3.14.

Gambar 3.14. Layout Form Status

c. Form Identitas (Data Diri)

Form identitas merupakan salah satu form pelengkap dari Aplikasi

Simulasi Warna. Dalam aplikasi simulasi warna terdapat sebuah frame data

diri di mana data yang ada pada kolom Nama dan NIM merupakan data

yang di-input pada form Identitas ini.

Form ini akan muncul saat user memilih tombol “Mahasiswa” pada

form Status. User diharuskan mengisi data yang ada sebelum memasuki

Aplikasi Simulasi Soal.

Gambar 3.15. Layout Form Identitas

Page 19: BAB III DESAIN DAN PEMBUATAN PROGRAM

44

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Layout dari Form Identitas ini hanya berisi label dan text boxt serta

satu buah tombol OK yang. Hasil dari desain form identitas ini dapat dilihat

pada gambar 3.15.

d. Form Login

Sama seperti fungsi form login pada umumnya, form ini digunakan

sebagai pintu masuk ke aplikasi selanjutnya. Form ini nantinya muncul

pada saat user memilih tombol Dosen pada form status. User diharuskan

memasukkan kode dan password agar bisa memasuki form selanjutnya.

Form selanjutnya setelah form ini adalah form tambah soal yang ditujukkan

untuk Dosen agar lebih leluasa dalam menambah soal pada database soal.

Dalam hal layout, form ini hampir sama dengan form data diri.

Terdapat dua text box yang harus diisi dengan identitas yang sesuai. Selain

itu, juga terdapat tiga buah tombol, yaitu New User, Login dan Batal. Hasil

dari proses desain layout form login dapat dilihat seperti pada gambar 3.16.

Gambar 3.16. Layout Form Login

e. Form Tambah Soal

Form ini ditujukan untuk user, dalam hal ini Dosen. Dengan

menggunakan form ini, dosen dapat lebih fleksibel dalam menambah

ataupun mengurangi jumlah soal. Selain itu dengan menggunakan form ini,

dosen juga dapat mengedit soal yang ada.

Form ini tersusun dari 5 buah text box yang akan menampilkan data

pada database soal. Selain itu, terdapat 3 buah tombol dan 1 buah kontrol

adodc serta 1 buah datagrid. Hasil desain layout form tambah soal dapat

dilihat pada gambar 3.17.

Page 20: BAB III DESAIN DAN PEMBUATAN PROGRAM

45

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Gambar 3.17. Layout Form Tambah Soal

f. Form Selamat

Form Selamat merupakan form hasil dari proses pengerjaan soal pada

Aplikasi Simulasi Soal. Form ini akan muncul apabila skor yang diperoleh

oleh user memenuhi standar minimal yang telah ditetapkan. Dalam form ini

nantinya dilengkapi dengan efek salju.

Layout dari form selamat ini berisi tentang identitas diri user, skor

akhir yang diperoleh, serta keterangan bahwa user dinyatakan lulus. Hasil

dari proses desain layout Form Selamat dapat dilihat pada gambar 3.18.

Gambar 3.18. Layout Form Selamat

Page 21: BAB III DESAIN DAN PEMBUATAN PROGRAM

46

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

g. Form Maaf

Form Maaf merupakan form hasil dari proses pengerjaan soal pada

Aplikasi Simulasi Soal. Form ini akan muncul apabila skor yang diperoleh

oleh user tidak memenuhi standar minimal yang telah ditetapkan. Dalam

form ini nantinya dilengkapi dengan efek salju.

Layout dari form Maaf ini berisi tentang identitas diri user, skor akhir

yang diperoleh, serta keterangan bahwa user dinyatakan tidak lulus. Hasil

dari proses desain layout Form Maaf dapat dilihat pada gambar 3.19.

Gambar 3.19. Layout Form Maaf

h. Form New User

Form ini nantinya digunakan untuk mengarahkan user untuk

membuat acount user baru (apabila status user adalah Dosen). Form ini

terdiri dari 2 buah textbox dan juga 2 tombol. Hasil dari proses desain

layout form New user dapat dilihat pada gambar 3.20.

Gambar 3.20. Layout Form New User

Page 22: BAB III DESAIN DAN PEMBUATAN PROGRAM

47

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

3.4. KAMUS DATA

Di dalam Aplikasi modul pembelajaran terpadu ini, terdapat beberapa Aplikasi

yang dikoneksikan dengan database. Hal ini bertujuan agar mempermudah proses

pengelolaan data, dan juga agar mempermudah user dalam penggunaannya. Database

dalam Aplikasi ini diberi nama Budget dengan ekstensi file *.mdb.

Di dalam file budget.mdb ini terdapat beberapa Tabel dan Query yang memiliki

fungsi dan peranan tersendiri dalam Aplikasi modul pembelajaran. Tabel-tabel

tersebut dapat disajikan dalam bentu Kamus Data. Kamus data yaitu sebuah tabel yang

berisi ringkasan penjelasan mengenai data-data dari setiap tabel.

3.4.1. Tabel pertama

Tabel pertama merupakan tabel yang digunakan pada aplikasi simulasi

warna, pada opsi 6 tube 6 serat. Data pada tabel pertama ini tidak dapat diedit.

Kamus data tabel ini dapat dilihat pada tabel 3.1.

Tabel 3.1. Kamus Data Tabel Pertama

Field Tipe Data Keterangan

Nomor Serat Text Terdiri dari 36 record, dengan nomor

serat 1-36

Warna Tube Text Warna tube: Biru, Orange, Hijau,

Cokelat, Abu-abu, dan Putih

Warna Serat Text Warna Serat: Biru, Orange, Hijau,

Cokelat, Abu-abu, dan Putih

3.4.2. Tabel kedua

Tabel kedua merupakan tabel yang digunakan pada aplikasi simulasi

warna, pada opsi 7 tube 7 serat. Kamus data dari tabel ini dapat dilihat pada

tabel 3.2.

Tabel 3.2. Kamus Data Tabel Kedua

Field Tipe Data Keterangan

Nomor Serat Text Terdiri dari 49 record, dengan nomor

serat 1-49

Warna Tube Text Warna tube: Biru, Orange, Hijau,

Cokelat, Abu-abu, Putih, dan Merah

Warna Serat Text Warna Serat: Biru, Orange, Hijau,

Cokelat, Abu-abu, Putih, dan Merah

3.4.3. Tabel ketiga

Tabel ketiga merupakan tabel yang digunakan pada aplikasi simulasi

warna, pada opsi 8 tube 8 serat. Kamus data dari tabel ini dapat dilihat pada

tabel 3.3.

Page 23: BAB III DESAIN DAN PEMBUATAN PROGRAM

48

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Tabel 3.3. Kamus Data Tabel Ketiga

Field Tipe Data Keterangan

Nomor Serat Text Terdiri dari 64 record, dengan nomor

serat 1-64

Warna Tube Text Warna tube: Biru, Orange, Hijau,

Cokelat, Abu-abu, Putih, Merah, dan

Hitam

Warna Serat Text Warna Serat: Biru, Orange, Hijau,

Cokelat, Abu-abu, Putih, Merah, dan

Hitam

3.4.4. Tabel kota

Tabel kota merupakan tabel yang digunakan pada aplikasi power link

budget untuk menentukan kota transmitter, receiver, serta jarak antar kota

tersebut. Data dari tabel ini dapat ditambah, diedit, ataupun dihapus dengan

menggunakan form Tambah Link. Nantinya pada saat form tambah link ditutup,

maka data pada combo box akan langsung berubah. Kamus data dari tabel kota

ini dapat dilihat pada tabel 3.4

Tabel 3.4. Kamus Data Tabel Kota

Field Tipe Data Keterangan

Transmitter Text Data Awal: Banjar Negara, Purbalingga,

Banyumas, Cilacap, dan Kebumen

Receiver Text Data Awal: Banjar Negara, Purbalingga,

Banyumas, Cilacap, dan Kebumen

Jarak Text Jarak Antar Kota Transmitter dan

Receiver

3.4.5. Tabel identitas

Tabel identitas merupakan penghubung antara menu utama dan aplikasi

Simulasi Soal. Tabel identitas merupakan sebuah tabel yang masih kosong dan

datanya akan diisi melalui form identitas. Tabel identitas ini berfungsi untuk

memasukkan data user, dalam hal ini NAMA dan Nim dari user. Kamus data

dari tabel identitas ini dapat dilihat pada tabel 3.5.

Tabel 3.5. Kamus Data Tabel Identitas

Field Tipe Data Keterangan

Nama Text Data awal: (kosong)

NIM Text Data awal: (kosong)

3.4.6. Tabel soal

Tabel soal digunakan pada aplikasi simulasi soal. Tabel ini berisi

kumpulan soal, option a-option c, serta jawaban benar. Nantinya data-data pada

tabel ini akan ditampilkan secara acak pada aplikasi simulasi soal. Data pada

Page 24: BAB III DESAIN DAN PEMBUATAN PROGRAM

49

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

tabel soal ini tidak dapat diedit. Kamus data dari tabel soal ini dapat dilihat

pada tabel 3.6.

Tabel 3.6. Kamus Data Tabel Soal

Field Tipe Data Keterangan

Pertanyaan Text Terdiri dari 25 record

Opsi A Text Terdiri dari 25 record

Opsi B Text Terdiri dari 25 record

Opsi C Text Terdiri dari 25 record

Jawaban Benar Text Terdiri dari 25 record

3.4.7. Query Kota1

Tabel query kota1 merupakan query yang digunakan untuk menyaring

data kota transmitter pada tabel kota. Query ini akan menampilkan data yang

berbeda dari setiap data yang data, baik apabila ada penambahan, pengurangan,

maupun perubahan data melalui form tambah link. Kamus data untuk query

kota1 ini dapat dilihat pada tabel 3.7.

Tabel 3.7. Kamus Data Query Kota1

Field Tipe Data Keterangan

Transmitter Text Data Awal: Banjar Negara, Purbalingga,

Banyumas, Cilacap, dan Kebumen

3.4.8. Query Kota2

Tabel query kota2 merupakan query yang digunakan untuk menyaring

data kota receiver pada tabel kota. Query ini akan menampilkan data yang

berbeda dari setiap data yang data, baik apabila ada penambahan, pengurangan,

maupun perubahan data melalui form tambah link. Kamus data untuk query

kota2 ini dapat dilihat pada tabel 3.8.

Tabel 3.8. Kamus Data Query Kota2

Field Tipe Data Keterangan

Receiver Text Data Awal: Banjar Negara, Purbalingga,

Banyumas, Cilacap, dan Kebumen

3.4.9. Tabel Login

Tabel login merupakan tabel yang digunakan untuk menyimpan data

login dosen pada saat dosen menggunakan aplikasi simulasi soal. Kamus data

untuk table login dapat dilihat pada tabel 3.9.

Tabel 3.8. Kamus Data Tabel Login

Field Tipe Data Keterangan

Kode Text Data awal: Dosen1

Password Text Data awal: 011011

Page 25: BAB III DESAIN DAN PEMBUATAN PROGRAM

50

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

3.5. PROSES CODING

Proses coding merupakan salah satu tahap pada pembuatan program modul

pembelajaran. Proses coding dilakukan setelah proses desain selsai. Proses coding

dalam visual basic dilakukan pada jendela coding yang dapat dilihat pada gambar

3.21.

Jendela coding dapat dibuka dengan menggunakan dua cara, yaitu:

a. Menekan dua kali kontrol yang akan diberikan coding.

b. Pada jendela project explorer, memilih ikon view code.

Gambar 3.21. Jendela Coding

3.5.1. Menu utama

Menu utama terdiri dari beberapa label, xp button, dan timer. Pada label,

tidak terdapat coding program. Pada xp button, coding program berisi perintah

untuk menuju ke halaman tertentu atau untuk menampilkan program. Timer

berfungsi untuk mengatur jalannya label yang berada di sebelah atas menu

utama.

Berikut merupakan sampel coding yang digunakan pada salah satu xp

button menu utama:

Private Sub XPButton1_Click()

Unload Me

Materi1.Show

Coding di atas akan menghasilkan output yaitu apabila xpbutton1

ditekan, maka akan menutup halaman menu utama dan membuka halaman

form materi1. Coding dari kontrol timer dapat dilihat sebagai berikut:

Private Sub Timer1_Timer()

Page 26: BAB III DESAIN DAN PEMBUATAN PROGRAM

51

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Dim str As String

str = MenuUtama.Label5.Caption

str = Mid$(str, 2, Len(str)) + Left(str, 1)

MenuUtama.Label5.Caption = str

End Sub

Coding di atas digunakan untuk menggerakkan label yang berisi tulisan:

“SELAMAT DATANG DI MODUL PEMBELAJARAN SISTEM

KOMUNIKASI SERAT OPTIK!”.

3.5.2. Menu Materi

Tampilan materi dalam menu ini merupakan sekumpulan gambar yang

berasal dari slide power point. Kumpulan gambar tersebut dipisahkan dengan

frame yang masing-masing mewakili 1 subjek materi. Pengaturan penampilan

keluarannya dilakukan dengan membuat tombol yang terdiri dari 4 tombol,

yaitu Tombol First, tombol Back, tombol Next, dan tombol Last. Selain itu juga

terdapat ribbon menu yang digunakan untuk memilih materi yang akan dibaca

atau dipelajari oleh user. Coding yang digunakan hanya terdiri dari visible dan

enabled.

Berikut ini merupakan sampel coding untuk tombol xpbutton:

Private Sub XPButton11_Click()

Picture3.Visible = False

Picture2.Visible = True

XPButton4.Visible = False

XPButton3.Visible = True

XPButton11.Visible = False

XPButton10.Visible = True

End Sub

Dan sampel coding untuk ribbon menu adalah sebagai berikut:

Private Sub mnSerat_Click()

Cahaya.Visible = False

Optik.Visible = True

SKSO.Visible = False

Jarlokaf.Visible = False

Parameter.Visible = False

End Sub

3.5.3. Menu Simulasi Warna

Dalam menu simulasi warna ini terdapat beberapa frame, option button,

dan juga xp button. Dalam menu ini, user diberikan 3 opsi simulasi pemilihan

warna seperti yang telah dijelaskan sebelumnya. Pada masing-masing opsi,

user dapat melihat dan mengecek warna tube dan warna serat secara manual

menggunakan kontrol adodc untuk menuju ke nomor serat sebelumnya ataupun

Page 27: BAB III DESAIN DAN PEMBUATAN PROGRAM

52

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

selanjutnya. Selain itu, user juga dapat mencari warna tube dan warna serat

berdasar nomor serat yang diinginkan menggunakan tombol cari.

Berikut merupakan sampel dari coding yang digunakan pada tombol cari:

Private Sub xpbutton2_Click()

Dim pesan As Integer

Adodc1.RecordSource = "select *from pertama where

NomorSerat= '" & Text4 & "'"

Adodc1.Refresh

If Text4.Text = "" Then

pesan = MsgBox("Masukkan Nomor Serat!", vbExclamation +

vbOKOnly, "Insert Number!")

Adodc1.RecordSource = "select *from pertama"

Adodc1.Refresh

ElseIf Adodc1.Recordset.EOF And Adodc1.Recordset.BOF Then

MsgBox "Nomor Serat Tidak DItemukan!"

Adodc1.RecordSource = "select *from pertama"

Adodc1.Refresh

Else

MsgBox "Nomor Serat Ditemukan!"

Adodc1.RecordSource = "select *from pertama"

Adodc1.Refresh

End If

End Sub

3.5.4. Menu Link Budget

Menu link budget digunakan untuk melakukan perhitungan power link

budget. Sehingga coding utamanya merupakan coding yang digunakan untuk

melakukan perhitungan dari masing-masing parameter input.

Berikut merupakan coding untuk melakukan perhitungan pada tombol

“Hasil Perhitungan”:

Private Sub XPButton4_Click()

Dim pesan As Integer

If Text7.Text = "" Or Text8.Text = "" Then

pesan = MsgBox("Masukkan Semua Nilai Level Yang

Diinginkan!", vbExclamation + vbOKOnly, "Warning!")

Else

XPButton4.Enabled = False

XPButton9.Enabled = True

Frame4.Enabled = True

hasil = Val(Val(Text2) * Val(Text4)) + Val(Val(Text1) *

Val(Text6)) + Val(Text3) + Val(Val(Text5) * 2)

hasil2 = Val(Text7) - Val(Text9)

hasil3 = Val(Text8) - Val(Text10)

Text9.Text = FormatNumber(hasil, 2)

Text10.Text = FormatNumber(hasil2, 2)

Text11.Text = FormatNumber(hasil3, 2)

If Text6.Text > 0.4 Then

Text12.Text = "Multi Mode"

Else

Text12.Text = "Single Mode"

End If

End If

Page 28: BAB III DESAIN DAN PEMBUATAN PROGRAM

53

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

End Sub

3.5.5. Menu Rise Time Budget

Menu rise time budget digunakan untuk menghitung rise time sistem

serta bandwidth total dari sebuah sistem. Berikut merupakan coding untuk

menghitung rise time sistem:

Private Sub XPButton6_Click()

Dim Ket As Integer, Ket2 As Integer, Ket3 As Single,

pesan As Integer

Ket = 350

Ket2 = 440

Ket3 = 0.5

If Text1.Text = "" Or Text2.Text = "" Or Text3.Text = ""

Or Text4.Text = "" Or Text5.Text = "" Or Combo1.Text = "" Or

Text7.Text = "" Then

pesan = MsgBox("Masukkan Semua Parameter Diketahui!",

vbExclamation + vbOKOnly, "Warning!")

Text8.Text = ""

Text9.Text = ""

Text10.Text = ""

Text11.Text = ""

Text12.Text = ""

XPButton6.Enabled = True

XPButton7.Enabled = False

ElseIf Combo1.Text > 1 Then

pesan = MsgBox("Nilai Parameter q antara 0.5 sampai 1!",

vbInformation + vbOKOnly, "Informasi")

Combo1.Text = ""

XPButton6.Enabled = True

Text8.Text = ""

Text9.Text = ""

Text10.Text = ""

Text11.Text = ""

Text12.Text = ""

Frame2.Enabled = False

XPButton7.Enabled = False

ElseIf Combo1.Text < 0.5 Then

pesan = MsgBox("Nilai Parameter q antara 0.5 sampai 1!",

vbInformation + vbOKOnly, "Informasi")

Combo1.Text = ""

XPButton6.Enabled = True

Text8.Text = ""

Text9.Text = ""

Text10.Text = ""

Text11.Text = ""

Text12.Text = ""

Frame2.Enabled = False

XPButton7.Enabled = False

Else

hasil = Text1

hasil2 = Ket / Val(Text2)

hasil3 = Val(Text3) * Val(Text4) * Val(Text5)

hasil4 = Val(Ket2 * Val(Val(Text5) ^ Val(Combo1))) /

Val(Text7)

Text8.Text = FormatNumber(hasil, 2)

Text9.Text = FormatNumber(hasil2, 2)

Page 29: BAB III DESAIN DAN PEMBUATAN PROGRAM

54

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Text10.Text = FormatNumber(hasil3, 2)

Text11.Text = FormatNumber(hasil4, 2)

XPButton7.Enabled = True

End If

If Text8.Text = "" Or Text9.Text = "" Or Text10.Text = ""

Or Text11.Text = "" Then

Text12.Text = ""

XPButton7.Enabled = False

Else

hasil5 = Val((Val(Text8) ^ 2) + (Val(Text9) ^ 2) +

(Val(Text10) ^ 2) + (Val(Text11) ^ 2)) ^ Ket3

Text12.Text = FormatNumber(hasil5, 2)

XPButton7.Enabled = True

End If

End Sub

Dan coding untuk melakukan perhitungan bandwidth total adalah

sebagai berikut:

XPButton2.Enabled = True

XPButton3.Enabled = True

XPButton7.Enabled = False

Text13.Enabled = True

hasil6 = 350 / Val(Text12)

Text13.Text = FormatNumber(hasil6, 2)

End Sub

3.5.6. Menu Simulasi Soal

Menu ini digunakan untuk menguji daya paham user. Coding dalam

menu ini ditujukan untuk mengatur penampilan data dara database secara

random dan untuk memberikan skor di setiap jawaban benar ataupun salah.

Berikut merupakan sampel coding dari menu simulasi soal:

Private Sub XPButton1_Click()

If nosoal < 10 Then

Option1.SetFocus

XPButton1.Enabled = False

Dim TotRec As Long 'Total Record

Dim RandomPos As Long 'Posisi Record Random Yang Diambil

'Ambil Total Record

TotRec = (Adodc1.Recordset.RecordCount - 1)

'Ambil Nomor Posisi Acak Record

RandomPos = (Rnd() * TotRec)

'KE POSISI AWAL DULU

Adodc1.Refresh

Adodc1.Recordset.MoveFirst

'PINDAHKAN POSISI RECORD DI POSISI ACAK

Adodc1.Refresh

Adodc1.Recordset.Move RandomPos

'TAMPILKAN DATA RECORD

Text1.Text = Adodc1.Recordset.Fields("Pertanyaan")

Text2.Text = Adodc1.Recordset.Fields("OpsiA")

Text3.Text = Adodc1.Recordset.Fields("OpsiB")

Text4.Text = Adodc1.Recordset.Fields("OpsiC")

Page 30: BAB III DESAIN DAN PEMBUATAN PROGRAM

55

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Text7 = Adodc1.Recordset("benar")

XPButton1.Enabled = True

Label3.Caption = Text1

Option1.Caption = Text2

Option2.Caption = Text3

Option3.Caption = Text4

If Option1.Value = True Then

hasil = "a"

Else

If Option2.Value = True Then

hasil = "b"

Else

If Option3.Value = True Then

hasil = "c"

End If

End If

End If

If hasil = Text7 Then

skor = skor + 10

End If

Text6.Text = skor

nosoal = nosoal + 1

nomor.Caption = nosoal

Else

If skor > 60 Then

Selamat.Show

Soal.Enabled = False

Frame1.Enabled = False

Label3.Caption = ""

nomor.Caption = ""

Option1.Caption = ""

Option2.Caption = ""

Option3.Caption = ""

XPButton2.Enabled = True

Else

If skor < 60 Then

Maaf.Show

Soal.Enabled = False

Frame1.Enabled = False

Label3.Caption = ""

nomor.Caption = ""

Option1.Caption = ""

Option2.Caption = ""

Option3.Caption = ""

XPButton2.Enabled = True

End If

End If

End If

End Sub

3.5.7. Menu HELP!

Menu ini digunakan untuk memanggil file help.chm yang telah dibuat.

File help berfungsi sebagai pedomen user dalam menggunakan aplikasi modul

pembelajaran. Untuk coding dari menu Help ini yaitu:

Private Sub XPButton8_Click()

Page 31: BAB III DESAIN DAN PEMBUATAN PROGRAM

56

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Call ShellExecute(Me.hwnd, "Open", App.HelpFile,

vbNullString, vbNullString, SW_SHOW)

End Sub

3.6. PEMBUATAN FILE HELP

Hampir di setiap aplikasi windows memiliki file help. File help berfungsi untuk

membantu user pada saat menggunakan aplikasi yang dibuat. Bagi user yang baru

menggunakan aplikasi tertentu tentunya membutuhkan panduan penggunaan aplikasi.

Dan hal tersebut dapat diatasi dengan membuat file help.

File help dalam sebuah aplikasi terdiri dari bermacam jenis. Beberapa aplikasi

windows menyediakan fitur ini pada bagian menu ribbon sehingga apabila user ingin

membuka aplikasi ini cukup dengan menekan menu help yang tersedia pada menu

ribbon. Selain itu, beberapa aplikasi windows menyediakan fitur help ini dengan cara

meletakkannya di samping tombol minimize dalam bentuk tombol dengan simbol

tanda tanya (?). Pada bentuk ini user cukup menekan tombol tersebut untuk

mengaktifkan file aplikasi help. Selain kedua bentuk tersebut, beberapa aplikasi

windows juga menyediakan fitur ini tanpa melalui tombol ataupun menu. Akan tetapi

user cukup menekan F1 pada keyboard dan file aplikasi help pun akan berjalan.

Banyak aplikasi yang dapat digunakan untuk membuat aplikasi Help. Dalam

proses penyusunan tugas akhir ini penulis menggunakan aplikasi “Help & manual

yang sebelumnya telah di-instal. Langkah awal untuk membukanya cukup dengan

menekan ikon Help & manual pada desktop. Tampilan awal dari aplikasi ini dapat

dilihat pada gambar 3.22.

Gambar 3.22. Tampilan Awal Help & manual

Page 32: BAB III DESAIN DAN PEMBUATAN PROGRAM

57

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

Langkah-langkah dalam membuat aplikasi help adalah sebagai berikut:

1. Membuka aplikasi Help & manual

2. Memilih menu File-New

3. Memilih opsi Create A New Help Project lalu Next

4. Pada bagian output file, menentukan di manakah file help yang dibuat disimpan

dan menentukan nama untuk aplikasi help lalu menekan Next

5. Pada bagian Help Project Title mengisikan nama judul Help dari project. Pada

bagian language dan karakter, memilih bahasa dan karakter yang digunakan dalam

file project yang dibuat lalu menekan Next.

6. Memilih OK lalu muncul lembar kerja untuk membuat file help.

7. Pada bagian sebelah kiri terdapat pilihan table of content. Bagian tersebut

digunakan untuk membuat content yang akan dimasukkan di dalam file help.

Content tersebut nantinya menjadi opsi pada saat file help dijalankan.

8. Pada bagian sebelah kanan merupakan bagian untuk mengedit isi dari masing-

masing content. Pada opsi topic option terdapat help context number merupakan

ID pada masing-masing content yang nantinya disamakan dengan help context ID

pada setiap form pada Visual Basic 6.

9. Hasil dari proses pembuatan file aplikasi help dapat dilihat pada gambar 3.23.

Gambar 3.23. Contoh Hasil Pembuatan file help

10. Setelah membuat file help dan di simpan dalam format .hmx, langkah selanjutnya

adalah meng-compile file help yang dibuat agar formatnya menjadi *.chm.

Langkah-langkahnya yaitu:

a. Menekan ikon tool “Compile Help File or PDF Manual”

Page 33: BAB III DESAIN DAN PEMBUATAN PROGRAM

58

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

b. Memilih opsi HTML Help lalu OK

c. Tunggu beberapa saat sampai proses compile selesai. Hasil proses compile

dapat dilihat pada gambar 3.24.

Gambar 3.24. Hasil Compile File help

3.7. PEMBUATAN INSTALLER PROGRAM

Setelah proses pembuatan aplikasi modul pembelajaran komunikasi serat optik

pada visual basic 6 selesai, data save aplikasi tersebut memiliki format.vbp. Apabila

file ini dijalankan maka akan secara otomatis membuka aplikasi visual basic 6 dan

program hanya bisa dijalankan melalui fitur running yang terdapat dalam visual basic

6. Tentunya pada saat proses pembuatan aplikasi selesai, user diharapkan dapat

menggunakannya pada PC tanpa melalui visual basic. Visual basic 6 juga

menyediakan fitur compile yang akan menjadikan file aplikasi modul pembelajaran

menjadi format*.exe. Dengan format ini user dapat langsung membuka modul

pembelajaran tanpa melalui visual basic 6.

Langkah-langkah untuk melakukan proses compile yaitu:

1. Membuka project yang telah dibuat.

2. Memilih menu file-make project.exe.

3. Memberikan nama untuk file*.exe lalu menekan OK.

4. Menunggu beberapa saat hingga proses compile selesai.

Setelah proses compile selesai, pada folder project yang dibuat terdapat file

modul pembelajaran dengan format *.exe. File ini digunakan untuk menjalankan

Page 34: BAB III DESAIN DAN PEMBUATAN PROGRAM

59

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

aplikasi modul pembelajaran yang telah dibuat. Dengan kata lain, aplikasi modul

pembelajaran hasil compile ini bersifat portabel, dapat digunakan tanpa harus

menginstal.

Secara garis besar proses pembuatan tugas akhir modul pembelajaran

komunikasi serat optik telah selesai sampai proses compile. Akan tetapi, untuk lebih

menyempurnakannya, dapat dilakukan dengan membuat installer setup.exe. File ini

digunakan untuk proses instalasi aplikasi yang dibuat sehingga apabila user lain ingin

menggunakannya harus terlebih dahulu menginstal aplikasi modul pembelajaran.

Pembuatan file setup tersebut, dapat menggunakan fitur “Package and

Deployment Wizard” yang disediakan oleh Microsoft Visual Studio 6. Langkah-

langkah dalam menggunakan fitur tersebut yaitu:

1. Menutup project visual basic yang telah dibuat dan menyimpannya.

2. Memastikan bahwa semua file pendukung seperti file help, database, file report

Microsoft Word, Image, Form, dan lain sebagainya telah berada dalam 1 folder

yang sama dengan project yang dibuat.

3. Memilih Start-All Program-Microsoft Viusal Studio 6-Microsoft Visual Studio 6

Tools-Package and Deployment Wizard dan muncul tampilan awal fitur tersebut

seperti terlihat pada gambar 3.25.

Gambar 3.25. Tampilan Awal Package and Deployment Wizard

4. Pada bagian browse, memilih file project dalam format *.vbp yang akan dibuat file

installernya. Lalu memilih opsi Package.

Page 35: BAB III DESAIN DAN PEMBUATAN PROGRAM

60

Laporan Tugas Akhir BAB III BAB I

STT Telematika Telkom Purwokerto D310051

5. Sistem akan mengetest apakah file project tersebut sudah pernah di-compile atau

belum. Karena file project dalam tugas akhir ini sudah di-compile maka sistem

melanjutkan ke langkah selanjutnya.

6. Pada bagian packaging script, memilih Next untuk menuju langkah selanjutnya.

7. Pada bagian package type memilih Standard Setup Package lalu memilih Next.

8. Pada bagian Package folder memilih ataupun membuat folder di mana file setup

akan disimpan lalu memilih Next.

9. Pada bagian include file menambahkan file-file penting mana sajakah yang akan

dimasukkan ke dalam folder setup menggunakan fitur “Add” lalu memilih Next.

10. Pada bagian cab option memilih single cab lalu memilih Next.

11. Pada bagian installation title memberikan judul pada proses instalasi lalu memilih

Next.

12. Pada bagian start menu items, memilih dan mengedit menu apa sajakah yang akan

dimasukkan ke dalam start menu dari program yang dibuat setelah diinstal lalu

memilih Next.

13. Pada bagian install locations memilih dan mengedit lokasi file-file yang

dimasukkan ke dalam folder setup lalu memilih Next.

14. Pada bagian shared files memilih file-file mana saja yang akan dijadikan shared

files lalu memilih Next.

15. Pada bagian Finished memilih Finish lalu akan muncul report.

16. Melihat folder di mana folder setup yang dibuat berada untuk melihat hasil

pembuatan setup installer.