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
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.
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.
Uji Kepribadian Uji Kecerdasan
INTRO
3. Uji Kepribadian adalah gambar untuk halaman yang berisi pertanyaan-pertanyaan 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 pertanyaan-pertanyaan Uji Kecerdasan yang didalamnya terdapat beberapa pertanyaan-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 :
3.2.1. Rancangan Halaman Intro
Gambar 3.2. Rancangan Halaman Intro
Rancangan ini menggambarkan isi halaman intro dengan komponen-komponen berupa :
1. Animasi angka.
2. Animasi loading, yang nantinya akan langsung menuju ke halaman Menu Utama.
ANIMASI ANGKA
ANIMASI LOADING
3.2.2. Rancangan Halaman Menu Utama
Gambar 3.3 Rancangan Halaman Menu Utama
Rancangan ini menggambarkan isi Halaman Menu Utama dengan komponen-komponen 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.
ANIMASI TEXT Tombol 1 Tombol 2 Tombol 3 ANIMASI GAMBAR
5. Animasi Gambar
3.2.3. Rancangan Halaman Uji Kepribadian
Gambar 3.4. Rancangan Halaman Uji Kepribadian ANIMASI TEXT 1 TEXT SCROLL 1 Tombol 1 Tombol 2 Tombol 3 TEXT SCROLL 3 Tombol 4 Tombol 5 Tombol 6 TEXT SCROLL 2
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.
3.2.4.1. Rancangan Halaman Uji Penalaran Numerik
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
ANIMASI TEXT 1 Time
Animasi angka
ANIMASI TEXT 2
Text
Text input
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
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.
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 “
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
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
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 “
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
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 )
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
