Perancangan STD State Transition Diagram

Gambar 4.19 Rancangan STD Tampilan Gerakan Bumi Pada gambar 4.19 merupakan rancangan STD tampilan gerakan bumi. Dalam tampilan ini terdapat sebuah tombol navigasi yaitu “Back” yang akan mengarahkan pengguna kembali meuju tampilan menu visualisasi. Gambar 4.20 Rancangan STD Tampilan Gerakan Bulan Pada gambar 4.20 merupakan rancangan STD tampilan gerakan bulan. Dalam tampilan ini terdapat sebuah tombol navigasi yaitu “Back” yang akan mengarahkan pengguna kembali meuju tampilan menu visualisasi. Gambar 4.21 Rancangan STD Tampilan Gerakan Bumi Bulan Gerakan Bumi Menu Visualisasi Klik “Back” Tampilkan Menu Visualisasi Klik “Gerakan Bumi” Tampilkan Gerakan Bumi Gerakan Bulan Menu Visualisasi Klik “Back” Tampilkan Menu Visualisasi Klik “Gerakan Bulan” Tampilkan Gerakan Bulan Gerakan Bumi bulan Menu Visualisasi Klik “Back” Tampilkan Menu Visualisasi Klik “Gerakan Bumi Bulan ” Tampilkan Gerakan Bulan Pada gambar 4.21 merupakan rancangan STD tampilan gerakan bumi dan bulan. Dalam tampilan ini terdapat sebuah tombol navigasi yaitu “Back” yang akan mengarahkan pengguna kembali meuju tampilan menu visualisasi. Gambar 4.22 Rancangan STD Tampilan Profil Creator Pada gambar 4.22 merupakan rancangan STD tampilan Profil Creator. Dalam tampilan ini terdapat sebuah tombol navigasi yaitu “Back” yang akan mengarahkan pengguna kembali meuju tampilan menu visualisasi. Gambar 4.23 Rancangan STD Tampilan Pengantar Permainan Profil Creator Menu Visualisasi Klik “Back” Tampilkan Menu Visualisasi Klik “About Me” Tampilkan Profil Creator Menu Utama Cerita Pengantar Permainan Klik “BackNPC” Tampilkan Menu Utama Klik “NextNPC” Tampilkan Permainan Labirin Permainan Labirin Klik “BackNPC” Tampilkan Cerita Pengantar Permainan Klik “Game Evaluasi” Tampilkan Cerita Pengantar Permainan Pada Gambar 4.23 merupakan rancangan STD tampilan cerita pengantar permainan. Navigasi dalam tampilan ini menggunakan tombol untuk berpindah tampilan maupun melalui interaksi dengan NPC yang terdapat di dalam tampilan dalam hal ini tampilan virtual reality. Dalam tampilan ini terdapat 2 arah navigasi yaitu yang mengarah menuju menu utama aplikasi serta yang mengarah ke tampilan selanjutnya yaitu tampilan permainan labirin. Gambar 4.24 Rancangan STD Tampilan Permainan Labirin Pada Gambar 4.24 merupakan rancangan STD tampilan permainan labirin. Navigasi dalam tampilan ini menggunakan tombol maupun interaksi dengan NPC yang terdapat dalam Klik “NextNPC” Tampilkan Permainan Puzzle Cerita Pengantar Permainan Permainan Labirin Klik “BackNPC” Tampilkan Cerita Pengantar Permainan Permainan Puzzle Klik “NextNPC” Tampilkan Permainan Labirin Game Over Labirin 3x Salah Jawab Tampilkan GameOver Labirin Klik “Coba Lagi” Tampilkan Permainan Labirin tampilan virtual reality. Untuk berpindah menuju tampilan selanjutnya pengguna harus menyelesaikan permainan terlebih dahulu, kemudian pengguna akan bertemu dengan NPC terakhir dalam tampilan yang akan mengarahkannya menuju tampilan selanjutnya. Sedangkan untuk kembali menuju tampilan sebelumnya yaitu tampilan cerita pengantar permainan, pengguna harus berinteraksi dengan NPC yang pertama kali ditemui dalam tampilan. Gambar 4.25 Rancangan STD Tampilan Permainan Puzzle Pada gambar 4.25 merupakan rancangan STD tampilan permainan puzzle. Dalam tampilan ini untuk dapat berpindah menuju tampilan berikutnya, pengguna diharuskan menyelesaikan teka-teki puzzle yang diberikan, jika pengguna berhasil maka akan muncul tampilan baru yang berisi tombol yang mengarahkan Permainan Labirin Permainan Puzzle Klik “FinishNPC” Tampilkan Cerita Pengantar Permainan Cerita Pengantar Permainan Klik “NextNPC” Tampilkan Permainan Puzzle Game Over Labirin Gagal Susun Tampilkan GameOver Puzzle Klik “Coba Lagi” Tampilkan Permainan Puzzle pengguna kembali menuju awal game evaluasi yaitu tampilan cerita pengantar permainan.

4.5.7 Perancangan Flowchart

Perancangan flowchart dilakukan untuk mengetahui serta mendokumentasikan aliran proses yang terjadi di dalam sistem atau aplikasi. Gambar 4.26 Rancangan Flowchart Intro Pada gambar 4.26 merupakan rancangan flowchart intro yang merupakan tampilan awal dari aplikasi. Terdapat pilihan enter yang jika dipilih oleh pengguna maka pengguna akan mengarah ke tampilan selanjutnya yaitu tampilan menu utama. Keterangan : A : Menu Utama Mulai Menampilkan Tampilan Intro Pilih Enter A Keluar ya tidak Gambar 4.27 Rancangan Flowchart Menu Utama Pada gambar 4.27 merupakan rancangan flowchart menu utama dari aplikasi. Terdapat pilihan visualisasi serta game evaluasi, jika pengguna memilih visualisasi maka pengguna akan diarahkan menuju tampilan menu visualisasi pergerakan bumi dan bulan sedangkan jika pengguna memilih game evaluasi maka pengguna akan diarahkan menuju tampilan awal dari game evaluasi yaitu tampilan cerita pengantar permainan. Keterangan : A : Menu Utama B : Menu Visualisasi P. Bumi Bulan C : Cerita Pengantar A Menampilkan VR Menu Utama Pilih Visualisasi B Keluar ya tidak Pilih Game Evaluasi C ya tidak Gambar 4.28 Rancangan Flowchart Menu Visualisasi Pada gambar 4.28 merupakan rancangan flowchart menu visualisasi pergerakan bumi dan bulan. Terdapat 4 pilihan dalam tampilan ini yaitu pilihan gerakan bumi yang jika dipilih oleh pengguna akan mengarah pada tampilan gerakan bumi, pilihan Keterangan : B : Menu Visualisasi P. Bumi Bulan D : Gerakan Bumi E : Gerakan Bulan F : Gerakan Bumi Bulan G : Profil Creator B Menampilkan Menu Visualisasi P. Bumi Bulan Pilih Gerakan Bumi D Keluar ya tidak Pilih Gerakan Bulan E ya tidak Pilih Gerakan Bumi Bulan F ya tidak Pilih About Me G ya tidak Pilih Back ya tidak Menu Utama