28 BAB III PEMBAHASAN MASALAH Pada masa perkembangan zaman saat ini sudah tidak heran apabila segala sesuatu dapat dikomputerisasikan, informasi datang begitu cepat. Informasi yang ada di era modern ini sangat penting untuk dipelajari. Berbagai informasi yang datang sangat beraneka ragam sehingga inforamsi itu tidak dapat diabaikan begitu saja tetapi harus diperhatikan baik untuk dipelajari maupun hanya sebagai pengetahuan, karena pengetahuan mempunyai peran sangat penting didalam dunia bisnis atau bahkan dalam menjalani kehidupan sehari-hari. Tanpa pengetahuan bagaikan hidup dalam kegelapan. Suatu informasi berbasis visualisasi yaitu cara yang tepat untuk pencarian data agar gambar lebih mudah dalam mengaksesnya. Pembuatan program aplikasi multimedia ini memerlukan beberapa tahapan yang dikerjakan secara berurutan oleh penulis. Tahap pembuatan program akan dibahas mulai dari langkah-langkah, rancangan peta navigasi, storyboard, pengoperasian program, dan perangkat yang dibutuhkan. 3.1. Peta Navigasi Pengenalan Uji Psikometri Peta navigasi berguna untuk menentukan cara dimana suatu alur program dapat dijalankan dari awal hingga akhir program. Agar alur yang diinginkan dapat
29 sesuai dengan arah dan tujuan sehingga proses pembuatan aplikasi multimedia dapat berjalan sebagaimana mestinya. Berikut adalah struktur navigasi hierarcy yang digunakan pada aplikasi pengenalan Uji Psikometri. INTRO MENU UTAMA Uji Kepribadian Uji Kecerdasan Gambar 3.1 Struktur Navigasi Aplikasi Keterangan peta navigasi untuk menjelaskan alur visualisasi Uji Psikometri : 1. Intro adalah gambar untuk halaman pembukaan yang merupakan halaman pertama dari aplikasi visualisasi Uji Psikometri. 2. Menu utama adalah gambar untuk halaman menu utama yang memiliki tombol untuk menuju ke halaman Uji kepribadian dan Uji kecerdasan.
30 3. Uji Kepribadian adalah gambar untuk halaman yang berisi pertanyaanpertanyaan Uji Kepribadian yang didalamnya terdapat tombol pilihan jawaban A, B, C dan keterangan mengenai jawaban yang dipilih. 4. Uji Kecerdasan adalah gambar untuk halaman yang berisi pertanyaanpertanyaan Uji Kecerdasan yang didalamnya terdapat beberapa pertanyaan logika yang dapat mengukur kecerdasan anda, serta hasil dari Uji Kecerdasan. 3.2. Storyboard Visualisasi Uji Psikometri Storyboard merupakan gambaran umum yang menjelaskan tentang suatu hal atau gambar yang sedang terjadi secara lengkap dan disusun secara berurutan dari layer pembuka hingga layer penutup dengan mengikuti peta navigasi yang ada sehingga dapat meminimalisasikan kesalahan yang terjadi. Berikut ini adalah rancangan storyboard dari aplikasi Uji Psikometri :
31 3.2.1. Rancangan Halaman Intro ANIMASI ANGKA ANIMASI LOADING Gambar 3.2. Rancangan Halaman Intro Rancangan ini menggambarkan isi halaman intro dengan komponenkomponen berupa : 1. Animasi angka. 2. Animasi loading, yang nantinya akan langsung menuju ke halaman Menu Utama.
32 3.2.2. Rancangan Halaman Menu Utama ANIMASI TEXT Tombol 1 ANIMASI GAMBAR Tombol 2 Tombol 3 Gambar 3.3 Rancangan Halaman Menu Utama Rancangan ini menggambarkan isi Halaman Menu Utama dengan komponenkomponen berupa : 1. Animasi text 2. Tombol 1 untuk menuju ke halaman Uji Kepribadian 3. Tombol 2 untuk menuju ke halaman Uji Kecerdasan 4. Tombol 3 untuk keluar dari program.
33 5. Animasi Gambar 3.2.3. Rancangan Halaman Uji Kepribadian ANIMASI TEXT 1 TEXT SCROLL 1 Tombol 1 TEXT SCROLL 3 Tombol 2 Tombol 3 TEXT SCROLL 2 Tombol 4 Tombol 5 Tombol 6 Gambar 3.4. Rancangan Halaman Uji Kepribadian
34 Rancangan ini menggambarkan isi dari Halaman Uji Kepribadian dengan komponen-komponen berupa : 1. Animasi text 1 yang bertuliskan judul dari Uji Psikometri (uji kepribadian) 2. Text scroll 1 yang bertuliskan pertanyaan dari Uji Kepribadian 3. Tombol 1 yang bertuliskan pilihan jawaban A dari soal Uji Kepribadian 4. Tombol 2 yang bertuliskan pilihan jawaban B dari soal Uji Kepribadian 5. Tombol 3 yang bertuliskan pilihan jawaban C dari soal Uji Kepribadian 6. Text Scroll 2 yang bertuliskan keterangan dari pertanyaan Uji Kepribadian 7. Text Scroll 3 yang bertuliskan keterangan dari pilihan jawaban A, B, atau C 8. Tombol 4 untuk menuju ke pertanyaan Uji Kepribadian sebelumnya 9. Tombol 5 untuk menuju ke pertanyaan Uji Kepribadian berikutnya 10. Tombol 6 untuk kembali ke Menu Utama.
35 3.2.4.1. Rancangan Halaman Uji Penalaran Numerik ANIMASI TEXT 1 Time Animasi angka ANIMASI TEXT 2 Text Text input Tombol Gambar 3.6. Rancangan Halaman Uji Penalaran Numerik 1. Time berisikan waktu yang diberikan untuk mengerjakan soal yang ada 2. Animasi text 1 berisikan judul dari Uji Kecerdasan 3. Animasi angka berisikan nomor soal dari Uji Kecerdasan
36 4. Animasi text 2 berisikan pertanyaan dari Uji Kecerdasan 5. Text berisikan text keterangan 6. Text input berisikan inputan jawaban dari pertanyaan Uji Kecerdasan yang diberikan 7. Tombol untuk kembali ke menu Utama 3.3. Cara Pembuatan Aplikasi Uji Psikometri 3.3.1. Pembuatan Halaman Intro 1. Klik insert > scene 2. Klik layer pertama ubah nama layer background, drag symbol graphic backgroundintro dari library. Panjang form pada timeline dibuat 50 3. Buat garis menggunakan line tool, dengan panjang 2 cm lalu jadikan garis tersebut menjadi movie clip, pada editing symbol movie clip dan beri nama line MC 4. Buat layer ubah nama layer kotak, lalu buat symbol graphic dengan mengklik insert > new symbol > graphic, dengan ukuran 3 * 4 cm 5. Buat layer, ubah nama layer jarum jam, kemudian klik frame 1, 10, 20, 30, 40, 50. drag symbol movie clip line MC dari library, lalu letakkan di dalam stage di frame 1, kemudian atur property rotation di panel inspector movie clip dari auto menjadi cw, lakukan hal yang sama hingga frame ke 50, untuk memperluas proses perputaran beri sedikit sentuhan motion tween
37 6. Buat layer, ubah nama layer loading 7. Pada layer loading, frame 1 buat persegi panjang menggunakan Rectangle tool, lalu letakkan di bawah text loading 8. Buat layer baru lalu beri nama text, klik text tool pada layer text tuliskan text loading 9. Pada frame 10, klik insert > keyframe, lakukan hal yang sama sampai frame 50 10. Buat layer, ubah nama layer animasi angka dengan menggunakan text tool, klik frame 1 dan kemudian tuliskan angka 5 11. klik frame 10 dan kemudian tuliskan angka 4 12. klik frame 20 dan kemudian tuliskan angka 3 13. klik frame 30 dan kemudian tuliskan angka 2 14. klik frame 40 dan kemudian tuliskan angka 1 15. klik frame 50 dan kemudian tuliskan angka 0.
38 Gambar 3.7. Tampilan Halaman Intro 3.3.2. Pembuatan Halaman Menu Utama 1. klik insert > scene, lalu ubah nama scene tersebut Menu 2. Klik layer 1, ubah nama layer background, kemudian drag symbol graphic dari dalam library ke dalam stage 3. Buat symbol movie clip, pada symbol movie clip, insert > behavior > movie clip beri nama dibagian name animasi masking, klik ok 4. Klik layer 1, buat persegi panjang beri warna gradicat kuning 5. Buat layer, tuliskan kata Uji Psikometri dengan menggunakan text tool label static 6. kemudian letakkan kata tersebut disebelah kiri persegi panjang 7. Klik frame 10, insert keyframe sampai dengan frame 50 8. Kemudian dari masing-masing frame beri motion tween 9. Buat layer di scene menu ubah nama layer animasi mask, drag symbol animasi masking MC ke dalam stage 10. Buat layer, ubah nama layer menu pilihan, drag symbol button kedalam stage 11. buat layer, tuliskan kata Uji Kepribadian, Uji Kecerdasan di dalam stage menggunakan texttoll tipe static, lalu tempatkan tulisan tersebut diatas layer menu pilihan 12. Buat layer exit, drag button exit lalu letakkan kedalam stage
39 13. Buat layer action, lalu berikan action stop() di frame 1 Gambar 3.8. Tampilan Halaman Menu Utama 3.3.3. Pembuatan Halaman Uji Kepribadian 1. Klik insert > scene, ubah nama scene Uji Kepribadian 2. Klik layer 1, ubah nama layer background, kemudian drag symbol graphic bg_pink dari dalam library dan letakkan di dalam stage 3. Buat layer, ubah nama layer animasi judul drag movie clip animasi judul MC dari dalam library dan letakkan di dalam stage 4. Buat layer, kemudian buat field dynamic text dengan variable pertanyaan dari frame 1 sampai dengan frame ke 45
40 5. Buat layer, kemudian buat field dynamic text dengan variable penjelasan dari frame 1 sampai dengan frame ke 45 6. Buat layer, kemudian buat field dynamic text dengan variable jawaban dari frame 1 sampai dengan frame ke 45 7. Buat layer, ubah nama layer bt.pilih drag symbol button piliha, pilihb, pilihc dari dalam library dan letakkan di dalam stage 8. Buat layer, ubah nama layer bt.next-prev, drag symbol button next prev ke dalam stage 9. Buat layer, ubah nama layer back to menu, drag symbol button BT.menu kedalam stage 10. Buat layer, ubah nama layer atas dan bawah drag symbol instance dari dalam library, lalu letakkan ke dalam stage sebagai penggulung tulisan 11. Buat layer action, kemudian buat action stop() pada frame 1
41 Gambar 3.9. Tampilan Halaman Uji Kepribadian 3.3.4. Pembuatan Halaman Uji Kecerdasan 1. Klik insert > scene ubah nama scene test1 2. Pada layer 1, ubah nama layer background, drag symbol image latertest1.jpg ke dalam stage 3. Buat layer kedua login1, kemudian buat 1 ( satu ) buah kotak teks dengan texttool, pilih input text> show border around text, dibagian instance name beri nama kuser1 dan dibagian variable nama user1 4. Buat layer petunjuk, sebagai keterangan buat label static teks gunakan texttool untuk membuatnya 5. Buat layer ke 4 ( empat ) button, kemudian drag symbol button dari dalam library sebanyak 2 ( dua ) buah, lalu buat label static text sebagai keterangan Ok, No 6. Buat layer ke 5 ( lima ) judul, drag symbol movie clip judulmctest1 kedalam stage, buat hingga panjang frame 50 7. Buat layer ke 6 ( enam ) nomor, kemudian buat 1 ( satu ) buah kotak teks dengan texttool, pilih dynamic text, dibagian variable dan beri nama nomor
42 8. Buat layer ke 7 ( tujuh ) pertanyaan, kemudian buat 1 ( satu ) buah kotak teks dengan texttool, pilih dynamic text 9. Copy > paste pertanyaan tersebut sebanyak 9 ( sembilan ) buah pada setiap frame insert > keyframe sampai frame ke 11 10. Buat layer ke 8 ( delapan ) input, kemudian buat 1 ( satu ) buah kotak teks dengan texttool, pilih input teks, show border around text, dibagian instance name, beri nama kjwb1 dan dibagian variable beri nama jwb1 11. Copy > paste input teks tersebut sebanyak 9 ( sembilan ) buah kemudian letakkan input teks tersebut insert > keyframe sampai frame ke 11 12. Buat layer ke 9 ( sembilan ) button_pilih, drag symbol button ( hit ) sebagai pilihan 13. Copy > paste button ( hit ) tersebut insert > keyframe sampai frame ke 11 14. Buat label jawab sebagai keterangan gunakan texttool untuk membuatnya 15. Buat layer ke 10 ( sepuluh ) ket_button sebagai keterangan kembali, untuk button kembali 16. Buat layer ke 11 ( sebelas ) action, kemudian klik frame 1 ( satu ) kemudian blok timeline tersebut sampai frame 11, kemudian tekan tombol di keyboard FG untuk mengisi masing-masing frame
43 tersebut kosong karena nantinya frame tersebut akan diisi dengan action-action. Gambar 3.10. Tampilan Halaman Uji Kecerdasan 3.4. Persyaratan Hardware dan Software Dalam pembuatan Aplikasi Uji Psikometri untuk semua kalangan dengan menggunakan Macromedia Flash MX ini, dibutuhkan perangkat lunak dan perangkat keras yang menunjang dengan spesifikasi sebagai berikut : Untuk menjalankan program Macromedia Flash MX ini, spesifikasi komputer minimal yang dibutuhkan adalah : 1. Sistem Operasi Windows 95 2. CPU dengan minimal Processor Intel Pentium 200 Mhz 3. Hardisk free space 85 MB ( untuk Macromedia Flash MX )
44 4. Monitor 640 x 480 high color pada 16 bit 5. RAM minimal sebesar 64 MB 6. Graphic Card minimal 4 MB Hardware pendukung yang digunakan penulis adalah : 1. Sistem Operasi Windows XP 2. Processor Intel Pentium III 3. SDRAM 128 MB 4. VGA