Tujuan Perancangan Sistem Gambaran Umum Sistem yang Diusulkan Perancangan Antarmuka

38 keras dari suatu sistem sehingga setelah instalasi dari sistem akan benar-benar memuaskan rancangan bangun yang telah ditetapkan pada akhir tahap analisa sistem”. Dengan demikian perancangan sistem dapat diartikan sebagai berikut : 1. Tahap setelah analisis dari siklus pengembangan sistem. 2. Pendefinisian dari kebutuhan-kebutuhan fungsional. 3. Persiapan untuk rancang bangun dan implementasi. 4. Menggambarkan bagaimana suatu sistem dibentuk. 5. Penggambaran, perancangan dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah kedalam satu kesatuan yang utuh dan berfungsi.

4.3.1. Tujuan Perancangan Sistem

Tujuan dari pembuatan perancangan aplikasi pembelajaran aksara lampung dasar berbasis android ini adalah untuk menghasilkan perangkat lunak berbasis mobile aplikasi android yang mampu : 1. Membangun aplikasi pembelajaran aksara lampung dasar berbasis android. 2. Memberikan pengenalan mengenai aksara lampung beserta latihan penulisan di dalam sebuah aplikasi.

4.3.2. Gambaran Umum Sistem yang Diusulkan

Pembuatan aplikasi pembelajaran aksara lampung ini akan membuat mampu menampilkan berupa gambar dan suara tentang pembelajaran aksara lampung 39 dasar pada layar smartphone android, selain itu terdapat juga menu latihan untuk mengevaluasi pembelajaran yang pengguna telah buka sebelumnya.

4.3.3. Prosedur Perancangan yang Diusulkan

Proses perancangan ini merupakan tahap awal dari perancangan pembelajaran aksara lampung dasar yang dilakukan sebagai media pembelajaran terhadap anak – anak . Perancangan ini mencakup diagram use case, diagram aktivitas, diagram sekuen, diagram kelas, diagram objek, diagram komponen dan diagram development yang dapat menghasilkan sitem lebih baik. Proses yang dirancang diuraikan menjadi beberapa bagian yang dapat membentuk sebuah sistem tersebut menjadi kesatuan komponen.

4.3.3.1. Diagram Use Case

Diagram use case adalah gambaran fungsional dari suatu sistem, sehingga pengguna sistem memahami dan mengerti mengenai kegunaan sistem yang akan dibangun. Gambar 4.1 Diagram Use Case Pembelajaran Aksara Lampung Dasar Pengguna Pemilik Aplikasi Materi Latihan Info 40 Definisi Aktor Definisi aktor berfungsi untuk menjelaskan proses yang dapat dijalankan oleh pengguna, atau bisa dibuat dalam bentuk table seperti berikut ini : Tabel 2 Definisi Aktor Aktor Deskripsi Pengguna anak – anak dan masyarakat Aktor yang dapat menjalankan aplikasi pembelajaran aksara lampung dasar. Definisi Use Case Definisi Use Case berfungsi untuk menjelaskan proses yang terdapat pada setiap Use Case, atau bisa dibuat dalam bentuk table seperti berikut ini: Tabel 3 Definisi Use Case Use Case Deskripsi Materi Sistem akan menampilkan isi materi pembelajaran Aksara Lampung Latihan Sistem akan menampilkan isi Latihan pembelajaran Aksara Lampung Info Pembuat Sistem ini akan menampilkan info pembuat aplikasi 41 Skenario Use Case Skenario Use Case yaitu urutan langkah – langkah dalam proses bisnis, baik yang dilakukan aktor terhadap sistem manapun yang dilakukan oleh sistem terhadap aktor. Tabel 4 Skrenario Use Case Pemilihan Materi Identifikasi Nama Materi Tujuan Untuk memastikan bahwa pengguna memilih sub menu Materi dari menu materi Deskripsi Sistem akan menampilkan isi pembelajaran dari keseluruhan materi Aktor Pengguna Skenario Utama Kondisi Awal Di menu utama aplikasi

1. Aksi Aktor

Reaksi Sistem 1. Memilih menu materi 2. Menampilkan pilihan sub menu dari menu materi 3. Memilih sub menu materi 4. Menampilkan isi materi - Huruf Induk - Anak Huruf dan Tanda Baca - Angka 5. Menerima isi materi - Huruf Induk 42 - Anak Huruf dan Tanda Baca - Angka Kondisi Akhir Pengguna dapat melihat isi materi Tabel 5 Skenario Use Case Pemilihan Latihan Identifikasi Nama Latihan Tujuan Untuk memastikan bahwa pengguna memilih sub menu Latihan dari menu pembelajaran. Deskripsi Sistem akan menampilkan isi latihan Aktor Pengguna Skenario Utama Kondisi Awal Di menu utama aplikasi

2. Aksi Aktor

Reaksi Sistem 1. Memilih menu pembelajaran 2. Menampilkan pilihan sub menu dari menu latihan 3. Memilih sub menu latihan 4. Menampilkan isi latihan 5. Menerima isi latihan Kondisi Akhir Pengguna dapat melihat isi latihan 43 Tabel 6 Skenario Use Case Info Identifikasi Nama Penyajian Info Tujuan Untuk memastikan agar pengguna melihat menu sejarah dan memilih menu pembuat Deskripsi Sistem akan menampilkan info aplikasi Aktor Pengguna Skenario Utama Kondisi Awal Di menu utama aplikasi Aksi Aktor Reaksi Sistem 1. Memilih menu info 2. Menampilkan isi info 3. Menerima isi info Kondisi Akhir Pengguna dapat melihat isi info

4.3.3.2. Diagram Aktivitas

Diagram aktivitas merupakan diagram yang memodelkan aliran kerja atau workflow dari urutan aktivitas dalam suatu proses yang mengacu pada diagram use case yang ada. Berikut ini penjelasan dari tiap diagram aktvitas yang terdapat pada aplikasi pembelajaran aksara lampung dasar : 1. Diagram Aktivitas Pemilihan Materi : Diagram Aktivitas ini digunakan untuk menampilkan semua materi yang ada di pembelajaran aksara lampung dasar. 44 Gambar 4.6 Diagram Aktivitas Pemilihan Materi

2. Diagram Aktivitas Pemilihan Menu Latihan

Diagram Aktivitas ini digunakan untuk menampilkan latihan . Pengguna dapat mengevaluasi kembali pelajaran yang ada dimateri. . Pada soal latihan ini tidak bisa random, karena menggunakan Flash CS6 basic 3.0. Pengguna Sistem Memilih Menu Materi Memilih sub menu materi Menerima isi materi Menampilkan pilihan sub menu dari menu materi Menampilkan isi materi 45 Pengguna Sistem Memilih Menu Latihan Memilih sub menu latihan Menerima isi latihan Menampilkan pilihan sub menu latihan Menampilkan isi latihan Gambar 4.7 Diagram Aktivitas Pemilihan Menu Latihan 3. Diagram Aktivitas Pemilihan Info Diagram Aktivitas ini digunakan untuk menampilkan menu Info, Digunakan untuk membantu pengguna mengetahui sejarah aplikasi dan siapa yang membuat aplikasi. 46 Pengguna Sistem Memilih Menu Info Menerima Isi Info Menampilkan isi info Gambar 4.8 Diagram Aktivitas Info Pembuat

4.3.3.3. Diagram Sequence

Diagram Sequence menggambarkan interaksi antar objek di dalam dan disekitar sistem termasuk pengguna, display dan sebagainya . Diagram Sequence terdiri atas dimensi vertical waktu dan dimensi horizontal objek – objek yang terkait . Berikut adalah Diagram Sequence yang terdapat pada aplikasi pembelajaran aksara lampung dasar :

1. Diagram Sequence Pembelajaran Materi Dibagi menjadi 2, yaitu Diagram

Sequence Secara Umum dan Diagram Sequence Khusus : 47 1 Diagram Sequence Secara Umum Menu Utama :pengguna Menu Materi Sub menu Materi 1:memilih menu utama 2 : panggil menu Materi 3:menampilkan sub menu materi 4:memilih sub menu materu 5:panggil sub menumateri 6:menampilkan isi materi 7:menerima isi materi Gambar 4.9 Diagram Sequence Materi Secara Umum 48 2 Diagram Sequence Materi Secara Inti Pengguna Menu Utama Materi Huruf Induk Anak Huruf dan Tanda Baca Angka

1. Memilih Menu

Utama 2. Menu Materi

4. Menu Huruf

Induk 6. Menu Anak Huruf dan Tanda Baca 8. Menu Angka 3 . Menampilkan Materi

5. Menampilkan

Halaman Huruf Induk

7. Menampilkan Halaman Anak

Huruf dan Tanda Baca

9. Menampilakan

Halaman Angka Gambar 4.10 Diagram Sequence Materi Secara Inti Diagram ini menangani proses untuk menampilkan semua materi huruf induk, anak huruf, tanda baca dan angka yang ada di pembelajaran aksara lampung yang telah dipilih dari list materi. Proses untuk materi diatas yaitu : 1. Pengguna memilih menu materi dari menu utama. 49 2. Pengguna memilih kategori materi yang ada. 3. Sistem menampilkan materi.

2. Diagram Sequence Latihan

Menu Utama :pengguna Menu Latihan Soal Latihan 1:memilih menu utama 2 : panggil menu latihan 3:menampilkan sub menu latihan 4:memilih sub menulatihan 5:panggil menu soal latihan level 1 dan level 2 8:menampilkansoal lat yg telah dikerjakan Nilai

6: menampilka

n soal lat level 1 dan level 2 7: mengerjakan soal lat

9: nilai soal lat 10:menampilkan nilai

Gambar 4.11 Diagram Sequence Latihan Diagram ini menangani proses untuk menampilkan dan menjawab soal latihan yang ada. Proses untuk gambar diatas yaitu : 1. Pengguna memilih menu latihan dari menu utama. 2. Sistem menampilkan latihan yang tersedia. 50 3. Pengguna menjawab pertanyaan yang keluar pada menu latihan. 4. Sistem menampilkan hasil skor dari pertanyaan yang benar .

3. Diagram Sequence Info

Menu Utama :pengguna Menu Info 1:memilih menu utama 2 : panggil menu info 3:menampilkaninfo sejarah dan info pembuat 4:menerima info sejarah dan info pembuat Gambar 4.12 Diagram Sequence Info

4.3.3.4. Diagram Kelas

Diagram kelas digunakan untuk menampilkan kelas – kelas dan paket – paket didalam sebuah sistem, diagram kelas memberikan gambaran relasi antar kelas. Kelas terdiri dari atribut dan operasinya. 51 Gambar 4.13 Diagram Kelas Menu Utama +change_butstart +change_butexit Materi +change_buthad +change_butck +change_butanak +change_butangka +bbackmenu Menu Dasar +bbackhome +change_butmateri +change_butinfo +change_butlatihan Had Lampung +backSound1 +soundKA +soundGA +soundNGA +soundPA +soundBA +soundMA +soundTA +soundDA +soundNA +soundCA +soundJA +soundNYA +soundYA +soundA +soundLA +soundRA +soundSA +soundWA +soundHA +soundGHA +fl_SwipeToGoToNextPreviousFrame_3 +nexthadlam +backhadlam +soundKA +soundGA +soundNGA +soundPA +soundBA +soundMA +soundTA +soundDA +soundNA +soundCA +soundJA +soundNYA +soundYA +soundA +soundLA +soundRA +soundSA +soundWA +soundHA +soundGHA Anak Huruf dan Tanda Baca +fl_SwipeToGoToNextPreviousFrame_4 +nextanakhu +backanakhu Gabungan Kata Aksara +fl_SwipeToGoToNextPreviousFrame_5 +nextmgka +backmgka +Operation1 Angka +backSound1 +sound1 +sound2 +sound3 +sound4 +sound5 +sound6 +sound7 +sound8 +sound9 +sound10 +sound11 +sound12 +sound13 +sound14 +sound15 +sound16 +sound17 +sound18 +sound19 +sound20 +fl_SwipeToGoToNextPreviousFrame_6 +nextangka +backangka +sound1 +sound2 +sound3 +sound4 +sound5 +sound6 +sound7 +sound8 +sound9 +sound10 +sound11 +sound12 +sound13 +sound14 +sound15 +sound16 +sound17 +sound18 +sound19 +sound20 Latihan +myText +change_butlev1 +bbackmulai +captureText +change_butlev2 +change_butjaw Level 1 +nilai +a +b +waktu +Benar +salah +handTimer +change_butya +change_buttidak Level 2 +nilai +a +b +waktu +benar +salah +handTimer +change_butya +change_buttidak Info +change_butsejarah +change_butsaya Sejarah +fl_SwipeToGoToNextPreviousFrame_2 +nextsejarahs +backsejarahs Tentang Saya +backinfo 52

4.3.3.5. Diagram Objek

Diagram Objek mendeskripsikan bagaimana kumpulan objek tertentu saling berhubungan. Gambar 4.14 Diagram Objek Menu utama +change_butstart +change_butexit menu dasar +bbackhome +change_butmateri +change_butinfo +change_butlatihan latihan +myText: input_txt +captureText +bbackmulai +change_butlev1 +change_butlev2 +change_butjaw level 1 +nilai.int: 0 +a.number: 0 +b: number:10 +waktu: Timer +Benar +salah +handTimer +change_butya +change_buttidak +kuncijaw +next2 level 2 +nilai. int: 0 +a.number: 0 +b.number: 10 +waktu: Timer +benar +salah +handTimer +change_butya +change_buttidak +kuncijaw +Operation1 info +change_butsejarah +change_butsaya sejarah +fl_SwipeToGoToNextPreviousFrame_2 +nextsejarahs +backsejarahs tentang saya +backinfo materi +change_buthad +change_butck +change_butanak +change_butangka +bbackmenu angka +backSound1: SoundChannel +sound1: so1 +sound2: so2 +sound3: so3 +sound4: so4 +sound5: so5 +sound6: so6 +sound7: so7 +sound8: so8 +sound9: so9 +sound10: so10 +sound11: so11 +sound12: so12 +sound13: so13 +sound14: so14 +sound15: so15 +sound16: so16 +sound17: so17 +sound18: so18 +sound19: so19 +sound20: so20 +fl_SwipeToGoToNextPreviousFrame_6 +nextangka +backangka +sound1 +sound2 +sound3 +sound4 +sound5 +sound6 +sound7 +sound8 +sound9 +sound10 +sound11 +sound12 +sound13 +sound14 +sound15 +sound16 +sound17 +sound18 +sound19 +sound20 gabungan kata aksara +fl_SwipeToGoToNextPreviousFrame_5 +nextmgka +backmgka Anak huruf dan tanda baca +fl_SwipeToGoToNextPreviousFrame_4 +nextanakhu +backanakhu Had lampung +backSound1: SoundChannel +soundKA: suaraKA +soundGA: suaraGA +soundNGA: suaraNGA +soundPA: suaraPA +soundBA: suaraBA +soundMA: suaraMA +soundTA: suaraTA +soundDA: suaraDA +soundNA: suaraNA +soundCA: suaraCA +soundJA: suaraJA +soundNYA: suaraNYA +soundYA: suaraYA +soundA: suaraA +soundLA: suaraLA +soundRA: suaraRA +soundSA: soundSA +soundWA: soundWA +soundHA: soundHA +soundGHA: soundGHA +fl_SwipeToGoToNextPreviousFrame_3 +nexthadlam +backhadlam +soundKA +soundGA +soundNGA +soundPA +soundBA +soundMA +soundTA +soundDA +soundNA +soundCA +soundJA +soundNYA +soundYA +soundA +soundLA +soundRA +soundSA +soundWA +soundHA +soundGHA 53

4.3.3.6. Diagram Komponen

Diagram Komponen dibawah ini menggambarkan struktur dan hubungan antar komponen piranti lunak aplikasi pembelajaran aksara lampung dasar berbasis android dalam suatu package. Gambar 4.15 Diagram Komponen

4.3.3.7. Diagram Deployment

Diagram Deployment dibawah ini menggambarkan komponen pada deploy dalam suatu infrastruktur sistem aplikasi pembelajaran aksara lampung dasar berbasis android beserta hubungannya. the aksara lampung.apk the aksara lampung.fla the aksara lampung.swf the aksara lampung-app.xml 54 Gambar 4.16 Diagram Development

4.3.4. Perancangan Antarmuka

Perancangan antarmuka dibutuhkan untuk mewakili keadaan sebenarnya dari aplikasi yang akan dibangun, berikut akan disajikan perancangan antarmuka dari aplikasi yang akan dibangun. Perancangan ini merupakan hasil transformasi dari analisa ke dalam perancangan yang nantinya akan di implementasikan. Android The aksara lampung.apk Adobe AIR.apk OS Android 55

4.3.4.1. Struktur Menu Utama

Pada perancangan struktur menu aplikasi pembelajaran aksara lampung dasar berbasis android menggunakan Adobe Flash CS6. Terdapat 4 menu utama diantaranya materi, latihan, info, kembali. Gambar 4.17 Perancangan Struktur Menu Utama Aplikasi

4.3.4.2. Menu Materi

Pada menu pembelajaran terdapat pilihan sub menu materi diantaranya had lampung, anak huruf dan tanda baca, gabungan kata aksara, angka lampung, kembali. Teks Materi Latihan Info Kembali 56 Gambar 4.18 Perancangan Menu Materi

4.3.4.3. Isi Materi Had Lampung

Pada menu materi had lampung terdapat icon, pengucapan dan suara pengenalan ka – gha. Gambar 4.19 Perancangan Menu Materi Had Lampung

4.3.4.4. Isi Materi Anak Huruf Dan Tanda Baca

Pada isi materi anak huruf dan tanda baca, terdapat nama anak huruf dan tanda baca, bunyi beserta contoh nya. Materi Had Lampung Anak Huruf dan Tanda baca Gabungan Kata Aksara Angka Kembali Had Lampung KA GA NGA PA MA BA TA DA NA CA JA NYA YA A LA RA SA WA HA GHA 57 Gambar 4.20 Perancangan Anak Huruf dan Tanda Baca

4.3.4.5. Isi Materi Gabungan Kata Aksara

Pada Isi materi gabung kata aksara terdapat contoh penggabungan kata yang telah diberi tanda baca. Gambar 4.21 Perancangan Gabungan Kata Aksara

4.3.4.6. Isi Materi Angka Lampung

Pada isi meteri angka lampung terdapat angka lampung dari angka 1 - 20 dan suara pengucapan angka tersebut. Anak Huruf dan Tanda Baca Nama Bunyi Aksara Contoh GABUNGAN KATA AKSARA KATA Aksara lampung 58 Gambar 4.22 Perancangan Materi Angka Lampung

4.3.4.7. Menu Latihan

Pada menu latihan terdapat kolom yang berisi nama pengguna yang dimasukan sebelum memulai latihan.kemudian memilih menu mulai. Gambar 4.23 Perancangan Menu Awal Latihan

4.3.4.8. Sub Menu Latihan menu mulai

Pada sub menu latihan menu mulai terdapat menu level latihan 1 dan menu level 2 latihan. ANGKA LAMPUNG dst…. 1 2 3 4 5 6 Masukan Nama Mulai Kembali 59 Gambar 4.24 Perancangan Sub Menu Latihan

4.3.4.9. Isi Latihan Level 1

Pada isi latihan level 1 terdapat 10 soal pilihan ganda yang harus dikerjakan dalam waktu 10 detik tiap 1 soal. Gambar 4.25 Perancangan Isi Latihan Level 1

4.3.4.10. List Nilai Latihan Level 1

Pada list nilai latihan level 1 terdapat sebuah nama dan nilai. Latihan Level 1 Level 2 Soal lev1 Timer 60 Gambar 4.26 List Nilai Latihan Level 1

4.3.4.11. Menu Latihan Level 2

Pada isi latihan level 2 terdapat 10 soal pilihan ganda penggabungan kata yang harus dikerjakan dalam waktu 10 detik tiap 1 soal. Gambar 4.27 Perancangan Menu Latihan Level 2

4.3.4.12. List Nilai Latihan Level 2

Pada list nilai latihan level 2 terdapat sebuah nama dan nilai. Level 1 Nama Nilai Kunci jawaban Kembali Soal lev 2 Timer 61 Gambar 4.28 Perancangan List Nilai Latihan Level 2

4.3.4.13. Menu Info

Menu Info berisikan Rangkuman Sejarah aksara lampung dan Profil pembuat. Gambar 4.29 Perancangan Menu Info INFO Sejarah Pembuat Level 2 Nama Nilai Kunci jawaban 61 BAB V IMPLEMENTASI DAN PENGUJIAN SISTEM

5.1. Implemetasi

Tahap implementasi sistem merupakan tahap penterjemahan perancangan berdasarkan hasil analisis ke dalam suatu bahasa pemrograman tertentu serta penerapan perangkat lunak yang dibangun pada lingkungan yang sesungguhnya. Adapun pembahasan implemetasi antarmuka. Disamping itu disajikan juga tampilan aplikasi pembelajaran aksara lampung dasar setelah diimplementasikan pada telepon genggam Samsung Galaxy Grand.

5.1.1. Batasan Implementasi

Dalam Praktek implementasi perangkat lunak tentunya dbutuhkan dukungan perangkat keras hardware yang baik agar pada saat penulisan program Coding . Perangkat yang penulis gunakan pada saat implementasi sebagai berikut.

5.1.2. Implementasi Perangkat Lunak

Dalam menerapkan rancangan yang telah dibuat , dibutuhkan beberapa software untuk membuat program aplikasi pembelajaran aksara lampung dasar yaitu 1. Sistem Operasi untuk penggunaan sistem operasi yang dapat digunakan Windows 7 32 atau 64 bit atau Windows 8 32-bit 2. Adobe Flash CS 6 yang telah tersedia fasilitas development aplikasi android. Antara lain tools pengembangan, action script 3.0, libraries, dokumentasi dan simulator untuk mensimulasikan aplikasi berjalan pada perangkat.