Flowchart aplikasi Story Board Aplikasi

70

2. Perancangan

Tahapan perancangan pada penelitian ini yang dilakukan adalah tahapan perancangan, tahapan perancangan yang dilakukan antara lain membuat flowchat, membuat story board dan rancangan media sebelum dikembangkan, tahapan tersebut antara lain:

a. Flowchart aplikasi

1 Flowchart Proses Kerja Halaman Petunjuk Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman petunjuk. Gambar 5. Flowchart Proses Kerja Halaman Petunjuk 2 Flowchart Proses Kerja Halaman Kompetensi Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman kompetensi. 71 Gambar 6. Flowchart Proses Kerja Halaman Kompetensi 3 Flowchart Proses Kerja Halaman Materi Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman materi. Gambar 7. Flowchart Proses Kerja Halaman Materi 72 4 Flowchart Proses Kerja Halaman Simulasi Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman simulasi. Gambar 8. Flowchart Proses Kerja Halaman Simulasi 5 Flowchart Proses Kerja Halaman Kuis Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman kuis. 73 Gambar 9. Flowchart Proses Kerja Halaman Kuis 6 Flowchart Proses Kerja Halaman Profil Flowchart yang digunakan untuk menjelaskan proses kerja pada halaman profil. Gambar 10. Flowchart Proses Kerja Halaman profil 74

b. Story Board Aplikasi

Tabel 15. Story Board Aplikasi No. Visual 1. Halaman Utama Keterangan : 1 Warna backround biru tua dan orange tua 2 Gambar logo bertuliskan SMK X semester genap 3 Tulisan judul media baris pertama berwarna merah maron, baris kedua berwarna hijau 4 Tombol “exit” t 5 Tombol “music onoff” t t music 2. Halaman petunjuk Judul media Logo Petunjuk Simulasi Materi Kompetensi Profil Kuis Exit Musik Onoff Exit Gambar halaman yang dijelaskan Judul halaman Next Undo 75 Keterangan : 1 Background putih tulang mendominasi halaman petunjuk 2 J “ t j ” 3 Warna tulisan judul hijau muda 4 Gambar halaman menunjukkan halaman yang dijelaskan penggunaannya 5 Tombol “next” t j j 6 Tombol “undo” t b t j sebelumnya 7 Tombol “exit” t t j b li ke menu utama 3. Halaman Kompetensi Keterangan : a Background berwarna krem b J “K t ” c T b “exit” t d T b “music onoff” t t c e T b “next” t j j t selanjutnya f T b “undo” t b t j mpetensi sebelumnya g T b “home” t b t Exit Judul halaman Musik Onoff Penjelasan kompetensi dan indikator Home Undo Next 76 4. Halaman Materi Keter angan : Keterangan: a. Warna background utama sama seperti menu utama b. J “M t ” c. T b “exit” untuk keluar dari program d. T b “music onoff” t t musik e. T b “home” t b t 5. Halaman Simulasi Home Judul halaman Exit Musik Onoff Pengertia Alat Bahan Tanda-tanda Cara mengukur Pola Sistem Bunka Judul halaman Exit Musik Onoff Home Badan Lengan Rok 77 Keterangan : 1 Background berwarna krem 2 J “S ” 3 T b “B ” t b b t pola badan 4 T b “L ” t b b t pola lengan badan 5 T b “R ” t b b t rok 6 T b “exit” untuk keluar dari program 7 T b “music onoff” t t musik 8 T b “home” t b t 6. Sub Halaman Simulasi Menu Badan Keterangan : 1 Background berwarna krem 2 J “Proses Pembuatan Pola Dasar Badan Atas System Bunka ” 3 T b “ - ” t t b t bentuk gambar 4 T b “ ” t t b t 5 T b “exit” t t j embali ke menu utama 6 T b “music onoff” t t musik Judul halaman Exit Musik Onoff Langkah 1 Langkah 4 Langkah 3 Langkah 5 Langkah 6 Langkah 7 Langkah 9 Langkah Langkah Simulasi Langkah 2 Langkah 8 78 7. Sub Halaman Simulasi Menu Lengan Keterangan : 1 Background berwarna krem 2 J “P P b t P D L S t Bunka ” 3 T b “ - 5” t t b t bentuk gambar 4 T b “simulasi” untuk melihat proses pembuatan dengan animasi 5 T b “exit” t t j b menu utama 6 T b “music onoff” t t musik 8. Sub Halaman Simulasi Menu Rok Judul halaman Exit Musik Onoff Langkah 1 Langkah 4 Langkah 3 Langkah 5 Simulasi Langkah 2 Judul halaman Exit Musik Onoff Langkah 1 Langkah 4 Langkah 3 Langkah 5 Simulasi Langkah 2 Langkah 6 Langkah 7 Langkah 8 79 Keterangan : 1 Background berwarna krem 2 J “Proses Pembuatan Pola Dasar Rok System Bunka” 3 T b “ - 8” t t b t bentuk gambar 4 T b “ ” t t b t 5 T b “exit” t t j b e menu utama 6 T b “music onoff” t k menyalakan dan mematikan musik 9 Halaman Kuis Keterangan : 1 Background berwarna krem 2 J “K ” 3 Tulis nama pada kotak yang telah disediakan 4 Tulis kelas pada kotak yang telah disediakan 5 T b “ ” t 7 T b “home” t b t 6 T b “music onoff” t k menyalakan dan mematikan musik 7 T b “exit” t Judul halaman Exit Musik Onoff Mulai Tempat menulis Tempat menulis Home 80 10 Halaman Profil Keterangan : 1 Background berwarna krem 2 J “P f ” 3 T b “home” untuk kembali ke menu utama 4 T b “music onoff” t k menyalakan dan mematikan musik 5 T b “exit” t 6 Titik adalah space tulisan isi profil media berjalan

3. Pengembangan