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.