• Tidak ada hasil yang ditemukan

BAB III ANALISA DAN PERANCANGAN

N/A
N/A
Protected

Academic year: 2022

Membagikan "BAB III ANALISA DAN PERANCANGAN"

Copied!
34
0
0

Teks penuh

(1)

3.1 Analisis Sistem

Dalam tahap merancang bangun aplikasi jurus Judo, tahap-tahap yang harus dilakukan adalah tahap analisis kemudian dilanjutkan dengan tahap konsep perancangan aplikasi tersebut. Pada tahap pertama penulis menganalisa kebutuhan dasar yang ada pada sistem yang akan dibuat, yang biasa dilakukan adalah mempresentasikan suatu masalah, sehingga data tersebut dapat diketahui spesifikasi kebutuhannya.

Di dalam aplikasi ini penulis membahas beberapa teknik gerakan bantingan dasar di dalam Judo.

3.2 Analisis Kebutuhan

Dalam melakukan penelitian, dibutuhkan beberapa komponen yang mendukung terhadap keberhasilan peneliltian ini yaitu :

1. Perangkat lunak (software)

a. Sistem operasi Windows 7

b. Software animasi Adobe Flash CS3 c. Software Adobe Photoshop CS3 2. Perangkat keras (hardware)

Seperangkat Komputer

3.3 Konsep

Aplikasi simulasi ini merupakan aplikasi yang dibuat untuk digunakan oleh masyarakat umum yang ingin belajar teknik gerakan bantingan dalam Judo. Aplikasi

29

(2)

ini mempergunakan suara, teks, gambar dan animasi untuk penjelasan agar lebih menarik serta lebih mudah di pahami.

Deskripsi konsep aplikasi ini adalah sebagai berikut :

Tabel 3.1 Deskripsi Konsep Aplikasi

Judul Aplikasi Jurus Judo

Pengguna Masyarakat dan semua kalangan pecinta Judo Gambar Menggunakan file berformat .gif yang dibuat sendiri Suara Menggunakan file berformat mp3

Animasi teks Animasi pada teks dan gambar dibuat sendiri

Interaktif Menggunakan script yang dimasukan kedalam aplikasi

Aplikasi ini juga dikemas dalam bentuk.swf sehingga bisa langsung digunakan pada laptop atau komputer yang sudah terinstal Adobe Flash CS3.

3.4 Perancangan

Pada bagian ini penulis akan dijelaskan secara rinci Rancang Bangun Aplikasi Jurus Judo yang meliputi pemodelan use case diagram, perancangan storyboard, sequence diagram, activity diagram dan perancangan antarmuka.

1. Pembuka

Halaman ini terdapat empat pilihan tombol dan animasi pembuka. Tombol start akan membawa user ke menu utama, sedangkan tombol X akan membawa user keluar dari aplikasi dan tombol bantuan penggunaan akan menampilkan cara penggunaan aplikasi sedangkan tombol sound untuk mematikan suara.

(3)

31 2. Menu Utama

Pada halaman ini terdapat berbagai pilihan yang berfungsi mengarahkan user kehalaman yang di inginkan.

3. Gokyu 1

Pada halaman ini terdapat 5 (lima) pilihan gerakan bantingan. User dapat memilih berbagai gerakan yang ada, Yaitu gerakan bantingan ogoshi, osotogari, hizaguruma, ouchigari, ukigoshi dan dapat pula kembali ke menu sebelumnya, yaitu menu utama.

4. Gokyu 2

Pada halaman ini terdapat 6 (enam) pilihan gerakan bantingan. Yaitu, Kouchigari, Tsurikomi, Taiotoshi, Haraigoshi, Uchimata, Koshiguruma.

Pada halaman ini user juga dapat kembali kehalaman menu utama.

5. Gokyu 3

Pada halaman ini terdapat 5 (lima) pilihan gerakan bantingan. User dapat memilih berbagai gerakan yang ada, Yaitu gerakan bantingan Ashiguruma, Hanegoshi, Haraitsuri, Kosotogake, Sodetsuri dan dapat pula kembali ke menu sebelumnya, yaitu menu utama.

6. Gokyu 4

Pada halaman ini terdapat 3 (tiga) pilihan gerakan bantingan. User dapat memilih berbagai gerakan yang ada, Yaitu gerakan bantingan Oguruma, Ukiotoshi, Utsurigoshi dan dapat pula kembali ke menu sebelumnya, yaitu menu utama.

7. Gokyu 5

Pada halaman ini terdapat 4 (empat) pilihan gerakan bantingan. User dapat memilih berbagai gerakan yang ada, Yaitu gerakan bantingan Ukiwaza, Yokogake, Yokoguruma, Ushirogoshi dan dapat pula kembali ke menu sebelumnya, yaitu menu utama.

(4)

8. Credit

Pada halaman ini adalah halaman penutup yaitu berisi profil penulis dan keluar dari aplikasi tersebut.

3.4.1. Perancangan Peta Navigasi

Peta navigasi ini memudahkan untuk merancang aplikasi yang akan dibuat dalam menentukan lokasi pada setiap halaman yang ada. Berikut ini adalah gambar peta navigasi dari rancang bangun aplikasi jurus Judo.

(5)

OSOTOGARI

Gokyu 1 HIZAGURUMA

Gambar 3.1 Diagram Peta Navigasi Gokyu 2

Gokyu 5 INTRO

OUCHIGARI UKIGOSHI

KOUCHIGARI TSURIKOMI TAIOTOSHI HARAIGOSHI UCHIMATA KOSHIGURUMA

Gokyu 3

ASHIGURUMA HANEGOSHI HARAITSURI KOSOTOGAKE SODETSURI

Gokyu 4

OGURUMA UKIOTOSHI UTSURIGOSHI UKIWAZA

USHIROGOSHI YOKOGAKE YOKOGURUMA

CREDIT

(6)

3.4.2 Perancangan Storyboard

Selanjutnya adalah membuat storyboard. Storyboard merupakan deskripsi masing-masing tampilan suatu kejadian dari movie yang akan dimainkan. Dengan mencantumkan semua objek atau elemen-elemen multimedia serta komponen-komponen aplikasi yang akan dibuat. Satu kolom storyboard mewakili satu tampilan dilayar monitor.

1. Storyboard Halaman Awal Modul : Pembukaan

Nama Scene : Home

Gambar : Background Dojo (Tempat Latihan Judo) Animasi : Pintu Navigasi

Logo Umb Profil Penulis

Sound : Linkin Park – Nobody Listening

Bantuan

Animasi

Sound X

Start Navigasi :

Start : Menuju menu utama

Sound : Mengecilkan / membesarkan volume lagu Bantuan : Menampilkan cara penggunaan aplikasi

Gambar 3.2 Storyboard Halaman Awal

Pada halaman ini menampilkan animasi, teks dan suara. Halaman awal ini bertujuan untuk menampilkan judul dari aplikasi ini dan terdapat tombol untuk masuk ke halaman menu utama dan keluar dari aplikasi.

(7)

2. Storyboard Halaman Menu Modul : Pembukaan

Nama Scene : Home

Gambar : Background Dojo (Tempat Latihan Judo)

Animasi : Tombol

Sound : Linkin Park – Nobody Listening Navigasi :

Tombol 1 : Menuju ke halaman Gokyu 1 Tombol 2 : Menuju ke halaman Gokyu 2 Tombol 3 : Menuju ke halaman Gokyu 3 Tombol 4 : Menuju ke halaman Gokyu 4 Tombol 5 : Menuju ke halaman Gokyu 5 Sound : Untuk mengecilkan atau

membesarkan volume

Sound X Bantuan

Menu

2 3 1

Bantuan : Menampilan cara penggunaan aplikasi

X : Menuju profil penulis / keluar aplikasi

4 5

Gambar 3.3 Storyboard Halaman Menu

(8)

3. Storyboard Gokyu 1

Modul : Pembukaan

Gambar 3.4 Storyboard Halaman Gokyu 1 Nama Scene : Gokyu 1

Gambar : Background Dojo (Tempat Latihan Judo)

Animasi : Tombol Sound : Linkin Park –

Nobody Listening Navigasi :

1 : Simulasi teknik bantingan Ogoshi 2 : Simulasi teknik bantingan Osotogari 3 : Simulasi teknik bantingan Hizaguruma

Bantuan X Back

Gokyu 1 2 3 1

4 5

4 : Simulasi teknik bantingan Ouchigari 5 : Simulasi teknik bantingan Ukigoshi Bantuan : Menampilkan cara penggunaan aplikasi X : Menuju profil penulis / keluar aplikasi Back : Kembali ke halaman Menu

(9)

4. Storyboard Gokyu 2

Gambar 3.5 Storyboard Halaman Gokyu 2 Modul : Pembukaan

Nama Scene : Gokyu 2

Gambar 3.5 Storyboard Halaman Gokyu 2 Gambar : Background Dojo

(Tempat Latihan Judo) Animasi : Tombol

Sound : Linkin Park – Nobody Listening Navigasi :

1 : Simulasi teknik bantingan Kouchigari 2 : Simulasi teknik bantingan Tsurikomi 3 : Simulasi teknik bantingan Taiotoshi 4 : Simulasi teknik bantingan Haraigoshi 5 : Simulasi teknik bantingan Uchimata 6 : Simulasi teknik bantingan Koshiguruma

Bantuan X Back

Gokyu 2

1 2 3

4 5 6

Bantuan : Menampilkan cara penggunaan aplikasi X : Menuju profil penulis / keluar aplikasi Back : Kembali ke halaman Menu

(10)

5. Storyboard Gokyu 3 Modul : Pembukaan

Nama Scene : Gokyu 3

Gambar : Background Dojo (Tempat Latihan Judo)

Animasi : Tombol

Sound : Linkin Park – Nobody Listening Navigasi :

1 : Simulasi teknik bantingan Ashiguruma 2 : Simulasi teknik bantingan Hanegoshi 3 : Simulasi teknik bantingan Haraitsuri 4 : Simulasi teknik bantingan Kosotogake 5 : Simulasi teknik bantingan Sodetsuri Bantuan : Menampilkan cara penggunaan aplikasi X : Menuju profil penulis / keluar aplikasi Back : Kembali ke halaman Menu

Bantuan X Back

Gokyu 3 2 3 1

4 5

Gambar 3.6 Storyboard Halaman Gokyu 3

(11)

6. Storyboard Gokyu 4

Modul : Pembukaan

Nama Scene : Gokyu 4 Back Bantuan X

Gambar : Background Dojo (Tempat Latihan Judo)

Animasi : Tombol

Sound : Linkin Park – Nobody Listening Navigasi :

Gokyu 4 1 : Simulasi teknik bantingan Oguruma

2 : Simulasi teknik bantingan Ukiotoshi 1 2 3 3 : Simulasi teknik bantingan Utsurigoshi

Bantuan : Menampilkan cara penggunaan aplikasi X : Menuju profil penulis / keluar aplikasi Back : Kembali ke halaman Menu

Gambar 3.7 Storyboard Halaman Gokyu 4

(12)

7. Storyboard Gokyu 5

Modul : Pembukaan

Nama Scene : Gokyu 5 Back Bantuan X

Gambar : Background Dojo (Tempat Latihan Judo)

Animasi : Tombol

Sound : Linkin Park – Nobody Listening Navigasi :

Gokyu 5 1 : Simulasi teknik bantingan Ukiwaza

2 : Simulasi teknik bantingan Ushirogoshi 1 2 3 : Simulasi teknik bantingan Yokogake

4 : Simulasi teknik bantingan Yokoguruma 3 4 Bantuan : Menampilkan cara penggunaan aplikasi

X : Menuju profil penulis / keluar aplikasi Back : Kembali ke halaman Menu

Gambar 3.8 Storyboard Halaman Gokyu 5

(13)

8. Storyboard Credit Modul : Credit

Sound X Nama Scene : Credit

Gamnbar : Background Dojo (Tempat Latihan Judo) Animasi : Tulisan Berjalan

Sound : Pas Band - Jengah Navigasi :

X : keluar aplikasi

Sound : Mengecilkan / membesarkan volume lagu

Gambar 3.9 Storyboard Halaman Credit

3.4.3. Perancangan Antar Muka

Pada rancangan aplikasi ini user harus dapat berintraksi karena terdapat tombol-tombol yang akan menjalankan proses-proses dalam aplikasi, sehingga dengan demikian user dapat memahami tentang aplikasi ini. Karena user tersebut dapat terlibat dan sesuai dengan apa yang diinginkan. Adapun rancangan sistemnya pada aplikasi ini adalah :

a. Rancangan Tampilan Halaman Awal

Halaman ini adalah halaman yang akan ditampilkan saat pertama kali aplikasi dijalankan. Pada halaman ini akan ditampilkan beberapa animasi untuk lebih menarik user dalam mengoperasikan aplikasi ini. Animasi berupa pintu kebuka dan keterangan tentang judul aplikasi yang akan digunakan, pembuat, dan jurusan dari pembuat aplikasi. Selain menampilkan beberapa item keterangan, halaman ini juga terdapat dua buah tombol untuk melakukan navigasi ke layar berikutnya, yaitu tombol start untuk menuju ke halaman utama, dan tombol X untuk keluar dari aplikasi.Dan satu tombol bantuan untuk menampilkan cara penggunaan aplikasi. Dan tombol Sound untuk menghentikan lagu. Dan untuk memperindah tampilan, maka dibuat juga beberapa animasi berupa text blur dan text muncul pada aplikasi.

(14)

START GAMBAR

SOUND X Bantuan Penggunaan

Gambar 3.10 : Rancangan Tampilan Halaman Awal a. Rancangan Tampilan Halaman Menu

Halaman kedua ini merupakan halaman utama dalam aplikasi ini. Pada halaman kedua ini, user dapat memilih berbagai pilihan yang tersedia. User dapat melanjutkan ke halaman berikutnya yaitu halaman Gokyu 1, Gokyu 2, Gokyu 3, Gokyu 4, Gokyu 5 dan tombol bantuan untuk menampilkan cara penggunaan aplikasi dan dan tombol sound untuk menghentikan lagu dan bisa juga keluar dari aplikasi tersebut .

SOUND

X

GAMBAR Bantuan

penggunaan

Menu

Gokyu 1 Gokyu 2 Gokyu 3

Gokyu 4 Gokyu 5

Gambar 3.11 : Rancangan Tampilan Halaman Menu

(15)

b. Rancangan Tampilan Halaman Gokyu 1

Pada halaman ini terdapat beberapa pilihan teknik bantingan yang dapat dipilih oleh user. Pada halaman ini juga terdapat tombol back ,bantuan penggunaan, jurus-jurus judo untuk user dapat kembali lagi ke menu utama, menampilkan cara penggunaan aplikasi dan menampilkan simulasi animasi jurus-jurus pada Gokyu 1. Tombol X untuk ke menu credit atau keluar aplikasi.

Gokyu 1

Ogoshi Osotogari Hizaguruma Ouchigari Ukigoshi

Back Bantuan X

ANIMASI

Gambar 3.12 : Rancangan Tampilan Halaman Gokyu 1

(16)

c. Rancangan Tampilan Halaman Gokyu 2

Pada halaman ini terdapat beberapa pilihan teknik bantingan yang dapat dipilih oleh user. Pada halaman ini juga terdapat tombol back ,bantuan penggunaan, jurus-jurus judo untuk user dapat kembali lagi ke menu utama, menampilkan cara penggunaan aplikasi, dan menampilkan simulasi animasi jurus-jurus pada Gokyu 2. Tombol X untuk ke menu credit atau keluar aplikasi.

Gokyu 2

KOUCHIGARI TSURIKOMI TAIOTOSHI HARAIGOSHI UCHIMATA

Back Bantuan Penggunaan X

KOSHIGURUMA

ANIMASI

Gambar 3.13 : Rancangan Tampilan Halaman Gokyu 2

(17)

d. Rancangan Tampilan Halaman Gokyu 3

Pada halaman ini terdapat beberapa pilihan teknik bantingan yang dapat dipilih oleh user. Pada halaman ini juga terdapat tombol back , bantuan penggunaan, jurus-jurus judo untuk user dapat kembali lagi ke menu utama, menampilkan cara penggunaan aplikasi dan menampilkan simulasi animasi jurus-jurus pada Gokyu 3. Tombol X untuk ke menu credit atau keluar aplikasi.

Gokyu 3

ASHIGURUMA HANEGOSHI HARAITSURI KOSOTOGAKE SODETSURI

Back Bantuan Penggunaan X

ANIMASI

Gambar 3.14 : Rancangan Tampilan Halaman Gokyu 3

(18)

e. Rancangan Tampilan Halaman Gokyu 4

Pada halaman ini terdapat beberapa pilihan teknik bantingan yang dapat dipilih oleh user. Pada halaman ini juga terdapat tombol back , bantuan penggunaan, jurus-jurus judo untuk user dapat kembali lagi ke menu utama, menampilkan cara penggunaan aplikasi dan menampilkan simulasi animasi jurus-jurus pada Gokyu 4. Tombol x untuk ke menu credit atau keluar aplikasi.

Gokyu 4

OGURUMA UKIOTOSHI UTSURIGOSHI Back Bantuan Penggunaan X

ANIMASI

Gambar 3.15 : Rancangan Tampilan Halaman Gokyu 4

(19)

f. Rancangan Tampilan Halaman Gokyu 5

Pada halaman ini terdapat beberapa pilihan teknik bantingan yang dapat dipilih oleh user. Pada halaman ini juga terdapat tombol back , bantuan penggunaan, jurus-jurus judo untuk user dapat kembali lagi ke menu utama, menampilkan cara penggunaan aplikasi dan menampilkan simulasi animasi jurus-jurus pada Gokyu 5. Tombol X untuk ke menu credit atau keluar aplikasi.

Gokyu 5

UKIWAZA USHIROGOSHI

YOKOGAKE YOKOGURUMA

Back Bantuan Penggunaan X

ANIMASI

Gambar 3.16 : Rancangan Tampilan Halaman Gokyu 5

(20)

g. Rancangan Tampilan Halaman Credit

Tampilan credit ini menampilkan profil pembuat aplikasi seperti nama, Tujuan Aplikasi, Thanx to, Support, universitas. Dan terdapat tombol suara dan X untuk menghentikan suara dan keluar dari aplikasi. Adapun rancangan tampilanya adalah sebagai berikut:

X SOUND

PROFIL

Gambar 3.17 : Rancangan Tampilan Halaman Credit

3.4.4. Perancangan Use Case Diagram

Diagram ini menunjukkan fungsionalitas suatu sistem atau kelas dan bagaimana sistem berinteraksi dengan dunia luar. Aktor memperlihatkan himpunan pengguna use case, himpunan ‘sesuatu’ yang berinteraksi dengan sistem yang akan digunakan. Kita harus mengidentifikasi aktor dan memahami bagaimana aktor akan menggunakan dan berinteraksi dengan sistem.

Pada aplikasi jurus Judo ini, dapat diidentifikasikan bahwa aktor utamanya adalah user (pengguna). Dari identifikasi aktor tersebut, maka akan didapatkan satu use case diagram dan beberapa skenario yang

(21)

memperlihatkan interaksi-interaksi use case dengan aktor. Use case diagram Rancang Bangun Aplikasi Jurus Judo dapat dilihat pada Gambar berikut :

GOKYU 5

GOKYU 4 Menu Utama

GOKYU 3 GOKYU 2 GOKYU 1

Keluar Profil

Gambar 3.18 : Use Case Diagram

(22)

Tabel 3.2 Use Case Aplikasi

Nama Melihat

Aktor Masyarakat dan pecinta Judo

Deskripsi User dapat memilih menu animasi jurus Judo.

Skenario 1. User memilih menu aplikasi

2. Sistem masuk ke halaman menu aplikasi di mana terdapat delapan tombol, Gokyu 1, Gokyu 2, Gokyu 3, Gokyu 4, Gokyu 5, bantuan penggunaan, sound, keluar

3. Sistem menampilkan animasi Gokyu 1 4. Sistem menampilkan animasi Gokyu 2 5. Sistem menampilkan animasi Gokyu 3 6. Sistem menampilkan animasi Gokyu 4 7. Sistem menampilkan animasi Gokyu 5 8. Sistem menampilkan bantuan penggunaan 9. Sistem menampilkan sound

Kondisi Awal

1. User menerima halaman menu yang di dalamnya terdapat delapan tombol. User memilih tombol-tombol yang ada Kondisi

Akhir

1. User memahami jurus Judo.

3.4.5 Perancangan Activity Diagram

Activity diagram menunjukkan langkah demi langkah untuk melakukan komputasi. Setiap langkah adalah sebuah keadaan dalam melakukan sesuatu. Diagram ini menggambarkan langkah yang mana yang harus dijalankan secara berurutan dan langkah mana yang bisa dijalankan secara bersamaan.

(23)

1. Perancangan Activity Diagram Halaman Menu Utama

Aktifitas dimulai ketika pengguna memilih masuk, kemudian sistem menampilkan halaman menu utama, aktifitas selanjutnya adalah memilih halaman berikutnya terdiri dari, Gokyu 1, Gokyu 2, Gokyu 3, Gokyu 4, Gokyu 5 dan Keluar. Kemudian sistem akan menampilkan halaman yang dipilih.

PENGGUNA SISTEM

Menampilkan menu yang dipilih Membuka Aplikasi

Memilih Menu yang diinginkan

Menampilkan tombol pada menu utama :

Gokyu 1, Gokyu 2, Gokyu 3, Gokyu 4, Gokyu 5, keluar, sound, bantuan penggunaan

Gambar 3.19 : Activity Diagram Halaman Menu Utama

(24)

2. Perancangan Activity Diagram Halaman Gokyu 1

Aktifitas dimulai ketika pengguna memilih tombol Gokyu 1 kemudian sistem menampilkan halaman Gokyu 1, aktifitas selanjutnya adalah memilih delapan tombol yang ada di halaman Gokyu 1. Kemudian sistem akan menampilkan animasi Gokyu 1 tersebut.

Pengguna Sistem

Memilih menu Gokyu 1 pada menu utama

Menampilkan lima tombol animasi Gokyu 1, dan tiga tombol untuk kembali ke menu utama, bantuan

penggunaan, dan keluar yang ada di halaman Gokyu 1 Memilih tombol

yang diinginkan

Menampilkan animasi yang dipilih

Gambar 3.20 Activity Diagram Halaman Gokyu 1

(25)

3. Perancangan Activity Diagram Halaman Gokyu 2

Aktifitas dimulai ketika pengguna memilih tombol Gokyu 2 kemudian sistem menampilkan halaman Gokyu 2, aktifitas selanjutnya adalah memilih Sembilan tombol yang ada di halaman Gokyu 2. Kemudian sistem akan menampilkan animasi Gokyu 2 tersebut.

Pengguna Sistem

Memilih menu Gokyu 2 pada menu utama

Menampilkan enam tombol animasi Gokyu 2, dan tiga tombol untuk kembali ke menu utama, bantuan penggunaan, dan keluar Memilih tombol

yang diinginkan

Menampilkan animasi yang dipilih

Gambar 3.21 Activity Diagram Halaman Gokyu 2

(26)

4. Perancangan Activity Diagram Halaman Gokyu 3

Aktifitas dimulai ketika pengguna memilih tombol Gokyu 3 kemudian sistem menampilkan halaman Gokyu 3, aktifitas selanjutnya adalah memilih delapan tombol yang ada di halaman Gokyu 3. Kemudian sistem akan menampilkan animasi Gokyu 2 tersebut.

Pengguna Sistem

Memilih menu Gokyu 3 pada menu utama

Menampilkan lima tombol animasi Gokyu 3, dan tiga tombol untuk kembali ke menu utama, bantuan penggunaan, dan keluar Memilih tombol

yang diinginkan

Menampilkan animasi yang dipilih

Gambar 3.22 Activity Diagram Halaman Gokyu 3

(27)

5. Perancangan Activity Diagram Halaman Gokyu 4

Aktifitas dimulai ketika pengguna memilih tombol Gokyu 4 kemudian sistem menampilkan halaman Gokyu 4, aktifitas selanjutnya adalah memilih enam tombol yang ada di halaman Gokyu 4. Kemudian sistem akan menampilkan animasi Gokyu 4 tersebut.

Pengguna Sistem

Memilih menu Gokyu 4 pada menu utama

Menampilkan tiga tombol animasi Gokyu 4, dan tiga tombol untuk kembali ke menu utama, bantuan penggunaan, dan keluar Memilih tombol

yang diinginkan

Menampilkan animasi yang dipilih

Gambar 3.23 Activity Diagram Halaman Gokyu 4

6. Perancangan Activity Diagram untuk halaman Gokyu 5

Aktifitas dimulai ketika pengguna memilih tombol Gokyu 5 kemudian sistem menampilkan halaman Gokyu 5, aktifitas selanjutnya adalah

(28)

memilih tujuh tombol yang ada di halaman Gokyu 5. Kemudian sistem akan menampilkan animasi Gokyu 5 tersebut.

Pengguna Sistem

Memilih menu Gokyu 5 pada menu utama

Menampilkan empat tombol animasi Gokyu 5, dan tiga tombol untuk kembali ke menu utama, bantuan penggunaan, dan keluar Memilih tombol

yang diinginkan

Menampilkan animasi yang dipilih

Gambar 3.24 Activity Diagram Halaman Gokyu 5

3.4.6. Perancangan Sequence Diagram

Sebuah sequence diagram secara khusus menjabarkan aktifitas sebuah skenario tunggal. Diagram tersebuat menunjukkan sejumlah objek contoh dan pesan- pesan melalui objek-objek di dalam use case diagram (Fowler, 2005:81). Dari bentuk use case yang telah di gambarkan sebelumnya, dapat dibuat sequence diagram.

(29)

1. Perancangan untuk halaman Jurus Gokyu 1

Sequence diagram untuk halaman Gokyu 1 menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk halaman menu utama, selanjutnya pengguna memilih menu Gokyu 1, dan pengguna akan di bawa oleh sistem ke halaman Gokyu 1. Di halaman Gokyu 1 pengguna dapat memilih 5 pilihan Gokyu 1, dan bisa juga kembali ke halaman sebelumnya, yaitu halaman menu utama. Pengguna juga dapat menampilkan bantuan penggunaan dan keluar dari aplikasi. Pengguna memilih salah satu pilihan Gokyu 1, dan sistem akan memberikan tampilan animasi Gokyu 1 tersebut kepada pengguna.

halaman menu utama halaman Gokyu 1 1. Menuju menu utama

Pengguna 2. Menuju halaman Gokyu 1 3. Tampilan halaman Gokyu 1

4. Memilih animasi Gokyu 1

5. Tampilan animasi Gokyu 1

Gambar 3.25 Sequence Diagram Halaman Gokyu 1

2. Perancangan untuk halaman Jurus Gokyu 2

Sequence diagram untuk halaman Gokyu 2 menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk halaman menu utama, selanjutnya pengguna memilih menu Gokyu 2, dan pengguna akan di bawa oleh sistem ke halaman Gokyu 2. Di halaman

(30)

Gokyu 2 pengguna dapat memilih 6 pilihan Gokyu 2, dan bisa juga kembali ke halaman sebelumnya, yaitu halaman menu utama. Pengguna juga dapat menampilkan bantuan penggunaan dan keluar dari aplikasi.

Pengguna memilih salah satu pilihan Gokyu 2, dan sistem akan memberikan tampilan animasi Gokyu 2 tersebut kepada pengguna.

halaman menu utama halaman Gokyu 2 1. Menuju menu utama

Pengguna 2. Menuju halaman Gokyu 2 3. Tampilan halaman Gokyu 2

4. Memilih animasi Gokyu 2

5. Tampilan animasi Gokyu 2

Gambar 3.26 Sequence Diagram Halaman Gokyu 2

3. Perancangan untuk halaman Jurus Gokyu 3

Sequence diagram untuk halaman Gokyu 3 menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk halaman menu utama, selanjutnya pengguna memilih menu Gokyu 3, dan pengguna akan di bawa

(31)

oleh sistem ke halaman Gokyu 3. Di halaman Gokyu 3 pengguna dapat memilih 5 pilihan Gokyu 3, dan bisa juga kembali ke halaman sebelumnya, yaitu halaman menu utama. Pengguna juga dapat menampilkan bantuan penggunaan dan keluar dari aplikasi. Pengguna memilih salah satu pilihan Gokyu 3, dan sistem akan memberikan tampilan animasi Gokyu 3 tersebut kepada pengguna.

halaman menu utama halaman Gokyu 3 1. Menuju menu utama

Pengguna 2. Menuju halaman Gokyu 3 3. Tampilan halaman Gokyu 3

4. Memilih animasi Gokyu 3

5. Tampilan animasi Gokyu 3

Gambar 3.27 Sequence Diagram Halaman Gokyu 3

4. Perancangan untuk halaman Jurus Gokyu 4

Sequence diagram untuk halaman Gokyu 4 menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk halaman menu utama, selanjutnya pengguna memilih menu Gokyu 4, dan pengguna akan di bawa oleh sistem ke halaman Gokyu 4. Di halaman Gokyu 4 pengguna dapat memilih 3 pilihan Gokyu 4, dan bisa juga kembali ke halaman sebelumnya, yaitu halaman menu utama. Pengguna juga dapat menampilkan bantuan penggunaan dan keluar dari

(32)

aplikasi. Pengguna memilih salah satu pilihan Gokyu 4, dan sistem akan memberikan tampilan animasi Gokyu 4 tersebut kepada pengguna.

halaman menu utama halaman Gokyu 4 1. Menuju menu utama

Pengguna 2. Menuju halaman Gokyu 4 3. Tampilan halaman Gokyu 4

4. Memilih animasi Gokyu 4

5. Tampilan animasi Gokyu 4

Gambar 3.28 Sequence Diagram Halaman Gokyu 4

5. Perancangan untuk halaman Jurus Gokyu 5

Sequence diagram untuk halaman Gokyu 5 menggambarkan skenario dan langkah-langkah yang dilakukan pengguna. Pertama pengguna masuk halaman menu utama, selanjutnya pengguna memilih menu Gokyu 5, dan pengguna akan di bawa oleh sistem ke halaman Gokyu 5. Di halaman Gokyu 5 pengguna dapat memilih 4 pilihan Gokyu 5, dan bisa juga kembali ke halaman sebelumnya, yaitu halaman menu utama. Pengguna juga dapat menampilkan bantuan penggunaan dan keluar dari

(33)

aplikasi. Pengguna memilih salah satu pilihan Gokyu 5, dan sistem akan memberikan tampilan animasi Gokyu 5 tersebut kepada pengguna.

halaman menu utama halaman Gokyu 5 1. Menuju menu utama

Pengguna 2. Menuju halaman Gokyu 5 3. Tampilan halaman Gokyu 5

4. Memilih animasi Gokyu 5

5. Tampilan animasi Gokyu 5

Gambar 3.29 Sequence Diagram Halaman Gokyu 5

(34)

Gambar

Tabel 3.1 Deskripsi Konsep Aplikasi
Gambar 3.1 Diagram Peta Navigasi  Gokyu 2 Gokyu 5INTRO  OUCHIGARI UKIGOSHI  KOUCHIGARITSURIKOMI TAIOTOSHI  HARAIGOSHI UCHIMATA KOSHIGURUMAGokyu 3 ASHIGURUMAHANEGOSHIHARAITSURI KOSOTOGAKESODETSURI Gokyu 4 OGURUMA UKIOTOSHI UTSURIGOSHI UKIWAZA USHIROGOSHIYOK
Gambar  :  Background Dojo    (Tempat Latihan Judo)  Animasi  :  Pintu Navigasi
Gambar 3.3 Storyboard Halaman Menu
+7

Referensi

Dokumen terkait

Sistem akan melakukan pengecekkan data, apakah data yang di masukkan valid datanya, jika ya maka sistem akan menampilkan halaman user tetapi jika tidak maka sistem akan

• User memilih Entry Data Item Makanan dan sistem akan menampilkan form Entry Item Makanan • Jika User ingin menambah data baru maka menekan. tombol add lalu diisi kolom

Tombol bergambar papan bertuliskan "Pengertian Tajwid" untuk masuk ke halaman menu pengertian tajwid dan ketika tombol ditekan akan keluar suara serta ada

Pada diagram aktifitas memilih words list langkah awal yang dilakukan sistem yaitu menampilkan words list kemudian user memilih kata dari tombol yang

Deskripsi Customer buka halaman web pilih menu kategori pembantu setelah itu sistem menampilkan menu kategori pembantu dan customer memilih klasifikasi pekerja,

Pada saat memasuki halaman menu pengenalan jenis reptil, tata cara pemeliharaan, alamat dokter hewan, dan tentang aplikasi maka akan menampilkan layout halaman tersebut

User akan membuka menu laporan pelayanan selanjutnya user diminta memasukkan id yang ingin dilihat kemudian sistem akan menampilkan informasi atau data yang

Jika user menekan tombol menu utama maka sistem akan menutup jendela AR Camera lalu kembali menampilkan menu utama aplikasi 4.4.3.6 Sequence Diagram Menjawab Soal -soal Sequence