Konsep Concept Perancangan Design

BAB IV PEMBAHASAN

Pada bab ini, peneliti menguraikan secara lebih lengkap tentang tahap- tahap yang dilakukan dalam pembuatan aplikasi desain virtual set pada news studio berdasarkan metode pengembangan multimedia.

4.1 Konsep Concept

Aplikasi dalam penelitian ini berbentuk CD interaktif yang digunakan untuk membantu memperkenalkan sistem virtual set yang digunakan di sebuah stasiun televisi dan dirancang sesuai dengan karakteristik pengguna yang berasal dari masyarakat umum termasuk mahasiswa yang ingin mengetahui lebih dalam tentang sistem virtual set. Dasar perancangan pada tahap konsep adalah sebagai berikut: Judul Aplikasi : Desain Virtual Set Menggunakan Metode Kamera Sintetis pada News Studio Pengguna : Karyawan baru yang akan bekerja di stasiun televisi bagian studio virtual maupun karyawan lama, mahasiswa, pelajar, dosen dan sebagainya yang tertarik akan virtual set Macam Aplikasi : Studio virtual set interaktif Tujuan Aplikasi : Sebagai gambaran informasi tentang virtual set 70 Spesifikasi Umum Tabel 4.1 Spesifikasi Umum Aplikasi Gambar Menggunakan file dengan format jpeg, gif, png, psd dan lain sebagainya yang peneliti dapat dari internet maupun hasil kreasi sendiri menggunakan Adobe Photoshop. Animasi Animasi intro, teks maupun gambar dibuat sendiri menggunakan 3Ds Max, Macromedia Flash, Adobe Director dan Ulead Video Studio 10. Suara Menggunakan musik dengan format mp3 dan wav dengan tujuan menambah kesan hidup pada aplikasi. Interaktif Tersedia menu dengan tombol-tombol navigasi yang digunakan untuk berpindah dari satu halaman ke halaman yang lain. Video Video pembuka berformat .avi dibuat menggunakan Ulead Video Studio 10, video lain berformat .mpeg.

4.2 Perancangan Design

Tahap perancangan aplikasi ini meliputi perancangan storyboard, perancangan bagan alir flowchart view, desain arsitektur navigasi, perancangan diagram transisi state transition diagram dan perancangan antar muka user interface.

A. Perancangan Storyboard

Secara umum, rancangan storyboard dalam aplikasi ini terdiri beberapa halaman utama, yaitu: 1. Halaman Intro Storyboard Modul : 1 Halaman : Intro Nama File : intro.dir Animasi : intro.mpg Audio : intro.mp3 Navigasi : Tulisan “klik pada layar untuk menuju menu” untuk langsung menuju ke halaman menu utama Catatan : Halaman intro berupa halaman pembuka yang berisi video animasi sebagai pengantar menuju menu utama. Dengan menekan klik kiri pada layar, intro akan berhenti dan langsung menuju menu utama, sedangkan jika layer tidak di klik, maka intro akan terus berjalan hingga akhir video. klik pada layar untuk menuju menu utama 2. Halaman Menu Utama 2. Halaman VS Storyboard Modul : 2 Halaman : Menu Utama Nama File : menu.dir Gambar : menu.jpg Audio : This Way.mp3 Navigasi 1 Apa itu virtual set : untuk masuk ke halaman Penjelasan 2 Cara kerja virtual set : untuk masuk ke halaman Cara Kerja 3 Virtual set : untuk masuk ke halaman Virtual Set 4 Info : untuk masuk ke halaman Info 5 Exit : untuk keluar dari aplikasi Catatan : Pada halaman menu, terdapat 5 tombol navigasi untuk menuju ke menu berikutnya. 4 1 2 3 5 3. Halaman Penjelasan 3. Halaman ILUSTRASI Storyboard Modul : 3 Halaman : Penjelasan Nama File : penjelasan.dir Gambar : penjelasan.jpg Animasi : ind.swf, eng.swf Video : chroma.avi, virtual.avi Audio : Canon.mp3 Navigasi Indonesia : untuk menampilkan penjelasan tentang virtual set menggunakan bahasa Indonesia English : untuk menampilkan penjelasan tentang virtual set menggunakan bahasa Ingris Menu : untuk kembali ke menu utama Catatan : Halaman Penjelasan merupakan halaman yang terdiri dari dua menu untuk menjelaskan pengertian umum Virtual Set serta penjelasannya dengan menggunakan dua bahasa. Pada halaman ini terdapat tombol “Kembali” untuk kembali ke menu utama. Ind English menu 4. Halaman Cara Kerja 4. Halaman UTAMA Storyboard Modul : 4 Halaman : Cara Kerja Nama File : carakerja.dir Gambar : cara.jpg Audio : Days.mp3 Navigasi Alat yang digunakan : untuk menampilkan peralatan utama apa saja yang diperlukan untuk menghasilkan siaran dengan latar belakang virtual set. Alur Kerja : untuk menampilkan ilustrasi proses pengerjaan hingga selesai. Menu : untuk kembali ke menu utama Catatan : Pada halaman cara kerja, terdapat penjelasan lebih lengkap lagi tentang virtual set berupa peralatan yang digunakan dan ilustrasi alur kerja yang dilalui. Alat yang digunakan Alur Kerja menu 5. Halaman Virtual Set 5. Halaman VIRTUAL STUDIO Storyboard Modul : 5 Halaman : Virtual Set Nama File : virtualset.dir Video : wartasiang.mpeg, ddb.mpeg, warnus.mpeg Gambar : vsbackground.jpg Audio : Wake Up.mp3 Navigasi Camview : untuk melihat dua tampilan video dengan menggunakan cam1 medium shot dan cam2 long shot Virtual studio : untuk melihat desain studio dengan tiga dimensi. Video : untuk melihat hasil akhir setelah penggabungan video dan latar belakang. Menu : untuk kembali ke menu utama Catatan : Pada halaman video ini merupakan gabungan antara desain virtual set yang telah dibuat dengan video nyata. Virtual Studio Video Camview menu 6. Halaman Info 6. Halaman VIDEO Storyboard Modul : 6 Halaman : Info Nama File : info.dir Gambar : clapper.png Animasi : index.swf Audio : Snow Dance.mp3 Navigasi Info Aplikasi : untuk menampilkan penjelasan tentang aplikasi Info Pembuat : untuk menampilkan profil pembuat Menu : untuk kembali ke menu utama Catatan : Halaman info ini merupakan halaman tambahan sebagai informasi tentang data peneliti dan aplikasi yang dibuat peneliti. Tombol “Menu” yang tedapat disini digunakan untuk kembali ke menu utama. menu Info Aplikasi Info Pembuat

B. Perancangan Flowchart View

Dengan menggunakan simbol-simbol, dibuat 5 flowchart, yaitu Flowchart Intro, Flowchart Menu Utama, Flowchart Penjelasan, Flowchart Cara Kerja, Flowchart Virtual Set dan Flowchart Info. Keterangan : 1 : Menu Utama Gambar 4.1 Flowchart Intro Flowchart Gambar 4.1 menjelaskan bahwa aplikasi dimulai dengan tampilan intro sebagai pembuka. Ketika intro diputar, di bawah layar terdapat teks “klik pada layar untuk menuju menu utama”. Jika user meng-klik layar maka video intro akan terhenti dan langsug menuju menu utama, jika tidak maka video intro akan terus berjalan hingga selesai. Tidak Ya Mulai Klik Mouse 1 1 Tampilkan Layar Intro Keterangan : 1 : Halaman Menu Utama 2 : Halaman Penjelasan 3 : Halaman Cara Kerja 4 : Halaman Virtual Set 5 : Halaman Info Flowchart Gambar 4.2 menjelaskan isi dari menu utama yang meliputi empat halaman untuk menuju ke menu selanjutnya. Jika pengguna memilih “ya”, maka akan masuk ke menu yang diinginkan. Apabila pengguna memilih “tidak”, maka akan kembali ke menu utama dan bisa memilih menu lainnya. Tidak Tidak Ya Tidak Tidak Ya Pilih Menu Apa Itu Virtual Set Pilih Menu Cara Kerja Pilih Menu Vitrual Set Pilih Menu Info Keluar 2 3 4 5 Ya Ya 1 Gambar 4.2 Flowchart Menu Utama Keterangan : 1 : Halaman Menu Utama 2 : Halaman Penjelasan Flowchart Gambar 4.3 menjelaskan bahwa dalam halaman pejelasan terdapat dua menu yaitu Indonesia dan English. Apabila pengguna memilih tombol Indonesia maka akan muncul pengertian dari virtual set berikut dengan penjelasannya, sama halnya dengan tombol English. Untuk keluar dari aplikasi, Tidak Tidak Pilih Menu Indonesia Pilih Menu English Pilih Menu Utama 1 Tampilkan dengan Bhs Ind Tampilan dengan Bhs Inggris Ya Ya 2 Pilih Menu Utama Pilih Menu Utama Gambar 4.3 Flowchart Menu Penjelasan pengguna harus kembali ke menu utama dan menekan tombol exit, begitu juga dengan halaman yang lainnya. Keterangan : 1 : Halaman Menu Utama 3 : Halaman Cara Kerja Flowchart Cara Kerja menjelaskan alat yang digunakan dan alur kerja penggunaan sistem virtual set. Apabila pengguna memilih tombol “Alat yang digunakan” maka layar menampilkan beberapa alat yang berperan dalam pembuatan studio menggunakan virtual set, begitu juga dengan alur prosesnya. 3 Ya Tidak Tidak Pilih Menu Alat yg digunakan Pilih Menu Alur Kerja Pilih Menu Utama 1 Tampilkan Layar Alat Yang Digunakan Tampilkan Layar Alur Kerja Ya Gambar 4.4 Flowchart Cara Kerja Keterangan : a : Halaman Camview b : Halaman Virtual Studio c : Halaman Video 1 : Halaman Menu Utama 4 : Halaman Virtual Set Pada Gambar 4.5 yaitu flowchart Virtual Set, terdapat tombol ”Camview” untuk menampilkan dua jenis pengambilan gambar yaitu secara Medium Shot dengan kamera 1 dan Long Shot dengan kamera 2. Tombol ”Virtual Studio” untuk 4 1 Tidak Tidak Ya Tidak Pilih Menu Virtual Studio Pilih Menu Video Pilih Menu Utama Ya Pilih Menu Camview Ya a b c Gambar 4.5 Flowchart Virtual Set menuju ke tampilan studio tiga dimensi dan tombol ”Video” untuk melihat tampilan hasil jadi yaitu berupa siaran Warta Siang TVRI yang menggunakan latar belakang virtual set yang telah peneliti buat. Dan untuk keluar dari apikasi, seperti halaman sebelumnya, pengguna kembali menekan tombol ”Menu Utama” untuk kembai ke halaman menu utama. Keterangan : a : Halaman Camview 4 : Halaman Virtual Set Pada Gambar 4.6 yaitu flowchart menu Camview yang terdapat pada halaman Virtual Set. Flowchart ini menampilkan dua jenis pengambilan gambar Tidak Ya Tidak Pilih Menu Cam2 Ya Pilih Menu Cam1 Pilih Menu Kembali 4 Menampilkan Video 1 dengan Teknik Virtual Set Menampilkan Video 2 dengan Teknik Virtual Set a Gambar 4.6 Flowchart Camview yaitu Cam 1 untuk tampilan dengan Medium Shot dan Cam 2 untuk tampilan dengan Long Shot. Dan apabila kedua video berjalan dengan baik, berati teknik virtual set telah berhasil diterapkan dalam aplikasi ini. Keterangan : b : Halaman Virtual Studio 4 : Halaman Virtual Set Tidak Tidak Tidak Tidak Tidak Pilih Panah Kanan Pilih Panah Atas Pilih Panah Bawah Pilih Panah Kiri Pilih Huruf R 4 Ya Ya Pengguna bergerak maju dalam ruangan Pengguna bergerak ke arah kanan dalam ruangan Ya Ya Pengguna bergerak ke arah Kiri dalam ruangan Pengguna bergerak mundur dalam ruangan Ya Pengguna kembali ke tempat semula Pilih Menu Kembali b Gambar 4.7 Flowchart Virtual Studio Pada Gambar 4.7 yaitu flowchart menu Virtual Studio yang terdapat pada halaman Virtual Set. Dengan adanya flowchart ini, dapat menjelaskan apakah teknik kamera sintetis berjalan pada aplikasi yang telah dibuat oleh peneliti. Apabila pengguna dapat bergerak menyusuri ruangan menggunakan tanda panah, berarti sesuai dengan teknik kamera sintetis yaitu mata pengguna bergerak menyerupai kamera. Begitu juga dengan teknik collision detection, apabila pengguna tidak dapat berjalan menembus salah satu objek yang terdapat di ruangan, berarti teknik collision detection sudah bekerja pada aplikasi. Keterangan : c : Halaman Video 4 : Halaman Virtual Set Ya c 4 Pilih Menu Kembali Pengguna bergerak ke arah kanan dalam ruangan Pengguna bergerak ke arah kanan dalam ruangan Pilih Menu Warta Nusantara Pilih Menu Dunia Dalam Berita Tidak Tidak Tidak Pilih Menu Warta Siang Ya Ya Pengguna bergerak maju dalam ruangan Gambar 4.8 Flowchart Video Gambar 4.8 yaitu flowchart Video menjelaskan jika pengguna memilih tombol menu Warta Siang maka video berupa siaran berita menggunakan virtual set akan diputar. Video tersebut menggunakan teknik virtual set yang dibuat leh peneliti menyerupai teknik yang digunakan di stasiun televisi. Keterangan : 1 : Halaman Menu Utama 5 : Halaman Info Flowchart Gambar 4.9 berisi tentang info pembuat dan info tentang aplikasi yang dibuat. Pada halaman ini, terdapat tombol ”Menu Utama” untuk kembali ke halaman menu utama. 5 Tidak Tidak Pilih Menu Utama 1 Pilih Menu Info Aplikasi Pilih Menu Info Pembuat Tampilkan Info Aplikasi Tampilkan Info Pembuat Ya Ya Gambar 4.9 Flowchart Info

C. Perancangan Arsitektur Navigasi

Pada arsitektur navigasi di atas, dijelaskan bahwa terdapat empat halaman utama pada aplikasi yaitu: 1. Penjelasan , berisi halaman dengan bahasa Indonesia dan English. 2. Cara Kerja, berisi halaman yang menjelaskan tentang Alat yang Digunakan dan Alur Kerja. 3. Virtual Set, berisi halaman Camview, Virtual Studio dan Video. 4. Info, berisi halaman Info Aplikasi dan Info Pembuat. Intro Menu Utama Penjelasan Cara Kerja Virtual Set Info Ind Eng Alat Yang Digunakan Alur Kerja Camview Virtual Studio Video Info Aplikasi Info Pembuat Gambar 4.10 Arsitektur Navigasi

D. Perancangan Diagram Transisi State Transition Diagram

Gambar 4.11 Rancangan STD Menu Utama Dari halaman Menu Utama, terdapat lima pilihan navigasi yaitu navigasi menuju penjelasan virtual set, cara kerja, virtual set studio dan video,, info dan pilihan tombol navigasi ”exit” untuk keluar. Gambar 4.12 Rancangan STD Penjelasan Virtual Set Pada halaman Penjelasan hanya terdapat tiga pilihan navigasi, yaitu pejelasan menggunakan Bahasa Indonesia dan Bahasa Inggris. Serta pilihan kembali ke Menu Utama. Klik “Cara Kerja” Tampilkan “Cara Kerja” Klik “Menu Utama” Tampilkan “Menu Utama” Klik “Keluar” Keluar dari aplikasi Klik “Info” Tampilkan “Info” Klik “Menu Utama” Tampilkan “Menu Utama” Klik “Virtual Set” Tampilkan “Virtual Set” Klik “Menu Utama” Tampilkan “Menu Utama” Tampilkan “Apa Itu Virtual Set” Klik “Apa Itu Virtual Set” Menu Utama Apa Itu Virtual Set Cara Kerja Virtual Set Info Keluar Klik “English” Tampilkan pejelasan dengan Bahasa Inggris Klik “Indonesia” Tampilkan pejelasan dengan Bahasa Indonesia Klik “Apa Itu Virtual Set” Tampilkan “Apa Itu Virtual Set” Klik “Menu Utama” Tampilkan “Menu Utama” Penjelasan Virtual Set Menu Utama Indonesia English Gambar 4.13 Rancangan STD Cara Kerja Navigasi yang terdapat pada halaman Cara Kerja adalah Alat Yang digunakan, Alur Kerja dan navigasi Menu Utama untuk kembali apabila ingin memilih menu yang lain. Gambar 4.14 Rancangan STD Virtual Set Klik “Cara Kerja” Tampilkan “Cara Kerja” Klik “Cara Kerja” Tampilkan “Cara Kerja” Klik “Alat Yang Digunakan” Tampilkan “Alat Yang Digunakan” Cara Kerja Klik “Menu Utama” Tampilkan “Menu Utama” Menu Utama Klik “Apa Itu Virtual Set” Tampilkan “Apa Itu Virtual Set” Alat Yang Digunakan Alur Kerja Klik “Alur Kerja” Tampilkan “Alur Kerja” Klik “Virtual Set” Tampilkan “Virtual Set” Klik “Camview” Tampilkan “Camview” Klik “Virtual Set” Tampilkan “Virtual Set” Klik “Video” Tampilkan “Video” Klik “Virtual Studio” Tampilkan “Virtual Studio” Virtual Set Klik “Menu Utama” Tampilkan “Menu Utama” Menu Utama Klik “Apa Itu Virtual Set” Tampilkan “Apa Itu Virtual Set” Virtual Studio Video Camview Klik “Virtual Set” Tampilkan “Virtual Set” Pada halaman Virtual Set terdapat empat navigasi yaitu Camview, Virtual Studio, Video dan Menu Utama seperti di halaman lainnya yang digunakan untuk kembali. Gambar 4.15 Rancangan STD Info Navigasi pada halaman Info terdapat tiga yaitu Info Pembuat, Info Aplikasi dan Menu Utama. Pada pertama kali membuka halaman, pengguna akan langsung masuk ke halaman Info Aplikasi.

E. Perancangan Antarmuka User Interface

Perancangan antarmuka pada tampilan skripsi ini dibuat seoptimal mungkin sesuai dengan kebutuhan manusia sebagai pengguna dan komputer yang saling berinteraksi. Oleh karena itu, peneliti mengacu pada delapan panduan interaksi antara manusia dan komputer agar mudah dipahami dan user friendly. Pada aplikasi desain virtual set pada news studio ini, terdapat enam rancangan layar, yaitu: 1. Rancangan Layar Intro Rancangan Layar Intro merupakan tampilan awal pada aplikasi untuk menuju menu utama. Pada layar intro, terdapat video yang otomatis akan Klik “Info Aplikasi” Tampilkan “Info Aplikasi” Klik “Info Aplikasi” Tampilkan “Info Aplikasi” Klik “Info” Tampilkan “Info” Klik “Info” Tampilkan “Info” Klik “Info” Tampilkan “Info” Info Menu Utama Klik “Menu Utama” Tampilkan “Menu Utama” Info Pembuat Info Aplikasi diputar dan pada bagian bawah layarnya terdapat teks sebagai petunjuk apabila pengguna ingin segera masuk ke layar menu utama. Caranya yaitu dengan mengklik pada layar. Apabila layar tidak diklik, maka layar akan otomatis menuju menu utama setelah video berakhir. Untuk lebih jelasnya, rancangan layar Intro dapat dilihat pada storyboard yang terdapat di halaman sebelumya. 2. Rancangan Layar Menu Utama Pada rancangan ini terdapat empat pilihan menu utama, yaitu Penjelasan, Cara Kerja, Virtual Set dan Info. Sedangkan tombol-tombol yang terdapat pada layar antara lain:  Tombol Apa Itu Virtual Set? untuk menuju halaman Penjelasan.  Tombol Cara Kerja untuk menuju halaman Cara Kerja.  Tombol Virtual Set untuk menuju halaman Virtual Set.  Tombol Info untuk menuju halaman Info.  Tombol Exit, untuk keluar dari aplikasi. Rancangan dapat dilihat pada storyboard Menu Utama di halaman sebelumnya. 3. Rancangan Layar Penjelasan Rancangan layar ini berisi tentang pengertian Virtual Set dalam dua bahasa, yaitu Bahasa Indonesia dan Bahasa Inggris. Selain itu juga terdapat dua contoh video yang membedakan teknik virtual dengan menggunakan chromakey dan virtual set. Sesuai dengan storyboard yang telah diuat di halama sebelumnya, di halaman ini juga dilengkapi dengan animasi berupa slide contoh-contoh desain virtual set agar pengguna dapat melihat berbagai macam hasil rancangan dengan teknik virtual. Tombol yang terdapat pada layar ini yaitu:  Tombol Versi Indonesia untuk menuju halaman pejelasan dengan Bahasa Indonesia.  Tombol Versi English untuk menuju halaman pejelasan dengan Bahasa English.  Tombol Menu untuk menuju Menu Utama. 4. Rancangan Layar Cara Kerja Pada rancangan layar ini terdapat dua menu utama yaitu Alat Yang Digunakan dan Alur Kerja yang digambarkan dengan tampilan monitor pada Studio Control. Halaman ini berbeda dengan halaman Penjelasan yang kebanyakan berisi teks, karena pada halaman ini Alat yang digunakan dan alur kerja disajikan dalam bentuk teks, gambar dan animasi agar pengguna lebih mudah dalam memahaminya. Tombol-tombol yang terdapat pada layar ini yaitu:  Tombol ”Alat yang Digunakan” untuk melihat delapan alat yang digunakan pada siaran berikut dengan fotonya.  Tombol ”Alur Kerja” untuk melihat bagan alur kerja pada siaran berita dengan latar belakang Virtual Set.  Tombol ”Menu” untuk menuju Menu Utama. 5. Rancangan Layar Virtual Set Pada layar Virtual Set terdapat tiga menu utama yaitu Camview, Virtual Studio dan Video. Halaman Virtual Studio merupakan inti dari aplikasi karena terdapat tampilan ruang studio tiga dimensi yang dapat digerakkan dengan tombol panah. Sedangkan pada halaman camview terdapat penerapan metode kamera sintetis yang digambarkan dengan dua video animasi. Tombol-tombol yang terdapat pada layar ini antara lain yaitu:  Tombol Camview untuk menampilkan pengambilan gambar dengan ukuran gambar medium shot dan long shot.  Tombol Virtual Studio untuk masuk ke ruang studio tiga dimensi.  Tombol Video untuk melihat siaran berita dengan latar belakang virtual set.  Tombol Menu untuk menuju Menu Utama. 6. Rancangan Layar Info Rancangan ini berisi keterangan singkat tentang aplikasi dan data diri pembuatnya. Dalam halman ini terdapat tiga tombol antara lain yaitu:  Tombol Info Aplikasi untuk melihat keterangan tentang aplikasi serta perangkat lunak pendukungnya.  Tombol Info Pembuat untuk melihat profil pembuat.  Tombol Menu untuk menuju Menu Utama.

4.3 Pengumpulan Bahan Material Collecting