• Tidak ada hasil yang ditemukan

BAB III METODE PENELITIAN

D. Desain Sistem

2. Desain Proses

Dalam perancangan sistem, penulis menggunakan diagram UML (Unified Modeling Language). Diagram yang digunakan adalah Use case diagram, Activity diagram, Sequence diagram, dan class diagram. Adapun UML (Unified Modeling Language) sistem pada desain aplikasi reading comprehension ini adalah sebagai berikut :

a) Use case Diagram

Use case diagram adalah gambaran grafik dari atau semua actor, use case, dan interaksi diantaranya yang memperkenalkan suatu sistem. Use case diagram tidak menjelaskan secara detail tentang pengguna use case, tetapi hanya memberikan gambaran singkat hubungan antara use case, actor, dan sistem. Use case diagram dapat dilihat pada gambar dibawah ini.

Use Case Diagram

Gambar 30 . Use case Diagram Admin dan Pengguna

Gambar di atas pada use case diagram admin menjelaskan bahwa sebelum admin masuk ke dalam sistem, admin harus terlebih dahulu melakukan

login setelah berhasil maka sistem akan menampilkan menu halaman admin yang terdiri dari beberapa menu yaitu tambah teks, tambah soal, edit teks, dan edit soal. Pada use case diagram pengguna menjelaskan bahwa setelah pengguna memasuki sistem maka sistem akan menampilkan halaman judul kemudian sistem menampilkan menu utama, didalam menu utama terdapat dua daftar menu yaitu level bacaan dan tema bacaan.

b) Activity Diagram

Berikut ini merupakan Activity Diagram dari perancangan aplikasi reading comprehension (Studi kasus : STMIK Palangkaraya).

1) Activity Diagram Halaman Utama Pengguna

Gambar 31 .Activity Diagram Halaman Utama Pengguna

Pada gambar dijelaskan bahwa dijelaskan bahwa pengguna terlebih dahulu membuka aplikasi yang dimana sistem akan otomatis menampilkan halaman judul kemudian pengguna diharuskan mengklik tombol menu pada halaman judul. Setelah diklik maka sistem akan menampilkan halaman menu utama . Pada halaman menu utama pengguna diharuskan memilih salah satu daftar menu,setelah dipilih maka sistem akan menampilkan menu yang dipilih.

2) Activity Diagram Halaman Level Bacaan

Gambar 32 . Activity Diagram Halaman Level Bacaan

Pada gambar dijelaskan bahwa pengguna memilih halaman level bacaan kemudian sistem menampilkan pilihan level bacaan, setelah itu pengguna memilih salah satu level dan sistem akan menampilkannya, barulah pengguna dapat membaca materi yang disediakan sistem. Kemudian setelah membaca pengguna dapat mengerjakan soal-soal dilevel bacaan, sistem akan menampilkan skor yang didapatkan pengguna.

3) Activity Diagram Tema Bacaan

-

Gambar 33. Activity Diagram Halaman Tema Bacaan

Pada gambar dijelaskan bahwa pengguna memilih halaman tema bacaan kemudian sistem menampilkan pilihan tema bacaan, setelah itu pengguna memilih salah satu tema dan sistem akan menampilkannya, barulah pengguna dapat membaca materi yang disediakan sistem. Kemudian setelah membaca pengguna dapat mengerjakan soal-soal ditema bacaan, sistem akan menampilkan skor yang didapatkan pengguna, pengguna menerima skor kemudian sistem menampilkan kunci jawaban kepada pengguna yang telah mengerjakan soal-soal di tema bacaan.

4. Actifity Diagram Halaman Login Admin

Gambar 34. Activity Diagram Halaman Login Admin

Pada gambar dijelaskan bahwa admin membuka aplikasi kemudian sistem menampilkan halaman login, setelah itu admin diarahkan untuk memasukan username dan password . Jika username dan password dimasukan salah maka sistem dengan otomatis mengarahkan admin untuk mengisi ulang username dan password yang benar, jika username dan password dimasukan sudah benar maka sistem akan menampilkan menu halaman admin.

5. Actifity Diagram Menu Halaman Admin

Gambar 35 Activity Diagram Menu Halaman Admin

Pada gambar ini dijelaskan pada menu halaman admin sistem menampilkan daftar menu halaman admin kemudian admin dapat memilih salah satu daftar yang tersedia dalam menu halaman admin, yang terdiri dari menu tambah teks, tambah soal, edit teks, dan edit soal. Setelah memilih salah satu dari daftar menu tersebut maka sistem akan menampilkan menu halaman admin yang dipilih. Kemudian setelah admin menyelesaikan pekerjaannya maka admin dapat mengupload hasil kerjanya sesudah hasil kerja diupload maka sistem akan menyimpan hasil kerja kedalam database.

c. Sequence Diagram

Berikut ini merupakan Sequence Diagram dari perancangan aplikasi reading comprehension (Studi kasus : STMIK Palangkaraya).

1) Sequence Diagram Halaman Utama

Gambar 36. Sequence Diagram Halaman Menu Utama

Pada gambar ini menjelaskan bahwa Pada gambar dijelaskan bahwa pengguna terlebih dahulu membuka aplikasi yang dimana sistem akan otomatis menampilkan halaman judul kemudian pengguna diharuskan mengklik tombol menu pada halaman judul. Setelah diklik maka sistem akan menampilkan halaman menu utama . Pada halaman menu utama pengguna diharuskan memilih salah satu daftar menu,setelah dipilih maka sistem akan menampilkan menu yang dipilih.

2) Sequence Diagram Halaman Level Bacaan

Gambar 37. Sequence Diagram Halaman Level Bacaan

Gambar ini menjelaskan setelah pengguna masuk ke halaman level bacaan maka sistem akan menampilkan halaman pilihan level, pengguna dapat memilih salah satu dan sistem akan menampilkan level bacaan yang dipilih pengguna, setelah itu pengguna dapat membaca level bacaan yang telah dipilih, sistem akan menampilkan tombol next, pengguna mengerjakan soal-soal yang disajikan, setelah itu sistem akan menampilkan skor hasil sehingga pengguna dapat menerima skor.

3) Sequence Diagram Halaman Tema Bacaan

Gambar 38. Sequence Diagram Halaman Tema Bacaan

Gambar ini menjelaskan setelah pengguna masuk ke halaman tema bacaan maka sistem akan menampilkan halaman pilihan tema bacaan , pengguna dapat memilih salah satu dan sistem akan menampilkan tema bacaan yang dipilih pengguna, setelah itu pengguna dapat membaca tema bacaan yang telah dipilih, sistem akan menampilkan tombol next, pengguna mengerjakan soal-soal yang disajikan, setelah itu sistem akan menampilkan skor hasil sehingga pengguna dapat menerima skor.

4) Sequence Diagram Halaman Login Admin

Gambar 39. Sequence Diagram Halaman Login Admin

Pada gambar dijelaskan bahwa admin membuka aplikasi kemudian sistem menampilkan halaman login, setelah itu admin diarahkan untuk

memasukan username dan password . Jika username dan password dimasukan salah maka sistem dengan otomatis mengarahkan admin untuk mengisi ulang username dan password yang benar, jika username dan password dimasukan sudah benar maka sistem akan menampilkan menu halaman admin.

5) Sequence Diagram Menu Halaman Admin

Gambar 40. Sequence Diagram Menu Halaman Admin

Pada gambar ini dijelaskan pada menu halaman admin sistem menampilkan daftar menu halaman admin kemudian admin dapat memilih

salah satu daftar menu halaman admin. Setelah memilih salah satu dari daftar menu tersebut maka sistem akan menampilkan menu halaman admin yang dipilih. Kemudian setelah admin menyelesaikan pekerjaannya maka admin dapat mengupload hasil kerjanya sesudah hasil kerja diupload maka sistem akan menyimpan hasil kerja kedalam database.

d. Class Diagram

Berikut ini merupakan Class Diagram dari perancangan aplikasi reading comprehension (Studi kasus : STMIK Palangkaraya).

Gambar 41. Class Diagram

Pada gambar ini proses masuk admin ke dalam aplikasi adalah melalui halaman login untuk dapat masuk kepada halaman admin sedangka pengguna

biasa dapat mengakses masuk aplikasi tanpa halaman login. Admin memiliki otoritas untuk menambah, mengubah, dan menghapus setiap data teks bacaan, soal, dan kunci jawaban. Pengguna biasa dapat mengakses teks bacaan, mengerjakan soal latihan, serta memdapatkan skor dan kunci jawaban setelah mengerjakan soal latihan.

Dokumen terkait