31
BAB 3 ANALISIS DAN PERANCANGAN APLIKASI
3.1
Latar Belakang Perusahaan 3.1.1
Sejarah Perusahaan Pada tahun 1956 beberapa Pastor Jesuit meninggalkan daratan Tiongkok dan datang ke Jakarta. Oleh Bapak Uskup Agung Jakarta, mereka diminta berkarya di wilayah Glodok. Selain berkarya di gereja mereka juga berkarya di bidang pendidikan maka didirikanlah sekolah RICCI di samping Gereja Katolik Santa Maria de Fatima, Toasebio. Nama “RICCI” diambil dari nama Mateo Ricci, yaitu Pastor asing pertama yang berhasil dalam misi inkulturasi di Tiongkok. Sekolah RICCI, yang didirikan oleh Pastor Mathias Leitenbouer, SJ, pada awalnya bergabung dengan Perkumpulan Strada. Gedung pertama sekolah RICCI diberkati oleh Mgr. Alibrandi, SJ (Pronunsio Apostolik) pada tahun 1959. Gedung terus mengalami penyempurnaan, kemudian pada tahun 1968 oleh Pastor Augustinus Phan Liang Chin, Pr (Pimpinan Sekolah Strada RICCI) dibangunlah gedung TK RICCI. Pada tanggal 14 Juli 1972, dibawah kepemimpinan Pastor Guido Paolucci SX, sekolah RICCI memisahkan diri dari Strada dan mendirikan Yayasan Pendidikan RICCI. Pemerintah Daerah DKI melalui Proyek Husni Thamrin, turut menyumbang sebuah gedung berlantai tiga beserta perlengkapannya pada tahun 1977, yang kini dipakai oleh SMP Ricci I.
32
Pembangunan gedung selanjutnya adalah gedung olahraga yang selesai dibangun pada tahun 1979, ketika yayasan dibawah pimpinan Pastor Vincenzo Baravalle, SX. Sekolah RICCI yang pada awalnya dimulai dengan TK-SD, kini telah berkembang pesat menjadi Ricci I dan II dengan jenjang pendidikan KB-TK-SD-SMP-SMA. Selanjutnya Sekolah Ricci yang berlokasi di Jakarta Barat ini disebut Ricci I. Pembangunan gedung Ricci II diawali dengan pembelian tanah seluas 2,2 Ha tahun 1986, yang terletak di Jl. Utama II Nomor 1 dan 2 Pondok Karya, Pondok Aren, Bintaro oleh Pastor Vincenzo Bravalle, SX. Satu tahun kemudian tepatnya tanggal 24 November 1987 berhasil didirikan gedung TK RICCI II. Gedung tersebut diberkati oleh Bapak Uskup Mgr. Leo Soekoto, SJ. Untuk memenuhi kebutuhan pendidikan masyarakat Bintaro mulailah dibangun gedung SD, SMP, dan SMA Ricci II secara bertahap. Gedung SD Ricci II berhasil diselesaikan pada tanggal 14 November 1989. SMP RICCI II mulai menerima siswa baru tahun 1990, dengan menumpang di gedung SD Ricci II sementara gedung SMA RICCI II selesai dibangun pada tahun 1993. Gedung tersebut diberkati oleh Bapak Uskup Agung Jakarta, Mgr. Leo Soekato, SJ dan diresmikan oleh Ibu Tri Sutrisno pada tanggal 15 November 1993. Baru pada tahun 1997 gedung SMP Ricci II selesai dibangun dan diresmikan oleh Dr. Atie Wardiman. Pada masa kepemimpinan R. Herman Notosuprapto sebagai Ketua Yayasan (1987-1997), Ricci berhasil membangun gedung baru
33
untuk SD Ricci I di Jln. Kemenangan III/33. Dan pada periode berikutnya, yaitu dalam masa kepemimpinan Dr. Hubertus Kasan Hidayat Sp.Kj (1997-2007) dibangunlah gedung SMA Ricci I. Gedung baru ini terletak di belakang Gereja Katolik Santa Maria de Fatima, berlantai 5 dan dilengkapi dengan lift. Lantai 5 untuk hall dan diberi nama Hall Mateo Ricci, yang sangat representatif untuk acara-acara seperti seminar, rapat, penataran, ataupun acara pertunjukan karena dilengkapi dengan panggung dan sound-system yang memadai. Kini semua ruangan dan kelas di Ricci I maupun II sudah dilengkapi dengan pendingin ruangan sehingga sangat nyaman sebagai tempat belajar.
3.1.2
Visi dan Misi Sekolah Ricci memiliki visi untuk mendidik manusia Indonesia seutuhnya dengan perlakuan yang sama bagi semua orang dan proses pendidikannya sesuai dengan tahap perkembangaan psikologik dan berorientasi kepada keberhasilan siswa serta bersemangat cinta kasih kristiani. Sekolah Ricci memiliki misi sebagai berikut: 1.
Mendidik manusia Indonesia seutuhnya agar berjiwa Pancasila, berbudaya,
berhati,
dan
berbudi
luhur,
serta
berilmu
berdasarkan cinta kasih kristiani 2.
Mendidik siswa sesuai dengan tahap-tahap perkembangan psikologik dan berorientasi kepada keberhasilan siswa.
34
3.
Memberi penghargaan yang layak bagi guru dan karyawan Ricci.
4.
Dukungan orangtua siswa menjadi pondasi dalam proses pendidikan.
5.
3.2
Memberi perlakuan yang sama bagi seluruh warga Ricci.
Struktur Organisasi Perusahaan
Gambar 3.1 Struktur organisasi Sekolah RICCI I Jakarta Periode 2007 - 2012
Sedangkan penjelasan dari wewenang dan tugas dari tiap-tiap jabatan dalam perusahaan adalah sebagai berikut:
35
a.
Dewan Pembina Penanggung jawab dan pengambil keputusan, dan segala sesuatu yang berhubungan keluar sekolah dan dalam sekolah. Selain itu Dewan Pembina
bertugas
merekrut
karyawan,
pengesahan
kurikulum,
merencanakan aktivitas sekolah, membuat tata tertib karyawan, membuat peraturan sekolah. b.
Dewan Pengurus Penanggung jawab dan pengambil keputusan kedua, dan segala sesuatu yang berhubungan keluar sekolah dan dalam sekolah jika Dewan Pembina berhalangan. Selain itu tugas Dewan Pengurus adalah mengurus segala hal yang berkaitan dengan operasional sekolah.
c.
Dewan Pengawas Mengawasi seluruh kegiatan-kegiatan yang akan berlangsung maupun yang telah berlangsung di dalam lingkungan RICCI 1 serta memberikan laporan atas hasil pengawasannya kepada Dewan Pembina.
d.
Operasional Pendidikan (Opsdik) Opsdik dituntut agar dapat mengkaji, mengembangkan kurikulum yang berlaku pada setiap tingkat pendidikan dengan benar.
e.
T.U. & RT Membantu
proses
belajar
mengajar,
urusan
kesiswaan,
kepegawaian, peralatan sekolah, urusan infrastruktur sekolah, keuangan, bekerja di laboratorium, perpustakaan dan hubungan masyarakat di sekolah RICCI 1.
36
f.
Pengadaan Lembaga yang bertugas dan bertanggung jawab mengadakan kegiatan yang berlangsung dalam proses belajar mengajar di sekolah baik di dalam maupun di luar sekolah.
g.
Pembukuan Lembaga yang bertugas membuat hasil atau laporan keuangan sekolah yang datanya diperoleh dari lembaga keuangan sekolah.
h.
Keuangan Lembaga yang bertugas mengatur keuangan sekolah, yaitu kas masuk dan keluar sekolah, serta menerima dan mengumpulkan uang sekolah siswa.
i.
Kepala TK Bertanggung jawab atas seluruh kegiatan belajar mengajar di sekolah TK. Juga mengawasi dan memperhatikan keseluruhan kegiatan setiap harinya yang berlangsung di sekolah taman kanak-kanak (TK) baik tentang guru-guru TK maupun siswa TK.
j.
Kepala SD Bertanggung jawab atas seluruh kegiatan belajar mengajar di lingkungan
sekolah
SD.
Juga
mengawasi
dan
memperhatikan
keseluruhan kegiatan setiap harinya yang berlangsung di lingkungan sekolah dasar (SD) baik tentang guru-guru SD maupun siswa SD.
37
k.
Kepala SMP Bertanggung jawab atas seluruh kegiatan belajar mengajar di lingkungan sekolah SMP. Juga mengawasi dan memperhatikan keseluruhan kegiatan setiap harinya yang berlangsung di lingkungan sekolah SMP, baik tentang guru-guru yang mengajar di SMP maupun siswa-siswi SMP.
l.
Kepala SMA Bertanggung jawab atas seluruh kegiatan belajar mengajar di lingkungan sekolah SMA. Juga mengawasi dan memperhatikan keseluruhan kegiatan setiap harinya yang berlangsung di lingkungan sekolah SMA, baik tentang guru-guru yang mengajar di SMA maupun siswa-siswi SMA.
m.
Koordinator Guru Mengatur dan membimbing para guru di sekolah RICCI 1. Selain itu juga bertugas mendidik guru dengan mengevaluasi kinerja guru setiap bulannya sehingga guru-guru dapat memberikan pengajaran yang terbaik untuk siswanya.
n.
Guru Membuat persiapan pelajaran dan menyediakan alat bantu pelajaran sebelum mulai mengajar, memecahkan masalah-masalah pelajaran yang dihadapi siswa untuk memberikan bimbingan pelajaran kepada siswa yang cerdas, siswa yang kurang cerdas, dan siswa yang
38
membandel serta memberikan pelajaran sesuai dengan bidang studi pada siswanya. 3.3
Analisis Sistem yang Sedang Berjalan Sistem pembelajaran di SDK Ricci I untuk siswa kelas satu khususnya untuk mata pelajaran matematika adalah dengan menerangkan pada para siswa tentang bab-bab pelajaran matematika tersebut di depan kelas. Di awal tahun ajaran, para siswa diajarkan tentang penambahan dan pengurangan dalam bentuk yang dasar sampai tahap menengah dengan jumlah angka yang masih 1 digit. Untuk bab-bab yang bersifat imajinasi seperti, bangun ruang dan jam, para guru memberikan alat-alat yang bisa membantu para siswa untuk meningkatkan imajinasi mereka sehingga mereka mampu untuk mengeluarkan ide-ide ataupun pertanyaan-pertanyaan yang ada di dalam pikiran mereka keluar melalui bendabenda nyata. Untuk penjumlahan dan pengurangan angka yang berbentuk puluhan,
hampir
semua
dari
siswa
mengalami
kesulitan
untuk
mengoperasikannya. Dan para guru kesulitan untuk menjelaskan pada muridmurid tersebut agar mengerti materi tersebut karena murid-murid masih belum lancar dalam membaca dan logikanya pun belum berjalan sepenuhnya. Perangkat ajar yang biasa digunakan disana, biasanya hanya berbentuk penjumlahan serta pengurangan dan penerapannya belum tentu ada sekali dalam seminggu karena perangkat ajar ini lebih ditujukan untuk mata pelajaran yang lain dan lebih bersifat bermain dari pada belajar. Kami ingin mencoba untuk menerapkan aplikasi yang kami buat ini, untuk lebih membantu para siswa menjadi lebih mudah untuk mengerti.
39
3.4
Wawancara Untuk wawancara dengan guru matematika yang mengajar pada kelas satu SD mendapat hasil: a)
Pada SD kelas satu ini, para siswa mulai diajarkan penambahan dan pengurangan pada awal semester. Sampai pada semester berikutnya akan diajarkan penambahan dan pengurangan dengan jumlah angka yang lebih banyak atau disebut juga penjumlahan susun panjang. Ditambah juga pengenalan bangun ruang dengan sisi-sisi yang menutupi bangun ruang itu.
b)
Pada pembelajaran tentang penjumlahan dan pengurangan susun panjang, para siswa mendapat kesulitan untuk mengerti pelajaran itu. Dan hasil ulangan yang di dapat pun tidak memuaskan. Para guru telah mencoba berkali-kali untuk menerangkan para siswa, namun butuh waktu yang agak lama dan berkali-kali agar dapat membuat para siswa mengerti.
3.5
Aplikasi Perangkat Ajar Sejenis Perangkat ajar ini adalah perangkat ajar mahir matematika untuk SD kelas satu yang diciptakan oleh PT Elex Media. Pada perangkat ajar ini, pengguna belajar tentang cara untuk berhitung dan mengenal matematika sebagai bahan dasar untuk pembelajaran di sekolah. Adapun menu yang terdapat di dalam perangkat ajar ini adalah:
40
1. Membaca bilangan Dalam menu ini terdapat bilangan dari angka 0-100. Selain itu, dalam menu ini juga terdapat pilihan belajar atau latihan. 2. Bilangan dan benda Pada menu ini terdapat angka 0-20. Angka tersebut menunjukkan benda yang muncul di layar. Juga terdapat piihan belajar dan latihan di dalamnya. 3. Mengurutkan Dalam menu ini terdapat tiga pilihan yaitu belajar mengurutkan benda, latihan, dan belajar mengurutkan bilangan. 4. Nilai tempat bilangan Pada menu ini terdapat dua angka yang terdiri dari puluhan dan satuan. Untuk pembelajarannya tersedia menu contoh soal, belajar, dan latihan. 5. Tambah kurang Pada menu ini terdapat dua angka yang terdiri puluhan dan satuan yang akan dikurangi atau ditambah. Hasil yang didapatkan berupa dua angka yang terdiri dari puluhan dan satuan. Selain itu di dalamnya terdapat pilihan menu contoh soal, susun pendek dan mendatar. Menu susun pendek adalah menjumlahkan atau mengurangkan dua angka sekaligus tanpa ada puluhan dan satuan secara bersusun. Untuk mempermudah pengguna maka terdapat pilihan menu yaitu belajar, contoh soal, dan latihan. Sama hal nya dengan
41
menu mendatar. Hanya bedanya hasil yang didapat berupa dua angka dalam bentuk mendatar. 6. Tes & uji kemampuanmu Pada menu ini pengguna dapat menguji kemampuannya dalam berhitung setelah mempelajari menu-menu yang diatas. Adapun pilihan menu didalamnya yaitu: membaca bilangan, bilangan dan benda, urutan jumlah benda, urutan bilangan, nilai tempat, tambah atau kurang susun pendek, tambah atau kurang mendatar. Masing-masing menu ini terdapat sub menu untuk pilihan waktu : satu menit, tiga menit, lima menit, dan kembali. Contoh tampilan pada aplikasi :
Gambar 3.2 Tampilan MAHIR MATEMATIKA SD KELAS SATU
42
Gambar 3.3 Tampilan MAHIR MATEMATIKA SD KELAS SATU
Gambar 3.4 Tampilan MAHIR MATEMATIKA SD KELAS SATU
43
Perangkat ajar ini adalah perangkat ajar KTSP matematika untuk SD/ MI kelas satu yang diciptakan oleh Ai-Learn. Pada perangkat ajar ini, pengguna belajar tentang matematika semester satu dan dua yang sudah memenuhi standar kompetensi sekolah dasar. Setiap menu dan sub menu terdapat tombol play dan pause untuk menjalankannya. Menu yang terdapat di dalam perangkat ajar ini adalah: 1. Mengenal bilangan Terbagi menjadi beberapa sub menu yaitu: bilangan 1 sampai 5, bilangan 6 sampai 10. Bilangan 11 sampai 20. menyusun bilangan, pertambahan dan pengurangan dan soal latihan. 2. Menghitung waktu dan panjang Terbagi menjadi beberapa sub menu yaitu: pagi siang sore dan malam, nama-nama hari, melihat jam, menghitung panjang benda, soal latihan. 3. Mengelompokkan bangun ruang Terbagi menjadi beberapa sub menu yaitu: berbagai bangun ruang, mana bangun yang lebih besar, dan soal latihan. 4. Bermain dengan puluhan Di dalam menu ini terbagi menjadi beberapa sub menu yaitu: bilangan
21
sampai
99,
mengurutkan
bilangan,
penjumlahan
pengurangan, pertukaran dan pengelompokkan, soal latihan
.
dan
44
5. Membandingkan berat Terbagi menjadi beberapa sub menu yaitu: berat dan ringan, membandingkan berat, soal latihan. 6. Mengelompokkan bangun datar Terbagi menjadi dua sub menu yaitu: berbagai bangun datar dan soal latihan. Untuk setiap soal latihan pada masing-masing sub menu dilengkapi dengan penjelasan atas jawaban yang dipilih. Contoh tampilan pada aplikasi:
Gambar 3.5 Tampilan KTSP MATEMATIKA SD/MI KELAS SATU
45
Gambar 3.6 Tampilan KTSP MATEMATIKA SD/MI KELAS SATU
Gambar 3.7 Tampilan KTSP MATEMATIKA SD/MI KELAS SATU
46
Tabel 3.1 Perbandingan aplikasi sejenis
Mahir Matematika
Kedalaman isi
√ isi materi yang disampaikan cukup lengkap, sesuai dengan tema nya yaitu mengajarkan anak‐anak tentang membaca bilangan, mengurutkan dan berhitung angka.
Konsistensi antarmuka
√√ Dalam aplikasi ini dinilai sangat baik terutama untuk konsistensi antarmukanya karena tidak mengubah‐ubah konsep awal antarmuka sehingga tidak membingungkan pengguna. √√ pada aplikasi ini penggunaan animasi nya sangat baik, mata pengguna akan terhibur dengan animasi 2D nya
Animasi
Pemilihan warna
Sound dan musik latar
KTSP Matematika √√ isi materi yang terdapat pada aplikasi sangat lengkap, karena selain mengajarkan anak‐anak tentang bilangan juga tentang macam‐macam bangun dan perbandingan berat melalui animasi suara dan gerak. Sehingga dapat membantu anak untuk memperluas pengetahuannya. √ Konsistensi antarmuka pada aplikasi ini sudah cukup baik karena konsistensi antarmuka pada aplikasi ini sesuai dengan tema yang terdapat pada aplikasi ini. Tetapi, rancangan antarmukanya belum sebaik aplikasi Mahir Matematika
√ penggunaan animasinya terlalu sederhana. Meskipun sudah memakai animasi 2D tetapi tidak sebaik dan sebagus aplikasi Mahir Matematika, sehingga belum cukup terhibur dengan animasi yang di suguhkan √ √√ Pemakaian warna yang terlalu Penggunaan warna yang cerah dan menggunakan simple dan cenderung kurangnya banyak warna yang dapat variasi warna, sehingga pengguna merasa kurang nyaman dan tidak memberikan kesan menarik saat menggunakan aplikasi menarik bagi pengguna dalam pemakaian aplikasi ini ini. √ √√ Penggunaan sound dan musik latar Pada aplikasi ini sudah cukup baik, namun belum penggunaan sound dan sebaik aplikasi Mahir Matematika musik latar nya sangat baik, sangat cocok untuk yang menggunakan aplikasi ini, tidak
47 berlebihan dan tidak kurang
Tingkat adaptasi pengguna
√√ untuk tingkat adaptasi pengguna diberikan nilai sangat baik karena tidak membingungkan pengguna saat pertama kali menggunakan aplikasi ini
√ pada aplikasi ini tingkat adaptasi user dinilai belum sebaik aplikasi Mahir Matematika, karena saat pengguna pertama kali memakai aplikasi ini akan mengalami kebingungan di awal sementara
Keterangan : √√
‐> Sangat baik
√
‐> Cukup Baik
Dari perbandingan dalam tabel diatas di dapatkan bahwa untuk membuat aplikasi multimedia yang baik di butuhkan kedalaman isi yang lengkap dan menunjang, namun tidak membingungkan pengguna. Dengan kedalaman isi yang lengkap bagi pengguna dapat mempelajari isi materi dalam aplikasi tanpa harus ada pertanyaan kembali dalam pikirannya karena isi materi yang tidak lengkap.
Untuk faktor konsistensi antarmuka dalam merancang aplikasi multimedia sangat penting, karena jika antarmuka tidak konsisten akan membingungkan pengguna. Rancangan antarmuka juga harus sesuai dengan konsep tema awal, jadi tiap halaman dalam aplikasi harus konsisten antarmukanya.
48
Selanjutnya pada aplikasi multimedia terdapat video, gambar, dan suara yang membuat aplikasi menjadi aplikasi multimedia. Namun, ada faktor lain yang dapat menjadikan aplikasi multimedia yaitu animasi. Aplikasi multimedia yang baik jika menggunakan animasi 2D dan atau 3D sehingga dapat menghibur pengguna dan menarik untuk dilihat.
Pemilihan warna yang baik dalam pembuatan aplikasi multimedia adalah dengan memilih lalu menggunakan warna cerah dan terdapat variasi warna yang kontras dalam aplikasi sehingga membawa kesan nyaman untuk pengguna yang menggunakan aplikasi multimedia. Mengurangi pemakaian kombinasi warna yang kurang variatif dan tidak menarik menimbulkan kesan kurang menarik untuk pengguna pada aplikasi multimedia.
Faktor lain yang membuat aplikasi multimedia menjadi baik ialah penggunaan sound (suara) dan musik latar yang tidak kurang dan tidak berlebihan, namun sesuai dengan tema aplikasi yang dibuat sehingga dapat menarik pengguna dalam memakai aplikasi ini dan mendengarkan musik latar dan sura yang dihasilkan. Selanjutnya aplikasi multimedia akan baik jika pengguna dapat menggunakan aplikasi tanpa harus mempunyai waktu yang cukup lama untuk beradaptasi dengan aplikasi yang akan dipakai oleh pengguna.
49
3.6
Rumusan Permasalahan Dari hasil analisis sistem dan data dalam bentuk wawancara dengan beberapa guru matematika, dapat dirumuskan beberapa kesulitan yang sedang dihadapi oleh guru dan siswa kelas satu SDK Ricci I dalam sistem pembelajaran di sekolah tersebut, khususnya untuk mata pelajaran matematika, yaitu : a.
Perangkat ajar yang pernah digunakan tidak difokuskan untuk mata pelajaran matematika. Sehingga penjelasan mengenai materi-materi yang sulit tidak tersampaikan.
b.
Kesulitan pada bab pembelajaran yang membahas tentang penjumlahan dan pengurangan susun panjang yang membutuhkan waktu yang lama untuk menjelaskannya.
3.7
Usulan Pemecahan Masalah Berdasarkan masalah-masalah yang ditemukan dan untuk meningkatkan pemahaman siswa kelas satu sekolah dasar RICCI I dalam mata pelajaran matematika, serta untuk mengatasi masalah yang dihadapi tersebut, maka dapat penulis mengusulkan untuk: a.
Membuat perangkat ajar matematika yang lebih fokus pada penjumlahan dan pengurangan susun panjang.
b.
Menambahkan
permainan-permainan
yang
lebih
interaktif
dan
komunikatif, serta sederhana, sehingga memberikan pemahaman yang mudah diterima oleh siswa.
50
c.
Mengurangi penggunaan kalimat-kalimat dan instruksi dalam bentuk tulisan maupun suara yang panjang dalam perangkat ajar, dan lebih memfokuskan pada tampilan dan gambar yang menarik.
d.
Melengkapi dan merumuskan komposisi yang lebih baik antara penjelasan, permainan dan latihan dalam perangkat ajar, sehingga dapat lebih efektif dan efisien dalam meningkatkan pemahaman siswa akan mata pelajaran yang kurang dimengerti Data yang diperlukan untuk membuat perangkat ajar ini adalah sistem
pembelajaran yang ada di SDK Ricci 1 beserta permasalahan-permasalahan yang sedang dihadapi oleh para guru, sehingga aplikasi yang dibuat dapat digunakan oleh para guru untuk menjelaskan materi-materi yang sulit diterangkan sebelumnya.
3.8
Perancangan Sistem Perancangan sistem yang dipakai untuk merancang perangkat ajar ini adalah perancangan UML yang meliputi class diagram, use case diagram, dan activity diagram.
51
3.8.1
Class Diagram
MsSoal
MsLogin
-Nomor
NamaPengg una
-Soal
- Password +insert()
+update() +delete()
-JawabanA 1..1
HighScore Pengguna
1..*
modify
-JawabanB NomorPenggu na
-JawabanC -Benar
1..1
1..*
NomorPenggu na
has
-Score -Pengguna
-Tampil
+insertscore() +insert()
-KdJenisSoal
1..*
- NamaPengguna +insert()
has
+update() +delete() 1..1 1..*
Rapor
has
NomorPenggu na
1..1
MsJenisSoal -KdJenisSoal
-KdJenisSoal
1..1
1..*
-JenisSoal
has
+getJenisSoal()
-Nilai -Tanggal +insert() +update() +viewRapor()
Gambar 3.8 Class Diagram
+viewScore()
52 3.8.2
Use Case Diagram
System Perangkat Ajar menambah soal
mengubah soal
menghapus soal
menampilkan soal / tidak
mengelompokan soal
melihat tutorial
mengatur tutorial
Admin User mengambil course
melihat rapor
melihat high score
Gambar 3.9 Use Case Diagram
53
3.8.3 Use Case Specification Use Case Specification menjelaskan lebih detail mengenai interaksi antara pelaku dengan sistem.
Seluruh
kegiatan
akan
mendapatkan respon dari sestem yang dikembalikan lagi ke pelaku. a. Use Case Specification Menambah Soal Pada proses ini, admin dapat melakukan penambahan soal baru yang akan tampil dalam menu course. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat menambah soal Mengatur soal Kegiatan Admin 1. Admin memilih menu Maintenance 3. Admin memasukkan penggunaname dan password 5. Admin mengklik button insert, kemudian memasukkan soal baru beserta pilihan jawaban dan jawaban benarnya, tampil atau tidak dilayar, serta masuk kedalam kelompok mana soal itu
Respon Sistem 2. sistem akan menampilkan login admin 4. Sistem akan mengecek apakah penggunaname dan password valid, jika valid maka akan tampil menu Maintenance soal 6. Sistem akan memasukan soal baru tersebut ke dalam database
b. Use Case Specification Mengubah Soal Pada proses ini, admin dapat melakukan pengubahan terhadap soal yang telah ada, baik itu memilih untuk menampilkan atau tidak, atau memasukan kedalam jenis soal yang mana yang nantinya akan tampil dalam menu course.
54 Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat mengubah soal Mengatur soal Kegiatan Admin 1. Admin memilih menu Maintenance 3. Admin memasukan penggunaname dan password 5. Admin mengubah soal yang telah ada, termasuk memasukan kedalam jenis soal yang mana serta tampil atau tidak di menu course, kemudian mengklik tombol update
Respon Sistem 2. sistem akan menampilkan login admin 4. Sistem akan mengecek apakah penggunaname dan password valid, jika valid maka akan tampil menu Maintenance soal 6. Sistem akan mengubah soal dan menyimpan kedalam database
c. Use Case Specification Menghapus Soal Pada proses ini, admin dapat melakukan penghapusan terhadap soal yang telah ada. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat menghapus soal Mengatur soal Kegiatan Admin 1. Admin memilih menu Maintenance 3. Admin memasukan penggunaname dan password 5. Admin memilih soal yang akan dihapus dari database, kemudian mengklik tombol delete
Respon Sistem 2. sistem akan menampilkan login admin 4. Sistem akan mengecek apakah penggunaname dan password valid, jika valid maka akan tampil menu Maintenance soal 6. Sistem akan menampilkan pesan, apakah akan benar akan menghapus data, jika ya, maka soal dihapus dari database
d. Use Case Specification Menampilkan soal atau tidak Pada proses ini, admin dapat melakukan pemilihan terhadap soal yang akan tampil di menu course.
55 Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat melakukan pemilihan soal Mengatur soal Kegiatan Admin Respon Sistem 1. Admin memilih menu 2. sistem akan menampilkan login Maintenance admin 3. Admin memasukan 4. Sistem akan mengecek apakah penggunaname dan penggunaname dan password valid, jika valid maka akan tampil password menu Maintenance soal 5. Admin memilih soal yang 6. Sistem akan menampilkan soal akan ditampilkan dan atau tidak tergantung checklist mencek tampilkan soal, yang dilakukan admin, jika check kemudian tekan tombol maka soal akan tampil, jika tidak ada check maka soal tidak tampil update
e. Use Case Specification Mengelompokan Soal Pada proses ini, admin dapat melakukan pengelompokan terhadap soal, apakah soal termasuk kedalam jenis soal penjumlahan I, atau jenis soal yang lain. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat melakukan pengelompokan soal Mengatur soal Kegiatan Admin Respon Sistem 1. Admin memilih menu 2. sistem akan menampilkan login Maintenance admin 3. Admin memasukan 4. Sistem akan mengecek apakah penggunaname dan penggunaname dan password valid, jika valid maka akan tampil password menu Maintenance soal 5. Admin memilih soal yang 6. Sistem akan menyimpan soal akan dikelompokan kedalam dan jenis soalnya kedalam jenis soal penjumlahan database dasar, dan seterusnya
f. Use Case Specification Melihat Tutorial Pada proses ini, admin dan pengguna dapat melihat tutorial perhitungan matematika, penjumlahan dan pengurangan menggunakan gambar dan perhitungan angka susun.
56 Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin, Pengguna Admin dan pengguna dapat melihat tutorial Memahami Tutorial dan Pelajaran Kegiatan Admin,Pengguna Respon Sistem 1. Admin/Pengguna memilih 2. sistem akan menampilkan menu Tutorial animasi tutorial
g. Use Case Specification Mengatur tutorial Pada proses ini, admin dapat melakukan pengaturan / navigasi terhadap tutorial dengan mengklik button next atau previous, serta dapat memilih untuk memilih jenis tutorial yang tersedia Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin Admin dapat melakukan pengaturan dan navigasi tutorial Mengatur soal Kegiatan Admin Respon Sistem 1. Admin memilih menu 2. sistem akan menampilkan Tutorial Tutorial 3. Admin melakukan navigasi 4. Sistem akan pindah ke menu atau memilih menu tutorial yang dipilih oleh admin yang ada
57
h. Use Case Specification Mengambil Course Pada proses ini, admin dan pengguna dapat mengambil course latihan soal-soal yang ada. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin, Pengguna Admin dan Pengguna dapat mengambil course Memahami Tutorial lebih lanjut dengan latihan soal Kegiatan Admin, Pengguna Respon Sistem 1. Admin / pengguna memilih 2. sistem akan menampilkan menu Course halaman untuk memasukkan nama 3. Admin / pengguna 4. Sistem akan mengecek apakah memasukkan nama dan nama sudah ada, jika belum ada menekan ok maka create nama didatabase, dan menampilkan halaman latihan soal. 5. Admin / pengguna dapat 6. Sistem akan menyimpan score melakukan latihan soal, ke dalam database memilih jawaban dan terakhir dapat melihat rapor benar atau salah
i. Use Case Specification Melihat Rapor Pada proses ini, admin dan pengguna dapat melihat rapor dari hasil yang telah dikerjakan selama course. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin, Pengguna Admin dan Pengguna dapat melihat rapor Melihat Nilai untuk masing-masing jenis soal Kegiatan Admin, Pengguna Respon Sistem 1. Admin / pengguna memilih 2. sistem akan menampilkan menu Course halaman untuk memasukkan nama 3. Admin / pengguna 4. Sistem akan mengecek apakah memasukkan nama dan nama sudah ada, jika belum ada menekan ok maka create nama didatabase, dan menampilkan halaman latihan soal. 5. Setelah admin/pengguna 6. Sistem akan menampilkan nilai melakukan latihan soal maka dari database dapat melihat rapor / nilai untuk masing-masing jenis soal yang ada
58
j. Use Case Specification Melihat Highscore Pada proses ini, admin dan pengguna dapat melihat highscore atau nilai rata-rata dari keseluruhan soal dari masing-masing pengguna yang telah mengambil course. Pelaku Deskripsi Tujuan Bidang Khas suatu Event
Admin, Pengguna Admin dan Pengguna dapat melihat high score Melihat Highscore Kegiatan Admin, Pengguna Respon Sistem 1. Admin / pengguna memilih 2. sistem akan menampilkan menu Highscore highscore dari pengguna yang telah mengambil course
3.8.4 Activity Diagram Activity diagram berisi penjelasan lebih lengkap mengenai urutan suatu proses yang terjadi antara pelaku dan sistem. Aktivitas yang pertama selalu dimulai dari pelaku, kemudian akan mendapat respon dari sistem yang nantinya akan menampilkan proses akhir dari proses tersebut. a. Activity Diagram Menu Utama Proses ini membawa user pada halaman utama dari aplikasi. Di menu utama ini, terdapat menu maintenance, tutorial, course, dan high score. Pada saat admin/pengguna masuk ke menu maintenance, akan muncul username dan password yang harus diisi jika ingin melanjutkan ke halaman berikutnya. Di menu tutorial, admin/pengguna akan dijelaskan tentang pelajaran matematika untuk kelas 1 SD. Pada menu course, admin/pengguna diharuskan untuk mengisi nama untuk melanjutkan ke layar berikutnya. Menu high score akan menampilkan hasil nilai tertinggi yang telah diperoleh oleh admin/pengguna yang telah
59
login pada menu course. Menu exit akan mengantarkan admin/pengguna keluar dari aplikasi.
Memilih menu maintenance
Memilih menu tutorial
Memilih menu high score
Memilih menu course
Menampilkan perolehan score tertinggi
Menampilkan layar login course
Menampilkan layar tutorial
Menampilkan layar login maintenance
Gambar 3.10 Activity Diagram Menu Utama
60
b. Activity Diagram Menambah Soal Proses ini terjadi saat admin akan menambahkan soal baru kedalam database. Admin terlebih dahulu memilih menu Maintenance, kemudian system akan menampilkan halaman login admin, setelah admin mengisi penggunaname dan password, maka sistem akan melakukan pengecekan terhadap penggunaname dan password itu, jika valid, maka akan tampil halaman Maintenance soal. Admin menekan tombol insert, kemudian mengisi soal baru dan menekan tombol insert now, maka soal akan tersimpan kedalam database.
61
Pengguna
Sistem
memilih menu maintenance menampilkan halaman login admin
mengisi username dan password
memeriksa username dan password
tekan tombol insert dan masukkan soal, setelah itu tekan insert now
masuk halaman maintenance soal
masukkan soal ke dalam database
Gambar 3.11 Activity Diagram Menambah Soal
a. Activity Diagram Mengubah Soal Proses ini terjadi saat admin akan mengubah soal yang telah ada. Admin terlebih dahulu memilih menu Maintenance, kemudian sistem akan menampilkan halaman login admin, setelah admin mengisi penggunaname dan password, maka system akan melakukan pengecekan
62
terhadap penggunaname dan password itu, jika valid, maka akan tampil halaman Maintenance soal. Admin memilih soal yang akan diubah, kemudian menekan tombol update, maka soal itu telah terubah di database.
Pengguna
Sistem
memilih menu maintenance menampilkan halaman login admin
mengisi username dan password
memeriksa username dan password
pilih soal yang akan diubah, tekan tombol ubah
masuk halaman maintenance soal
soal sudah terubah dalam database
Gambar 3.12 Activity Diagram Mengubah Soal
63
b. Activity Diagram Menghapus Soal Proses ini terjadi saat admin akan mengubah soal yang telah ada. Admin terlebih dahulu memilih menu Maintenance, kemudian sistem akan menampilkan halaman login admin, setelah admin mengisi penggunaname dan password, maka system akan melakukan pengecekan terhadap penggunaname dan password itu, jika valid, maka akan tampil halaman Maintenance soal. Admin memilih soal yang akan dihapus, kemudian menekan tombol delete, maka soal itu telah terhapus dari database.
64
Pengguna
Sistem
memilih menu maintenance menampilkan halaman login admin
mengisi username dan password
memeriksa username dan password
pilih soal yang akan dihapus, tekan tombol hapus
masuk halaman maintenance soal
soal sudah terhapus dari database
Gambar 3.13 Activity Diagram Menghapus Soal
c. Activity Diagram Menampilkan Soal atau tidak Proses ini terjadi saat admin akan mengubah soal yang telah ada. Admin terlebih dahulu memilih menu Maintenance, kemudian sistem akan menampilkan halaman login admin, setelah admin mengisi penggunaname dan password, maka system akan melakukan pengecekan terhadap penggunaname dan password itu, jika valid, maka akan tampil
65
halaman Maintenance soal. Admin memilih soal yang akan ditampilkan, kemudian men check tampilkan soal, setelah itu menekan tombol update, maka soal yang telah dicheck oleh admin akan ditampilkan di menu course.
Pengguna
Sistem
memilih menu maintenance menampilkan halaman login admin
mengisi username dan password
memeriksa username dan password
pilih soal yang akan ditampilkan, check tampilkan soal, tekan update
masuk halaman maintenance soal
soal yang tercheck akan diupdate dan tampil pada menu course
Gambar 3.14 Activity Diagram Menampilkan Soal atau tidak
d. Activity Diagram Mengelompokkan Soal Proses ini terjadi saat admin akan mengubah soal yang telah ada. Admin terlebih dahulu memilih menu Maintenance, kemudian sistem
66
akan menampilkan halaman login admin, setelah admin mengisi penggunaname dan password, maka sistem akan melakukan pengecekan terhadap penggunaname dan password itu, jika valid, maka akan tampil halaman
Maintenance
soal.
Admin
memilih
soal
yang
akan
dikelompokkan, memilih jenis soalnya, kemudian menekan tombol update, maka sistem akan menyimpan soal tersebut berdasarkan kelompok jenis soal.
67 Pengguna
Sistem
memilih menu maintenance menampilkan halaman login admin
mengisi username dan password
memeriksa username dan password
pilih soal yang akan dikelompokan, masukan dalam jenis soal mana, update
masuk halaman maintenance soal
soal yang telah dikelompokan akan tersimpan
Gambar 3.15 Activity Diagram Mengelompokkan Soal
e. Activity Diagram Melihat tutorial Proses ini terjadi saat admin atau pengguna akan melihat tutorial, maka admin atau pengguna menekan tombol tutorial dan akan tampil tutorial perhitungan matematika.
68
Pengguna
Sistem
memilih menu tutorial menampilkan halaman tutorial
Gambar 3.16 Activity Diagram Melihat tutorial
f. Activity Diagram Mengatur tutorial Proses ini terjadi saat admin dapat mengatur navigasi tutorial, untuk maju ke tutorial selanjutnya atau mundur ke tutorial sebelumnya, serta dapat langsung memilih menu untuk lanjut ke tutorial yang telah dipilih.
Pengguna
Sistem
memilih menu tutorial menampilkan halaman tutorial
melakukan navigasi atau memilih menu tutorial
menampilkan sesuai navigasi oleh pengguna
Gambar 3.17 Activity Diagram Mengatur tutorial
69
g. Activity Diagram mengambil course Proses ini terjadi saat admin / pengguna dapat mengambil course atau latihan soal, pertama tama memilih jenis soal terlebih dahulu, kemudian memilih jawaban yang benar untuk soal
Pengguna
Sistem
memilih menu course menampilkan halaman input nama
masukan nama
menampilkan halaman course
memilih jawaban course, setelah selesai tekan finish menyimpan score dari user ke dalam database
Gambar 3.18 Activity Diagram mengambil course
h. Activity Diagram melihat rapor Proses ini terjadi saat admin atau pengguna akan melihat rapor, maka setelah mengisi semua soal berdasarkan jenis soal, maka akan muncul rapor dari pengguna yang bersangkutan. Nilai rapor berdasarkan jenis soal.
70
Pengguna
Sistem
memilih menu course menampilkan halaman input nama
masukan nama
menampilkan halaman course
memilih jawaban course, setelah selesai tekan finish menyimpan score dari user ke dalam database
menekan tombol lihat rapor menampilkan nilai user yang bersangkutan dari database
Gambar 3.19 Activity Diagram melihat rapor
i. Activity Diagram melihat highscore Proses ini terjadi saat admin atau pengguna akan melihat high score, admin atau pengguna cukup menekan tombol highscore, maka akan muncul semua score dari semua pengguna yang telah mengambil course.
71
Pengguna
Sistem
memilih menu highscore menampilkan highscore dari masing-masing user
Gambar 3.20 Activity Diagram melihat highscore
3.9
Perancangan Layar Perancangan Input dan Output 1. Form Menu Utama Form ini adalah Form awal dimana terdapat pilihan empat menu lain, yaitu: Menu Maintenance, Menu Tutorial, Menu Course, dan Menu Highscore.
1 2 Header Selamat Datang
3 Maintenance
4 Course
5 Tutorial
6 High Score
7 Exit
Gambar 3.21 Form Menu Utama
72
Tabel 3.2 Keterangan Form Menu Utama No 1 2 3 4 5 6 7
Kategori Gambar Animasi Tombol Tombol Tombol Tombol Tombol
Penjelasan Gambar Background Layar Animasi Header Selamat Datang Tombol untuk masuk ke menu Maintenance Tombol untuk masuk ke menu course Tombol untuk masuk ke menu tutorial Tombol untuk masuk ke menu high score Tombol untuk keluar aplikasi
Modul Form Main Menu Jika tekan tombol ”Maintenance” Tampilkan Form Login Admin Jika tekan tombol ”Tutorial” Tampilkan Form Tutorial Jika tekan tombol ”Course” Tampilkan Form Input Nama untuk Course Jika tekan tombol ”High Score” Tampilkan Form High Score Jika tekan tombol ”Exit” Keluar dari aplikasi Akhir Modul
2. Form Maintenance Form ini digunakan oleh admin untuk melakukan perubahan terhadap soalsoal yang ada dalam menu Course. Hanya Admin yang dapat menggunakan menu ini. Setelah memilih menu Maintenance, maka akan muncul halaman Login, hal ini untuk mencegah orang lain selain admin untuk memodifikasi soal.
73
1
2 Penggunaname :
3
4 Password :
5
6 Kembali
7 Login
8 Reset
Gambar 3.22 Form Maintenance
Tabel 3.3 Keterangan Form Maintenance No 1 2 3
Kategori Gambar Label Textbox
4 5
Label Textbox
6 7
Tombol Tombol
8
Tombol
Penjelasan Gambar Background Layar Label Penggunaname Textbox penggunaname untuk menginput penggunaname Label Password Textbox Password untuk menginput password Tombol untuk kembali ke halaman utama Tombol untuk masuk ke menu Maintenance Tombol untuk menghapus / mereset yang telah diinput
Modul Form Maintenance Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Login” Tampilkan Animasi Akhir Modul Setelah admin memasukkan Penggunaname dan Password, maka akan muncul menu untuk memodifikasi soal yang nantinya dapat dipakai pada menu Course.
74
1
2 Maintenance Soal
3 No.
4 Soal
9
5 Jawaban A
10
6 Jawaban B
11
7 Jawaban C
12
14 Munculkan Soal
15 Tipe Soal
8 Jawaban Benar
16 |<
13 17 <<
20
21
Insert
Update
18 >> 22 Delete
19 >| 23 Exit
Gambar 3.23 Login Maintenance
75
Tabel 3.4 Keterangan Login Maintenance No 1 2 3 4 5 6 7 8 9 10 11 12 13 14
Kategori Gambar Label Label Label Label Label Label Label Textbox Textbox Textbox Textbox Textbox Checkbox
Penjelasan Gambar Background Layar Label Judul Label Nomor Soal Label Soal Label Jawaban A Label Jawaban B Label Jawaban C Label Jawaban Benar Textbox berisi Soal Textbox berisi Jawaban A Textbox berisi Jawaban B Textbox berisi Jawaban C Textbox berisi Jawaban Benar Checkbox untuk munculkan soal atau tidak
15 16
Listbox Tombol
17
Tombol
18
Tombol
19
Tombol
20
Tombol
21
Tombol
22
Tombol
23
Tombol
Memilih Tipe soal Tombol Navigasi Pindah ke record pertama Tombol Navigasi Pindah ke record sebelumnya Tombol Navigasi Pindah ke record selanjutnya Tombol Navigasi Pindah ke record terakhir Tombol untuk insert / memasukan soal baru Tombol untuk update / mengubah soal yang sudah ada Tombol untuk delete / menghapus soal yang sudah ada Tombol untuk keluar dari tampilan Maintenance menu
Modul Form Maintenance Jika tekan tombol ”|<” Tampilkan Record pertama Jika tekan tombol ”<<” Tampilkan Record sebelumnya Jika tekan tombol ”>|” Tampilkan Record terakhir
76
Jika tekan tombol ”>>” Tampilkan Record selanjutnya Jika tekan tombol ”Insert” Tampilkan Form Maintenance yang masih kosong Jika tekan tombol ”Update” Tampilkan Form Maintenance yang sudah ada isinya Jika tekan tombol ”Delete” Menghapus soal yang ada pada Form Maintenance di saat itu Jika tekan tombol ”Exit” Tampilkan Form Menu Utama Jika tekan listbox ”Tipe Soal” Tampilkan Tipe Soal yang ada Akhir Modul
3. Form Tutorial Form ini digunakan untuk menampilkan Tutorial pembelajaran dengan menggunakan tampilan yang Pengguna Friendly. 1 Layar Tutorial
2 Judul Tutorial 3 Penjumlahan I
9 Halaman Utama Page Tutorial
4 Pengurangan I
5 Penjumlahan II
6 Pengurangan II
7 Penjumlahan III
10 Next 8 Pengurangan III
11 << Kembali ke menu utama
Gambar 3.24 Form Tutorial
77
Tabel 3.5 Keterangan Form Tutorial No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9
Label
10 11
Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Halaman utama yang berisikan pengantar sebelum masuk tutorial Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial yang dipilih pada saat itu Akhir Modul
78
4. Form Tutorial Penjumlahan I 1 Layar Tutorial Penjumlahan I 5. 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.25 Form Tutorial Penjumlahan I
79
Tabel 3.6 Keterangan Form Tutorial Penjumlahan I No 1 2
Kategori Gambar Label
Penjelasan Gambar Background Layar Judul Tutorial
3
Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Gambar penjumlahan 2 bilangan Penjelasan gambar Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Penjumlahan I Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Penjumlahan I Akhir Modul
80
6. Form Tutorial Pengurangan I 1 Layar Tutorial Pengurangan I 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.26 Form Tutorial Pengurangan I
81
Tabel 3.7 Keterangan Form Tutorial Pengurangan I No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Gambar pengurangan 2 bilangan Penjelasan gambar Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Pengurangan I Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Pengurangan I Akhir Modul
82
7. Form Penjumlahan II 1 Layar Tutorial Penjumlahan II 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.27 Form Penjumlahan II
83
Tabel 3.8 Keterangan Form Tutorial Penjumlahan II No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Gambar penjumlahan 3 bilangan Penjelasan gambar Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Penjumlahan II Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Penjumlahan II Akhir Modul
84
8. Form Pengurangan II 1 Layar Tutorial Pengurangan II 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.28 Form Tutorial Pengurangan II
85
Tabel 3.9 Keterangan Tutorial Pengurangan II No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Gambar pengurangan 3 bilangan Penjelasan gambar Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Pengurangan II Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Pengurangan II Akhir Modul
86
9. Form Penjumlahan III 1 Layar Tutorial Penjumlahan III 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.29 Form Penjumlahan III
87
Tabel 3.10 Keterangan Form Tutorial Penjumlahan III No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Penjumlahan 3 bilangan secara bersusun Penjelasan Penjumlahan 3 bilangan susun Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Penjumlahan III Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Penjumlahan III Akhir Modul
88
10. Form Pengurangan III 1 Layar Tutorial Pengurangan III 2 Judul Tutorial 2 Judul Tutorial 3 Penjumlahan I
9 gambar 4 Pengurangan I
5 Penjumlahan II
10 Penjelasan gambar 6 Pengurangan II
7 Penjumlahan III
11 Next 8 Pengurangan III
12 << Kembali ke menu utama
Gambar 3.30 Form Pengurangan III
89
Tabel 3.11 Keterangan Form Pengurangan III No 1 2 3
Kategori Gambar Label Tombol
4
Tombol
5
Tombol
6
Tombol
7
Tombol
8
Tombol
9 10 11 12
Gambar Text Tombol Tombol
Penjelasan Gambar Background Layar Judul Tutorial Tombol untuk menuju ke tutorial penjumlahan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 2 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial pengurangan 3 bilangan menggunakan gambar Tombol untuk menuju ke tutorial penjumlahan 3 bilangan susun bertingkat Tombol untuk menuju ke tutorial pengurangan 3 bilangan susun bertingkat Berisi Pengurangan 3 bilangan secara bersusun Penjelasan Pengurangan 3 bilangan susun Tombol untuk menuju ke tutorial berikutnya Tombol untuk kembali ke halaman utama
Modul Form Tutorial Pengurangan III Jika tekan tombol ”Kembali” Tampilkan Main Menu Jika tekan tombol ”Penjumlahan I” Tampilkan Menu Tutorial Penjumlahan I Jika tekan tombol ”Pengurangan I” Tampilkan Menu Tutorial Pengurangan I Jika tekan tombol ”Penjumlahan II” Tampilkan Menu Tutorial Penjumlahan II Jika tekan tombol ”Pengurangan II” Tampilkan Menu Tutorial Pengurangan II Jika tekan tombol ”Penjumlahan III” Tampilkan Menu Tutorial Penjumlahan III Jika tekan tombol ”Pengurangan III” Tampilkan Menu Tutorial Pengurangan III Jika tekan tombol ”Next” Tampilkan Layar selanjutnya dari tutorial Pengurangan III Akhir Modul
90
11. Form Course Form ini digunakan untuk melakukan latihan soal-soal tentang materi Tutorial yang telah diajarkan. Pengguna harus mengisi nama terlebih dahulu.
1 2 Silahkan isi Nama terlebih dahulu
3 Nama
4
5 Ok
6 Reset
7 << Kembali ke menu
Gambar 3.31 Form Course Login
Tabel 3.12 Keterangan Form Course Login No 1 2
Kategori Gambar Label
3 4 5
Label Textbox Tombol
6
Tombol
7
Tombol
Penjelasan Gambar Background Layar Label untuk pemberitahuan untuk mengisikan nama Label Nama Textbox untuk mengisi nama Tombol untuk melanjutkan ke menu course setelah nama diisi Tombol untuk menghapus nama yang sudah dihapus Tombol untuk kembali ke menu utama
Modul Form Course Login Jika tekan tombol ”Ok” Tampilkan Animasi
91
Jika tekan tombol ”Reset” Menghapus Nama Jika tekan tombol ”<<” Tampilkan Form Menu Utama Akhir Modul
Setelah Pengguna mengisi nama dan mengklik ok, maka akan tampil animasi singkat.
Animasi
Gambar 4.21 Animasi setelah login
Gambar 3.32 Animasi Setelah animasi singkat, maka akan tampil Halaman Course yang akan diambil oleh pengguna yang bersangkutan.
92
1
2 Selamat datang,
3 Jenis Soal 4 Pertanyaan 5 Soal 6 a.
Jawaban A
7 b.
Jawaban B
8 c.
Jawaban C
9 << Kembali
10 >> / Finish
11 Score : XX
Gambar 4.22 Form Course setelah Login
Gambar 3.33 Form Course setelah Login
93
Tabel 3.13 Keterangan Form Course setelah Login No 1 2
Kategori Gambar Label
3
Label
4
Frame
5 6 7 8 9 10
Label Radiobutton Radiobutton Radiobutton Tombol Tombol
11
Label
Penjelasan Gambar Background Layar Label untuk menyapa pengguna yang telah mengisi nama Label yang berisikan jenis soal (penjumlahan, pengurangan) Frame untuk tempat pertanyaan dan jawaban a sampai c Label Soal Pilihan Jawaban A Pilihan Jawaban B Pilihan Jawaban C Tombol untuk kembali ke menu utama Tombol untuk melanjutkan ke soal berikutnya Label yang berisi score dari pengguna
Modul Form Course setelah Login Jika tekan tombol ”>> / Finish” Tampilkan soal selanjutnya / tampilkan Form High Score Jika tekan tombol ”<<” Tampilkan Form Menu Utama Akhir Modul Bila sudah sampai pada akhir dari pertanyaan dan pengguna meng-klik finish, maka akan keluar tampilan sebagai berikut.
94
1
2 Score Akhir 3 -
Penjumlahan I : xx Pengurangan I : xx Penjumlahan II : xx Pengurangan II : xx Penjumlahan III : xx Pengurangan III : xx
4 Nilai Rata‐ rata : XX,XX
5 Exit
Gambar 3.34 Form Score Akhir
Tabel 3.14 Keterangan Form Score Akhir No 1 2 3
Kategori Gambar Label Label
4 5
Label Tombol
Penjelasan Gambar Background Layar Label Judul Score Akhir Label yang berisikan nilai masing‐masing dari course yang sudah diambil Berisikan nilai rata‐rata dari keseluruhan course Tombol untuk kembali ke menu utama
Modul Form Score Akhir Jika tekan tombol ”Exit” Tampilkan Form Menu Utama Akhir Modul 12.
Form High Score Form ini digunakan untuk melihat Highscore dari Pengguna yang telah
mengambil Course. Sort berdasarkan Score tertinggi hingga Score terendah.
95 1 2 Pengguna High Score 3 Pengguna
4 Score
5 CLOSE
Gambar 3.35 Form High Score
Tabel 3.35 Keterangan Form High Score No 1 2
Kategori Gambar Label
3
Label
4
Frame
5
Tombol
Penjelasan Gambar Background Layar Label untuk menyapa pengguna yang telah mengisi nama Label yang berisikan jenis soal (penjumlahan, pengurangan, mengenal wantu, mengenal bentuk) Frame untuk tempat pertanyaan dan jawaban a sampai c Tombol untuk kembali ke menu utama
Modul Form Score Akhir Jika tekan tombol ”Close” Tampilkan Form Menu Utama Akhir Modul
96
3.10
Perancangan Basis Data Data-data yang akan diolah menjadi informasi akan ditampung didalam tabeltabel yang sesuai dengan fungsinya. Dibawah ini akan dijelaskan tentang spesifikasi dari tabel-tabel itu: 1. Tabel Login Di dalam tabel ini terdapat field namapengguna yang berfungsi sebagai pengenal atau ID dari admin. Tabel password yang berfungsi sebagai penampung kata sandi rahasia yang hanya diketahui oleh admin dengan ID bersangkutan. Bila ID dan password yang diketik berbeda dengan ID dan password yang ada di dalam database, maka pengguna tersebut dianggap bukan sebagai admin dan tidak dapat masuk ke dalam menu maintenance. Nama File : data.mdb Nama Table : MsLogin Primary Key : NamaPengguna Tabel 3.16 Tabel Login
Field Penggunaname
Tipe Field Text
Panjang Field 15
Keterangan Penggunaname untuk Login sebelum masuk Menu Maintenance Soal
Password
Text
15
Password untuk Login sebelum masuk Menu Maintenance Soal
2. Tabel Master Soal Di dalam tabel master soal ini, terdapat beberapa field yang berbeda fungsi. Field soal digunakan sebagai tempat menampung soal yang telah
97
dibuat oleh admin. Field jawaban digunakan sebagai tempat untuk menampung jawaban yang diberikan kepada pengguna. Field benar digunakan sebagai validasi apakah jawaban yang dimasukan oleh user sesuai dengan jawaban yang ada di dalam database. Field tampil digunakan untuk menampilkan soal atau tidak. Field kdjenissoal digunakan untuk mengelompokkan soal-soal yang telah dibuat akan masuk ke dalam jenis apa. Field namapengguna adalah sebagai tanda bahwa siapa yang telah memasukan atau memodifikasi soal yang ada di dalam database. Dari soal yang ada di dalam database, dan dari yang telah dipilih untuk dimunculkan, soal akan ditampilkan pada jenis soal yang dipilih oleh user. Soal yang akan dimunculkan adalah berurutan dari soal nomor 1 sampai soal nomor terakhir (sesuai yang telah diatur oleh admin), bila admin tidak mengatur jumlah soal yang ingin dikeluarkan, maka default-nya adalah 10 soal dari tiap jenis soal dan keluar secara berurutan dari awal sampai akhir. Nama File : data.mdb Nama Table : MsSoal Primary Key : Nomor
98
Tabel 3.17 Tabel Master Soal Field Nomor Soal JawabanA JawabanB JawabanC Benar Tampil KdJenisSo al Pengguna name
Tipe Field Panjang Field Keterangan AutoNumber 3 Nomor urut Sebagai Primary Key Text 50 Deskripsi Soal Text 50 Deskripsi Jawaban untuk opsi A Text 50 Deskripsi Jawaban untuk opsi B Text 50 Deskripsi Jawaban untuk opsi C Text 1 Jawaban yang benar (a/b/c) Integer 1 Variable Penampung Soal mau ditampilkan (1) atau tidak (0) Text 5 Kode Jenis Soal Text
15
Pengguna yang memodifikasi Soal
3. Tabel MsJenisSoal Dalam tabel ini, dikelompokan kode dari jenis soal dan jenis soalnya, yang hanya ditampilkan pada database. Nama File : data.mdb Nama Table : MsJenisSoal Primary Key : KdJenisSoal Tabel 3.18 Tabel MsJenisSoal Field Tipe Field KdJenisSoal Text JenisSoal Text
Panjang Field Keterangan 5 Kode Jenis Soal 15 Jenis Soal
4. Tabel Rapor Pada tabel ini, terdapat field nilai yang berguna sebagai penyimpan skor untuk jawaban benar yang telah dijawab oleh pengguna. Dan pada akhir dari Course, total dari jumlah jawaban yang benar akan dijumlahkan dan ditampilkan di menu Raport. Juga terdapat field tanggal yang berfungsi
99
menyimpan data tanggal pada saat soal-soal yang ada pada course dikerjakan,
sehingga
para
guru
atau
admin
dapat
memantau
perkembangan siswa. Nama File : data.mdb Nama Table : Rapor Primary Key : NomorPengguna,KdJenisSoal Tabel 3.19 Tabel Rapor Field Tipe Field NomorPengguna Integer KdJenisSoal Text Nilai Integer Tanggal Date
Panjang Field Keterangan 5 NomorPengguna 5 Kode Jenis Soal 2 Score / Nilai yang dimiliki oleh Pengguna Tanggal Pengerjaan
5. Tabel Pengguna Pada tabel ini, field nomorpengguna yang berfungsi sebagai tanda pengenal dari tiap user yang telah login ke dalam menu Course dan nomorpengguna tidak dapat dirubah. Dan field pengguna yang dapat digunakan sebagai tempat untuk menyimpan nama dari pengguna yang telah login ke dalam menu course. Nama File : data.mdb Nama Table : Highscore Primary Key : NomorPengguna Tabel 3.20 Tabel Pengguna Field Tipe Field NomorPengguna Integer Pengguna
Text
Panjang Field 5 20
Keterangan Nomor Pengguna yang tergenerate otomatis Nama yang diinput oleh pengguna
100
6. Tabel High Score Di dalam tabel ini, terdapat field score yang didapat dari jumlah nilai rata-rata pengerjaan tiap siswa pada tiap jenis soal. 10 nilai rata-rata tertinggi akan ditampilkan dalam menu high score. Bila dalam keadaan 10 nilai tertinggi sudah terisi, pengguna harus bisa untuk melebihi nilai rata-rata yang terendah agar dapat ditampilkan dalam menu high score. Dapat diambil contoh bila pengguna mendapatkan peringkat ke 3 tertinggi dalam keadaan high score yang sudah penuh dengan 10 nilai, maka nilai yang berada di posisi ke 3 akan bergeser ke posisi ke 4, lalu posisi ke 4 akan bergeser ke posisi ke 5, dengan pola yang sama akan terus bergeser sampai pada posisi ke 10, lalu posisi ke 10 dibuang dan posisi ke 9 menggantikan posisi ke 10 sebagai nilai terendah. Nama File : data.mdb Nama Table : Highscore Primary Key : NomorPengguna Tabel 3.21 Tabel High Score Field Tipe Field NomorPengguna Integer Score
Integer
Panjang Field 5 2
Keterangan Nomor Pengguna yang tergenerate otomatis Score / Nilai yang dimiliki oleh Pengguna
101 MsSoal MsLogin PK
PK
Nomor
FK2 FK1
Soal JawabanA JawabanB JawabanC Benar Tampil KdJenisSoal Username
Username 1..1 modify
1..*
Password
User PK
HighScore
NomorUser
1..1
has
1..*
User
has
1..* 1..*
Rapor
1..1
MsJenisSoal PK
KdJenisSoal JenisSoal
1..1
has
PK,FK1 1..* PK,FK2
NomorUser KdJenisSoal Nilai Tanggal
Gambar 3.36 Perancangan Database Model Diagram
NomorUser Score
1..1
has
PK,FK2