31 BAB IV ANALISA DAN PEMBAHASAN 4.1 Desain Website (Perancangan Website) Desain ini berupa struktur yang harus dibuat untuk memudahkan pembuatan website yang dimaksudkan agar web ini terlihat sederhana dan mudah digunakan. Hal ini perlu karena setiap interaksi dengan pemakai pasti melalui antarmuka. Pada web ini penulis menggunakan struktur navigasi Composite yaitu gabungan dari ketiga struktur sebelumnya yaitu linear, non linear dan hierarchical, jika suatu tampilan membutuhkan percabangan maka dapat dibuat percabangan dimana percabangan tersebut terdapat suatu tampilan yang sama kedudukannya. 4.1.1 Struktur Navigasi Menu Utama Home Prambanan Borobudur Parangtritis Mendut Profil Profil Profil Profil Galeri Galeri Galeri Galeri Fasilitas Fasilitas Fasilitas Fasilitas Mendut Profil Galeri Fasilitas Gambar 4.1 Struktur Navigasi 4.1.2 Storyboard Storyboard ini menjelaskan movie-movie dari tampilan movie menu, movie home, movie prambanan yang terdiri dari profil, galeri dan fasilitas. 31
32 Movie Menu Pada movie ini di tampilkan pilihan menu yang apabila di klik akan menampilkan tampilan yang telah di klik. Movie Home Pada movie ini ditampilkan movie menu sekaligus movieclip dari movie indeks. Movie Profile Pada movie ini ditampilkan movie menu sekaligus movie profile yang berisi tampilan gambar dan juga teks yang isinya mengenai sejarah dan lokasi wisata. Dan pada movie ini terdapat juga tombol yang akan menampilkan isi dari movie profile selanjutnya. Movie Photo Pada movie ini ditampilkan movie menu sekaligus movie galeri yang berisi tampilan gambar-gambar yang apabila di klik akan menampilkan preview dari gambar tersebut. Movie Fasilitas Pada movie ini ditampilkan movie menu sekaligus movie fasilitas yang berisi fasilitas hotel dan juga fasilitas umum. 4.1.3 Perancangan Aplikasi 1. Movie Menu Pada movie ini merupakan halaman depan yang menjadi acuan untuk berpindah dari menu movie satu ke movie lainnya. Di movie ini terdapat 6 tombol beserta animasi selamat datang yaitu Home, Prambanan, Borobudur, Parangtritis, Mendut dan Sukuh. Rancangan movie menu utama adalah sebagai berikut :
33 Judul Animasi Teks Gambar Home Borobudur Prambanan Parangtritis Mendut Sukuh Teks Gambar 4.2 Rancangan Movie Menu 2. Movie Home Pada movie ini merupakan animasi singkat selamat datang di Web Wisata. Animasi Teks Gambar 4.3 Rancangan Movie Home 3. Movie Prambanan Pada movie prambanan dari tiga movie yang terdiri dari tombol yaitu tombol Profil, tombol Galeri dan tombol Fasilitas. Tombol Profil yang berisi tentang profil atau sejarah tentang wisata Candi Prambanan. Tombol Galeri berisi foto candi prambanan yang telah diperbesar. Tombol Fasilitas berisi tentang fasilitas-fasilitas yang terdapat di Candi Prambanan. Gambar Teks S c r o l
34 Tb1 Tb2 Tb3 Gambar 4.4 Rancangan Movie Prambanan 4. Movie Borobudur Pada movie Borobudur terdiri dari tiga tombol yaitu tombol Profil, tombol Galeri dan tombol Fasilitas. Tombol Profil yang berisi tentang profil atau sejarah tentang wisata Candi Borobudur. Tombol Galeri berisi foto candi Borobudur yang telah diperbesar. Tombol Fasilitas berisi tentang fasilitasfasilitas yang terdapat di Candi Borobudur. Gambar Tb1 Tb2 Tb3 Teks S c r o l Gambar 4.5 Rancangan Movie Borobudur 5. Movie Parangtritis Pada movie Parangtritis terdiri dari tiga tombol yaitu tombol Profil, tombol Galeri dan tombol Fasilitas. Tombol Profil yang berisi tentang profil atau sejarah tentang wisata Candi Parangtritis. Tombol Galeri berisi foto candi Parangtritis yang telah diperbesar. Tombol Fasilitas berisi tentang fasilitasfasilitas yang terdapat di Candi Parangtritis. Gambar Teks S c r o l
35 Tb1 Tb2 Tb3 Gambar 4.6 Rancangan Movie Parangtritis 6. Movie Mendut Pada movie Mendut terdiri dari tiga tombol yaitu tombol Profil, tombol Galeri dan tombol Fasilitas. Tombol Profil yang berisi tentang profil atau sejarah tentang wisata Candi Mendut. Tombol Galeri berisi foto Candi Mendut yang telah diperbesar. Tombol Fasilitas berisi tentang fasilitas-fasilitas yang terdapat di Candi Mendut. Gambar Tb1 Tb2 Tb3 Teks S c r o l Gambar 4.7 Rancangan Movie Profil 7. Movie Sukuh Pada movie Sukuh terdiri dari tiga tombol yaitu tombol Profil, tombol Galeri dan tombol Fasilitas. Tombol Profil yang berisi tentang profil atau sejarah tentang wisata Candi Sukuh. Tombol Galeri berisi foto Candi Sukuh yang telah diperbesar. Tombol Fasilitas berisi tentang fasilitas-fasilitas yang terdapat di Candi Sukuh. Gambar Teks S c r o l
36 Tb1 Tb2 Tb3 Gambar 4.8 Rancangan Movie Sukuh 4.2 Pembuatan Aplikasi Setelah perancangan input dibuat selanjutnya dilakukan pembuatan aplikasi dimana pembuatan aplikasi ini berisi cara pembuatan website dari movie menu, movie home, movie profile, movie galeri, movie fasilitas dan juga movie kontak. Langkah-langkah pembuatan aplikasinya adalah sebagai berikut : 4.2.1 Movie Menu Gambar 4.9 Halaman Movie Menu 1. Buka file baru dan beri nama menu 2. Pada layer 1 beri nama background lalu pada frame 1 klik rectangle tool dan pilih fill colour dengan warna orange, buat kotak dengan ukuran stage. Klik rectangle tool dan pilih fill
37 colour dengan warna coklat buat kotak untuk menempatkan gambar. 3. Buat layer baru dan beri nama judul pada frame 1 buat text dengan nama Wisata Jawa Tengah dan atur propertiesnya dengan jenis tulisan monotyp corsiva, ukuran 38 dan warna kuning lalu letakkan di pojok kiri atas. 4. Buat layer baru beri nama background tombol, klik rectangle tool dan pilih fill colour dengan warna merah, buat kotak memanjang di bawah gambar untuk meletakkan tombol. 5. Buat layer baru beri nama tombol, lalu klik insert> new symbol pilih behavior button dan beri nama home. Klik rectangle tool, pilih fill colour dengan warna kuning dan pada round rectangle radius isi corner radius dengan point 30. Pada frame up buat kotak dengan ukuran tombol letakkan ditengah stage, lalu pada frame up klik copy frame pada frame over insert> keyframe lalu paste frame, lakukan hal yang sama pada frame down dan hit. Buat layer baru, pada frame up buat text dengan nama home letakkan pada kotak dan pada frame hit insert> frame. Kembali ke scene1 klik window> library maka akan tampil library yang berisi button home drag lalu letakkan pada kotak tombol. Buat tombol lain dengan cara yang sama. 6. Buat layer baru beri nama animasi selamat datang. Klik insert> new symbol pilih behaviour movieclip dan beri nama animasi teks. Pada layer 1 beri nama animasi selamat datang, pada frame 1 buat teks selamat dating dan pada color pilih alpha beri point 0%. Pada frame 10 insert> keyframe tarik teks kekiri pada color pilih none. Pada frame 32 insert> keyframe tarik teks kekiri. Pada frame 37 insert> keyframe tarik teks kekiri pada color pilih alpha beri point 0%. Kembali ke scene1 lalu pada library drag animasi teks letakkan di kanan atas stage.
38 7. Buat layer baru dan beri nama teks. Pada frame 1 buat teks Silahkan Anda Pilih Tombol lalu letakkan di tengah bawah layer movie. 8. Buat layer baru dan beri nama movieclip. Insert> new symbol pilih behaviournya movieclip dan beri nama kosong. Kembali ke scene1 pada library drag movieclip tadi pada stage lalu letakkan titik acuan di sudut stage yang kosong. Pada frame1 klik titik acuan dan ganti frame labelnya menjadi indeks. Insert> keyframe pada frame10 klik titik acuan dan ganti frame labelnya menjadi profil. Lakukan hal yang sama pada frame 20, frame30, frame40 dan ganti labelnya menjadi galeri, fasilitas dan kontak. 9. Buat layer baru dan beri nama label. Pada frame1 ganti frame labelnya dengan indeks, frame10 labelnya Prambanan, frame20 labelnya Borobudur, frame30 labelnya Parangtritis, frame40 labelnya Mendut dan frame50 labelnya Sukuh. 4.2.2 Movie Home Gambar 4.10 Halaman Movie Home 1. Buka file baru beri nama INDEKS
39 2. Pada layer 1 beri nama animasi teks. Pada frame1 buat huruf S, lalu insert> blankframe pada frame2 buat huruf E. Buat huruf yang lain hingga membentuk kalimat Selamat Datang di Web Wisata. Kemudian setiap huruf masukkan suara dari librarysound. Lalu pada frame terakhir berikan action stop 4.2.3 Movie Prambanan Gambar 4.11 Halaman Movie Prambanan 1. Buat file baru dan beri nama PRAMBANAN 2. Pada layer1 beri nama teks & gambar. Pada frame1 drag gambar dan letakkan dipojok kiri atas stage, lalu buat kotak teks di sebelah gambar, lalu drag scrollbox pada component letakkan disebelah kanan kotak teks dan masukkan teks. Insert> blankframe pada frame10 lalu letakkan gambar. Insert> blankframe pada frame20 lalu buat animasi teks dan teks lalu letakkan di stage. 3. Buat layer baru dan beri nama tombol. Pada frame1 insert> new symbol pilih behaviornya button dan namenya btn_prof.
40 Pada layer 1 frameup buat kotak untuk ukuran tombol, lalu insert> keyframe pada frameover, framedown, framehit dan setiap framenya beri warna berbeda. Buat layer baru, pada frameup buat teks profil, lalu letakkan dalam kotak. Pada framehit insert> frame. Kembali ke scene1 buat lagi tombol galeri dan tombol fasilitas dengan cara yang sama, drag tombol tadi pada library letakkan di bawah gambar 4. Buat layer baru dan beri nama label. Pada frame1 beri nama frame labelnya Profil. Insert> blankframe pada frame10 lalu beri nama galeri untuk frame labelnya dan insert> blankframe pada frame20 dan beri nama fasilitas untuk frame label. 5. Buat layer baru dan beri nama action. Pada frame1 beri action stop. 4.2.4 Movie Borobudur Gambar 4.12 Halaman Movie Borobudur 1. Buat file baru dan beri nama BOROBUDUR
41 2. Pada layer1 beri nama teks & gambar. Pada frame1 drag gambar dan letakkan dipojok kiri atas stage, lalu buat kotak teks di sebelah gambar, lalu drag scrollbox pada component letakkan disebelah kanan kotak teks dan masukkan teks. Insert> blankframe pada frame10 lalu letakkan gambar. Insert> blankframe pada frame20 lalu buat animasi teks dan teks lalu letakkan di stage. 3. Buat layer baru dan beri nama tombol. Pada frame1 insert> new symbol pilih behaviornya button dan namenya btn_prof. Pada layer 1 frameup buat kotak untuk ukuran tombol, lalu insert> keyframe pada frameover, framedown, framehit dan setiap framenya beri warna berbeda. Buat layer baru, pada frameup buat teks profil, lalu letakkan dalam kotak. Pada framehit insert> frame. Kembali ke scene1 buat lagi tombol galeri dan tombol fasilitas dengan cara yang sama, drag tombol tadi pada library letakkan di bawah gambar 4. Buat layer baru dan beri nama label. Pada frame1 beri nama frame labelnya Profil. Insert> blankframe pada frame10 lalu beri nama galeri untuk frame labelnya dan insert> blankframe pada frame20 dan beri nama fasilitas untuk frame label. 5. Buat layer baru dan beri nama action. Pada frame1 beri action stop. 4.2.5 Movie Parangtritis
42 Gambar 4.13 Halaman Movie Fasilitas 1. Buat file baru dan beri nama PARANGTRITIS 2. Pada layer1 beri nama teks & gambar. Pada frame1 drag gambar dan letakkan dipojok kiri atas stage, lalu buat kotak teks di sebelah gambar, lalu drag scrollbox pada component letakkan disebelah kanan kotak teks dan masukkan teks. Insert> blankframe pada frame10 lalu letakkan gambar. Insert> blankframe pada frame20 lalu buat animasi teks dan teks lalu letakkan di stage. 3. Buat layer baru dan beri nama tombol. Pada frame1 insert> new symbol pilih behaviornya button dan namenya btn_prof. Pada layer 1 frameup buat kotak untuk ukuran tombol, lalu insert> keyframe pada frameover, framedown, framehit dan setiap framenya beri warna berbeda. Buat layer baru, pada frameup buat teks profil, lalu letakkan dalam kotak. Pada framehit insert> frame. Kembali ke scene1 buat lagi tombol galeri dan tombol fasilitas dengan cara yang sama, drag tombol tadi pada library letakkan di bawah gambar
43 4. Buat layer baru dan beri nama label. Pada frame1 beri nama frame labelnya Profil. Insert> blankframe pada frame10 lalu beri nama galeri untuk frame labelnya dan insert> blankframe pada frame20 dan beri nama fasilitas untuk frame label. 5. Buat layer baru dan beri nama action. Pada frame1 beri action stop. 4.2.6 Movie Mendut Gambar 4.14 Halaman Movie Mendut 1. Buat file baru dan beri nama MENDUT 2. Pada layer1 beri nama teks & gambar. Pada frame1 drag gambar dan letakkan dipojok kiri atas stage, lalu buat kotak teks di sebelah gambar, lalu drag scrollbox pada component letakkan disebelah kanan kotak teks dan masukkan teks. Insert> blankframe pada frame10 lalu letakkan gambar. Insert> blankframe pada frame20 lalu buat animasi teks dan teks lalu letakkan di stage.
44 3. Buat layer baru dan beri nama tombol. Pada frame1 insert> new symbol pilih behaviornya button dan namenya btn_prof. Pada layer 1 frameup buat kotak untuk ukuran tombol, lalu insert> keyframe pada frameover, framedown, framehit dan setiap framenya beri warna berbeda. Buat layer baru, pada frameup buat teks profil, lalu letakkan dalam kotak. Pada framehit insert> frame. Kembali ke scene1 buat lagi tombol galeri dan tombol fasilitas dengan cara yang sama, drag tombol tadi pada library letakkan di bawah gambar 4. Buat layer baru dan beri nama label. Pada frame1 beri nama frame labelnya Profil. Insert> blankframe pada frame10 lalu beri nama galeri untuk frame labelnya dan insert> blankframe pada frame20 dan beri nama fasilitas untuk frame label. 5. Buat layer baru dan beri nama action. Pada frame1 beri action stop. 4.2.7 Movie Sukuh Gambar 4.15 Halaman Movie Sukuh
45 1. Buat file baru dan beri nama SUKUH 2. Pada layer1 beri nama teks & gambar. Pada frame1 drag gambar dan letakkan dipojok kiri atas stage, lalu buat kotak teks di sebelah gambar, lalu drag scrollbox pada component letakkan disebelah kanan kotak teks dan masukkan teks. Insert> blankframe pada frame10 lalu letakkan gambar. Insert> blankframe pada frame20 lalu buat animasi teks dan teks lalu letakkan di stage. 3. Buat layer baru dan beri nama tombol. Pada frame1 insert> new symbol pilih behaviornya button dan namenya btn_prof. Pada layer 1 frameup buat kotak untuk ukuran tombol, lalu insert> keyframe pada frameover, framedown, framehit dan setiap framenya beri warna berbeda. Buat layer baru, pada frameup buat teks profil, lalu letakkan dalam kotak. Pada framehit insert> frame. Kembali ke scene1 buat lagi tombol galeri dan tombol fasilitas dengan cara yang sama, drag tombol tadi pada library letakkan di bawah gambar 4. Buat layer baru dan beri nama label. Pada frame1 beri nama frame labelnya Profil. Insert> blankframe pada frame10 lalu beri nama galeri untuk frame labelnya dan insert> blankframe pada frame20 dan beri nama fasilitas untuk frame label. 5. Buat layer baru dan beri nama action. Pada frame1 beri action stop. 4.3 Tombol Navigasi Untuk mengaktifkan Action script pada tombol navigasi misalnya tombol profil yaitu dengan cara mengklik dimana frame awal dari semua tombol mulai muncul pada menu utama lalu klik tombol profil lalu aktifkan action frame pilih movie control lalu klik dua kali pada icon Goto set dengan gotoandstop, type dipilih frame label untuk frame dipilih profil, pada load movienya ketik PROFIL.swf pada Url lalu pilih location pada
46 target tentukan dengan teks profil. Adapun script yang dijabarkan sebagai berikut : on (release) { gotoandstop ( Profil ); loadmovie ( PROFIL.swf, Profil ) } Pada penulisan script tombol navigasi yang lainya, yang ada pada menu utama cara penulisan dan langkah-langkahnya sama dengan yang ada pada Profil, hanya saja nama frame yang ada pada goto serta nama URL dan Target yang ada pada Load Movie diganti berdasarkan nama masing-masing tombol. Contohnya pada tombol GALERI nama frame yang ada pada goto diisi dengan Tipe, selanjutnya pada Load Movie URL dan Location masing-masing diisi dengan target dan Tipe. Penulisan scriptnya seperti berikut ini : on (release) { gotoandstop ( Galeri ); loadmovie ( GALERI.swf, Galeri ); } Sedangkan penulisan script tombol navigasi yang ada pada tiaptiap movie, misalnya pada movie profil yang terdapat tombol next dan back dengan cara masuk action pilih movie control lalu klik dua kali on maka akan muncul pilihan event kemudian check event release. Setelah itu klik dua kali icon goto set dengan gotoandstop, type frame label dan frame borobudur.adapun script yang dijabarkan sebagai berikut : On (release) { GotoAndStop ( Borobudur ) }
47 4.4 Penyelesaian dan Publish Setting Tahap akhir dari penyelesaian program adalah dengan proses Pempublishing-an. Flash MX telah menyediakan suatu pilihan menu yang berfungsi untuk mengubah file program berextention.fla menjadi file eksekusi (dengan extention.exe). Dengan demikian file program dapat langsung dieksekusi dibawah system Windows tanpa harus membuka program Flash MX. Proses pem-publishing-an sangat mudah, yaitu : 1. Simpan aplikasi yang sudah dibuat 2. File> publish setting, akan tampil kotak dialognya, secara default flash akan memberikan tanda cek (.) pada tipe flash dan html. 3. Cobalah tambahkan tanda cek (.) pada bagian type windows projector dan hilangkan tanda cek (.) pada bagian use default names, lalu klik tombol publish. 4. Cobalah buka windows explorer, maka pada file anda akan secara otomatis terdapat file ber-extension fla, html dan exe. 4.5 Proses-Proses Burning CD, Download, dan Scaner 1. Proses Burning CD Buka program Ahead Nero Pilih Nero express Klik data lalu pilih Data Disk Klik menu add untuk mengambil data dari windows explorer Pilih data-data yang ingin di burning lalu klik add Setelah semua data sudah dipilih lalu klik finished Tahap terakhir klik scan 2. Proses Download Buka alamat web yang dituju Setelah terbuka alamat web yang dituju dan ditemukan gambar, save gambar tersebut lalu masukkan ke dalam disket.
48 Gambar yang telah disimpan di disket tadi kita pindahkan ke dalam hardisk. Buka program flash lalu klik file>import to library Pilih gambar yang ingin di import lalu klik open Secara otomatis gambar tersebut sudah masuk ke dalam library. 3. Proses Scaner Letakkan gambar pada scaner Buka program Ulead Photo Express 4.0 lalu akan menampilkan tampilan sebagai berikut : Gambar 4.16 Ulead Photo Express Klik get photo lalu pilih scaner Klik Acquire maka akan tampil VisaScan Astra 3600 Klik Acquire maka akan tampil VisaScan Astra 3600
49 Gambar 4.17 VistaScan Astra 3600 Pada AstraScan Astra 3600 klik preview maka akan menampilkan gambar yang akan di scan Langkah terakhir klik scan maka gambar tadi akan terscan