commit to user
3.2.3 Spesifikasi Pengguna
Sasaran aplikasi ArimBima ini ditujukan untuk digunakan oleh semua pihak yang ingin mengetahui, mempelajari, dan mengerti dunia wayang Indonesia
khususnya Mahabarata dan Ramayana.
3.3 PEMODELAN SISTEM
3.3.1 Use case Diagram
ArimBima Mobile Pedia
Baca Cerita Wayang Lihat keterangan
tokoh Mahabarata
Pengguna
Lihat nilai
Lihat Sejarah Wayang dan cerita wayang
include
extend
Lihat Gambar Tokoh Ramayana
Searching
include
Lihat Informasi aplikasi
Quiz extend
include include
include include
Lihat Gambar Tokoh Mahabarata
include include
include
Lihat keterangan
tokoh Ramayana
Baca Sejarah Wayang
Menjawab QuizA
Menjawab QuizB
Menjawab QuizC
Gambar 3.1 Use case Diagram Use case diagram menggambarkan fungsionalitas dan merancang test case
untuk semua fitur yang ada pada sistem. Use case diagram menggambarkan interaksi antara pengguna dengan use case. Pada Gambar 3.2 use case keterangan
tokoh extend terhadap use case gambar tokoh karena ketika use case gambar
commit to user
tokoh berjalan, use case keterangan tokoh berjalan jika dan hanya jika diinginkan oleh actor. Jika tidak diinginkan, maka use case keterangan tokoh tidak akan
pernah dijalankan. Aktor dalam sistem ini adalah pengguna atau pembelajar, dan sistem yang dimaksud adalah ArimBima Mobile Pedia. Untuk lebih jelasnya dapat
dilihat pada table 3.1. Tabel 3.1 Deskripsi Use case Diagram
Aktor : Pengguna
Deskripsi : 1 Use case
Sejarah dan Cerita Wayang Aktor
Pengguna Pengguna dapat membaca dan mengetahui
sejararah wayang dan perkembangannya di Indonesia.
Pengguna dapat membaca contoh cerita wayang yang berkembang di masyarakat Indonesia.
2 Use case
Melihat Foto Tokoh Mahabarata Aktor
Pengguna Pengguna dapat melihat foto dari tokoh
Mahabarata extend
use case : Keterangan Tokoh Pengguna dapat membaca keterangan tokoh
Mahabarata yang telah dilihat sebelumnya. 3
Use case Melihat Foto Tokoh Ramayana
Aktor Pengguna
Pengguna dapat melihat foto dari tokoh Ramayana.
extend use case : Keterangan Tokoh
Pengguna dapat membaca keterangan tokoh Ramayana yang telah dilihat sebelumnya.
4 Use case
Pertanyaan Aktor
Pengguna
commit to user
Pengguna menjawab beberapa pertanyaan sederhana seputar contain yang ada dalam
ArimBima Mobile Pedia sebagai indikator keberhasilan pembelajaran.
5 Use case
Mencari Tokoh Aktor
Pengguna Pengguna dapat mencari tokoh yang diinginkan
secara random baik tokoh Mahabarata maupun Ramayana dengan menginputkan nama dari
tokoh tersebut. Output yang didapat adalah keterangan dan gambar tokoh yang dicari.
6 Use case
Informasi Aplikasi Aktor
Pengguna Pengguna
dapat mengetahui
informasi mengenai pembuat aplikasi.
3.3.2 Activity Diagram
Gambar 3.2 menggambarkan alur aktivitas umum yang dilakukan ArimBima Mobile Pedia. Keadaan pertama yang muncul adalah proses load aplikasi, setelah
itu aplikasi akan menghadapkan pengguna dengan enam menu pilihan yaitu, Sejarah wayang, Mahabarata, Ramayana, Search, Quiz, dan About. Apabila
pengguna memilih Keluar, maka aktivitas yang dilakukan adalah keluar dari aplikasi. Apabila pengguna memilih menu SejarahWayang, akan muncul
ChoiceGroup sejarah wayang dan cerita wayang, aktivitas yang dilakukan adalah melihat sejarah wayang dan membaca salah satu cerita wayang yang berkembang
di Indonesia. Setelah melakukan aktivitas tersebut pengguna bisa kembali ke menu awal. Apabila pengguna memilih menu Mahabarata, maka pengguna akan
dihadapakan pada SlideImage tokoh-tokoh Mahabarata, aktivitas yang dilakukan adalah melihat foto tokoh-tokoh Mahabarta, di form tersebut ada menu untuk
melihat keterangan detail, aktivitas yang dilakukan adalah membaca keterangan tentang tokoh tersebut. Setelah selesai pengguna bisa kembali ke menu awal.
commit to user
Apabila pengguna memilih menu Ramayana, aktifitas yang dilakukan sama dengan menu Ramayana tetapi dengan SlideImage tokoh- tokoh Ramayana.
Menu
Lihat Info Aplikasi Sejarah Wayang
Dan Cerita Wayang
Keluar
Mahabarata Ramayana
Lihat Keterangan Lihat Keterangan
Cari Gambar dari Tokoh
Mahabarata Cari
Gambar dari Tokoh
Ramayana Quiz
Jumlah Nilai
Lihat Nilai
Keluar Keluar
Keluar Keluar
Keluar Buka Aplikasi Midlet
MuLai
Foto Tokoh Ramayana
Search Foto Tokoh
Mahabarata Lihat
Keterangan Detail Tokoh
Lihat Keterangan
Detail Tokoh Baca
Sejarah dan Cerita
QuizC QuizB
QuizA
Gambar 3.2 Activity Diagram Apabila pengguna memilih menu Search, aktivitas yang dilakukan adalah
mencari tokoh wayang beserta gambar dan keterangannya. Tokoh yang diinputkan adalah tokoh yang termasuk dalam menu Mahabarata dan
Ramayana. Apabila pengguna memilih menu Quiz, aktivitas yang dilakukan adalah pengguna dihadapkan dengan sejumlah soal mengenai dunia
pewayangan khususnya yang tersaji di ArimBima Mobile Pedia sebagai indikator kepahaman pengguna. Jika pengguna telah selesai menjawab soal
commit to user
akan ada menu untuk melihat skor atau nilai yang diperoleh pengguna dalam menjawab quiz. Setelah aktivitas selesai pengguna bisa kembali ke menu
awal. Apabila pengguna memilih menu About, aktivitas yang dilakukan adalah membaca info tentang aplikasi dan pembuat aplikasi. Setelah aktivitas selesai
pengguna bisa kembali ke menu awal.
3.3.3 Class Diagram
Class diagram digunakan untuk menampilkan kelas-kelas dan relasi antar mereka. Di sini akan dibahas enam class diagram dari masing-masing menu yaitu:
class diagram wayang, class diagram Mahabarata, class diagram Ramayana, class diagram Search, class diagram Quiz, class diagram About.
3.3.3.1 Class diagram Wayang
Gambar 3.3 Class Diagram Wayang 3.3.3.2
Class diagram Mahabarata
Gambar 3.4 Class Diagram Mahabarata
commit to user
3.3.3.3 Class diagram Ramayana
Gambar 3.5 Class Diagram Ramayana 3.3.3.4
Class diagram Search
Gambar 3.6 Class Diagram Search 3.3.3.5
Class diagram Quiz
QuizB
Quiz
MenuArimBima ArimBima
Splashscreen QuizA
QuizC Skor
Gambar 3.7 Class Diagram Quiz
commit to user
3.3.3.6 Class diagram About
Gambar 3.8 Class Diagram About
3.3.4 Sequence Diagram
Sequence diagram menggambarkan interaksi antar objek di dalam dan di sekitar sistem termasuk pengguna, display, dan sebagainya berupa message yang
digambarkan terhadap waktu. Message digambarkan sebagai garis berpanah dari satu objek ke objek lainnya. Pada fase desain berikutnya, message akan dipetakan
menjadi operasimetode dari class. 3.3.4.1
Sequence Diagram sejarah wayang
1. Pilih Menu
Menu : MenuArimBima
2. ArimBima. Wayang
Menampilkan sejarah dan
cerita wayang 3. hasil dari ReadFile
sejarah wayang dan cerita wayang
Wayang : wayang
Gambar 3.9 Sequence diagram sejarah wayang
commit to user
Sequence diagram pada Gambar 3.9 terjadi interaksi antara pengguna dengan menu. Pengguna mengirimkan pesan kepada objek menu dan dilanjutkan ke objek
about untuk menampilkan informasi nama aplikasi dan pembuat aplikasi kepada pengguna.
3.3.4.2 Sequence diagram Mahabarata
Sequence diagram Mahabarata menggambarkan interaksi langsung antara pengguna dengan objek Mahabarata. Objek Mahabarata mengirimkan pesan
berupa tampilkan SlideImage tokoh-tokoh Mahabarata ke TokohMahabarata, selain itu juga meminta untuk menampilkan keterangan. Kemudian objek
Mahabarata memproses untuk ditampilkan kepada pengguna. Lebih jelasnya dapat dilihat pada Gambar 3.10.
Gambar 3.10 Sequence Diagram Mahabarata 3.3.4.3
Sequence diagram Ramayana Sequence diagram pada Gambar 3.11 menggambarkan interaksi langsung
antara pengguna dengan objek Ramayana. Objek Ramayana mengirimkan pesan berupa tampilkan SlideImage tokoh-tokoh Ramayana ke TokohRamayana, selain
commit to user
itu juga meminta untuk menmpilkan keterangan. Kemudian objek Ramayana memproses untuk ditampilkan kepada pengguna. Proses ini sama dengan proses
sequence diagram Mahabarata.
Gambar 3.11 Sequence Diagram Ramayana 3.3.4.4
Sequence diagram Search
1. Pilih Menu MenuArimBima :
menu Tokoh
2. MenuArimBima. Search
keterangan tokoh
4. Hasil cari gambar Gambar
3. MenuArimBima.Gambar
5. hasil cari tokoh
Foto tokoh
Gambar 3.12 Sequence Diagram Search
commit to user
Sequence diagram pada Gambar 3.12 terjadi interaksi pengguna dengan objek search. Pengguna mengirimkan pesan kepada objek cari tokoh yang kemudian
diteruskan ke objek-objek yang menangani data dan untuk ditampilkan ke pengguna, sehingga pengguna mendapatkan informasi tentang foto dan
keterangan dari tokoh yang dicari.
3.3.4.5 Sequence diagram Quiz
Gambar 3.13 Sequence Diagram Quiz Sequence diagram pada Gambar 3.13 terjadi interaksi antara pengguna dan
objek quiz. Pengguna menjawab beberapa pertanyaan dan Pengguna mengirimkan pesan yang berupa jawaban kepada objek skor. Objek skor kemudian
menampilkan informasi skor atau nilai kepada pengguna. 3.3.4.6
Sequence diagram About Sequence Diagram pada Gambar 3.14 menggambarkan interaksi yang
terjadi antar objek untuk menghasilkan tampilan about berupa info tentang pembuat aplikasi. Objek menu berinteraksi langsung dengan pengguna dan
mengirimkan pesan berupa pilihan menu ke objek menu. Objek menu meneruskan pesan tersebut berupa permintaan untuk menampilkan halaman about. Objek
commit to user
about menerima pesan tersebut kemudian mengembalikan pesan tersebut kepada pengguna berupa tampilan about.
Gambar 3.14 Sequence Diagram About
3.3.5 Class Diagram
Dari sequence diagram didapatkan atribut-atribut dan metode-metode yang mengisi masing-masing kelas, lebih jelasnya dapat dilihat pada Gambar 3.15
sampai Gambar 3.20. 3.3.5.1
Class Diagram Wayang Class diagram pada Gambar 3.15 akan menampilkan halaman dari sejarah
wayang dan cerita wayang. Di sini terdapat informasi mengenai sejarah wayang dan cerita wayang. Dari kelas Wayang terdapat dua pilihan menu yaitu sejarah
wayang dan cerita wayang. Kelas Baca Wayang menangani ReadFile dari sejarah wayang dan kelas BacaCerita menangai ReadFile dari cerita wayang.
commit to user
Gambar 3.15 Class Diagram Wayang 3.3.5.2
Class Diagram Mahabarata
Class diagram pada Gambar 3.16 akan menampilkan gambar dan keterangan tokoh-tokoh Mahabarata. SlideMenu adalah kelas yang menangani penampilan
gambar, durasi perpindahan gambar, sedangkan TokohMahabarata mendefinisikan gambar dan nama tokoh. Metode untuk menampilkan gambar
yaitu paint.
commit to user
mahabarata
display keyPressed
SlideMenu Int select_index
commandAction Image
String label
slideItem
paint run
SlideMenu int duration
long time paint
Splashscreen arimbima : ArimBima
ArimBima
destroyApp exitMIDlet
pauseApp startApp
wayang mahabarata
ramayana search
quiz about
MenuArimBima
drawIcons drawSelectingRectangle
keyPressed keyPressedFire
paint drawIcons
display
int iKEY_DOWN int iKEY_UP
int iKEY_LEFT int iKEY_RIGHT
int iKEY_FIRE int iKEY_SOFT1
int iKEY_SOFT2 int screenHeight
int screenWidth Image [ ] icons
String [ ] label selectedIndex
selectedMenu
Gambar 3.16 Class Diagram Mahabarata
commit to user
3.3.5.3 Class diagram Ramayana
Gambar 3.17 Class Diagram Ramayana Class diagram pada Gambar 3.5 akan menampilkan gambar dan keterangan
tokoh-tokoh Ramayana. Metode untuk menampilkan gambar yaitu paint. Kelas
commit to user
SlideMenu dan kelas TokohRamayana mempunyai peran yang sama dengan kelas Mahabarata
3.3.5.4 Class diagram Search
MenuArimBima
drawIcons drawSelectingRectangle
keyPressed keyPressedFire
paint drawIcons
display
int iKEY_DOWN int iKEY_UP
int iKEY_LEFT int iKEY_RIGHT
int iKEY_FIRE int iKEY_SOFT1
int iKEY_SOFT2 int screenHeight
int screenWidth Image [ ] icons
String [ ] label selectedIndex
selectedMenu
ArimBima
destroyApp exitMIDlet
pauseApp startApp
wayang mahabarata
ramayana search
quiz about
Splashscreen arimbima : ArimBima
Tokoh StringItem
cmBack commandAction
Gambar StringItem
cmBack commandAction
Image
search
cmFind cmPict
cmBack tfFind
StringItem commandAction
Gambar 3.18 Class Diagram Search Class diagram pada Gambar 3.18 akan menampilkan hasil dari mencari tokoh
baik tokoh Mahabarata maupun Ramayana. Terdapat dua searching yaitu searching tokoh dan gambar. Hasil dari searching tokoh ditangani oleh kelas
Tokoh dan searching gambar ditangani oleh kelas Gambar.
commit to user
3.3.5.5 Class diagram Quiz
QuizB
quizForm image
commandAction
hitungSkor
choicegroup Int skor
indexQuiz
QuizA
quizForm image
commandAction choicegroup
Int skor indexQuiz
Splashscreen arimbima : ArimBima
ArimBima
destroyApp exitMIDlet
pauseApp startApp
wayang mahabarata
ramayana search
quiz about
quiz
ImageItem Image
commandAction choicegroup
quiz indexQuiz
skor
quizForm image
commandAction
Skor
choicegroup Int skor
indexQuiz MenuArimBima
drawIcons drawSelectingRectangle
keyPressed keyPressedFire
paint drawIcons
display
int iKEY_DOWN int iKEY_UP
int iKEY_LEFT int iKEY_RIGHT
int iKEY_FIRE int iKEY_SOFT1
int iKEY_SOFT2 int screenHeight
int screenWidth Image [ ] icons
String [ ] label selectedIndex
selectedMenu
hitungSkor
Skor
quizForm image
choicegroup Int skor
indexQuiz commandAction
hitungSkor
QuizC
quizForm image
commandAction
hitungSkor
choicegroup Int skor
indexQuiz cmOk
cmBack
Gambar 3.19 Class Diagram Quiz Class diagram pada Gambar 3.19 akan menampilkan halaman quiz yang
menampilkan tiga pilihan choicegroup dan masing-masing berisi sepuluh pertanyaan dan dari jawaban yang telah disimpan dapat dilihat pula skor yang
diperoleh pengguna. Kelas yang menangani proses ini yaitu kelas Quiz dan yang menangani nilai adalah kelas Skor.
commit to user
3.3.5.6 Class diagram About
Gambar 3.20 Class Diagram About Class diagram pada Gambar 3.20 akan menampilkan informasi tentang
pembuat aplikasi. Kelas yang menangani proses ini adalah kelas About.
commit to user
3.4 KEPERLUAN SISTEM