BAB III ANALISA DAN PERANCANGAN
3.1
Analisis Sistem Animasi ini merupakan simulasi singkat mengenai perbedaan daging
dengan struktur 3 dimensi agar mudah dipahami, dimana pengenalan menggunakan animasi ini diharapkan dapat memberikan kesan menarik dan interaktif dalam penyampaian suatu informasi. 3.2
Perancangan Pada tahap ini penulis melakukan perancangan aplikasi berupa
perancangan struktur navigasi, Storyboard, Use case diagram, Activity Diagram, dan perancangan antar muka (user interface). 3.2.1 Perancangan struktur navigasi Perancangan struktur navigasi ini sangant penting dalam pembuatan suatu aplikasi. Struktur navigasi ini merupakan arah dari perjalanan aplikasi yang akan dibuat untuk dapat membantu penulis sebagai acuan pembuatan aplikasi dari awal hingga akhir. Berikut rancangan struktur navigasi:
Menu Utama
Animasi
Simulasi
Gambar 3.1 Diagram Struktur Navigasi
26
http://digilib.mercubuana.ac.id/
Keluar
27
3.2.2 Perancangan Storyboard Storyboard merupakan deskripsi masing-masing tampilan suatu kejadian movie yang akan dimainkan dengan pencantuman semua objek atau elemen multimedia serta komponen-komponen yang akan dibuat. Storyboard terdiri dari beberapa kolom kejadian, satu kolom dalam storyboard mewakili satu tampilan dilayar monitor. Pada storyboard ini selain digambarkan perkiraan dari tampilan yang digunakan / diinginkan, juga dituliskan penjelasan serta spesifikasi dari setiap layarnya. Dalam membuat storyboard selain membuat penjelasan tentang spesifikasi layer yang digunakan juga harus tetap mengikuti rancangan dari peta navigasi, dengan demikian setiap tahapan desain akan menjadi terarah. Pada perancangan storyboard ini dibuat 4 tampilan storyboard, yaitu:
A.
Storyboard Menu Utama
Storyboard Halaman Animasi
Storyboard Halaman Simulasi
Storyboard Halaman Keluar
Storyboard Pilihan Menu Utama Pada halaman ini pengguna dapat memilih menu yang ada dengan
memilih tombol yang terdapat pada layar.
1 3 4
2
5
Gambar 3.2 Storyboard Pilihan Menu Utama
http://digilib.mercubuana.ac.id/
28
Keterangan: 1. Judul
: Simulasi perbedaan daging oplosan
2. Gambar
: background
3. Tombol Animasi
: Pada tombol menu ini pengguna akan masuk ke scene animasi
4. Tombol Simulasi
: Pada tombol menu ini pengguna akan masuk ke scene simulasi
5. Tombol Keluar
B.
: Keluar aplikasi
Storyboard Scene Animasi Pada halaman ini pengguna akan diberikan penjelasan singkat mengenai
daging apa saja yang akan dibahas kemudian pengguna dapat kembali ke menu utama dengan menekan tombol yang ada pada layar.
6
7
Gambar 3.3 Storyboard Halaman Animasi
http://digilib.mercubuana.ac.id/
29
Keterangan: 6. Objek
: Objek animasi karakter.
7. Kembali
: Dengan menekan tombol ini pengguna
akan
kembali
ke menu utama C. Storyboard Scene Simulasi Pada halaman simulasi ini pengguna akan diberikan beberapa pilihan tentang perbedaan daging dengan memilih tombol yang ada. Terdapat 4 tombol pada halaman ini dimana 3 diantaranya adalah pilihan tentang perbedaan daging.
8
9
10
11
Gambar 3.4 Storyboard Halaman Simulasi Keterangan:
D.
8. Sapi vs Babi
: Pengguna akan masuk ke scene Sapi vs Babi.
9. Sapi vs Kuda
: Pengguna akan masuk ke scene Sapi vs Kuda.
10.Ayam vs Tikus
: Pengguna akan masuk ke scene Ayam vs Tikus.
11. kembali
: Pengguna akan kembali ke halaman utama.
Storyboard Scene Sapi dan Babi Pada scene ini pengguna akan diberikan penjelasan singkat mengenai
perbedaan daging sapi dengan daging babi.
http://digilib.mercubuana.ac.id/
30
12
13
Gambar 3.5 storyboard halaman sapi dan babi Keterangan:
E.
12. Objek simulasi
: objek bergerak dari tekstur daging.
13. Penjelasan
: Penjelasan singkat tentang daging diatas.
Storyboard Scene Sapi dan Kuda Pada scene ini pengguna akan diberikan penjelasan singkat mengenai
perbedaan daging sapi dengan daging kuda.
14
15
Gambar 3.6 storyboard halaman sapi dengan kuda Keterangan:
http://digilib.mercubuana.ac.id/
31
F.
14. Objek simulasi
: objek bergerak dari tekstur daging.
15. Penjelasan
: Penjelasan singkat tentang daging diatas.
Storyboard Scene Ayam dan Tikus Pada scene ini pengguna akan diberikan penjelasan singkat mengenai
perbedaan daging ayam dengan daging tikus.
16
17
Gambar 3.7 storyboard halaman ayam dan tikus Keterangan: 16. Objek simulasi
: objek bergerak dari tekstur daging.
17. Penjelasan
: Penjelasan singkat tentang daging diatas.
3.2.3 Perancangan Animasi Perancangan animasi disesuaikan dengan kebutuhan pengguna yang akan melihat informasi yang mereka butuhkan. Karena aplikasi yang dibuat bersifat interaktif langsung kepada pengguna (user), maka perancangan animasi dibuat pada blender game engine.
http://digilib.mercubuana.ac.id/
32
1.
Modeling Modeling adalah proses pembentukan pola sebagai dasar dari objek yang
akan dibuat.
Sebelum memulai modeling ada baiknya terlebih dahulu
mepersiapkan sketsa awal dari objek yang akan dibuat. Setelah pembuatan sketsa gambar pada storyboard, selanjutnya sketsa gambar tersebut akan dipergunakan sebagai acuan dalam pembuatan model animasi.
Gambar 3.8 Modeling 2.
Rigging Setelah model karakter selesai dibuat proses selanjutnya adalah rigging,
proses ini untuk menggerakan model yang telah dibuat dengan memberikan armature atau tulang pada bagian yang ingin digerakan.
http://digilib.mercubuana.ac.id/
33
Gambar 3.9. Rigging
3.
Texturing Selanjutnya, pemberian tekstur pada objek yang telah dibuat. Metode
yang digunakan dalam pemberian tekstur adalah real texture, dimana pemberian tekstur menyerupai seperti keadaan dan bentuk seperti aslinya. Tujuannya adalah untuk mendapatkan tingkat kemiripan dari segi warna dan pencahayaan.
http://digilib.mercubuana.ac.id/
34
Gambar 3.10 Texturing
4.
Compositing Pengaturan pencahayaan tekstur pada objek dilakukan pada tahap
compositing agar terlihat seperti animasi 3 dimensi.
Gambar 3.11 Compositing
http://digilib.mercubuana.ac.id/
35
5.
Text Editor Pengkodean script python pada area Screen layout scripting sebagai
interaksi yang digunakan pada input hardware seperti mouse dan keyboard.
Gambar 3.12 Text Editor
6.
Timeline Timeline editor adalah salah satu cara pembuatan animasi, metode ini
merupakan cara dasar dalam menganimasikan objek pada blender 3D. dimana setiap gerakan objek pada setiap frame akan dikunci kemudian menjalankan frame sehingga menjadi animasi gerak objek.
http://digilib.mercubuana.ac.id/
36
Gambar 3.13 Timeline editor 7. Rendering Rendering hasil proses akhir dari keseluruhan proses pemodelan ataupun animasi komputer. Dalam rendering semua data yang sudah dimasukan dalam proses pemodelan, animasi, pemberian texture, dan pencahayaan menjadi bentuk sebuah output video.
Gambar 3.14 Rendering
http://digilib.mercubuana.ac.id/
37
3.2.4 Use case diagram Use case diagram adalah diagram yang menunjukkan fungsionalitas suatu sistem atau kelas dan bagaimana sistem tersebut berinteraksi dengan dunia luar dan menjelaskan sistem secara fungsionalitas yang terlihat pada user. Use case diagram menggambarkan fungsionalitas yang diharapkan dari sebuah sistem yang ditekankan pada “apa” yang diperbuat system, dan bukan “bagaimana”. Use case diagram mendeskripsikan interaksi tipikal antara pengguna sistem dengan sistem itu sendiri, dengan
member sebuah narasi tentang
bagaimana sistem tersebut digunakan (Fowler, 2005:141). Diagram ini menunjukkan fungsionalitas suatu sistem dan bagaimana sistem berinteraksi dengan dunia luar.
Gambar 3.15. Use Case Diagram
Aktor utama dalam aplikasi ini adalah user. Dari identifikasi aktor tersebut didapatkan suatu use case diagram yang menampilkan interaksi antara user dengan system.
http://digilib.mercubuana.ac.id/
38
Deskripsi use case diagram dari gambar diatas: 1) Animasi
Nama
: Animasi
Aktor
: User
Deskripsi : User dapat animasi yang dibuat pada layar.
Skenario : Ketika user menekan tombol Animasi, maka system akan menampilkan halaman animasi.
2) Simulasi
Nama
: Simulasi
Aktor
: User
Deskripsi : User dapat memilih menjalankan aplikasi dengan menekan tombol Simulasi pada layar.
Skenario : Ketika user menekan tombol Simulasi, maka system akan menampilkan halaman simulasi.
3) Keluar
Nama
: Keluar
Aktor
: User
Deskripsi : User dapat memilih keluar aplikasi dengan menekan tombol keluar.
Skenario : Ketika user menekan tombol keluar, maka sistem akan menutup aplikasi.
http://digilib.mercubuana.ac.id/
39
3.2.5 Activity Diagram Activity diagram menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, ketetapan yang mungkin terjadi, dan bagaimana aktivitas tersebut berakhir. Activity diagram juga dapat menggambarkan proses parallel yang mungkin terjadi pada beberapa eksekusi. 1.
Activity diagram pilihan menu Aktivitas ini dimulai ketika pengguna menjalankan aplikasi dan sistem
menampilkan halaman pilihan menu, selanjutnya user akan diminta untuk memilih salah satu tombol untuk masuk ke halaman yang di pilih.
Membuka aplikasi
Menamplikan halaman menu
Memilih tombol animasi
Menampilkan halaman animasi
Memilih tombol simulasi
Menampilkan halaman animasi
Memilih tombol keluar
Keluar dari aplikasi
Gambar 3.16 Activity diagram pilihan menu 2.
Activity diagram halaman masuk Animasi Pada menu halaman Animasi, user dapat memainkan animasi objek yang
telah dibuat. Animasi yang ditampilkan seperti slideshow objek berbagai macam daging yang telah diberi tekstur.
http://digilib.mercubuana.ac.id/
40
User
Sistem
Memilih menu animasi
Menampilkan halaman animasi
Memilih tombol keluar
Kembali ke halaman menu
Gambar 3.17 Activity diagram halaman animasi
3.
Activity diagram halaman Simulasi Pada halaman simulasi, user dapat berinteraksi dengan animasi yang telah
dibuat dengan menggunakan keyboard untuk merubah slideshow objek daging. User dapat kembali ke menu pilihan utama dengan menekan tombol B pada keyboard.
Gambar 3.18 Activity diagram halaman simulasi
http://digilib.mercubuana.ac.id/
41
3.2.6 Desain antar muka Pada bagian utama desain antar muka akan menampilkan beberapa menu pilihan yang akan ditampilkan pada animasi. Tampilan antar muka pilihan menu Utama Pada tampilan utama pilihan menu ada beberapa tombol pilihan yang dapat dipilih oleh user dengan menekan salah satu tombol menu.
Gambar 3.19 Tampilan antar muka pilihan menu utama
http://digilib.mercubuana.ac.id/