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 Keluar Gambar 3.1 Diagram Struktur Navigasi 26
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: Storyboard Menu Utama Storyboard Halaman Animasi Storyboard Halaman Simulasi Storyboard Halaman Keluar A. Storyboard Pilihan Menu Utama Pada halaman ini pengguna dapat memilih menu yang ada dengan memilih tombol yang terdapat pada layar. 3 1 4 2 5 Gambar 3.2 Storyboard Pilihan Menu Utama
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 : Keluar aplikasi B. 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
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: 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. D. Storyboard Scene Sapi dan Babi Pada scene ini pengguna akan diberikan penjelasan singkat mengenai perbedaan daging sapi dengan daging babi.
30 12 13 Gambar 3.5 storyboard halaman sapi dan babi Keterangan: 12. Objek simulasi : objek bergerak dari tekstur daging. 13. Penjelasan : Penjelasan singkat tentang daging diatas. E. Storyboard Scene Sapi dan Kuda Pada scene ini pengguna akan diberikan penjelasan singkat mengenai perbedaan daging sapi dengan daging kuda. 14 15 Keterangan: Gambar 3.6 storyboard halaman sapi dengan kuda
31 14. Objek simulasi : objek bergerak dari tekstur daging. 15. Penjelasan : Penjelasan singkat tentang daging diatas. F. 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.
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.
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.
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
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.
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
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.
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.
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.
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
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