Peracangan Storyboard Perancangan Design

72

4.3 Perancangan Design

Pada tahap ini penulis melakukan perancangan aplikasi berupa perancangan storyboard, perancangan flowchart, desain struktur navigasi, perancangan STD State Transition Diagram dan perancangan antarmuka pemakai User Interface.

4.3.1 Peracangan Storyboard

Storyboard merupakan serangkaian sketsa gambaran kartun dibuat persegi panjang yang menggambarkan suatu urutan alur cerita elemen-elemen yang diusulkan untuk aplikasi multimedia M. Suyanto, 2003 : 375. Secara umum, rancangan storyboard yang dibuat oleh penulis terdiri dari 8 buah scene, yang terdiri dari : a. Scene 1 Intro Menampilkan layar intro Storyboard Layar Menu Intro Modul : Layar Intro Nama File: Intro Frame No : 1 Gambar : Video : Audio :Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Enter : Skip Intro Video Animasi Enter Gambar 4.2 Storyboard Layar Intro 73 a. Scene 2 Home Menampilkan animasi bunga CV. Bonsai Interior b. Scene 3 Profile Menampilkan visi dan misi serta struktur organisasi CV. Bonsai Interior. Storyboard Layar Menu Profile On Off Music Animasi Logo Tombol Menu Teks Profil, Visi dan Misi serta Struktur Organisasi CV. Bonsay Interior Modul : Layar Menu Utama Nama File: Profil Frame No : 1 Gambar : Buatan Sendiri Video : - Audio :Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Storyboard Layar Menu Home Modul : Layar Menu Utama Nama File: Halaman Utama Frame No : 1 Gambar : Buatan Sendiri Video : - Audio : Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Exit Max Min Layar Exit Animasi Logo Animasi Gambar Produk CV. Bonsay Interior Max . Min Layar On Off Music Tombol Menu Gambar 4.3 Storyboard Layar Home Gambar 4.4 Storyboard Layar Profile 74 a. Scene 4 Produk Bunga Kering Menampilkan gambar produk bunga kering, harga, warna dan keterangan dari produk. b. Scene 5 Gallery Menampilkan gambar-gambar tentang jenis bunga, showroom, tempat produksi dan lokasi outlet. Storyboard Layar Menu Produk Bunga Kering Gambar dan Teks Keterangan Produk Bunga Kering Storyboard Layar Menu Gallery Image Jenis bunga, Showroom, Bahan Baku, Tempat Produksi dan Lokasi Outlet Tombol Menu Animasi Logo On Off Music Exit On Off Music Animasi Logo Tombol Menu Exit Max Min Layar Tombol Sub Menu Produk Bunga Max Min Layar Modul : Layar Menu Utama Nama File: Produk Frame No : 1 Gambar : Buatan Sendiri Video : - Audio :Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Next : Ke halaman menu Produk bunga berikutnya Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Gambar 4.5 Storyboard Layar Produk Bunga Kering Tombol Sub Menu Gallery Modul : Layar Menu Utama Nama File: Gallery Frame No : 1 Gambar : Buatan Sendiri Video : - Audio : Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Next : Ke halaman menu image berikutnya Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Gambar 4.6 Storyboard Layar Gallery 75 a. Scene 6 Video Menampilkan video produk bunga kering tiga dimensi serta teknik kamera. b. Scene 7 Contact Menampilkan halaman informasi pemesanan yang dapat dihubungi oleh calon konsumen Storyboard Layar Menu Contact Informasi mengenai alamat dan nomor telepon yang dapat dihubungi Storyboard Layar Menu Video Informasi mengenai video dan teks Produk Bunga Kering Exit Exit On Off Music On Off Music Animasi Logo Tombol Menu Animasi Logo Tombol Menu Max Min Layar Tombol Sub Menu Video Bunga Modul : Layar Menu Utama Nama File: Video Frame No : 1 Gambar : Buatan Sendiri Video : Buatan Sendiri Audio : Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Next : Ke halaman menu video berikutnya Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Gambar 4.7 Storyboard Layar Video Max Min Layar Modul : Layar Menu Utama Nama File: Contact Frame No : 1 Gambar : Buatan Sendiri Video : - Audio : Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol Gambar 4.8 Storyboard Layar Contact Image Direktur CV. Bonsai Interior 76 a. Scene 8 Author Menampilkan informasi penulis Gambar 4.9 Storyboard Layar Author Storyboard Layar Menu Author Informasi mengenai penulis Exit On Off Music Animasi Logo Tombol Menu Max Min Layar Image penulis Modul : Layar Menu Utama Nama File: Author Frame No : 1 Gambar : Buatan Sendiri Video : - Audio : Scottwills_streets.mp3 Super music_4.mp3 Ada on off volume Navigasi Home : Tombol Profile : Tombol Produk : Tombol Gallery : Tombol Video : Tombol Contact : Tombol Author : Tombol 77 M u la i T a m p ila n L a y a r In tro P ilih M e n u P ilih M e n u H o m e P ilih M e n u P ro file P ilih M e n u C o n ta c t P ilih M e n u V id e o P ilih M e n u P ro d u k B u n g a K e rin g P ilih M e n u G a lle ry P ilih M e n u A u th o r S e le s a i T a m p ila n L a y a r H o m e T a m p ila n L a y a r P ro file T a m p ila n L a y a r C o n ta c t T a m p ila n L a y a r A u th o r T id a k T id a k T id a k T id a k T id a k T id a k T id a k C B Y a Y a Y a Y a Y a Y a Y a T a m p ila n L a y a r H a la m a n U ta m a A

4.3.2 Perancangan Flowchart