BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 38 BAB III ANALISA DAN PERANCANGAN 3.1 Analisa Perangkat Lunak Perangkat lunak yang akan dirancang dalam tugas akhir ini untuk melakukan perhitungan geometri bangun datar dan konversi ukuran satuan dengan hasil berupa teks dan audio.wav. Perangkat lunak ini diberi nama Geometri And Converter yang dibangun diatas platform mobile phone bersistem operasi android. Perangkat lunak yang dirancang memiliki 2 fungsi utama yaitu perangkat lunak dapat menghitung luas serta keliling bangun datar dan perangkat lunak dapat mengkonversi nilai ukuran satuan. Pada saat menjalankan fungsi perhitungan, perangkat lunak menerima masukan yaitu angka yang akan dihitung menggunakan teknik percabangan switch case, setelah itu hasil perhitungan berupa teks dan penyebutan hasil dengan audio. 3.2 Analisa konversi numerik menjadi audio. Setelah angka dimasukkan kemudian pengguna ponsel memilih perhitungan, selanjutnya aplikasi menampilkan hasil perhitungan berupa teks dan menyebutkan hasil tersebut dengan audio. Hasil teks tersebut bertipe double kemudian diubah menjadi tipe string. Misalnya Hasil = 21.3 angka tersebut bertipe double diubah menjadi string. Kemudian dibaca per karakter dengan perulangan sebanyak jumlah karakternya, dalam hal ini 4 karakter. Kemudian menggunakan teknik switch case untuk penyeleksian kondisi dengan kemungkinan yang terjadi cukup banyak. Berikut ini penggalan source code konversi numeric menjadi audio dengan nama file SuaraAngka.java

2 39 for (int i=0; i<hasil.length(); i++) { try { Thread.sleep(300); } catch (Exception e) {} switch (hasil.charat(i)) { case '1' : mp = MediaPlayer.create(classAct, R.raw.satu); mp.start(); break; case '2' : mp = MediaPlayer.create(classAct, R.raw.dua); mp.start(); break; case '3' : mp = MediaPlayer.create(classAct, R.raw.tiga); mp.start(); break; case '4' : mp = MediaPlayer.create(classAct, R.raw.empat); mp.start(); break; case '5' : mp = MediaPlayer.create(classAct, R.raw.lima); mp.start(); break; case '6' : mp = MediaPlayer.create(classAct, R.raw.enam); mp.start(); break; case '7' : mp = MediaPlayer.create(classAct, R.raw.tujuh); mp.start(); break; case '8' : mp = MediaPlayer.create(classAct, R.raw.delapan); mp.start(); break; case '9' : mp = MediaPlayer.create(classAct, R.raw.sembilan); mp.start(); break; case '0' : mp = MediaPlayer.create(classAct, R.raw.nol); mp.start(); break; case '.' : mp = MediaPlayer.create(classAct, R.raw.koma); mp.start(); break; }

3 40 Berikut flow proses perhitungan bangun datar dan konversi : Start Menampilkan Menu Utama Memilih Menu Utama Ya tidak Menampilkan Form Menu Utama Yang Dipilih Memasukkan Nilai Angka Memilih Tombol Proses Menampilkan dan menyebutkan hasil perhitungan Start Gambar 3.1 Flowchart Proses Perhitungan Bangun Datar dan Konversi

4 Gambar 3.2 Flowchart konversi numeric menjadi audio 41

5 Perancangan Sistem Pada bagian ini akan dijelaskan secara rinci perancangan Aplikasi Matematika Geometri Bangun Datar Pada Handphone Bersistem Operasi Android yang meliputi permodelan use case diagram, activity diagram dan sequence diagram Pemodelan Use Case Diagram Use case diagram digunakan untuk menggambarkan pengguna sistem dan perilaku terhadap sistem. Pengguna sistem diwakili oleh user atau pengguna ponsel, sedangkan perilakunya diwakili oleh use case. Diagram use case dari Aplikasi Matematika Geometri Bangun Datar Dan Konversi Ukuran Satuan dapat dilihat pada Gambar 3.3. Gambar 3.3 Diagram use case Aplikasi Matematika Geometri Bangun Datar Dan Konversi Ukuran Satuan

6 43 Berikut ini deskripsi Use Case yang dapat dilihat pada tabel : Tabel 3.1 Spesifikasi untuk Use Case Diagram Melihat Menu Kalkulator Bangun Datar Nama Usecase Aktor Deskripsi Skenario Kondisi Awal Kondisi Akhir Memilih Menu Kalkulator Bangun Datar Pengguna Ponsel Pengguna dapat memilih menu Kalkulator Bangun Datar 1. Pengguna memilih menu Kalkulator Bangun Datar. 2. Sistem masuk kedalam menu Kalkulator Bangun Datar yang berisi submenu persegi, persegi panjang, segitiga, jajargenjang, trapesium, layang-layang, belah ketupat, dan lingkaran. 3. Pengguna memilih submenu bangun datar yang berisi macam-macam bangun datar. Pengguna menerima halaman perhitungan bangun datar yang terdiri dari persegi, persegi panjang, segitiga, jajargenjang, trapesium, layang-layang, belah ketupat, dan lingkaran. Pengguna memilih submenu bangun datar dan siap mempelajari dan melakukan perhitungan geometri bangun datar. Tabel 3.2 Spesifikasi untuk Use Case Diagram Memilih Menu Rumus Bangun Datar Nama Usecase Aktor Deskripsi Skenario Kondisi Awal Memilih Menu Rumus Bangun Datar Pengguna Ponsel Pengguna dapat memilih menu rumus bangun datar. 1. Pengguna memilih menu rumus bangun datar. 2. Sistem masuk kedalam tampilan grid view. Pengguna menerima tampilan grid view berisi rumus bangun datar dalam bentuk gambar.

7 44 Kondisi Akhir Pengguna siap mempelajari dan mengetahui rumus bangun datar Tabel 3.3 Spesifikasi untuk Use Case Diagram Memilih Menu Konversi Nama Usecase Aktor Deskripsi Skenario Kondisi Awal Memilih Menu Konversi Pengguna Ponsel Pengguna dapat memilih menu konversi 1. Pengguna memilih menu konversi. 2. Sistem masuk kedalam form konversi Pengguna menerima tampilan form konversi. Kondisi Akhir Pengguna siap mempelajari dan melakukan perhitungan konversi Tabel 3.4 Spesifikasi untuk Use Case Diagram Memilih Menu Latihan Soal Nama Usecase Aktor Deskripsi Skenario Kondisi Awal Kondisi Akhir Memilih Menu Latihan Soal Pengguna Ponsel Pengguna dapat memilih menu Latihan Soal 1. Pengguna memilih menu latihan soal. 2. Sistem masuk kedalam form soal latihan. Pengguna menerima halaman form soal latihan beserta jawaban pilihan ganda. 1. Sistem meneriam halaman form soal latihan beserta jawaban pilihan ganda. 2. Pengguna siap membaca, menjawab soal-soal latihan dan mendapatkan nilai diakhir yang menentukan apakah berhak untuk menjawab soal-soal latihan berikutnya yang terdiri dari 3 level ( mudah, sedang, dan sulit ). Tabel 3.5 Spesifikasi untuk Use Case Diagram Memilih Menu About Nama Usecase Aktor Memilih Menu About Pengguna Ponsel

8 45 Deskripsi Skenario Kondisi Awal Kondisi Akhir Pengguna dapat memilih menu about 1. Pengguna memilih menu about. 2. Sistem menampilkan informasi aplikasi. Pengguna menerima tampilan informasi aplikasi. Sistem menampilkan informasi aplikasi berupa toast Pemodelan Activity Diagram Activity diagram menunjukkan langkah demi langkah untuk melakukan komputasi. Setiap langkah adalah sebuah state dalam melakukan sesuatu. Diagram ini menggambarkan langkah yang mana yang harus dijalankan secara berurutan dan langkah yang mana yang bisa dijalankan secara bersamaan. Aliran pengaturan dari aktivitas suatu state berikutnya disebut transition. Diagram aktifitas untuk memilih menu kalkulator bangun datar ditunjukkan oleh Gambar 3.4, diagram aktifitas untuk memilih submenu bangun datar ditunjukkan oleh Gambar 3.5, diagram aktifitas untuk memilih menu rumus bangun datar ditunjukkan oleh Gambar 3.6, diagram aktifitas untuk memilih menu perhitungan konversi ditunjukkan oleh Gambar 3.7, diagram aktifitas untuk memilih menu latihan soal ditunjukkan oleh Gambar 3.8, dan diagram aktifitas untuk memilih menu About ditunjukkan oleh Gambar Diagram aktifitas untuk Memilih Menu kalkulator bangun datar Pada Gambar 3.4 aktifitas dimulai ketika pengguna sudah masuk kedalam menu utama, aktifitas selanjutnya memilih menu perhitungan

9 46 bangun datar, didalam menu perhitungan bangun datar selanjutnya adalah memilih submenu perhitungan bangun datar yang akan dijalankan, yaitu persegi, persegi panjang, segitiga, jajargenjang, trapesium, layang-layang, belah ketupat, dan lingkaran. Setelah pengguna memilih salah satu dari menu tersebut, aktifitas selanjutnya adalah pengguna bisa memilih untuk kembali perhitungan yang ingin dilakukan dan dapat melihat petunjuk penggunaan. Pengguna Sistem Buka Aplikasi Menampilkan Menu Utama Memilih menu perhitungan bangun datar Menampilkan Submenu Bangun Datar Memilih Submenu Bangun Datar Menampilkan form Perhitungan bangun datar Gambar 3.4 Diagram aktifitas untuk memilih menu kalkulator bangun datar Diagram aktifitas untuk memilih submenu bangun datar Pada Gambar 3.5 aktifitas dimulai ketika pengguna sudah masuk kedalam form perhitungan bangun datar, aktifitas selanjutnya memasukkan angka

10 47 dalam kotak input, kemudian memilih pilihan perhitungan, selanjutnya menekan tombol proses. Kemudian akan tampil hasil perhitungan dan menyebutkan hasil perhitungan. Pengguna Sistem Menampilkan form perhitungan Bangun datar Memasukkan angka kedalam Kotak input Memilih radio button konversi. Menampilkan Hasil Perhitungan Dan menyebutkan hasil perhitungan Gambar 3.5 Diagram aktifitas untuk memilih submenu bangun datar Diagram aktifitas untuk memilih menu rumus bangun datar Pada Gambar 3.6 aktifitas dimulai ketika pengguna sudah masuk kedalam menu utama, aktifitas selanjutnya memilih menu rumus bangun datar, didalam menu rumus bangun datar selanjutnya adalah menampilkan gambar dalam tampilan grid view. Kemudian memilih gambar secara otomatis akan tampil gambarnya.

11 48 Pengguna Sistem Buka Aplikasi Menampilkan Menu Utama Memilih menu Rumus bangun datar Menampilkan Tab View Rumus Bangun Datar Memilih gambar Rumus Bangun Datar Menampilkan Gambar Rumus Bangun Datar Gambar 3.6 Diagram aktifitas untuk memilih menu rumus bangun datar Diagram aktifitas untuk memilih menu konversi Pada Gambar 3.7 aktifitas dimulai ketika pengguna sudah masuk kedalam menu utama, aktifitas selanjutnya memilih menu konversi, didalam menu konversi selanjutnya adalah menampilkan form konversi, pengguna memasukkan nilai angka yang akan di konversi pada kotak input. Kemudian memilih button konversi yang disediakan. Secara otomatis akan keluar hasilnya pada kotak output dan ditampilkan dalam bentuk suara.wav.

12 49 Pengguna Sistem Buka Aplikasi Menampilkan Menu Utama Memilih menu Konversi Menampilkan form konversi Memasukkan angka pada Kotak input. Memilih radio button konversi. Menampilkan hasil konversi dan Menyebutkan hasil konversi. Gambar 3.7 Diagram aktifitas untuk memilih menu konversi Diagram aktifitas untuk memilih menu Latihan Soal Pada Gambar 3.8 aktifitas dimulai ketika pengguna sudah masuk kedalam menu utama, aktifitas selanjutnya memilih menu latihan soal. Setelah pengguna memilih menu latihan soal, aktifitas selanjutnya adalah adalah menampilkan form latihan soal yang berisi soal latihan beserta jawaban berupa pilihan ganda, pengguna memilih jawaban pilihan ganda tersebut dan menekan tombol proses nilai untuk mengetahui nilai kemudian secara otomatis akan keluar hasilnya pada kotak output.

13 50 Pengguna Sistem Buka Aplikasi Menampilkan Menu Utama Memilih menu Latihan soal Menampilkan form latihan soal Memilih radio button Jawaban pilihan ganda Menampilkan nilai pada kotak jawaban Menekan tombol proses Untuk melihat total nilai Memproses total nilai Menampilkan total nilai dan Menyebutkan total nilai Gambar 3.8 Diagram aktifitas untuk memilih menu latihan soal Diagram aktifitas untuk menu About Pada Gambar 3.9 aktifitas yang dilakukan pengguna ponsel pada saat memilih menu About dimana pengguna dapat melihat tentang aplikasi.

14 51 Pengguna Sistem Buka Aplikasi Menampilkan Menu Utama Memilih menu About Menampilkan tentang aplikasi Berupa PopUp. Gambar 3.9 Diagram aktifitas untuk menu About Pemodelan Sequence Diagram Diagram sequence biasa digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan sebagai respon daris sebuah kejadian untuk mengahasilkan keluaran tertentu. Masing-masing objek, termasuk aktor, memiliki lifeline vertikal. Pesan digambarkan sebagai garis berpanah dari satu objek ke objek lainnya. (Fowler, 2005). Dari bentuk use case yang telah digambarkan sebelumnya, dapat dibuat sequence diagram yang tampak pada Gambar 3.10 sampai Gambar Sequence Diagram memilih menu kalkulator bangun datar Sequence Diagram memilih menu kalkulator bangun datar menggambarkan skenario dan langkah-langkah yang dilakukan pengguna.

15 52 Pertama pengguna masuk ke menu utama, kemudian memilih menu kalkulator bangun datar kemudian sistem menampilkan submenu bangun datar yang terdiri dari 8 bangun datar. Kemudian masuk ke halaman form perhitungan bangun datar yang dipilih, sistem menampilkan halaman yang dipilih. Gambar 3.10 Sequence Diagram untuk memilih menu kalkulator bangun datar Sequence Diagram memilih submenu perhitungan bangun datar. Sequence Diagram memilih menu submenu bangun datar menggambarkan skenario dan langkah-langkah yang dilakukan

16 53 pengguna. Pertama pengguna masuk kedalam form perhitungan bangun datar, kemudian memasukkan angka, kemudian memilih tombol proses. Selanjutnya sistem menampilkan hasil perhitungan dan menyebutkan hasil perhitungan tersebut. Pengguna Ponsel ;Form Submenu Perhitungan Bangun Datar ;Form Menu Perhitungan BD Open () Open () Input Angka () Pilih Perhitungan () Proses Hasil Display hasil () Gambar 3.11 Sequence Diagram untuk memilih submenu perhitungan bangun datar Sequence Diagram memilih menu rumus bangun datar Sequence Diagram memilih menu rumus bangun datar menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk ke menu utama, kemudian memilih menu rumus

17 54 bangun datar kemudian sistem masuk ke form rumus bangun datar yang berisi gambar rumus-rumus bangun datar, kemudian pengguna memilih rumus yang ingin dipelajari selanjutnya sistem menampilkan gambar yang dipilih. Gambar 3.12 Sequence Diagram untuk memilih menu rumus bangun datar Sequence Diagram memilih menu konversi Sequence Diagram memilih menu konversi menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk ke menu utama, kemudian memilih menu konversi kemudian sistem masuk ke form konversi Kemudian pengguna memasukkan angka dan memilih konversi selanjutnya memilih tombol proses maka akan menampilkan hasil konversi yang dipilih berupa text dan suara.wav.

18 55 Pengguna Ponsel ;Form Menu Utama ;Form Menu Konversi ;Form Konversi Open () Open () Input Angka () Pilih Perhitungan () Proses Hasil Display hasil () Gambar 3.13 Sequence Diagram untuk memilih menu konversi Sequence Diagram memilih menu Latihan Soal Sequence Diagram memilih menu latihan soal menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk ke menu utama, kemudian memilih menu latihan soal kemudian sistem masuk ke form latihan soal. Selanjutnya sistem menampilan soal-soal latihan dengan pilihan jawab berupa pilihan ganda. Kemudian pengguna memilih jawaban pilihan ganda tersebut, selanjutnya memilih tombol proses nilai maka akan menampilkan hasil total nilai latihan.

19 56 ;Pengguna Ponsel ;form menu utama ;form menu Latihan soal ;form latihan soal Open () Open () pilih jawaban () Proses Hasil () Display Hasil () Gambar 3.14 Sequence Diagram untuk memilih menu latihan soal Sequence Diagram memilih menu about Sequence Diagram memilih menu about menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk ke menu utama, kemudian memilih menu about kemudian sistem masuk ke form about. Selanjutnya akan menampilkan informasi aplikasi.

20 57 ;Pengguna Ponsel ;Form Menu Utama ;Form Menu About Open () Open () Display Informasi Aplikasi () Gambar 3.15 Sequence Diagram untuk memilih menu about Pemodelan Class Diagram Aplikasi matematika geometri bangun datar dan konversi ukuran satuan memiliki suatu kelas utama yaitu Class GeometriAndConverter yang terdiri dari beberapa class lainnya diantaranya BujurSangkar, PersegiPanj, Segitiga, Jajargenjang, Trapesium, BelahKetupat, Layang, Lingkaran, Rumus, LatBD1, LatBD2, LatBD3, Konversi, SuaraAngka. Class diagram perancangan aplikasi matematika geometri dan konversi ukuran satuan terlihat pada Gambar 3.16 berikut ini

21 58 Gambar 3.16 Diagram Class untuk Aplikasi Matematika Geometri Bangun Datar dan Konversi Ukuran Satuan.

22 59 Tabel 3.6 Spesifikasi untuk Class Diagram GeometriAndConverter Nama Class Attribut GeometriAndConverter - Bangundatar - Menuutama Operation OnCreate () OnListItem () Tabel 3.7 Spesifikasi untuk Class Diagram bujursangkar Nama Class Attribut bujursangkar - angka1 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.8 Spesifikasi untuk Class Diagram persegipanj Nama Class Attribut persegipanj - angka1 - angka2 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.9 Spesifikasi untuk Class Diagram segitiga Nama Class Attribut Segitiga - angka1 - angka2

23 60 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.10 Spesifikasi untuk Class Diagram jajargenjang Nama Class Attribut Jajargenjang - angka1 - angka2 - angka3 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.11 Spesifikasi untuk Class Diagram trapesium Nama Class Attribut Trapesium - angka1 - angka2 - angka3 - angka4 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.12 Spesifikasi untuk Class Diagram belahketupat Nama Class Attribut Belahketupat - angka1 - angka2

24 61 - spinoperasi Operation buttonhandler () oncreate () Tabel 3.13 Spesifikasi untuk Class Diagram layang Nama Class Attribut Layang - angka1 - angka2 - angka3 - angka4 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.14 Spesifikasi untuk Class Diagram lingkaran Nama Class Attribut Lingkaran - angka1 - angka2 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.15 Spesifikasi untuk Class Diagram rumus Nama Class Attribut Rumus - Image Operation OnCreate ()

25 62 Tabel 3.16 Spesifikasi untuk Class Diagram Converter Nama Class Attribut Converter - angka1 - spinoperasi Operation buttonhandler () OnCreate () Tabel 3.17 Spesifikasi untuk Class Diagram latbd1 Nama Class Attribut latbd1 - ejwb1 - ejwb2 - ejwb3 - ejwb4 - ejwb5 - esoal1a - esoal1b - esoal2a - esoal2b - esoal3a - esoal3b - esoal4a - esoal4b - esoal5a - esoal5b - prosesnilai Operation OnClick () OnCreate ()

26 63 Tabel 3.18 Spesifikasi untuk Class Diagram latbd2 Nama Class Attribut latbd2 - ejwb1 - ejwb2 - ejwb3 - ejwb4 - ejwb5 - esoal1a - esoal1b - esoal2a - esoal2b - esoal3a - esoal3b - esoal4a - esoal4b - esoal5a - esoal5b - prosesnilai Operation OnClick () OnCreate () Tabel 3.19 Spesifikasi untuk Class Diagram latbd3 Nama Class Attribut latbd3 - ejwb1 - ejwb2 - ejwb3 - ejwb4

27 64 - ejwb5 - esoal1a - esoal1b - esoal2a - esoal2b - esoal3a - esoal3b - esoal4a - esoal4b - esoal5a - esoal5b - prosesnilai Operation OnClick () OnCreate () Tabel 3.20 Spesifikasi untuk Class Diagram SuaraAngka Nama Class Attribut SuaraAngka - ClassAct - Hasil Operation run () 3.4 Perancangan Antarmuka Perancangan antarmuka dibutuhkan dalam rekayasa perangkat lunak agar aplikasi yang dibangun mudah digunakan oleh pengguna (user friendly). Untuk itu perlu diciptakan suatu antar muka pengguna yang baik. Aplikasi matematika geometri bangun datar dan konversi ukuran satuan yang akan dibangun tiap bagian dalam aplikasi memiliki desain tampilan yang akan dijelaskan pada subbab-subbab berikut:

28 Perancangan Halaman Menu Utama Apabila pengguna ponsel memasuki tampilan menu utama terdapat thread. Dalam thread tersebut terdapat Kalkulator Bangun Datar, Konversi, Latihan Soal, About dan Keluar. Desain antar muka Menu Utama ditunjukkan oleh Gambar 3.17 berikut ini. Kalkulator Bangun Datar Rumus Bangun Datar Konversi Latihan Soal About Keluar Gambar 3.17 Rancangan Tampilan Menu Utama Aplikasi Keterangan: 1. Pilih salah satu Menu berfungsi untuk memilih pilihan menu yang pengguna pilih. 2. Pilih About berfungsi untuk menampilkan toast berupa popup tentang aplikasi. 3. Pilih Keluar berfungsi untuk keluar dari program aplikasi matematika geometri bangun datar dan konversi ukuran satuan Perancangan Halaman Bangun Datar Saat pengguna ponsel memilih bangun datar terdapat thread. Dalam thread tersebut terdapat bujur sangkar, persegi panjang, segitiga,

29 66 jajargenjang, trapesium, layang-layang, belah ketupat, dan lingkaran. Desain antar muka Bangun Datar ditunjukkan oleh Gambar 3.18 berikut ini. Bujur Sangkar Persegi Panjang Segitiga Jajargenjang Trapesium Belah Ketupat Layang Layang Lingkaran Back Gambar 3.18 Rancangan Tampilan Menu Bangun Datar. Keterangan: 1. Bila pengguna ponsel memilih thread Bujur Sangkar, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Bujur Sangkar ditunjukkan oleh Gambar 3.19 berikut ini Kalkulator Nilai Sisi Bangun : Petunjuk Pilihan perhitungan Proses Gambar 3.19 Rancangan Tampilan Form Perhitungan Bujur Sangkar.

30 67 2. Bila pengguna ponsel memilih thread Persegi Persegi, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Persegi Panjang ditunjukkan oleh Gambar 3.20 berikut ini: Kalkulator Nilai Panjang : Petunjuk Nilai Lebar : Pilihan perhitungan Proses Gambar 3.20 Rancangan Tampilan Form Perhitungan Persegi. 3. Bila pengguna ponsel memilih thread Segitiga, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Segitiga ditunjukkan oleh Gambar 3.21 berikut ini. Kalkulator Nilai Alas atau Nilai A : Petunjuk Nilai Tinggi atau Nilai B : Nilai C : Pilihan perhitungan Proses Gambar 3.21 Rancangan Tampilan Form Perhitungan Segitiga.

31 68 4. Bila pengguna ponsel memilih thread Jajargenjang, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Jajargenjang ditunjukkan oleh Gambar 3.22 berikut ini. Kalkulator Nilai p : Petunjuk Nilai t : Nilai q : Pilihan perhitungan Proses Gambar 3.22 Rancangan Tampilan Form Perhitungan Jajargenjang. 5. Bila pengguna ponsel memilih thread Trapesium, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Trapesium ditunjukkan oleh Gambar 3.23 berikut ini. Kalkulator Nilai a : Petunjuk Nilai b : Nilai c atau Nilai t : Nilai d : Pilihan perhitungan Proses Gambar 3.23 Rancangan Tampilan Form Perhitungan Trapesium.

32 69 6. Bila pengguna ponsel memilih thread BelahKetupat, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan BelahKetupat ditunjukkan oleh Gambar 3.24 berikut ini. Kalkulator Petunjuk Nilai Diagonal 1 atau Sisi Bangun : Nilai Diagonal 2 : Pilihan perhitungan Proses Gambar 3.24 Rancangan Tampilan Form Perhitungan BelahKetupat. 7. Bila pengguna ponsel memilih thread Layang-Layang, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Layang-Layang ditunjukkan oleh Gambar 3.25 berikut ini. Kalkulator Petunjuk Nilai Diagonal 1 atau Sisi AB : Nilai Diagonal 2 atau Sisi BC: Nilai CD : Nilai DA : Pilihan perhitungan Proses Gambar 3.25 Rancangan Tampilan Form Perhitungan Layang-Layang.

33 70 8. Bila pengguna ponsel memilih thread Lingkaran, maka akan masuk kedalam form perhitungan. Desain antar muka Form Perhitungan Lingkaran ditunjukkan oleh Gambar 3.26 berikut ini. Kalkulator Nilai Jari Jari : Petunjuk Nilai Diameter : Pilihan perhitungan Proses Gambar 3.26 Rancangan Tampilan Form Perhitungan Lingkaran Perancangan Halaman Rumus Bangun Datar Saat pengguna ponsel memilih halaman gambar rumus bangun datar maka akan tampil form rumus bangun datar. Desain antar muka form rumus bangun datar ditunjukkan oleh Gambar 3.27 berikut ini. Tab1 Tab 2 Tab 3 Tab 4 Tab 5 Tab n Gambar Rumus Bangun Datar yang terdapat pada Tab Tab diatas Gambar 3.27 Rancangan Tampilan Form Rumus Bangun Datar.

34 71 Keterangan: 1. Pengguna ponsel memilih Gambar yang terdapat pada tab-tab. 2. Setelah memilih salah satu gambar maka gambar akan tampil pada layar Perancangan Halaman Konversi Saat pengguna ponsel memilih pengubah suhu maka akan tampil form konversi. Desain antar muka form konversi ditunjukkan oleh Gambar 3.28 berikut ini. Input Nilai Pilihan perhitungan Proses Hitung Gambar 3.28 Rancangan Tampilan Form Konversi. Keterangan: 1. Pengguna ponsel memasukkan nilai pada kotak input. Kemudian memilih salah satu radio button untuk konversi. 2. Setelah memilih radio button, tekan tombol Hitung untuk melihat hasil yang telah di konversi.

35 Perancangan Halaman Latihan Soal Saat pengguna ponsel memilih latihan soal maka akan tampil form latihan soal. Desain antar muka form latihan soal ditunjukkan oleh Gambar 3.29 berikut ini. Soal No.1 O pilihan a. O pilihan b. Soal No.2 O pilihan a. O pilihan b. Soal No.3 O pilihan a. O pilihan b. Soal No.4 O pilihan a. O pilihan b. Soal No.5 O pilihan a. O pilihan b. Proses Nilai Gambar 3.29 Rancangan Tampilan Form Latihan Soal. Keterangan: 1. Pengguna ponsel membaca soal dan memilih jawaban pilihan ganda yang disediakan. 2. Setelah memilih jawaban, pilih tombol proses nilai sehingga menampilkan nilai anda selanjutnya nilai tersebut menentukan apakah dapat mengerjakan soal berikutnya.