ANALISA DAN PERANCANGAN SISTEM

44

BAB III ANALISA DAN PERANCANGAN SISTEM

3.1. Analisa Sistem

Sistem yang dibangun merupakan perangkat lunak untuk konversi Aksara Jawa. Proses konversi dilakukan dengan cara mengkonversi setiap huruf yang dimasukkan oleh pengguna. Sistem input gesture menggunakan gesture API yang telah disediakan oleh Android. Seluruh gesture yang telah disimpan pada program akan dipanggil saat pengguna menuliskan Aksara Jawa pada layar smartphone.

3.2. Perancangan Sistem

Perancangan sistem berisikan penjelasan tentang deskripsi umum sistem yang meliputi proses-proses dalam sistem. Proses-proses tersebut akan dijabarkan dalam bentuk flowchart dan UML Unified Modeling Language yang meliputi Use Case Diagram, Activity Diagram, Sequence Diagram, Collaboration Diagram, serta State Diagram. Perancangan database akan dijelaskan dalam bentuk Conceptual Data Model dan Physical Data Model.

3.2.1. Flowchart

Dalam perancangan suatu aplikasi, dibutuhkan alur yang jelas sehingga proses dapat terselesaikan dengan baik. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.1.1. Flowchart Alur Sistem

Dalam perancangan sistem dibutuhkan alur aplikasi yang sistematis dan searah sehingga dapat terselesaikan dengan baik. Dalam aplikasi ini, Peneliti pembuat aplikasi membagi aplikasi konversi Aksara Jawa ini menjadi lima bagian. Lima bagian yang di maksud adalah konversi Aksara Jawa ke huruf latin, konversi huruf latin ke Aksara Jawa, latihan, Petunjuk, dan about. Start Konversi Latin → Aksara Konversi Aksara → Latin T Latihan T Petunjuk T About T Keluar? Tidak Input teks latin Ya Input gesture aksara Ya Proses konversi Latin → Aksara Proses konversi Aksara → Latin Tampilkan hasil konversi Tampilkan hasil konversi Tampilkan halaman petunjuk Ya Tampilkan halaman about Ya Ulangi? Ulangi? Finish Ya Ya Ya Ya Tidak Tampilkan soal Ulangi? i = 0 i 10 Tampilkan hasil latihan Tidak T Tidak Ya Ya Ya Ya Tidak i++ Ya Gambar 3.1 Flowchart Alur Sistem Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.1.2. Flowchart Konversi Huruf Latin ke Aksara Jawa

Gambar di bawah ini menggambarkan tentang proses bagaimana sebuah kata atau kalimat dapat dikonversi menjadi Aksara Jawa. Start Input teks string = tostring “input teks” Tampilkan hasil aksara Finish aksara = NULL len = lengthstring i = 0 i len aksara = aksara + data_pembanding Tidak string[i] == konsonan Ya i++ string[i+1] == „a‟ || „i‟ || „u‟ || „e‟ Ya T Tidak string[i+1] == „é‟ string[i+1] == „o‟ Tidak aksara = aksara + data_pembanding + vokal i++ Ya aksara = aksara + data_pembanding Tidak aksara = aksara + „[„ + data_pembanding i++ Ya aksara = aksara + „[‟ + data_pembanding + „o‟ i++ Ya Gambar 3.2 Flowchart konversi huruf latin ke Aksara Jawa Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Kata atau kalimat yang diinputkan akan diubah menjadi potongan huruf yang nantinya setiap huruf tersebut akan dikonversi satu per satu. Setelah inputan diubah menjadi potongan huruf, lalu akan dilakukan inisialisasi variabel “aksara” sebagai variabel tempat hasil konve rsi dan “len” sebagai inisialisasi panjangnya inputan. Langkah selanjutnya yaitu melakukan decision apakah potongan kata sudah dikonversi semua apa belum. Jika belum maka akan dilakukan konversi huruf inputan dengan data pembanding dan hasil dari setiap konversi tersebut akan disimpan pada variabel “aksara”. Namun jika sudah dikonversi semua, maka hasil konversi akan langsung ditampilkan. Berikut ini adalah simulasi dari proses konversi sesuai dengan flowchart di atas: 1. Misal user menginputkan kata “metu”. 2. Kata “metu” tersebut akan diubah menjadi potongan-potongan huruf sehingga menjadi: “m”, “e”, “t”, dan “u”. Seluruh potongan kata tersebut dimasukkan ke dalam variabel array string[]. Dalam kasus ini: a string[0] = „m‟ b string[1] = „e‟ Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. c string[2] = „t‟ d string[3 ] = „u‟ 3. Selanjutnya akan dilakukan penghitungan karakter kata dan inisialisasi awal. Pada kasus ini inputan berjumlah 4 huruf dan inisialisasi awal adalah i=0. Jumlah huruf dimasukkan dalam variabel len. 4. Jika i kurang dari len, maka akan dilakukan proses konversi. Berikut ini adalah prosesnya: a i len, atau 0 4 maka proses konversi berlangsung. b string[0] = ‘m’, merupakan huruf konsonan, maka akan dilihat huruf selanjutnya. Huruf selanjutnya yaitu string[1 ]==‘e’, maka didapatkan dua huruf yaitu „me. Kata ‘me‟ akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding ‘m’ yaitu ditambahkan dengan huruf kedua ‘e’. Data pembanding dari ‘e’ yaitu . Hasil dari konversi kedua huruf tersebut kemudian ditambahkan ke dalam variabel aksara sehingga isi dari variabel aksara adalah . c Proses selanjutnya adalah i++ dan kembali ke proses i len . d 2 4 maka proses dilanjutkan. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. e string[2] = ‘t’, merupakan huruf konsonan, maka akan dilihat huruf selanjutnya. Huruf selanjutnya yaitu string[1]==‘u’, maka didapatkan dua huruf yaitu ‘tu’. Kata ‘tu‟ akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding ‘t’ yaitu ditambahkan dengan huruf kedua ‘u’. Data pembanding dari ‘u’ yaitu . Hasil dari konversi kedua huruf tersebut kemudian ditambahkan ke dalam variabel aksara sehingga isi dari variabel aksara adalah . f Proses selanjutnya adalah i++ dan kembali ke proses i len . g 4 4 maka proses konversi berhenti. 5. Semua hasil konversi yang telah tersimpan dalam variabel aksara akan ditampilkan. metu =

3.2.1.3. Flowchart Konversi Aksara Jawa ke Huruf Latin

Flowchart di bawah ini menggambarkan tentang bagaimana Aksara Jawa dapat dikonversi menjadi Huruf Latin. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Start Input Gesture string = tostring “gestures” Tampilkan hasil latin Finish latin = NULL len = lengthstring i = 0 i len latin = latin + data_pembanding Tidak string[i] == data_pembanding i++ gestures = gestureLibrary.recognize Ya Tidak Ya Gambar 3.3 Flowchart konversi Aksara Jawa ke huruf latin Semua inputan gesture akan diubah menjadi Aksara Jawa. Proses pengenalan gesture dilakukan Android API. Aksara Jawa yang diinputkan akan diubah menjadi potongan huruf yang nantinya setiap huruf tersebut akan dikonversi satu per satu. Setelah inputan diubah menjadi potongan huruf, lalu akan dilakukan inisialisasi variabel “latin” sebagai variabel tempat hasil konversi dan “len” sebagai inisialisasi panjangnya inputan. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Langkah selanjutnya yaitu melakukan decision apakah potongan kata sudah dikonversi semua apa belum. Jika belum maka akan dilakukan konversi huruf inputan dengan data pembanding dan hasil dari setiap konversi tersebut akan disimpan pada variabel “latin”. Namun jika sudah dikonversi semua, maka hasil konversi akan langsung ditampilkan. Berikut ini adalah simulasi dari proses konversi sesuai dengan flowchart di atas: 1. Misal inputan user adalah . 2. Kata tersebut akan diubah menjadi potongan-potongan huruf sehingga menjadi: , , , dan . Seluruh potongan kata tersebut dimasukkan ke dalam variabel array string[]. Dalam kasus ini: a string[0] = b string[1] = c string[2] = d string[3] = 3. Selanjutnya akan dilakukan penghitungan karakter kata dan inisialisasi awal. Pada kasus ini inputan berjumlah 4 huruf dan inisialisasi awal adalah i=0. Jumlah huruf dimasukkan dalam variabel len. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. 4. Jika i kurang dari len, maka akan dilakukan proses konversi. Berikut ini adalah prosesnya: a i len, atau 0 4 maka proses konversi berlangsung. b string[0] = , maka akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding yaitu „n‟, hasil tersebut kemudian disimpan ke dalam variabel aksara . c Proses selanjutnya adalah i++, lalu kembali ke proses i len . d 1 4 maka proses dilanjutkan. e string[1]== , maka akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding yaitu: „e‟, hasil tersebut kemudian ditambahkan ke dalam variabel aksara sehingga isi dari variabel aksara adalah „ne‟. f Proses selanjutnya adalah i++ dan kembali ke proses i len . g 2 4 maka proses dilanjutkan. h string[1]== , maka akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding yaitu „ga‟, hasil tersebut kemudian ditambahkan ke dalam variabel aksara sehingga isi dari variabel aksara adalah „nega‟. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. i Proses selanjutnya adalah i++ dan kembali ke proses i len . j 3 4 maka proses dilanjutkan. k string[1]== , maka akan dikonversidibandingkan dengan data pembanding. Hasil dari data pembanding yaitu „ra‟, hasil tersebut kemudian ditambahkan ke dalam variabel aksara sehingga isi dari variabel aksara adalah „negara‟. l Proses selanjutnya adalah i++ dan kembali ke proses i len . m 4 4 maka proses konversi berhenti. 5. Semua hasil konversi yang telah tersimpan dalam variabel aksara akan ditampilkan. = negara

3.2.2. Use Case Diagram

Use case merupakan representasi operasi-operasi yang dilakukan oleh actor. Aplikasi ini hanya mempunyai satu actor dan empat buah use case. Actor dalam aplikasi ini bertugas mengoperasikan aplikasi. Use case yang terdapat dalam aplikasi ini adalah use case latin_aksara, use case aksara_latin, use case petunjuk, dan use case about. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. latin_aksara aksara_l atin petunj uk about latihan User Gambar 3.4 Use Case Diagram Use case di atas merupakan use case sistem aplikasi konversi Aksara Jawa. Sistem ini mempunyai satu buah aktor dan empat buah use case. Aktor dari sistem ini adalah user yang berfungsi sebagai pengguna yang menggunakanmenjalankan aplikasi ini. Use case dalam aplikasi ini adalah latin_akasara konversi huruf latin ke Aksara Jawa, aksara_latin konversi Aksara Jawa ke huruf latin, petunjuk, dan about.

3.2.3. Activity Diagram

Dari use case yang telah dibuat sebelumnya, maka dapat digambarkan lebih detail lagi activity pada masing-masing use case tersebut. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.3.1. Activity Diagram Huruf Latin ke Aksara Jawa

mengi nputkan teks latin membaca teks Lakukan proses konversi T ampilkan hasil konversi Sistem User Gambar 3.5 Activity diagram huruf latin ke Aksara Jawa Activity diagram di bawah ini menjelaskan tentang alur program saat konversi Huruf Latin ke Aksara Jawa. Setelah user menginputkan teks latin, sistem akan membaca teks dan melakukan proses konversi. hasil dari konversi tersebut kemudian akan ditampilkan oleh sistem kepada pengguna.

3.2.3.2. Activity Diagram Aksara Jawa ke Huruf Latin

Activity diagram di bawah ini menjelaskan tentang alur program saat konversi Aksara Jawa ke Huruf Latin. Setelah user menginputkan gesture, sistem akan menerjemahkan semua pola gesture tersebut ke dalam teks Aksara Jawa. Hasil inputan Aksara Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Jawa tersebut kemudian akan dikonversi menjadi huruf latin dan kemudian akan ditampilkan oleh sistem. Input gersture aksara j awa Tekan tom bol konversi Menerjemahkan gesture ke dal am teks Lakukan proses konversi Tampil kan hasi l konversi Tidak Ya Sistem User Gambar 3.6 Activity diagram Aksara Jawa ke huruf latin

3.2.3.3. Activity Diagram Latihan

Masuk menu latihan Menjawab soal Selesai ? Menam pi lkan soal T ampilkan hasil kui s Sistem User Gambar 3.7 Activity diagram latihan Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Activity diagram di atas menjelaskan tentang alur menu latihan dalam program ini. Setelah user masuk ke dalam menu latihan, sistem akan menampilkan soal. Soal yang tampil di layar dapat langsung dijawab oleh pengguna. Soal akan terus tampil bergantian sampai latihan selesai. Hasil dari latihan tersebut kemudian akan ditampilkan jika latihan sudah selesai.

3.2.3.4. Activity Diagram Petunjuk

Buka petunjuk T ampilkan halaman petunj uk Sistem User Gambar 3.8 Activity diagram petunjuk Activity diagram di atas menjelaskan tentang alur program saat user memilih menu petunjuk. Setelah user memilih menu petunjuk, sistem akan menampilkan halaman petunjuk. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.3.5. Activity Diagram About

Buka about T ampilkan halaman about Sistem User Gambar 3.9 Activity diagram about Activity diagram di atas menjelaskan tentang alur program saat user memilih menu about. Setelah user memilih menu about, sistem akan menampilkan halaman about.

3.2.4. Sequence Diagram

Sequence diagram menunjukkan alur bagaimana aktivitas satu dan lainnya saing berkelanjutan dalam sebuah aplikasi. Aplikasi ini mempunyai dua Sequence diagram yaitu diagram huruf latin ke Aksara Jawa dan diagram Aksara Jawa ke huruf latin. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.4.1. Sequence Diagram Huruf Latin ke Aksara Jawa

: User : User : form i nput lati n : form i nput lati n sistem sistem database lati n database lati n 1: tampilan form i nput 2: isi form 3: proses konversi 4: sim pan data 5: berhasil di si mpan 6: berhasil di konversi 7: tampilan hasi l konversi Gambar 3.10 Sequence diagram huruf latin ke Aksara Jawa Diagram di atas adalah sequence diagram konversi huruf latin ke Aksara Jawa. Setelah halaman form input ditampilkan, user dapat mengisinya dan sistem akan melakukan proses konversi. Inputan dan hasil konversi akan disimpan dalam database kemudian hasil konversi tersebut akan ditampilkan. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.4.2. Sequence Diagram Aksara Jawa ke Huruf Latin

: User : User : halaman input aksara : halaman input aksara sistem sistem database aksara database aksara 1: tampilan halaman i nput 2: input gesture 3: pengenalan gesture 4: proses konversi 5: sim pan data 6: berhasil di si mpan 7: berhasil di konversi 8: tampilan hasi l konversi Gambar 3.11 Sequence diagram Aksara Jawa ke huruf latin Diagram di atas adalah sequence diagram konversi Aksara Jawake huruf latin. Setelah halaman input ditampilkan, user dapat menginputkan gesture pada halaman tersebut. Kemudian sistem akan melakukan pengenalan pola gesture dan melakukan proses konversi. Inputan dan hasil konversi akan disimpan dalam database kemudian hasil konversi tersebut akan ditampilkan. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.5. Colaboration Diagram

collaboration diagram digunakan untuk menampilkan aliran skenario tertentu dalam use case. Jika sequence diagram disusun berdasarkan waktu, collaboration diagram lebih konsentrasi pada hubungan antara obyek-obyek.

3.2.5.1. Collaboration Diagram Huruf Latin ke Aksara Jawa

: form i nput latin : User sistem database latin 1: tampilan form i nput 2: isi form 3: proses konversi 6: berhasi l di konversi 4: sim pan data 5: berhasi l di si mpan Gambar 3.12 Collaboration diagram huruf latin ke Aksara Jawa Collaboration diagram menjelaskan tentang konversi huruf latin ke Aksara Jawa. Setelah halaman form input ditampilkan, user dapat mengisinya dan sistem akan melakukan proses konversi. Inputan dan hasil konversi akan disimpan dalam database kemudian hasil konversi tersebut akan ditampilkan. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.5.2. Collaboration Diagram Aksara Jawa ke Huruf Latin

: User : halaman input aksara sistem database aksara 4: proses konversi 1: tampilan halaman i nput 2: input gesture 3: pengenalan gesture 7: berhasil di konversi 5: sim pan data 6: berhasil di si mpan Gambar 3.13 Collaboration diagram Aksara Jawa ke huruf latin Collaboration diagram menjelaskan tentang konversi Aksara Jawa huruf latin. Setelah halaman input ditampilkan, user dapat menginputkan gesture pada halaman tersebut. Kemudian sistem akan melakukan pengenalan pola gesture dan melakukan proses konversi. Inputan dan hasil konversi akan disimpan dalam database kemudian hasil konversi tersebut akan ditampilkan.

3.2.6. State Diagram

State diagram adalah diagram untuk menggambarkan behavior, yaitu perubahan state di suatu class berdasarkan event dan message yang dikirimkan dan diterima oleh class tersebut. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.2.6.1. State Diagram Huruf Latin ke Aksara Jawa

Form input entry Isi form konversi event OnConvert Display result Enter Latin-Aksara Menu onSubmit Gambar 3.14 State diagram huruf latin ke Aksara Jawa State diagram di atas menjelaskan tentang konvesi huruf latin ke Aksara Jawa. Setelah masuk ke menu konversi “Latin → Aksara”, sistem akan menampilkan form input yang dapat diisi oleh user. Setelah user mengklik tombol konversi, sistem akan melakukan proses konversi dan menampilkan hasilnya.

3.2.6.2. State Diagram Aksara Jawa ke Huruf Latin

State diagram di atas menjelaskan tentang konvesi Aksara Jawa ke huruf latin. Setelah masuk ke menu konversi “Aksara → Latin”, sistem akan menampilkan halaman input. Melalui halaman tersebut, user dapat menginputkan Aksara Jawa dengan menggunakan metode gesture input. Setelah user mengklik tombol Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. konversi, sistem akan melakukan proses konversi dan menampilkan hasilnya. Halaman input entry Input Gesture Konversi event OnConvert Display resu... Enter Aksara-Latin Menu onSubmit Gambar 3.15 State diagram Aksara Jawa ke huruf latin

3.3. Perancangan Database

3.3.1. Conceptual Data Model

Sistem ini memiliki tiga buah entitas yang tidak berelasi yaitu entitas latin, tb_soal, dan score. Entitas latin berfungsi menyimpan inputan user dan hasil konversinya. Inputan user yang telah masuk ke database nantinya dapat digunakan untuk melengkapi fitur autocomplete saat user menginputkan kata serta digunakan untuk melihat histori konversi. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Entitas tb_soal berfungsi untuk menyimpan semua soal dan kunci jawaban pada menu latihan. Entitas score berfungsi untuk menyimpan hasil user dari soal-soal yang telah dikerjakan. Latin id_latin latin_2 aksara_2 pi Integer Text Text M Identifier_1 pi tb_soal id_soal soal jawaban_a jawaban_b jawaban_c kunci_jawaban pi Integer Text Text Text Text Text M Identifier_1 pi score id_nilai nama_nilai nilai pi Integer Text Integer M Identifier_1 pi Gambar 3.16 Conceptual Data model

3.3.2. Physical Data Model

Latin id_latin latin_2 aksara_2 int text text pk tb_soal id_soal soal jawaban_a jawaban_b jawaban_c kunci_jawaban int text text text text text pk score id_nilai nama_nilai nilai int text int pk Gambar 3.17 Physical Data Model PDM ini merupakan hasil generate dari CDM sebelumnya. PDM ini tidak begitu berbeda dengan Conceptual Data Model. PDM ini terdiri dari tiga buah entitas yaitu entitas latin, tb_soal, dan score. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Entitas latin mempunyai atribut id_latin, latin, dan aksara. Entitas tb_soal mempunyai atribut id_soal, soal, jawaban_a, jawaban_b , jawaban_c, dan kunci_jawaban. Entitas score mempunyai atribut id_nilai, nama_nilai, dan nilai.

3.4. Perancangan Desain Antarmuka

Pada sub-bab ini akan dijelaskan tentang perencanaan desain antarmuka dalam aplikasi ini.

3.4.1. Perancangan Menu Utama

Menu utama pada aplikasi ini didesain sesederhana mungkin agar para pengguna dapat dengan mudah memahami aplikasi ini. Ada lima menu yaitu Latin → Aksara, Aksara → Latin, latihan, Petunjuk, dan About. Gambar 3.18 Rancangan tampilan menu utama Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

3.4.2. Perancangan Halaman Konversi Huruf Latin ke Aksara Jawa

Pada halaman konversi Latin ke Aksara Jawa, terdapat sebuah form untuk menginputkan teks maupun kalimat. Selain itu, terdapat sebuah tombol konversi untuk proses konversi. Hasil dari konversi akan langsung ditampilkan di bawah form input. Gambar 3.19 Rancangan halaman konversi huruf latin ke Aksara Jawa

3.4.3. Perancangan Halaman Konversi Aksara Jawa ke Huruf Latin

Pada halaman konversi Aksara Jawa ke Latin, juga terdapat sebuah form yang berfungsi menampilkan teks yang telah diinputkan melalui gesture. Area input gesture terdapat pada seluruh halaman ini. Selain itu, pada halaman ini juga terdapat sebuah tombol konversi untuk proses konversi. Hasil dari konversi akan langsung ditampilkan di bawah form. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. Gambar 3.20 Rancangan halaman konversi Aksara Jawa ke huruf latin

3.4.4. Perancangan Halaman Latihan

Gambar 3.21 Rancangan halaman latihan Pada halaman latihan, terdapat sebuah pertanyaan dan tiga pilihan jawaban. User dapat memilih salah satu dari tiga jawaban Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. yang disediakan oleh sistem. Setelah user memilih jawaban, maka dapat menekan tombol ‘Lanjut’ yang berada di bawah jawaban dan sistem akan memanampilkan pertanyaan selanjutnya sampai latihan berakhir. Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber. 70

BAB IV HASIL DAN PEMBAHASAN