4. Flowchart pada Exercise
Pada flowchart exercise ini akan ditampilkan aliran data pada proses berjalannya exercise dan perhitungan skor exercise.
Gambar 3.11 Flowchart Tahap-tahap Exercise
Start
Input Nama
Data Soal Pilihan Berganda
Periksa Jawaban
Jawaban Benar
Benar = Benar+1 Salah = Salah+1
Perhitungan Nilai
Print Nama Dan Nilai
End yes
no
Universitas Sumatera Utara
Dari flowchart tersebut dapat dijelaskan sebagai berikut: 1.
Sebelum user memulai exercise maka user diminta menginputkan nama. 2.
Saat game berlangsung maka akan ditampilkan data soal exercise berupa pertanyaan yang berhubungan dengan materi pembelajaran pada game beserta
pilihan jawaban yang benar untuk soal tersebut. 3.
Perhitungan skor dilakukan dengan jumlah semua jawaban yang benar dan jawaban yang salah untuk menentukan skor.
4. Setelah user menyelesaikan exercise maka akan ditampilkan skor user beserta
nama yang user yang diinputkan pada awal exercise.
3.2.4 Storyboard
Storyboard merupakan rancangan tampilan yang dideskripsikan secara berurut mengenai fungsi menu ataupun navigasi lainnya dalam suatu aplikasi. Storyboard
dijabarkan secara jelas sehingga dapat mendeskripsikan rancangan yang akan dibuat secara tepat. Hasil dari storyboard akan digunakan untuk membangun aplikasi agar
lebih terstruktur.
3.2.4.1. Pendefenisian Fungsi-fungsi Menu Aplikasi
Penjabaran tentang fungsi menu dan navigasi serta proses yang berlangsung di dalam aplikasi dapat dijelaskan sebagai berikut:
Tabel 3.1 Tabel Fungsi-fungsi Menu Aplikasi No
Nama Layar
Aktifitas Proses Efek
Navigasi
1. Tampilan
Utama Aplikasi
• Saat aplikasi dibuka, tampilan
yang pertama muncul adalah tampilan awal aplikasi.
• Tampilan menyajikan gambar
kartun dengan tulisan English for Learning dan Education Game di
tengah layar dan judul skripsi penulis di bagian kiri atas layar
• Di bagian pinggir kiri terdapat
tombol utama yaitu: Home. •
Musik latar
lagu anak-
anak dalam
bahasa Inggris
• Animasi
pengui •
Tombol Home: untuk memilih
menu home. •
Tombol Games: untuk
memilih menu game.
• Tombol
Profile: untuk memilih menu
Universitas Sumatera Utara
No Nama
Layar Aktifitas Proses
Efek Navigasi
• Games, Profile dan Exit
Tampilan awal ini uga disertai dengan musik latar lagu anak-anak
dalam bahasa Inggris dan animasi pinguin menari.
• profile.
Tombol Exit: untuk memilih
menu exit.
2. Menu
Home •
Jika user mengklik tombol menu Home maka muncul penjelasan
singkat tentang konsep education game tentang penggunaan aplikasi
secara umum.
• Tampilan menu home memiliki
tombol next dan previous untuk berpindah halaman, serta tombol
back untuk kembali ke tampilan utama aplikasi.
• Hampir sama dengan tampilan
awal, pada tampilan menu home masih terdapat tombol menu
utama, tulisan judul skripsi, dan musik latar.
• Tombol Next:
untuk menuju ke halaman
menu
home berikutnya.
• Tombol
Previous: untuk menuju
ke halaman menu
home sebelumnya.
• Tombol Back:
untuk kembali ke tampilan
utama aplikasi.
3. Menu
Games •
Jika user mengklik tombol menu Games
maka muncul pilihan tombol game Vocabulary dan
game Grammar. •
Jika user memilih tombol game Vocabulary maka akan menuju
tampilan awal game Vocabulary. •
Jika user memilih tombol game Grammar
maka kan menuju tampilan awal game Grammar.
• Pada tampilan menu home juga
masih terdapat tombol menu utama, tombol back, tulisan judul
skripsi, dan musik latar. •
Musik latar
lagu anak-
anak dalam
bahasa Inggris
• Tombol Game
Vocabulary: untuk masuk
ke
game Vocabulary.
• Tombol Game
Grammar. •
untuk masuk ke
game Grammar.
• Tombol Back:
untuk kembali ke tampilan
utama aplikasi.
4. Tampilan
Awal Game
Vocabu- lary
• Jika
user memilih
game Vocabulary maka akan muncul
tampilan awal game Vocabulary •
Di bagian samping kiri layar terdapat submenu Play, Level,
High Score, Help dan Exercise. •
Tampilan awal disertai musik latar game dan tombol back untuk
kembali ke tampilan utama aplikasi.
• Musik
latar •
Animasi •
Tombol Back: untuk kembali
ke tampilan utama aplikasi.
Universitas Sumatera Utara
No Nama
Layar Aktifitas Proses
Efek Navigasi
5. Tampilan
Awal Game
Grammar •
Jika user memilih game Grammar maka akan muncul tampilan awal
game Grammar. •
Di bagian samping kiri layar terdapat submenu Play, Level,
High Score, Help dan Exercise. •
Tampilan awal disertai musik latar game dan tombol back untuk
kembali ke tampilan utama aplikasi
• Musik
latar •
Animasi •
Tombol Back: untuk kembali
ke tampilan utama
aplikasi.
6. Submenu
Play •
Jika user memilih tombol Play maka akan muncul tampilan saat
game berlangsung. •
Pada game Vocabulary terdapat ikon gambar beserta 4 pilhan
jawaban. User harus memilih jawaban yang tepat yang
merupakan bahasa Inggris dari gambar yang ditampilkan.
• Hampir sama dengan game
Vocabulary, pada game Grammar terdapat pertanyaan yang
berhubungan dengan grammar beserta 4 pilhan jawaban. User
harus memilih jawaban yang tepat yang merupakan bahasa Inggris
dari gambar yang ditampilkan.
• Jika user sudah mengklik salah
satu jawaban, maka akan muncul soal berikutnya dan begitu
seterusnya.
• Setelah user menyelesaikan game
maka akan ditampilkan skor game. •
Di bagian samping kiri layar terdapat submenu Pause, Stop,
Music OnOff, High Score, Help. •
Game diiringi musik latar dan tampilan animasi.
• Musik
latar •
Animasi pegiring
game •
Animasi orang
tertawa saat
game berhasil
• Animasi
orang menan-
gis saat game
gagal. •
Tombol Pause: Menghentikan
Permainan Sementara.
• Tombol Stop:
Menghentikan Game
dan kembali ke
tampilan awal game.
• Tombol Music
OnOff •
Disediakan juga tombol
Submenu: High Score dan
Help
7. Submenu
Level •
Jika user memilih tombol Level maka akan muncul 3 pilhan level
yaitu level easy mudah, medium sedang, dan hard sulit
• Jika user sudah memilih salah satu
level maka user dapat memilih tombol
Play untuk memulai
permain •
Musik latar
• Tombol Level
Easy: untuk
memilih game dengan tingkat
kesulitan yang mudah.
• Tombol Level
Medium: untuk
Universitas Sumatera Utara
No Nama
Layar Aktifitas Proses
Efek Navigasi
• Tampilan submenu Level diiringi
musik latar dan tombol Back untuk kembali ke tampilan awal game.
•
• memilih game
dengan tingkat kesulitan yang
sedang.
• Tombol Level
Hard: untuk
memilih game dengan tingkat
kesulitan yang sulit.
Tombol Back: untuk kembali
ke tampilan awal game.
8. Submenu
High Score
• Jika user memilih tombol High
Score maka akan muncul 5 data skor tertinggi beserta nama user
yang mencapai skor tersebut.
• Tampilan submenu High Score
diiringi musik latar dan tombol Back.
• Musik
latar •
Tombol Back: untuk kembali
ke tampilan awal game.
9. Submenu
Help •
Jika user memilih tombol Help maka akan muncul informasi
instruksiaturan main dalam game. •
Tampilan submenu Help diiringi musik latar dan tombol Back.
• Musik
latar •
Tombol Back: untuk kembali
ke ampilan awal game.
10. Submenu Exercise
• Jika user memilih tombol Exercise
maka akan muncul tampilan untuk menginputkan nama.
• Setelah user menginputkan nama,
maka akan muncul tampilan exercise
yang menyajikan pertanyaan yang berhubungan
dengan materi pembelajaran dalam game beserta 3 pilihan jawaban.
• Jika user sudah mengklik salah
satu jawaban maka akan muncul pertanyaan selanjutnya dan begitu
seterusnya.
• Setelah
user menyelesaikan
exercise maka akan ditampilkan skor exercise.
• Exercise diiringi dengan musik
latar dan tombol Next, Previous dan Back.
• Musik
latar •
Animasi pada
saat skor ditampil-
kan •
Tombol Next: untuk ke
halaman exercise
berikutnya.
• Tombol
Previous: untuk ke
halaman exercise
sebelumnya.
• Tombol Back:
untuk kembali ke tampilan
awal game.
Universitas Sumatera Utara
No Nama
Layar Aktifitas Proses
Efek Navigasi
11
Menu Profile
•
\
Saat user mengklik tombol menu Profile
maka muncul profile pengembang.
• Tampilan menu Profile memiliki
tombol back untuk kembali ke tampilan awal aplikasi.
•
Pada tampilan menu Profile juga masih terdapat tombol menu
utama, tulisan judul skripsi, dan musik latar.
• Musik
latar lagu
anak- anak
dalam bahasa
Inggris
• •
Tombol Back: untuk kembali
ke tampilan awal game.
12. Menu Exit
• Saat user mengklik tombol menu
Exit maka muncul pertanyaan konfirmasi untuk keluar dari
aplikasi disertai dua pilihan tombol Yes dan No.
• Musik
latar •
Tombol Yes:
untuk keluar dari aplikasi.
• Tombol
No: untuk tetap
menggunakan aplikasi.
3.2.4.2 Rancangan Tampilan
Pendefinisian tentang fungsi-fungsi menu dan proses yang berlangsung di dalam aplikasi dapat dijabarkan secara lebih rinci sebagai |berikut:
1. Tampilan Utama
Kategori